@progress/kendo-theme-bootstrap 12.3.1-dev.8 → 13.0.0-dev.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/bootstrap-3-dark.css +1 -1
- package/dist/bootstrap-3.css +1 -1
- package/dist/bootstrap-4-dark.css +1 -1
- package/dist/bootstrap-4.css +1 -1
- package/dist/bootstrap-dataviz-v4.css +1 -1
- package/dist/bootstrap-main-dark.css +1 -1
- package/dist/bootstrap-main.css +1 -1
- package/dist/bootstrap-nordic.css +1 -1
- package/dist/bootstrap-turquoise-dark.css +1 -1
- package/dist/bootstrap-turquoise.css +1 -1
- package/dist/bootstrap-urban.css +1 -1
- package/dist/bootstrap-vintage.css +1 -1
- package/dist/meta/sassdoc-data.json +20507 -15833
- package/dist/meta/sassdoc-raw-data.json +10090 -7798
- package/dist/meta/variables.json +715 -465
- package/lib/swatches/bootstrap-3-dark.json +1 -1
- package/lib/swatches/bootstrap-3.json +1 -1
- package/lib/swatches/bootstrap-4-dark.json +1 -1
- package/lib/swatches/bootstrap-4.json +1 -1
- package/lib/swatches/bootstrap-dataviz-v4.json +1 -1
- package/lib/swatches/bootstrap-main-dark.json +1 -1
- package/lib/swatches/bootstrap-main.json +1 -1
- package/lib/swatches/bootstrap-nordic.json +1 -1
- package/lib/swatches/bootstrap-turquoise-dark.json +1 -1
- package/lib/swatches/bootstrap-turquoise.json +1 -1
- package/lib/swatches/bootstrap-urban.json +1 -1
- package/lib/swatches/bootstrap-vintage.json +1 -1
- package/package.json +5 -5
- package/scss/appbar/_variables.scss +6 -16
- package/scss/avatar/_variables.scss +37 -24
- package/scss/badge/_variables.scss +22 -43
- package/scss/bottom-navigation/_variables.scss +12 -17
- package/scss/breadcrumb/_variables.scss +6 -30
- package/scss/button/_variables.scss +22 -42
- package/scss/calendar/_variables.scss +9 -31
- package/scss/card/_variables.scss +7 -17
- package/scss/checkbox/_layout.scss +15 -9
- package/scss/checkbox/_variables.scss +13 -23
- package/scss/chip/_theme.scss +0 -2
- package/scss/chip/_variables.scss +38 -50
- package/scss/coloreditor/_variables.scss +9 -41
- package/scss/colorgradient/_variables.scss +11 -42
- package/scss/colorpalette/_variables.scss +7 -19
- package/scss/column-menu/_variables.scss +6 -25
- package/scss/datetimepicker/_variables.scss +6 -16
- package/scss/dialog/_variables.scss +7 -10
- package/scss/fab/_theme.scss +78 -72
- package/scss/fab/_variables.scss +21 -34
- package/scss/floating-label/_variables.scss +2 -2
- package/scss/forms/_variables.scss +7 -17
- package/scss/grid/_variables.scss +7 -41
- package/scss/icons/_variables.scss +6 -0
- package/scss/input/_layout.scss +8 -4
- package/scss/input/_variables.scss +36 -34
- package/scss/list/_variables.scss +6 -73
- package/scss/loader/_variables.scss +13 -17
- package/scss/menu/_variables.scss +6 -0
- package/scss/messagebox/_variables.scss +8 -17
- package/scss/notification/_functions.scss +1 -1
- package/scss/notification/_variables.scss +7 -13
- package/scss/otp/_variables.scss +1 -22
- package/scss/overlay/_variables.scss +6 -18
- package/scss/pager/_variables.scss +7 -26
- package/scss/radio/_variables.scss +7 -22
- package/scss/signature/_variables.scss +0 -21
- package/scss/split-button/_variables.scss +2 -2
- package/scss/spreadsheet/_variables.scss +1 -1
- package/scss/suggestion/_variables.scss +4 -45
- package/scss/switch/_variables.scss +101 -7
- package/scss/table/_variables.scss +6 -25
- package/scss/tabstrip/_variables.scss +6 -25
- package/scss/timeselector/_variables.scss +24 -42
- package/scss/toolbar/_variables.scss +16 -27
- package/scss/tooltip/_functions.scss +3 -3
- package/scss/tooltip/_variables.scss +1 -13
- package/scss/treeview/_variables.scss +8 -33
- package/scss/window/_variables.scss +12 -20
package/scss/fab/_theme.scss
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
@use "../core/_index.scss" as *;
|
|
2
|
+
@use "../core/functions/index.scss" as *;
|
|
2
3
|
@use "./_variables.scss" as *;
|
|
3
4
|
@use "@progress/kendo-theme-core/scss/components/fab/_theme.scss" as *;
|
|
4
5
|
|
|
@@ -6,80 +7,85 @@
|
|
|
6
7
|
|
|
7
8
|
@mixin kendo-fab--theme() {
|
|
8
9
|
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
outline-color: k-color(primary-active);
|
|
61
|
-
}
|
|
62
|
-
50% {
|
|
63
|
-
background-color: color-mix(in srgb, k-color(primary-active) $kendo-fab-generating-opacity, k-color(surface-alt));
|
|
64
|
-
border: color-mix(in srgb, k-color(primary-active) $kendo-fab-generating-opacity, k-color(surface-alt));
|
|
65
|
-
outline-color: color-mix(in srgb, k-color(primary-active) $kendo-fab-generating-opacity, k-color(surface-alt));
|
|
10
|
+
.k-fab {
|
|
11
|
+
// Fillmode: solid
|
|
12
|
+
#{k-when-default($kendo-fab-default-fill-mode, "solid")}
|
|
13
|
+
&.k-fab-solid {
|
|
14
|
+
|
|
15
|
+
// Theme colors
|
|
16
|
+
@each $name in $kendo-fab-theme-colors {
|
|
17
|
+
|
|
18
|
+
// Normal state
|
|
19
|
+
#{k-when-default($kendo-fab-default-theme-color, $name)}
|
|
20
|
+
&.k-fab-#{$name} {
|
|
21
|
+
@include box-shadow( $kendo-fab-shadow );
|
|
22
|
+
outline: $kendo-fab-border-width $kendo-fab-outline-style k-color($name);
|
|
23
|
+
outline-offset: -$kendo-fab-border-width;
|
|
24
|
+
border-color: k-color($name);
|
|
25
|
+
color: k-color(on-#{$name});
|
|
26
|
+
background-color: k-color($name);
|
|
27
|
+
|
|
28
|
+
// Hover state
|
|
29
|
+
&:hover,
|
|
30
|
+
&.k-hover {
|
|
31
|
+
border-color: k-color(#{$name}-hover);
|
|
32
|
+
color: k-color(on-#{$name});
|
|
33
|
+
background-color: k-color(#{$name}-hover);
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
// Focus state
|
|
37
|
+
&:focus,
|
|
38
|
+
&.k-focus {
|
|
39
|
+
outline: $kendo-fab-outline-width $kendo-fab-outline-style color-mix(in srgb, k-color($name) 50%, transparent);
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
// Active state
|
|
43
|
+
&:active,
|
|
44
|
+
&.k-active,
|
|
45
|
+
&.k-selected {
|
|
46
|
+
@include box-shadow( $kendo-fab-active-shadow );
|
|
47
|
+
border-color: k-color(#{$name}-active);
|
|
48
|
+
color: k-color(on-#{$name});
|
|
49
|
+
background-color: k-color(#{$name}-active);
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
// Disabled state
|
|
53
|
+
&:disabled,
|
|
54
|
+
&.k-disabled {
|
|
55
|
+
@include box-shadow( $kendo-fab-disabled-shadow );
|
|
56
|
+
background-color: color-mix(in srgb, k-color($name) 65%, transparent);
|
|
57
|
+
color: color-mix(in srgb, k-color(on-#{$name}) 65%, transparent);
|
|
58
|
+
opacity: 1;
|
|
59
|
+
}
|
|
60
|
+
}
|
|
66
61
|
}
|
|
67
|
-
100% {
|
|
68
|
-
background-color: k-color(primary-active);
|
|
69
|
-
border: k-color(primary-active);
|
|
70
|
-
outline-color: k-color(primary-active);
|
|
71
|
-
}
|
|
72
|
-
}
|
|
73
|
-
}
|
|
74
62
|
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
63
|
+
// Generating state
|
|
64
|
+
#{k-when-default($kendo-fab-default-theme-color, "primary")}
|
|
65
|
+
&.k-fab-primary {
|
|
66
|
+
|
|
67
|
+
&.k-generating {
|
|
68
|
+
animation: k-fab-generating 1.5s ease-in-out 0.5s infinite;
|
|
69
|
+
|
|
70
|
+
@keyframes k-fab-generating {
|
|
71
|
+
0% {
|
|
72
|
+
background-color: k-color(primary-active);
|
|
73
|
+
border: k-color(primary-active);
|
|
74
|
+
outline-color: k-color(primary-active);
|
|
75
|
+
}
|
|
76
|
+
50% {
|
|
77
|
+
background-color: color-mix(in srgb, k-color(primary-active) $kendo-fab-generating-opacity, k-color(surface-alt));
|
|
78
|
+
border: color-mix(in srgb, k-color(primary-active) $kendo-fab-generating-opacity, k-color(surface-alt));
|
|
79
|
+
outline-color: color-mix(in srgb, k-color(primary-active) $kendo-fab-generating-opacity, k-color(surface-alt));
|
|
80
|
+
}
|
|
81
|
+
100% {
|
|
82
|
+
background-color: k-color(primary-active);
|
|
83
|
+
border: k-color(primary-active);
|
|
84
|
+
outline-color: k-color(primary-active);
|
|
85
|
+
}
|
|
86
|
+
}
|
|
87
|
+
}
|
|
88
|
+
}
|
|
83
89
|
}
|
|
84
90
|
}
|
|
85
91
|
|
package/scss/fab/_variables.scss
CHANGED
|
@@ -5,6 +5,23 @@
|
|
|
5
5
|
|
|
6
6
|
// Floating Action Button
|
|
7
7
|
|
|
8
|
+
/// The default theme color of the FAB.
|
|
9
|
+
/// @group floating-action-button
|
|
10
|
+
/// @role default
|
|
11
|
+
$kendo-fab-default-theme-color: "primary" !default;
|
|
12
|
+
/// The default fill mode of the FAB.
|
|
13
|
+
/// @group floating-action-button
|
|
14
|
+
/// @role default
|
|
15
|
+
$kendo-fab-default-fill-mode: "solid" !default;
|
|
16
|
+
/// The default roundness of the FAB.
|
|
17
|
+
/// @group floating-action-button
|
|
18
|
+
/// @role default
|
|
19
|
+
$kendo-fab-default-roundness: "full" !default;
|
|
20
|
+
/// The default size of the FAB.
|
|
21
|
+
/// @group floating-action-button
|
|
22
|
+
/// @role default
|
|
23
|
+
$kendo-fab-default-size: "md" !default;
|
|
24
|
+
|
|
8
25
|
/// The width of the border around the FAB.
|
|
9
26
|
/// @group floating-action-button
|
|
10
27
|
$kendo-fab-border-width: 1px !default;
|
|
@@ -87,38 +104,6 @@ $kendo-fab-item-icon-border-width: 0 !default;
|
|
|
87
104
|
/// @group floating-action-button
|
|
88
105
|
$kendo-fab-item-icon-border-radius: 50% !default;
|
|
89
106
|
|
|
90
|
-
/// The theme colors map for the FAB.
|
|
91
|
-
/// @group floating-action-button
|
|
92
|
-
$kendo-fab-theme-colors: (
|
|
93
|
-
"primary": k-color(primary),
|
|
94
|
-
"secondary": k-color(secondary),
|
|
95
|
-
"tertiary": k-color(tertiary),
|
|
96
|
-
"info": k-color(info),
|
|
97
|
-
"success": k-color(success),
|
|
98
|
-
"warning": k-color(warning),
|
|
99
|
-
"error": k-color(error),
|
|
100
|
-
"dark": k-color(dark),
|
|
101
|
-
"light": k-color(light),
|
|
102
|
-
"inverse": if($kendo-is-dark-theme, k-color(light), k-color(dark))
|
|
103
|
-
) !default;
|
|
104
|
-
|
|
105
|
-
/// The size map for the FAB.
|
|
106
|
-
/// @group floating-action-button
|
|
107
|
-
$kendo-fab-sizes: (
|
|
108
|
-
sm: (
|
|
109
|
-
padding-x: $kendo-fab-sm-padding-x,
|
|
110
|
-
padding-y: $kendo-fab-sm-padding-y
|
|
111
|
-
),
|
|
112
|
-
md: (
|
|
113
|
-
padding-x: $kendo-fab-md-padding-x,
|
|
114
|
-
padding-y: $kendo-fab-md-padding-y
|
|
115
|
-
),
|
|
116
|
-
lg: (
|
|
117
|
-
padding-x: $kendo-fab-lg-padding-x,
|
|
118
|
-
padding-y: $kendo-fab-lg-padding-y
|
|
119
|
-
)
|
|
120
|
-
) !default;
|
|
121
|
-
|
|
122
107
|
/// The base shadow of the FAB.
|
|
123
108
|
/// @group floating-action-button
|
|
124
109
|
$kendo-fab-shadow: k-elevation(5) !default;
|
|
@@ -180,6 +165,10 @@ $kendo-fab-generating-opacity: 40% !default;
|
|
|
180
165
|
|
|
181
166
|
|
|
182
167
|
@forward "@progress/kendo-theme-core/scss/components/fab/_variables.scss" with (
|
|
168
|
+
$kendo-fab-default-theme-color: $kendo-fab-default-theme-color,
|
|
169
|
+
$kendo-fab-default-fill-mode: $kendo-fab-default-fill-mode,
|
|
170
|
+
$kendo-fab-default-roundness: $kendo-fab-default-roundness,
|
|
171
|
+
$kendo-fab-default-size: $kendo-fab-default-size,
|
|
183
172
|
$kendo-fab-border-width: $kendo-fab-border-width,
|
|
184
173
|
$kendo-fab-font-family: $kendo-fab-font-family,
|
|
185
174
|
$kendo-fab-font-size: $kendo-fab-font-size,
|
|
@@ -205,8 +194,6 @@ $kendo-fab-generating-opacity: 40% !default;
|
|
|
205
194
|
$kendo-fab-item-icon-padding-y: $kendo-fab-item-icon-padding-y,
|
|
206
195
|
$kendo-fab-item-icon-border-width: $kendo-fab-item-icon-border-width,
|
|
207
196
|
$kendo-fab-item-icon-border-radius: $kendo-fab-item-icon-border-radius,
|
|
208
|
-
$kendo-fab-theme-colors: $kendo-fab-theme-colors,
|
|
209
|
-
$kendo-fab-sizes: $kendo-fab-sizes,
|
|
210
197
|
$kendo-fab-shadow: $kendo-fab-shadow,
|
|
211
198
|
$kendo-fab-disabled-shadow: $kendo-fab-disabled-shadow,
|
|
212
199
|
$kendo-fab-active-shadow: $kendo-fab-active-shadow,
|
|
@@ -8,13 +8,13 @@
|
|
|
8
8
|
$kendo-floating-label-scale: 1 !default;
|
|
9
9
|
/// The font size of the Floating Label.
|
|
10
10
|
/// @group floating-label
|
|
11
|
-
$kendo-floating-label-font-size: $kendo-input-font-size !default;
|
|
11
|
+
$kendo-floating-label-font-size: $kendo-input-md-font-size !default;
|
|
12
12
|
/// The maximum width of the Floating Label.
|
|
13
13
|
/// @group floating-label
|
|
14
14
|
$kendo-floating-label-max-width: 90% !default;
|
|
15
15
|
/// The line height of the Floating Label.
|
|
16
16
|
/// @group floating-label
|
|
17
|
-
$kendo-floating-label-line-height: $kendo-input-line-height !default;
|
|
17
|
+
$kendo-floating-label-line-height: $kendo-input-md-line-height !default;
|
|
18
18
|
/// The height of the Floating Label.
|
|
19
19
|
/// @group floating-label
|
|
20
20
|
$kendo-floating-label-height: calc( #{$kendo-floating-label-line-height} * #{$kendo-floating-label-font-size} ) !default;
|
|
@@ -5,6 +5,11 @@
|
|
|
5
5
|
|
|
6
6
|
// Forms
|
|
7
7
|
|
|
8
|
+
/// The default size of the Form.
|
|
9
|
+
/// @group form
|
|
10
|
+
/// @role default
|
|
11
|
+
$kendo-form-default-size: "md" !default;
|
|
12
|
+
|
|
8
13
|
/// The padding of the inline Form.
|
|
9
14
|
/// @group form
|
|
10
15
|
$kendo-form-spacer: k-spacing(8) !default;
|
|
@@ -141,22 +146,8 @@ $kendo-form-field-info-margin: k-spacing(4) !default;
|
|
|
141
146
|
/// @group form
|
|
142
147
|
$kendo-fieldset-legend-text: unset !default;
|
|
143
148
|
|
|
144
|
-
/// The sizes map for the Form.
|
|
145
|
-
/// @group form
|
|
146
|
-
$kendo-form-sizes: (
|
|
147
|
-
sm: (
|
|
148
|
-
form-rows-spacing: $kendo-form-sm-rows-spacing
|
|
149
|
-
),
|
|
150
|
-
md: (
|
|
151
|
-
form-rows-spacing: $kendo-form-md-rows-spacing
|
|
152
|
-
),
|
|
153
|
-
lg: (
|
|
154
|
-
form-rows-spacing: $kendo-form-lg-rows-spacing
|
|
155
|
-
)
|
|
156
|
-
) !default;
|
|
157
|
-
|
|
158
|
-
|
|
159
149
|
@forward "@progress/kendo-theme-core/scss/components/forms/_variables.scss" with (
|
|
150
|
+
$kendo-form-default-size: $kendo-form-default-size,
|
|
160
151
|
$kendo-form-spacer: $kendo-form-spacer,
|
|
161
152
|
$kendo-form-font-size: $kendo-form-font-size,
|
|
162
153
|
$kendo-form-line-height: $kendo-form-line-height,
|
|
@@ -195,6 +186,5 @@ $kendo-form-sizes: (
|
|
|
195
186
|
$kendo-fieldset-legend-margin: $kendo-fieldset-legend-margin,
|
|
196
187
|
$kendo-form-alert-error-margin: $kendo-form-alert-error-margin,
|
|
197
188
|
$kendo-form-field-info-margin: $kendo-form-field-info-margin,
|
|
198
|
-
$kendo-fieldset-legend-text: $kendo-fieldset-legend-text
|
|
199
|
-
$kendo-form-sizes: $kendo-form-sizes
|
|
189
|
+
$kendo-fieldset-legend-text: $kendo-fieldset-legend-text
|
|
200
190
|
);
|
|
@@ -11,6 +11,12 @@
|
|
|
11
11
|
|
|
12
12
|
|
|
13
13
|
// Grid
|
|
14
|
+
|
|
15
|
+
/// The default size of the Grid.
|
|
16
|
+
/// @group grid
|
|
17
|
+
/// @role default
|
|
18
|
+
$kendo-grid-default-size: "md" !default;
|
|
19
|
+
|
|
14
20
|
/// The width of the border around the Grid.
|
|
15
21
|
/// @group grid
|
|
16
22
|
$kendo-grid-border-width: 1px !default;
|
|
@@ -173,46 +179,6 @@ $kendo-grid-md-selection-aggregates-padding-x: $kendo-grid-padding-y !default;
|
|
|
173
179
|
$kendo-grid-md-selection-aggregates-padding-y: $kendo-grid-padding-y !default;
|
|
174
180
|
|
|
175
181
|
|
|
176
|
-
// Kendo Grid sizes
|
|
177
|
-
/// The sizes of the Grid.
|
|
178
|
-
/// @group grid
|
|
179
|
-
$kendo-grid-sizes: (
|
|
180
|
-
sm: (
|
|
181
|
-
header-padding-x: $kendo-grid-sm-header-padding-x,
|
|
182
|
-
header-padding-y: $kendo-grid-sm-header-padding-y,
|
|
183
|
-
grouping-header-padding-x: $kendo-grid-sm-grouping-header-padding-x,
|
|
184
|
-
grouping-header-padding-y: $kendo-grid-sm-grouping-header-padding-y,
|
|
185
|
-
cell-padding-x: $kendo-grid-sm-cell-padding-x,
|
|
186
|
-
cell-padding-y: $kendo-grid-sm-cell-padding-y,
|
|
187
|
-
filter-cell-padding-x: $kendo-grid-sm-filter-cell-padding-x,
|
|
188
|
-
filter-cell-padding-y: $kendo-grid-sm-filter-cell-padding-y,
|
|
189
|
-
edit-cell-padding-x: $kendo-grid-sm-edit-cell-padding-x,
|
|
190
|
-
edit-cell-padding-y: $kendo-grid-sm-edit-cell-padding-y,
|
|
191
|
-
button-padding-y: $kendo-button-sm-padding-y,
|
|
192
|
-
button-calc-size: $kendo-button-sm-calc-size,
|
|
193
|
-
group-dropclue-height: $kendo-grid-sm-group-dropclue-height,
|
|
194
|
-
selection-aggregates-padding-x: $kendo-grid-sm-selection-aggregates-padding-x,
|
|
195
|
-
selection-aggregates-padding-y: $kendo-grid-sm-selection-aggregates-padding-y
|
|
196
|
-
),
|
|
197
|
-
md: (
|
|
198
|
-
header-padding-x: $kendo-grid-md-header-padding-x,
|
|
199
|
-
header-padding-y: $kendo-grid-md-header-padding-y,
|
|
200
|
-
grouping-header-padding-x: $kendo-grid-md-grouping-header-padding-x,
|
|
201
|
-
grouping-header-padding-y: $kendo-grid-md-grouping-header-padding-y,
|
|
202
|
-
cell-padding-x: $kendo-grid-md-cell-padding-x,
|
|
203
|
-
cell-padding-y: $kendo-grid-md-cell-padding-y,
|
|
204
|
-
filter-cell-padding-x: $kendo-grid-md-filter-cell-padding-x,
|
|
205
|
-
filter-cell-padding-y: $kendo-grid-md-filter-cell-padding-y,
|
|
206
|
-
edit-cell-padding-x: $kendo-grid-md-edit-cell-padding-x,
|
|
207
|
-
edit-cell-padding-y: $kendo-grid-md-edit-cell-padding-y,
|
|
208
|
-
button-padding-y: $kendo-button-md-padding-y,
|
|
209
|
-
button-calc-size: $kendo-button-md-calc-size,
|
|
210
|
-
group-dropclue-height: $kendo-grid-md-group-dropclue-height,
|
|
211
|
-
selection-aggregates-padding-x: $kendo-grid-md-selection-aggregates-padding-x,
|
|
212
|
-
selection-aggregates-padding-y: $kendo-grid-md-selection-aggregates-padding-y
|
|
213
|
-
),
|
|
214
|
-
) !default;
|
|
215
|
-
|
|
216
182
|
/// The font size of the Grid header.
|
|
217
183
|
/// @group grid
|
|
218
184
|
$kendo-grid-header-font-size: null !default;
|
|
@@ -528,6 +494,7 @@ $kendo-grid-stack-expandable-shadow: k-elevation(2) !default;
|
|
|
528
494
|
|
|
529
495
|
|
|
530
496
|
@forward "@progress/kendo-theme-core/scss/components/grid/_variables.scss" with (
|
|
497
|
+
$kendo-grid-default-size: $kendo-grid-default-size,
|
|
531
498
|
$kendo-grid-border-width: $kendo-grid-border-width,
|
|
532
499
|
$kendo-grid-font-family: $kendo-grid-font-family,
|
|
533
500
|
$kendo-grid-font-size: $kendo-grid-font-size,
|
|
@@ -578,7 +545,6 @@ $kendo-grid-stack-expandable-shadow: k-elevation(2) !default;
|
|
|
578
545
|
$kendo-grid-md-group-dropclue-height: $kendo-grid-md-group-dropclue-height,
|
|
579
546
|
$kendo-grid-md-selection-aggregates-padding-x: $kendo-grid-md-selection-aggregates-padding-x,
|
|
580
547
|
$kendo-grid-md-selection-aggregates-padding-y: $kendo-grid-md-selection-aggregates-padding-y,
|
|
581
|
-
$kendo-grid-sizes: $kendo-grid-sizes,
|
|
582
548
|
$kendo-grid-header-font-size: $kendo-grid-header-font-size,
|
|
583
549
|
$kendo-grid-header-first-border: $kendo-grid-header-first-border,
|
|
584
550
|
$kendo-grid-header-menu-icon-spacing: $kendo-grid-header-menu-icon-spacing,
|
|
@@ -1,5 +1,10 @@
|
|
|
1
1
|
@use "../core/_index.scss" as *;
|
|
2
2
|
|
|
3
|
+
/// The default size of the Icon.
|
|
4
|
+
/// @group icon
|
|
5
|
+
/// @role default
|
|
6
|
+
$kendo-icon-default-size: "md" !default;
|
|
7
|
+
|
|
3
8
|
/// Font sizes of the icons.
|
|
4
9
|
/// @group icon
|
|
5
10
|
$kendo-icon-size: 1rem !default;
|
|
@@ -35,6 +40,7 @@ $kendo-icon-spacing: k-spacing(2) !default;
|
|
|
35
40
|
$kendo-icon-padding: k-spacing(1) !default;
|
|
36
41
|
|
|
37
42
|
@forward "@progress/kendo-theme-core/scss/components/icons/_variables.scss" with (
|
|
43
|
+
$kendo-icon-default-size: $kendo-icon-default-size,
|
|
38
44
|
$kendo-icon-size: $kendo-icon-size,
|
|
39
45
|
$kendo-icon-size-xs: $kendo-icon-size-xs,
|
|
40
46
|
$kendo-icon-size-sm: $kendo-icon-size-sm,
|
package/scss/input/_layout.scss
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
@use "sass:map";
|
|
2
2
|
@use "../core/_index.scss" as *;
|
|
3
|
+
@use "../core/functions/index.scss" as *;
|
|
3
4
|
@use "./_variables.scss" as *;
|
|
4
5
|
@use "@progress/kendo-theme-core/scss/components/input/_layout.scss" as *;
|
|
5
6
|
|
|
@@ -7,11 +8,13 @@
|
|
|
7
8
|
|
|
8
9
|
@include kendo-input--layout-base();
|
|
9
10
|
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
$
|
|
11
|
+
.k-input {
|
|
12
|
+
// Sizing
|
|
13
|
+
@each $size, $size-props in $kendo-input-sizes {
|
|
14
|
+
$_padding-x: map.get( $size-props, padding-x );
|
|
13
15
|
|
|
14
|
-
|
|
16
|
+
#{k-when-default($kendo-input-default-size, $size)}
|
|
17
|
+
&.k-input-#{$size} {
|
|
15
18
|
.k-input-prefix > .k-icon,
|
|
16
19
|
.k-input-prefix > .k-icon-wrapper-host .k-icon,
|
|
17
20
|
.k-input-prefix > .k-input-prefix-text,
|
|
@@ -22,5 +25,6 @@
|
|
|
22
25
|
}
|
|
23
26
|
}
|
|
24
27
|
}
|
|
28
|
+
}
|
|
25
29
|
|
|
26
30
|
}
|
|
@@ -5,6 +5,19 @@
|
|
|
5
5
|
|
|
6
6
|
// Input
|
|
7
7
|
|
|
8
|
+
/// The default fill mode of the Input.
|
|
9
|
+
/// @group input
|
|
10
|
+
/// @role default
|
|
11
|
+
$kendo-input-default-fill-mode: "solid" !default;
|
|
12
|
+
/// The default roundness of the Input.
|
|
13
|
+
/// @group input
|
|
14
|
+
/// @role default
|
|
15
|
+
$kendo-input-default-roundness: "md" !default;
|
|
16
|
+
/// The default size of the Input.
|
|
17
|
+
/// @group input
|
|
18
|
+
/// @role default
|
|
19
|
+
$kendo-input-default-size: "md" !default;
|
|
20
|
+
|
|
8
21
|
/// The default width of the Input components.
|
|
9
22
|
/// @group input
|
|
10
23
|
$kendo-input-default-width: 100% !default;
|
|
@@ -42,7 +55,7 @@ $kendo-input-font-family: var( --kendo-font-family, inherit ) !default;
|
|
|
42
55
|
|
|
43
56
|
/// The font size of input components.
|
|
44
57
|
/// @group input
|
|
45
|
-
$kendo-input-font-size:
|
|
58
|
+
$kendo-input-font-size: null !default;
|
|
46
59
|
/// The font size of the small Input components.
|
|
47
60
|
/// @group input
|
|
48
61
|
$kendo-input-sm-font-size: var( --kendo-font-size-sm, inherit )!default;
|
|
@@ -55,7 +68,7 @@ $kendo-input-lg-font-size: var( --kendo-font-size-lg, inherit ) !default;
|
|
|
55
68
|
|
|
56
69
|
/// The line height of input components.
|
|
57
70
|
/// @group input
|
|
58
|
-
$kendo-input-line-height:
|
|
71
|
+
$kendo-input-line-height: null !default;
|
|
59
72
|
/// The line height of the small Input components.
|
|
60
73
|
/// @group input
|
|
61
74
|
$kendo-input-sm-line-height: math.div( 20, 14 ) !default;
|
|
@@ -70,35 +83,6 @@ $kendo-input-sm-calc-size: calc( ( #{$kendo-input-sm-line-height} * 1em ) + ( #{
|
|
|
70
83
|
$kendo-input-md-calc-size: calc( ( #{$kendo-input-md-line-height} * 1em ) + ( #{$kendo-input-md-padding-y} * 2 ) + ( #{$kendo-input-border-width * 2} ) ) !default;
|
|
71
84
|
$kendo-input-lg-calc-size: calc( ( #{$kendo-input-lg-line-height} * 1em ) + ( #{$kendo-input-lg-padding-y} * 2 ) + ( #{$kendo-input-border-width * 2} ) ) !default;
|
|
72
85
|
|
|
73
|
-
/// The sizes map for the Input components.
|
|
74
|
-
/// @group input
|
|
75
|
-
$kendo-input-sizes: (
|
|
76
|
-
sm: (
|
|
77
|
-
padding-x: $kendo-input-sm-padding-x,
|
|
78
|
-
padding-y: $kendo-input-sm-padding-y,
|
|
79
|
-
font-size: $kendo-input-sm-font-size,
|
|
80
|
-
line-height: $kendo-input-sm-line-height,
|
|
81
|
-
button-padding-x: $kendo-input-sm-padding-y,
|
|
82
|
-
button-padding-y: $kendo-input-sm-padding-y
|
|
83
|
-
),
|
|
84
|
-
md: (
|
|
85
|
-
padding-x: $kendo-input-md-padding-x,
|
|
86
|
-
padding-y: $kendo-input-md-padding-y,
|
|
87
|
-
font-size: $kendo-input-md-font-size,
|
|
88
|
-
line-height: $kendo-input-md-line-height,
|
|
89
|
-
button-padding-x: $kendo-input-md-padding-y,
|
|
90
|
-
button-padding-y: $kendo-input-md-padding-y
|
|
91
|
-
),
|
|
92
|
-
lg: (
|
|
93
|
-
padding-x: $kendo-input-lg-padding-x,
|
|
94
|
-
padding-y: $kendo-input-lg-padding-y,
|
|
95
|
-
font-size: $kendo-input-lg-font-size,
|
|
96
|
-
line-height: $kendo-input-lg-line-height,
|
|
97
|
-
button-padding-x: $kendo-input-lg-padding-y,
|
|
98
|
-
button-padding-y: $kendo-input-lg-padding-y
|
|
99
|
-
)
|
|
100
|
-
) !default;
|
|
101
|
-
|
|
102
86
|
/// The background color of the Input components.
|
|
103
87
|
/// @group input
|
|
104
88
|
$kendo-input-bg: k-color(surface-alt) !default;
|
|
@@ -276,6 +260,19 @@ $kendo-input-invalid-border: k-color(error-on-surface) !default;
|
|
|
276
260
|
/// @group input
|
|
277
261
|
$kendo-input-invalid-shadow: 0 0 0 .25rem color-mix(in srgb, k-color(error) 25%, transparent) !default;
|
|
278
262
|
|
|
263
|
+
/// The default fill mode of the Picker.
|
|
264
|
+
/// @group picker
|
|
265
|
+
/// @role default
|
|
266
|
+
$kendo-picker-default-fill-mode: "solid" !default;
|
|
267
|
+
/// The default roundness of the Picker.
|
|
268
|
+
/// @group picker
|
|
269
|
+
/// @role default
|
|
270
|
+
$kendo-picker-default-roundness: "md" !default;
|
|
271
|
+
/// The default size of the Picker.
|
|
272
|
+
/// @group picker
|
|
273
|
+
/// @role default
|
|
274
|
+
$kendo-picker-default-size: "md" !default;
|
|
275
|
+
|
|
279
276
|
/// The background color of the Picker components.
|
|
280
277
|
/// @group picker
|
|
281
278
|
$kendo-picker-bg: k-color(surface-alt) !default;
|
|
@@ -342,7 +339,7 @@ $kendo-picker-disabled-shadow: null !default;
|
|
|
342
339
|
|
|
343
340
|
/// The background color of the outline Picker components.
|
|
344
341
|
/// @group picker
|
|
345
|
-
$kendo-picker-outline-bg:
|
|
342
|
+
$kendo-picker-outline-bg: transparent !default;
|
|
346
343
|
/// The text color of the outline Picker components.
|
|
347
344
|
/// @group picker
|
|
348
345
|
$kendo-picker-outline-text: $kendo-button-text !default;
|
|
@@ -384,7 +381,7 @@ $kendo-picker-outline-hover-focus-border: null !default;
|
|
|
384
381
|
|
|
385
382
|
/// The background color of the flat Picker components.
|
|
386
383
|
/// @group picker
|
|
387
|
-
$kendo-picker-flat-bg:
|
|
384
|
+
$kendo-picker-flat-bg: transparent !default;
|
|
388
385
|
/// The text color of the flat Picker components.
|
|
389
386
|
/// @group picker
|
|
390
387
|
$kendo-picker-flat-text: $kendo-button-text !default;
|
|
@@ -431,6 +428,9 @@ $kendo-use-input-spinner-icon-offset: false !default;
|
|
|
431
428
|
|
|
432
429
|
|
|
433
430
|
@forward "@progress/kendo-theme-core/scss/components/input/_variables.scss" with (
|
|
431
|
+
$kendo-input-default-fill-mode: $kendo-input-default-fill-mode,
|
|
432
|
+
$kendo-input-default-roundness: $kendo-input-default-roundness,
|
|
433
|
+
$kendo-input-default-size: $kendo-input-default-size,
|
|
434
434
|
$kendo-input-default-width: $kendo-input-default-width,
|
|
435
435
|
$kendo-input-border-width: $kendo-input-border-width,
|
|
436
436
|
$kendo-input-border-radius: $kendo-input-border-radius,
|
|
@@ -452,7 +452,6 @@ $kendo-use-input-spinner-icon-offset: false !default;
|
|
|
452
452
|
$kendo-input-sm-calc-size: $kendo-input-sm-calc-size,
|
|
453
453
|
$kendo-input-md-calc-size: $kendo-input-md-calc-size,
|
|
454
454
|
$kendo-input-lg-calc-size: $kendo-input-lg-calc-size,
|
|
455
|
-
$kendo-input-sizes: $kendo-input-sizes,
|
|
456
455
|
$kendo-input-bg: $kendo-input-bg,
|
|
457
456
|
$kendo-input-text: $kendo-input-text,
|
|
458
457
|
$kendo-input-border: $kendo-input-border,
|
|
@@ -507,6 +506,9 @@ $kendo-use-input-spinner-icon-offset: false !default;
|
|
|
507
506
|
$kendo-input-suffix-bg: $kendo-input-suffix-bg,
|
|
508
507
|
$kendo-input-invalid-border: $kendo-input-invalid-border,
|
|
509
508
|
$kendo-input-invalid-shadow: $kendo-input-invalid-shadow,
|
|
509
|
+
$kendo-picker-default-fill-mode: $kendo-picker-default-fill-mode,
|
|
510
|
+
$kendo-picker-default-roundness: $kendo-picker-default-roundness,
|
|
511
|
+
$kendo-picker-default-size: $kendo-picker-default-size,
|
|
510
512
|
$kendo-picker-bg: $kendo-picker-bg,
|
|
511
513
|
$kendo-picker-text: $kendo-picker-text,
|
|
512
514
|
$kendo-picker-border: $kendo-picker-border,
|