@progress/kendo-theme-classic 10.1.0-dev.6 → 10.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/all.css +1 -1
- package/dist/classic-green-dark.css +1 -1
- package/dist/classic-green.css +1 -1
- package/dist/classic-lavender-dark.css +1 -1
- package/dist/classic-lavender.css +1 -1
- package/dist/classic-main-dark.css +1 -1
- package/dist/classic-main.css +1 -1
- package/dist/classic-metro-dark.css +1 -1
- package/dist/classic-metro.css +1 -1
- package/dist/classic-moonlight.css +1 -1
- package/dist/classic-opal-dark.css +1 -1
- package/dist/classic-opal.css +1 -1
- package/dist/classic-silver-dark.css +1 -1
- package/dist/classic-silver.css +1 -1
- package/dist/classic-uniform.css +1 -1
- package/dist/meta/sassdoc-data.json +4974 -1914
- package/dist/meta/sassdoc-raw-data.json +1824 -474
- package/dist/meta/variables.json +292 -4
- package/lib/swatches/classic-green-dark.json +1 -1
- package/lib/swatches/classic-green.json +1 -1
- package/lib/swatches/classic-lavender-dark.json +1 -1
- package/lib/swatches/classic-lavender.json +1 -1
- package/lib/swatches/classic-main-dark.json +1 -1
- package/lib/swatches/classic-main.json +1 -1
- package/lib/swatches/classic-metro-dark.json +1 -1
- package/lib/swatches/classic-metro.json +1 -1
- package/lib/swatches/classic-moonlight.json +1 -1
- package/lib/swatches/classic-opal-dark.json +1 -1
- package/lib/swatches/classic-opal.json +1 -1
- package/lib/swatches/classic-silver-dark.json +1 -1
- package/lib/swatches/classic-silver.json +1 -1
- package/lib/swatches/classic-uniform.json +1 -1
- package/package.json +5 -5
- package/scss/coloreditor/_variables.scss +145 -1
- package/scss/colorgradient/_variables.scss +106 -1
- package/scss/colorpalette/_variables.scss +40 -0
|
@@ -9,6 +9,15 @@ $kendo-color-editor-spacer: k-spacing(3) !default;
|
|
|
9
9
|
/// The minimum width of the ColorEditor.
|
|
10
10
|
/// @group color-editor
|
|
11
11
|
$kendo-color-editor-min-width: 272px !default;
|
|
12
|
+
/// The minimum width of the ColorEditor.
|
|
13
|
+
/// @group color-editor
|
|
14
|
+
$kendo-color-editor-sm-min-width: 252px !default;
|
|
15
|
+
/// The minimum width of the ColorEditor.
|
|
16
|
+
/// @group color-editor
|
|
17
|
+
$kendo-color-editor-md-min-width: $kendo-color-editor-min-width !default;
|
|
18
|
+
/// The minimum width of the ColorEditor.
|
|
19
|
+
/// @group color-editor
|
|
20
|
+
$kendo-color-editor-lg-min-width: 362px !default;
|
|
12
21
|
/// The width of the border around the ColorEditor.
|
|
13
22
|
/// @group color-editor
|
|
14
23
|
$kendo-color-editor-border-width: 1px !default;
|
|
@@ -49,7 +58,25 @@ $kendo-color-editor-header-padding-y: $kendo-color-editor-spacer !default;
|
|
|
49
58
|
$kendo-color-editor-header-padding-x: $kendo-color-editor-header-padding-y !default;
|
|
50
59
|
/// The spacing between the ColorEditor header actions.
|
|
51
60
|
/// @group color-editor
|
|
52
|
-
$kendo-color-editor-header-actions-gap:
|
|
61
|
+
$kendo-color-editor-header-actions-gap: k-spacing(2) !default;
|
|
62
|
+
/// The vertical padding of the small ColorEditor header.
|
|
63
|
+
/// @group color-editor
|
|
64
|
+
$kendo-color-editor-sm-header-padding-y: $kendo-color-editor-header-padding-y !default;
|
|
65
|
+
/// The horizontal padding of the small ColorEditor header.
|
|
66
|
+
/// @group color-editor
|
|
67
|
+
$kendo-color-editor-sm-header-padding-x: $kendo-color-editor-header-padding-x !default;
|
|
68
|
+
/// The vertical padding of the medium ColorEditor header.
|
|
69
|
+
/// @group color-editor
|
|
70
|
+
$kendo-color-editor-md-header-padding-y: $kendo-color-editor-header-padding-y !default;
|
|
71
|
+
/// The horizontal padding of the medium ColorEditor header.
|
|
72
|
+
/// @group color-editor
|
|
73
|
+
$kendo-color-editor-md-header-padding-x: $kendo-color-editor-header-padding-x !default;
|
|
74
|
+
/// The vertical padding of the large ColorEditor header.
|
|
75
|
+
/// @group color-editor
|
|
76
|
+
$kendo-color-editor-lg-header-padding-y: k-spacing(4.5) !default;
|
|
77
|
+
/// The horizontal padding of the large ColorEditor header.
|
|
78
|
+
/// @group color-editor
|
|
79
|
+
$kendo-color-editor-lg-header-padding-x: k-spacing(4.5) !default;
|
|
53
80
|
|
|
54
81
|
/// The width of the ColorEditor preview.
|
|
55
82
|
/// @group color-editor
|
|
@@ -60,6 +87,34 @@ $kendo-color-editor-color-preview-height: 12px !default;
|
|
|
60
87
|
/// The spacing between the colors in the ColorEditor preview.
|
|
61
88
|
/// @group color-editor
|
|
62
89
|
$kendo-color-editor-preview-gap: k-spacing(1) !default;
|
|
90
|
+
/// The spacing between the colors in the small ColorEditor preview.
|
|
91
|
+
/// @group color-editor
|
|
92
|
+
$kendo-color-editor-sm-preview-gap: k-spacing(0.5) !default;
|
|
93
|
+
/// The spacing between the colors in the medium ColorEditor preview.
|
|
94
|
+
/// @group color-editor
|
|
95
|
+
$kendo-color-editor-md-preview-gap: $kendo-color-editor-preview-gap !default;
|
|
96
|
+
/// The spacing between the colors in the large ColorEditor preview.
|
|
97
|
+
/// @group color-editor
|
|
98
|
+
$kendo-color-editor-lg-preview-gap: k-spacing(1) !default;
|
|
99
|
+
|
|
100
|
+
/// The width of the small ColorEditor preview.
|
|
101
|
+
/// @group color-editor
|
|
102
|
+
$kendo-color-editor-sm-color-preview-width: 34px !default;
|
|
103
|
+
/// The height of the small ColorEditor preview.
|
|
104
|
+
/// @group color-editor
|
|
105
|
+
$kendo-color-editor-sm-color-preview-height: 12px !default;
|
|
106
|
+
/// The width of the medium ColorEditor preview.
|
|
107
|
+
/// @group color-editor
|
|
108
|
+
$kendo-color-editor-md-color-preview-width: $kendo-color-editor-color-preview-width !default;
|
|
109
|
+
/// The height of the medium ColorEditor preview.
|
|
110
|
+
/// @group color-editor
|
|
111
|
+
$kendo-color-editor-md-color-preview-height: $kendo-color-editor-color-preview-height !default;
|
|
112
|
+
/// The width of the large ColorEditor preview.
|
|
113
|
+
/// @group color-editor
|
|
114
|
+
$kendo-color-editor-lg-color-preview-width: 44px !default;
|
|
115
|
+
/// The height of the large ColorEditor preview.
|
|
116
|
+
/// @group color-editor
|
|
117
|
+
$kendo-color-editor-lg-color-preview-height: 16px !default;
|
|
63
118
|
|
|
64
119
|
/// The vertical padding of the ColorEditor views container.
|
|
65
120
|
/// @group color-editor
|
|
@@ -70,6 +125,33 @@ $kendo-color-editor-views-padding-x: $kendo-color-editor-views-padding-y !defaul
|
|
|
70
125
|
/// The spacing of the ColorEditor views container.
|
|
71
126
|
/// @group color-editor
|
|
72
127
|
$kendo-color-editor-views-gap: $kendo-color-editor-spacer !default;
|
|
128
|
+
/// The vertical padding of the small ColorEditor views container.
|
|
129
|
+
/// @group color-editor
|
|
130
|
+
$kendo-color-editor-sm-views-padding-y: $kendo-color-editor-spacer !default;
|
|
131
|
+
/// The horizontal padding of the small ColorEditor views container.
|
|
132
|
+
/// @group color-editor
|
|
133
|
+
$kendo-color-editor-sm-views-padding-x: $kendo-color-editor-views-padding-y !default;
|
|
134
|
+
/// The spacing of the small ColorEditor views container.
|
|
135
|
+
/// @group color-editor
|
|
136
|
+
$kendo-color-editor-sm-views-gap: $kendo-color-editor-spacer !default;
|
|
137
|
+
/// The vertical padding of the medium ColorEditor views container.
|
|
138
|
+
/// @group color-editor
|
|
139
|
+
$kendo-color-editor-md-views-padding-y: $kendo-color-editor-views-padding-y !default;
|
|
140
|
+
/// The horizontal padding of the medium ColorEditor views container.
|
|
141
|
+
/// @group color-editor
|
|
142
|
+
$kendo-color-editor-md-views-padding-x: $kendo-color-editor-views-padding-x !default;
|
|
143
|
+
/// The spacing of the medium ColorEditor views container.
|
|
144
|
+
/// @group color-editor
|
|
145
|
+
$kendo-color-editor-md-views-gap: $kendo-color-editor-views-gap !default;
|
|
146
|
+
/// The vertical padding of the large ColorEditor views container.
|
|
147
|
+
/// @group color-editor
|
|
148
|
+
$kendo-color-editor-lg-views-padding-y: k-spacing(4.5) !default;
|
|
149
|
+
/// The horizontal padding of the large ColorEditor views container.
|
|
150
|
+
/// @group color-editor
|
|
151
|
+
$kendo-color-editor-lg-views-padding-x: k-spacing(4.5) !default;
|
|
152
|
+
/// The spacing of the large ColorEditor views container.
|
|
153
|
+
/// @group color-editor
|
|
154
|
+
$kendo-color-editor-lg-views-gap: k-spacing(4.5) !default;
|
|
73
155
|
|
|
74
156
|
/// The outline color of the focused ColorGradient.
|
|
75
157
|
/// @group color-editor
|
|
@@ -81,10 +163,48 @@ $kendo-color-editor-color-gradient-focus-outline: 2px !default;
|
|
|
81
163
|
/// @group color-editor
|
|
82
164
|
$kendo-color-editor-color-gradient-focus-outline-offset: 4px !default;
|
|
83
165
|
|
|
166
|
+
/// The size map of the ColorEditor.
|
|
167
|
+
/// @group color-editor
|
|
168
|
+
$kendo-color-editor-sizes: (
|
|
169
|
+
sm: (
|
|
170
|
+
min-width: $kendo-color-editor-sm-min-width,
|
|
171
|
+
header-padding-x: $kendo-color-editor-sm-header-padding-x,
|
|
172
|
+
header-padding-y: $kendo-color-editor-sm-header-padding-y,
|
|
173
|
+
views-padding-x: $kendo-color-editor-sm-views-padding-x,
|
|
174
|
+
views-padding-y: $kendo-color-editor-sm-views-padding-y,
|
|
175
|
+
preview-gap: $kendo-color-editor-sm-preview-gap,
|
|
176
|
+
preview-width: $kendo-color-editor-sm-color-preview-width,
|
|
177
|
+
preview-height: $kendo-color-editor-sm-color-preview-height,
|
|
178
|
+
|
|
179
|
+
),
|
|
180
|
+
md: (
|
|
181
|
+
min-width: $kendo-color-editor-md-min-width,
|
|
182
|
+
header-padding-x: $kendo-color-editor-md-header-padding-x,
|
|
183
|
+
header-padding-y: $kendo-color-editor-md-header-padding-y,
|
|
184
|
+
views-padding-x: $kendo-color-editor-md-views-padding-x,
|
|
185
|
+
views-padding-y: $kendo-color-editor-md-views-padding-y,
|
|
186
|
+
preview-gap: $kendo-color-editor-md-preview-gap,
|
|
187
|
+
preview-width: $kendo-color-editor-md-color-preview-width,
|
|
188
|
+
preview-height: $kendo-color-editor-md-color-preview-height,
|
|
189
|
+
),
|
|
190
|
+
lg: (
|
|
191
|
+
min-width: $kendo-color-editor-lg-min-width,
|
|
192
|
+
header-padding-x: $kendo-color-editor-lg-header-padding-x,
|
|
193
|
+
header-padding-y: $kendo-color-editor-lg-header-padding-y,
|
|
194
|
+
views-padding-x: $kendo-color-editor-lg-views-padding-x,
|
|
195
|
+
views-padding-y: $kendo-color-editor-lg-views-padding-y,
|
|
196
|
+
preview-gap: $kendo-color-editor-lg-preview-gap,
|
|
197
|
+
preview-width: $kendo-color-editor-lg-color-preview-width,
|
|
198
|
+
preview-height: $kendo-color-editor-lg-color-preview-height,
|
|
199
|
+
)
|
|
200
|
+
) !default;
|
|
84
201
|
|
|
85
202
|
@forward "@progress/kendo-theme-default/scss/coloreditor/_variables.scss" with (
|
|
86
203
|
$kendo-color-editor-spacer: $kendo-color-editor-spacer,
|
|
87
204
|
$kendo-color-editor-min-width: $kendo-color-editor-min-width,
|
|
205
|
+
$kendo-color-editor-sm-min-width: $kendo-color-editor-sm-min-width,
|
|
206
|
+
$kendo-color-editor-md-min-width: $kendo-color-editor-md-min-width,
|
|
207
|
+
$kendo-color-editor-lg-min-width: $kendo-color-editor-lg-min-width,
|
|
88
208
|
$kendo-color-editor-border-width: $kendo-color-editor-border-width,
|
|
89
209
|
$kendo-color-editor-border-radius: $kendo-color-editor-border-radius,
|
|
90
210
|
$kendo-color-editor-font-family: $kendo-color-editor-font-family,
|
|
@@ -97,13 +217,37 @@ $kendo-color-editor-color-gradient-focus-outline-offset: 4px !default;
|
|
|
97
217
|
$kendo-color-editor-focus-shadow: $kendo-color-editor-focus-shadow,
|
|
98
218
|
$kendo-color-editor-header-padding-y: $kendo-color-editor-header-padding-y,
|
|
99
219
|
$kendo-color-editor-header-padding-x: $kendo-color-editor-header-padding-x,
|
|
220
|
+
$kendo-color-editor-sm-header-padding-y: $kendo-color-editor-sm-header-padding-y,
|
|
221
|
+
$kendo-color-editor-sm-header-padding-x: $kendo-color-editor-sm-header-padding-x,
|
|
222
|
+
$kendo-color-editor-md-header-padding-y: $kendo-color-editor-md-header-padding-y,
|
|
223
|
+
$kendo-color-editor-md-header-padding-x: $kendo-color-editor-md-header-padding-x,
|
|
224
|
+
$kendo-color-editor-lg-header-padding-y: $kendo-color-editor-lg-header-padding-y,
|
|
225
|
+
$kendo-color-editor-lg-header-padding-x: $kendo-color-editor-lg-header-padding-x,
|
|
100
226
|
$kendo-color-editor-header-actions-gap: $kendo-color-editor-header-actions-gap,
|
|
101
227
|
$kendo-color-editor-color-preview-width: $kendo-color-editor-color-preview-width,
|
|
102
228
|
$kendo-color-editor-color-preview-height: $kendo-color-editor-color-preview-height,
|
|
103
229
|
$kendo-color-editor-preview-gap: $kendo-color-editor-preview-gap,
|
|
230
|
+
$kendo-color-editor-sm-preview-gap: $kendo-color-editor-sm-preview-gap,
|
|
231
|
+
$kendo-color-editor-md-preview-gap: $kendo-color-editor-md-preview-gap,
|
|
232
|
+
$kendo-color-editor-lg-preview-gap: $kendo-color-editor-lg-preview-gap,
|
|
233
|
+
$kendo-color-editor-sm-color-preview-width: $kendo-color-editor-sm-color-preview-width,
|
|
234
|
+
$kendo-color-editor-sm-color-preview-height: $kendo-color-editor-sm-color-preview-height,
|
|
235
|
+
$kendo-color-editor-md-color-preview-width: $kendo-color-editor-md-color-preview-width,
|
|
236
|
+
$kendo-color-editor-md-color-preview-height: $kendo-color-editor-md-color-preview-height,
|
|
237
|
+
$kendo-color-editor-lg-color-preview-width: $kendo-color-editor-lg-color-preview-width,
|
|
238
|
+
$kendo-color-editor-lg-color-preview-height: $kendo-color-editor-lg-color-preview-height,
|
|
104
239
|
$kendo-color-editor-views-padding-y: $kendo-color-editor-views-padding-y,
|
|
105
240
|
$kendo-color-editor-views-padding-x: $kendo-color-editor-views-padding-x,
|
|
106
241
|
$kendo-color-editor-views-gap: $kendo-color-editor-views-gap,
|
|
242
|
+
$kendo-color-editor-sm-views-padding-y: $kendo-color-editor-sm-views-padding-y,
|
|
243
|
+
$kendo-color-editor-sm-views-padding-x: $kendo-color-editor-sm-views-padding-x,
|
|
244
|
+
$kendo-color-editor-sm-views-gap: $kendo-color-editor-sm-views-gap,
|
|
245
|
+
$kendo-color-editor-md-views-padding-y: $kendo-color-editor-md-views-padding-y,
|
|
246
|
+
$kendo-color-editor-md-views-padding-x: $kendo-color-editor-md-views-padding-x,
|
|
247
|
+
$kendo-color-editor-md-views-gap: $kendo-color-editor-md-views-gap,
|
|
248
|
+
$kendo-color-editor-lg-views-padding-y: $kendo-color-editor-lg-views-padding-y,
|
|
249
|
+
$kendo-color-editor-lg-views-padding-x: $kendo-color-editor-lg-views-padding-x,
|
|
250
|
+
$kendo-color-editor-lg-views-gap: $kendo-color-editor-lg-views-gap,
|
|
107
251
|
$kendo-color-editor-color-gradient-focus-outline-color: $kendo-color-editor-color-gradient-focus-outline-color,
|
|
108
252
|
$kendo-color-editor-color-gradient-focus-outline: $kendo-color-editor-color-gradient-focus-outline,
|
|
109
253
|
$kendo-color-editor-color-gradient-focus-outline-offset: $kendo-color-editor-color-gradient-focus-outline-offset
|
|
@@ -44,6 +44,26 @@ $kendo-color-gradient-bg: $kendo-component-bg !default;
|
|
|
44
44
|
/// @group color-gradient
|
|
45
45
|
$kendo-color-gradient-border: $kendo-component-border !default;
|
|
46
46
|
|
|
47
|
+
/// The width of the small ColorGradient.
|
|
48
|
+
/// @group color-gradient
|
|
49
|
+
$kendo-color-gradient-sm-width: 226px !default;
|
|
50
|
+
/// The width of the medium ColorGradient.
|
|
51
|
+
/// @group color-gradient
|
|
52
|
+
$kendo-color-gradient-md-width: $kendo-color-gradient-width !default;
|
|
53
|
+
/// The width of the large ColorGradient.
|
|
54
|
+
/// @group color-gradient
|
|
55
|
+
$kendo-color-gradient-lg-width: 324px !default;
|
|
56
|
+
|
|
57
|
+
/// The spacing between the sections of the small ColorGradient.
|
|
58
|
+
/// @group color-gradient
|
|
59
|
+
$kendo-color-gradient-sm-gap: $kendo-color-gradient-gap !default;
|
|
60
|
+
/// The spacing between the sections of the medium ColorGradient.
|
|
61
|
+
/// @group color-gradient
|
|
62
|
+
$kendo-color-gradient-md-gap: $kendo-color-gradient-gap !default;
|
|
63
|
+
/// The spacing between the sections of the large ColorGradient.
|
|
64
|
+
/// @group color-gradient
|
|
65
|
+
$kendo-color-gradient-lg-gap: k-spacing(4.5) !default;
|
|
66
|
+
|
|
47
67
|
/// The border color of the focused ColorGradient.
|
|
48
68
|
/// @group color-gradient
|
|
49
69
|
$kendo-color-gradient-focus-border: null !default;
|
|
@@ -60,6 +80,25 @@ $kendo-color-gradient-canvas-gap: $kendo-color-gradient-spacer !default;
|
|
|
60
80
|
/// The height the ColorGradient canvas hsv rectangle.
|
|
61
81
|
/// @group color-gradient
|
|
62
82
|
$kendo-color-gradient-canvas-rectangle-height: 180px !default;
|
|
83
|
+
/// The height the small ColorGradient canvas hsv rectangle.
|
|
84
|
+
/// @group color-gradient
|
|
85
|
+
$kendo-color-gradient-sm-canvas-rectangle-height: 182px !default;
|
|
86
|
+
/// The height the medium ColorGradient canvas hsv rectangle.
|
|
87
|
+
/// @group color-gradient
|
|
88
|
+
$kendo-color-gradient-md-canvas-rectangle-height: $kendo-color-gradient-canvas-rectangle-height !default;
|
|
89
|
+
/// The height the large ColorGradient canvas hsv rectangle.
|
|
90
|
+
/// @group color-gradient
|
|
91
|
+
$kendo-color-gradient-lg-canvas-rectangle-height: 268px !default;
|
|
92
|
+
|
|
93
|
+
/// The spacing between the items of the small ColorGradient canvas.
|
|
94
|
+
/// @group color-gradient
|
|
95
|
+
$kendo-color-gradient-sm-canvas-gap: $kendo-color-gradient-canvas-gap !default;
|
|
96
|
+
/// The spacing between the items of the medium ColorGradient canvas.
|
|
97
|
+
/// @group color-gradient
|
|
98
|
+
$kendo-color-gradient-md-canvas-gap: $kendo-color-gradient-canvas-gap !default;
|
|
99
|
+
/// The spacing between the items of the large ColorGradient canvas.
|
|
100
|
+
/// @group color-gradient
|
|
101
|
+
$kendo-color-gradient-lg-canvas-gap: k-spacing(4.5) !default;
|
|
63
102
|
|
|
64
103
|
/// The width of the ColorGradient slider.
|
|
65
104
|
/// @group color-gradient
|
|
@@ -81,6 +120,16 @@ $kendo-color-gradient-slider-horizontal-size: 100% !default;
|
|
|
81
120
|
/// @group color-gradient
|
|
82
121
|
$kendo-color-gradient-slider-alpha-bgr: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAuSURBVHgBxYyxDQAwDMJIL+YT+DjtzFRliUfLcklqBCRT4eCTxbD6kdL2/LgYXqpvCbs3kBv/AAAAAElFTkSuQmCC" !default;
|
|
83
122
|
|
|
123
|
+
/// The height of the small ColorGradient vertical slider.
|
|
124
|
+
/// @group color-gradient
|
|
125
|
+
$kendo-color-gradient-sm-slider-vertical-size: 182px !default;
|
|
126
|
+
/// The height of the medium ColorGradient vertical slider.
|
|
127
|
+
/// @group color-gradient
|
|
128
|
+
$kendo-color-gradient-md-slider-vertical-size: $kendo-color-gradient-slider-vertical-size !default;
|
|
129
|
+
/// The height of the large ColorGradient vertical slider.
|
|
130
|
+
/// @group color-gradient
|
|
131
|
+
$kendo-color-gradient-lg-slider-vertical-size: 268px !default;
|
|
132
|
+
|
|
84
133
|
/// The width of the ColorGradient canvas drag handle.
|
|
85
134
|
/// @group color-gradient
|
|
86
135
|
$kendo-color-gradient-draghandle-width: 14px !default;
|
|
@@ -127,7 +176,7 @@ $kendo-color-gradient-canvas-draghandle-margin-x: - math.div( $kendo-color-gradi
|
|
|
127
176
|
$kendo-color-gradient-input-width: 46px !default;
|
|
128
177
|
/// The spacing between the ColorGradient inputs.
|
|
129
178
|
/// @group color-gradient
|
|
130
|
-
$kendo-color-gradient-input-gap:
|
|
179
|
+
$kendo-color-gradient-input-gap: k-spacing(2) !default;
|
|
131
180
|
/// The spacing between the ColorGradient inputs and their labels.
|
|
132
181
|
/// @group color-gradient
|
|
133
182
|
$kendo-color-gradient-input-label-gap: calc( #{$kendo-color-gradient-spacer} / 3 ) !default;
|
|
@@ -135,6 +184,16 @@ $kendo-color-gradient-input-label-gap: calc( #{$kendo-color-gradient-spacer} / 3
|
|
|
135
184
|
/// @group color-gradient
|
|
136
185
|
$kendo-color-gradient-input-label-text: $kendo-subtle-text !default;
|
|
137
186
|
|
|
187
|
+
/// The width of the small ColorGradient input.
|
|
188
|
+
/// @group color-gradient
|
|
189
|
+
$kendo-color-gradient-sm-input-width: 42px !default;
|
|
190
|
+
/// The width of the medium ColorGradient input.
|
|
191
|
+
/// @group color-gradient
|
|
192
|
+
$kendo-color-gradient-md-input-width: $kendo-color-gradient-input-width !default;
|
|
193
|
+
/// The width of the large ColorGradient input.
|
|
194
|
+
/// @group color-gradient
|
|
195
|
+
$kendo-color-gradient-lg-input-width: 62.5px !default;
|
|
196
|
+
|
|
138
197
|
/// The font weight of the ColorGradient contrast ratio text.
|
|
139
198
|
/// @group color-gradient
|
|
140
199
|
$kendo-color-gradient-contrast-ratio-font-weight: var( --kendo-font-weight-bold, normal ) !default;
|
|
@@ -142,10 +201,44 @@ $kendo-color-gradient-contrast-ratio-font-weight: var( --kendo-font-weight-bold,
|
|
|
142
201
|
/// @group color-gradient
|
|
143
202
|
$kendo-color-gradient-contrast-spacer: calc( #{$kendo-color-gradient-spacer} / 1.5 ) !default;
|
|
144
203
|
|
|
204
|
+
/// The size map of the ColorGradient.
|
|
205
|
+
/// @group color-gradient
|
|
206
|
+
$kendo-color-gradient-sizes: (
|
|
207
|
+
sm: (
|
|
208
|
+
width: $kendo-color-gradient-sm-width,
|
|
209
|
+
vertical-slider-height: $kendo-color-gradient-sm-slider-vertical-size,
|
|
210
|
+
rectangle-height: $kendo-color-gradient-sm-canvas-rectangle-height,
|
|
211
|
+
input-width: $kendo-color-gradient-sm-input-width,
|
|
212
|
+
gap: $kendo-color-gradient-sm-gap,
|
|
213
|
+
canvas-gap: $kendo-color-gradient-sm-canvas-gap
|
|
214
|
+
),
|
|
215
|
+
md: (
|
|
216
|
+
width: $kendo-color-gradient-md-width,
|
|
217
|
+
vertical-slider-height: $kendo-color-gradient-md-slider-vertical-size,
|
|
218
|
+
rectangle-height: $kendo-color-gradient-md-canvas-rectangle-height,
|
|
219
|
+
input-width: $kendo-color-gradient-md-input-width,
|
|
220
|
+
gap: $kendo-color-gradient-md-gap,
|
|
221
|
+
canvas-gap: $kendo-color-gradient-md-canvas-gap
|
|
222
|
+
),
|
|
223
|
+
lg: (
|
|
224
|
+
width: $kendo-color-gradient-lg-width,
|
|
225
|
+
vertical-slider-height: $kendo-color-gradient-lg-slider-vertical-size,
|
|
226
|
+
rectangle-height: $kendo-color-gradient-lg-canvas-rectangle-height,
|
|
227
|
+
input-width: $kendo-color-gradient-lg-input-width,
|
|
228
|
+
gap: $kendo-color-gradient-lg-gap,
|
|
229
|
+
canvas-gap: $kendo-color-gradient-lg-canvas-gap
|
|
230
|
+
)
|
|
231
|
+
) !default;
|
|
145
232
|
|
|
146
233
|
@forward "@progress/kendo-theme-default/scss/colorgradient/_variables.scss" with (
|
|
147
234
|
$kendo-color-gradient-spacer: $kendo-color-gradient-spacer,
|
|
148
235
|
$kendo-color-gradient-width: $kendo-color-gradient-width,
|
|
236
|
+
$kendo-color-gradient-sm-width: $kendo-color-gradient-sm-width,
|
|
237
|
+
$kendo-color-gradient-md-width: $kendo-color-gradient-md-width,
|
|
238
|
+
$kendo-color-gradient-lg-width: $kendo-color-gradient-lg-width,
|
|
239
|
+
$kendo-color-gradient-sm-gap: $kendo-color-gradient-sm-gap,
|
|
240
|
+
$kendo-color-gradient-md-gap: $kendo-color-gradient-md-gap,
|
|
241
|
+
$kendo-color-gradient-lg-gap: $kendo-color-gradient-lg-gap,
|
|
149
242
|
$kendo-color-gradient-border-width: $kendo-color-gradient-border-width,
|
|
150
243
|
$kendo-color-gradient-border-radius: $kendo-color-gradient-border-radius,
|
|
151
244
|
$kendo-color-gradient-padding-y: $kendo-color-gradient-padding-y,
|
|
@@ -162,12 +255,21 @@ $kendo-color-gradient-contrast-spacer: calc( #{$kendo-color-gradient-spacer} / 1
|
|
|
162
255
|
$kendo-color-gradient-canvas-border-radius: $kendo-color-gradient-canvas-border-radius,
|
|
163
256
|
$kendo-color-gradient-canvas-gap: $kendo-color-gradient-canvas-gap,
|
|
164
257
|
$kendo-color-gradient-canvas-rectangle-height: $kendo-color-gradient-canvas-rectangle-height,
|
|
258
|
+
$kendo-color-gradient-sm-canvas-rectangle-height: $kendo-color-gradient-sm-canvas-rectangle-height,
|
|
259
|
+
$kendo-color-gradient-md-canvas-rectangle-height: $kendo-color-gradient-md-canvas-rectangle-height,
|
|
260
|
+
$kendo-color-gradient-lg-canvas-rectangle-height: $kendo-color-gradient-lg-canvas-rectangle-height,
|
|
261
|
+
$kendo-color-gradient-sm-canvas-gap: $kendo-color-gradient-sm-canvas-gap,
|
|
262
|
+
$kendo-color-gradient-md-canvas-gap: $kendo-color-gradient-md-canvas-gap,
|
|
263
|
+
$kendo-color-gradient-lg-canvas-gap: $kendo-color-gradient-lg-canvas-gap,
|
|
165
264
|
$kendo-color-gradient-slider-track-size: $kendo-color-gradient-slider-track-size,
|
|
166
265
|
$kendo-color-gradient-slider-border-radius: $kendo-color-gradient-slider-border-radius,
|
|
167
266
|
$kendo-color-gradient-slider-draghandle-border-width: $kendo-color-gradient-slider-draghandle-border-width,
|
|
168
267
|
$kendo-color-gradient-slider-vertical-size: $kendo-color-gradient-slider-vertical-size,
|
|
169
268
|
$kendo-color-gradient-slider-horizontal-size: $kendo-color-gradient-slider-horizontal-size,
|
|
170
269
|
$kendo-color-gradient-slider-alpha-bgr: $kendo-color-gradient-slider-alpha-bgr,
|
|
270
|
+
$kendo-color-gradient-sm-slider-vertical-size: $kendo-color-gradient-sm-slider-vertical-size,
|
|
271
|
+
$kendo-color-gradient-md-slider-vertical-size: $kendo-color-gradient-md-slider-vertical-size,
|
|
272
|
+
$kendo-color-gradient-lg-slider-vertical-size: $kendo-color-gradient-lg-slider-vertical-size,
|
|
171
273
|
$kendo-color-gradient-draghandle-width: $kendo-color-gradient-draghandle-width,
|
|
172
274
|
$kendo-color-gradient-draghandle-height: $kendo-color-gradient-draghandle-height,
|
|
173
275
|
$kendo-color-gradient-draghandle-border-width: $kendo-color-gradient-draghandle-border-width,
|
|
@@ -185,6 +287,9 @@ $kendo-color-gradient-contrast-spacer: calc( #{$kendo-color-gradient-spacer} / 1
|
|
|
185
287
|
$kendo-color-gradient-input-gap: $kendo-color-gradient-input-gap,
|
|
186
288
|
$kendo-color-gradient-input-label-gap: $kendo-color-gradient-input-label-gap,
|
|
187
289
|
$kendo-color-gradient-input-label-text: $kendo-color-gradient-input-label-text,
|
|
290
|
+
$kendo-color-gradient-sm-input-width: $kendo-color-gradient-sm-input-width,
|
|
291
|
+
$kendo-color-gradient-md-input-width: $kendo-color-gradient-md-input-width,
|
|
292
|
+
$kendo-color-gradient-lg-input-width: $kendo-color-gradient-lg-input-width,
|
|
188
293
|
$kendo-color-gradient-contrast-ratio-font-weight: $kendo-color-gradient-contrast-ratio-font-weight,
|
|
189
294
|
$kendo-color-gradient-contrast-spacer: $kendo-color-gradient-contrast-spacer
|
|
190
295
|
);
|
|
@@ -18,6 +18,24 @@ $kendo-color-palette-tile-width: k-spacing(6) !default;
|
|
|
18
18
|
/// The height of the ColorPalette tile.
|
|
19
19
|
/// @group color-palette
|
|
20
20
|
$kendo-color-palette-tile-height: $kendo-color-palette-tile-width !default;
|
|
21
|
+
/// The width of the small ColorPalette tile.
|
|
22
|
+
/// @group color-palette
|
|
23
|
+
$kendo-color-palette-tile-sm-width: k-spacing(5.5) !default;
|
|
24
|
+
/// The height of the small ColorPalette tile.
|
|
25
|
+
/// @group color-palette
|
|
26
|
+
$kendo-color-palette-tile-sm-height: $kendo-color-palette-tile-sm-width !default;
|
|
27
|
+
/// The width of the medium ColorPalette tile.
|
|
28
|
+
/// @group color-palette
|
|
29
|
+
$kendo-color-palette-tile-md-width: $kendo-color-palette-tile-width !default;
|
|
30
|
+
/// The height of the medium ColorPalette tile.
|
|
31
|
+
/// @group color-palette
|
|
32
|
+
$kendo-color-palette-tile-md-height: $kendo-color-palette-tile-height !default;
|
|
33
|
+
/// The width of the large ColorPalette tile.
|
|
34
|
+
/// @group color-palette
|
|
35
|
+
$kendo-color-palette-tile-lg-width: k-spacing(8) !default;
|
|
36
|
+
/// The height of the large ColorPalette tile.
|
|
37
|
+
/// @group color-palette
|
|
38
|
+
$kendo-color-palette-tile-lg-height: $kendo-color-palette-tile-lg-width !default;
|
|
21
39
|
/// The shadow of the ColorPalette focused tile.
|
|
22
40
|
/// @group color-palette
|
|
23
41
|
$kendo-color-palette-tile-focus-shadow: 0 0 3px 1px rgba( black, .3 ), inset 0 0 0 1px rgba( white, .5 ) !default;
|
|
@@ -28,6 +46,22 @@ $kendo-color-palette-tile-hover-shadow: 0 0 3px 1px rgba( black, .3 ), inset 0 0
|
|
|
28
46
|
/// @group color-palette
|
|
29
47
|
$kendo-color-palette-tile-selected-shadow: 0 1px 3px 1px rgba( black, .3 ), inset 0 0 0 1px rgba( white, 1 ) !default;
|
|
30
48
|
|
|
49
|
+
/// The size map of the ColorPalette.
|
|
50
|
+
/// @group color-palette
|
|
51
|
+
$kendo-color-palette-sizes: (
|
|
52
|
+
sm: (
|
|
53
|
+
width: $kendo-color-palette-tile-sm-width,
|
|
54
|
+
height: $kendo-color-palette-tile-sm-height
|
|
55
|
+
),
|
|
56
|
+
md: (
|
|
57
|
+
width: $kendo-color-palette-tile-md-width,
|
|
58
|
+
height: $kendo-color-palette-tile-md-height
|
|
59
|
+
),
|
|
60
|
+
lg: (
|
|
61
|
+
width: $kendo-color-palette-tile-lg-width,
|
|
62
|
+
height: $kendo-color-palette-tile-lg-height
|
|
63
|
+
)
|
|
64
|
+
) !default;
|
|
31
65
|
|
|
32
66
|
@forward "@progress/kendo-theme-default/scss/colorpalette/_variables.scss" with (
|
|
33
67
|
$kendo-color-palette-font-family: $kendo-color-palette-font-family,
|
|
@@ -35,6 +69,12 @@ $kendo-color-palette-tile-selected-shadow: 0 1px 3px 1px rgba( black, .3 ), inse
|
|
|
35
69
|
$kendo-color-palette-line-height: $kendo-color-palette-line-height,
|
|
36
70
|
$kendo-color-palette-tile-width: $kendo-color-palette-tile-width,
|
|
37
71
|
$kendo-color-palette-tile-height: $kendo-color-palette-tile-height,
|
|
72
|
+
$kendo-color-palette-tile-sm-width: $kendo-color-palette-tile-sm-width,
|
|
73
|
+
$kendo-color-palette-tile-sm-height: $kendo-color-palette-tile-sm-height,
|
|
74
|
+
$kendo-color-palette-tile-md-width: $kendo-color-palette-tile-md-width,
|
|
75
|
+
$kendo-color-palette-tile-md-height: $kendo-color-palette-tile-md-height,
|
|
76
|
+
$kendo-color-palette-tile-lg-width: $kendo-color-palette-tile-lg-width,
|
|
77
|
+
$kendo-color-palette-tile-lg-height: $kendo-color-palette-tile-lg-height,
|
|
38
78
|
$kendo-color-palette-tile-focus-shadow: $kendo-color-palette-tile-focus-shadow,
|
|
39
79
|
$kendo-color-palette-tile-hover-shadow: $kendo-color-palette-tile-hover-shadow,
|
|
40
80
|
$kendo-color-palette-tile-selected-shadow: $kendo-color-palette-tile-selected-shadow
|