@progress/kendo-theme-fluent 7.3.0-dev.0 → 8.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.
Files changed (21) hide show
  1. package/dist/all.css +3716 -2575
  2. package/dist/fluent-main.scss +4 -1
  3. package/dist/meta/sassdoc-data.json +2706 -1456
  4. package/dist/meta/sassdoc-raw-data.json +1353 -728
  5. package/lib/swatches/all.json +13 -2
  6. package/lib/swatches/fluent-main.json +13 -2
  7. package/package.json +4 -4
  8. package/scss/calendar/_layout.scss +5 -5
  9. package/scss/calendar/_theme.scss +0 -3
  10. package/scss/calendar/_variables.scss +129 -81
  11. package/scss/core/color-system/_swatch-legacy.scss +1 -1
  12. package/scss/core/color-system/_swatch.scss +1 -1
  13. package/scss/drawer/_layout.scss +26 -58
  14. package/scss/drawer/_variables.scss +42 -41
  15. package/scss/floating-label/_layout.scss +10 -14
  16. package/scss/floating-label/_theme.scss +5 -5
  17. package/scss/forms/_layout.scss +0 -4
  18. package/scss/input/_theme.scss +0 -1
  19. package/scss/panelbar/_layout.scss +0 -4
  20. package/scss/panelbar/_theme.scss +0 -2
  21. package/scss/panelbar/_variables.scss +73 -69
package/lib/swatches/all.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "name": "All",
4
4
  "product": "kendo",
5
5
  "base": "@progress/kendo-theme-fluent",
6
- "version": "7.3.0-dev.0",
6
+ "version": "8.0.0-dev.0",
7
7
  "api": "modern",
8
8
  "previewColors": [
9
9
  "#ffffff",
@@ -13,5 +13,16 @@
13
13
  "#424242"
14
14
  ],
15
15
  "components": [],
16
- "groups": []
16
+ "groups": [
17
+ {
18
+ "name": "New color system",
19
+ "colorSystem": {
20
+ "kendo-enable-color-system": {
21
+ "name": "New color system",
22
+ "type": "boolean",
23
+ "value": true
24
+ }
25
+ }
26
+ }
27
+ ]
17
28
  }
package/lib/swatches/fluent-main.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "name": "Fluent Main",
4
4
  "product": "kendo",
5
5
  "base": "@progress/kendo-theme-fluent",
6
- "version": "7.3.0-dev.0",
6
+ "version": "8.0.0-dev.0",
7
7
  "api": "modern",
8
8
  "previewColors": [
9
9
  "#ffffff",
@@ -13,5 +13,16 @@
13
13
  "#424242"
14
14
  ],
15
15
  "components": [],
16
- "groups": []
16
+ "groups": [
17
+ {
18
+ "name": "New color system",
19
+ "colorSystem": {
20
+ "kendo-enable-color-system": {
21
+ "name": "New color system",
22
+ "type": "boolean",
23
+ "value": true
24
+ }
25
+ }
26
+ }
27
+ ]
17
28
  }
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@progress/kendo-theme-fluent",
3
3
  "description": "A css variables based theme for Kendo UI that follows the Fluent design system guidelines.",
4
- "version": "7.3.0-dev.0",
4
+ "version": "8.0.0-dev.0",
5
5
  "author": "Progress",
6
6
  "license": "Apache-2.0",
7
7
  "keywords": [
@@ -53,12 +53,12 @@
53
53
  },
54
54
  "dependencies": {
55
55
  "@progress/kendo-svg-icons": "2.1.0",
56
- "@progress/kendo-theme-core": "7.3.0-dev.0",
57
- "@progress/kendo-theme-utils": "7.3.0-dev.0"
56
+ "@progress/kendo-theme-core": "8.0.0-dev.0",
57
+ "@progress/kendo-theme-utils": "8.0.0-dev.0"
58
58
  },
59
59
  "directories": {
60
60
  "doc": "docs",
61
61
  "lib": "lib"
62
62
  },
63
- "gitHead": "01297a87bc94d867851e28577c04a0596e35e4f9"
63
+ "gitHead": "82fa9745206aad68ed9f5a6d8c11d84dbb70c20c"
64
64
  }
package/scss/calendar/_layout.scss CHANGED
@@ -148,11 +148,6 @@
148
148
  justify-content: space-between;
149
149
  flex: 0 0 auto;
150
150
 
151
- .k-title,
152
- .k-calendar-title {
153
- font-weight: bold;
154
- }
155
-
156
151
  .k-calendar-nav {
157
152
  display: flex;
158
153
  flex-flow: row nowrap;
@@ -186,6 +181,11 @@
186
181
  z-index: 1;
187
182
  overflow: hidden;
188
183
 
184
+ .k-today {
185
+ font-weight: bold;
186
+ }
187
+
188
+
189
189
  .k-link {
190
190
  @include border-radius( var( --kendo-calendar-cell-border-radius, #{$kendo-calendar-cell-border-radius} ) );
191
191
  padding-inline: var( --INTERNAL--kendo-calendar-cell-padding-x, 0 );
package/scss/calendar/_theme.scss CHANGED
@@ -237,7 +237,4 @@
237
237
  }
238
238
  }
239
239
 
240
- .k-out-of-range {
241
- pointer-events: none;
242
- }
243
240
  }
package/scss/calendar/_variables.scss CHANGED
@@ -1,298 +1,346 @@
1
1
  @use "sass:map";
2
2
  @use "../core/" as *;
3
3
 
4
- /// Width of the border around the calendar.
4
+ /// The width of the border around the Calendar.
5
5
  /// @group calendar
6
6
  $kendo-calendar-border-width: 1px !default;
7
- /// Font family of the calendar.
7
+ /// The font family of the Calendar.
8
8
  /// @group calendar
9
9
  $kendo-calendar-font-family: var( --kendo-font-family, inherit ) !default;
10
- /// Font size of the calendar.
10
+ /// The font size of the Calendar.
11
11
  /// @group calendar
12
12
  $kendo-calendar-font-size: var( --kendo-font-size, inherit ) !default;
13
- /// Line height of the calendar.
13
+ /// The line height of the Calendar.
14
14
  /// @group calendar
15
15
  $kendo-calendar-line-height: var( --kendo-line-height, normal ) !default;
16
16
 
17
- /// Size of the calendar cell.
17
+ /// The size of the calendar cell.
18
18
  /// @group calendar
19
19
  $kendo-calendar-cell-size: 28px !default;
20
20
 
21
- /// Background color of the calendar.
21
+ /// The background color of the Calendar.
22
22
  /// @group calendar
23
23
  $kendo-calendar-bg: var( --kendo-component-bg, initial) !default;
24
- /// Text color of the calendar.
24
+ /// The text color of the Calendar.
25
25
  /// @group calendar
26
26
  $kendo-calendar-text: var( --kendo-component-text, initial) !default;
27
- /// Border color of the calendar.
27
+ /// The border color of the Calendar.
28
28
  /// @group calendar
29
29
  $kendo-calendar-border: var( --kendo-component-border, initial) !default;
30
30
 
31
- /// Horizontal padding of the calendar header.
31
+ /// The horizontal padding of the calendar header.
32
32
  /// @group calendar
33
- $kendo-calendar-header-padding-x: map.get( $kendo-spacing, 3 ) !default;
34
- /// Vertical padding of the calendar header.
33
+ $kendo-calendar-header-padding-x: map.get( $kendo-spacing, 1 ) !default;
34
+ /// The vertical padding of the calendar header.
35
35
  /// @group calendar
36
- $kendo-calendar-header-padding-y: map.get( $kendo-spacing, 3 ) map.get( $kendo-spacing, 1 ) !default;
37
- /// Width of the bottom border of the calendar header.
36
+ $kendo-calendar-header-padding-y: map.get( $kendo-spacing, 1 ) !default;
37
+ /// The width of the bottom border of the calendar header.
38
38
  /// @group calendar
39
39
  $kendo-calendar-header-border-width: 1px !default;
40
40
  $kendo-calendar-header-min-width: ($kendo-calendar-cell-size * 8) !default;
41
41
 
42
- /// Background color of the calendar header.
42
+ /// The background color of the calendar header.
43
43
  /// @group calendar
44
44
  $kendo-calendar-header-bg: if($kendo-enable-color-system, k-color( surface ), k-get-theme-color-var( neutral-10 )) !default; // $kendo-component-header-bg
45
- /// Text color of the calendar header.
45
+ /// The text color of the calendar header.
46
46
  /// @group calendar
47
47
  $kendo-calendar-header-text: $kendo-calendar-text !default; // $kendo-component-header-text
48
- /// Border color of the calendar header.
48
+ /// The border color of the calendar header.
49
49
  /// @group calendar
50
50
  $kendo-calendar-header-border: $kendo-calendar-border !default; // $kendo-component-header-border
51
51
 
52
- /// Spacing between the navigation buttons of the calendar.
52
+ /// The spacing between the navigation buttons of the Calendar.
53
53
  /// @group calendar
54
54
  $kendo-calendar-nav-gap: 0 !default;
55
55
 
56
- /// Horizontal padding of the calendar footer.
56
+ /// The horizontal padding of the calendar footer.
57
57
  /// @group calendar
58
- $kendo-calendar-footer-padding-x: map.get( $kendo-spacing, 3 ) !default;
59
- /// Vertical padding of the calendar footer.
58
+ $kendo-calendar-footer-padding-x: map.get( $kendo-spacing, 1 ) !default;
59
+ /// The vertical padding of the calendar footer.
60
60
  /// @group calendar
61
- $kendo-calendar-footer-padding-y: map.get( $kendo-spacing, 3 ) !default;
61
+ $kendo-calendar-footer-padding-y: map.get( $kendo-spacing, 1 ) !default;
62
62
 
63
- /// Font size of the calendar cell.
63
+ /// The font size of the calendar cell.
64
64
  /// @group calendar
65
65
  $kendo-calendar-cell-font-size: var( --kendo-font-size-sm, inherit ) !default;
66
- /// Horizontal padding of the calendar cell.
66
+ /// The horizontal padding of the calendar cell.
67
67
  /// @group calendar
68
68
  $kendo-calendar-cell-padding-x: map.get( $kendo-spacing, 1.5 ) !default;
69
- /// Vertical padding of the calendar cell.
69
+ /// The vertical padding of the calendar cell.
70
70
  /// @group calendar
71
71
  $kendo-calendar-cell-padding-y: $kendo-calendar-cell-padding-x !default;
72
- /// Line height of the calendar cell.
72
+ /// The line height of the calendar cell.
73
73
  /// @group calendar
74
74
  $kendo-calendar-cell-line-height: $kendo-calendar-line-height !default;
75
- /// Border radius of the calendar cell.
75
+ /// The border radius of the calendar cell.
76
76
  /// @group calendar
77
77
  $kendo-calendar-cell-border-radius: var( --kendo-border-radius-md, 0) !default;
78
78
 
79
- /// Horizontal padding of the calendar header cell.
79
+ /// The horizontal padding of the calendar header cell.
80
80
  /// @group calendar
81
81
  $kendo-calendar-header-cell-padding-x: 0 !default;
82
- /// Vertical padding of the calendar header cell.
82
+ /// Th vertical padding of the calendar header cell.
83
83
  /// @group calendar
84
84
  $kendo-calendar-header-cell-padding-y: 0 !default;
85
- /// Width of the calendar header cell.
85
+ /// The width of the calendar header cell.
86
86
  /// @group calendar
87
87
  $kendo-calendar-header-cell-width: $kendo-calendar-cell-size !default;
88
- /// Height of the calendar header cell.
88
+ /// The height of the calendar header cell.
89
89
  /// @group calendar
90
90
  $kendo-calendar-header-cell-height: $kendo-calendar-cell-size !default;
91
- /// Font size of the calendar header cell.
91
+ /// The font size of the calendar header cell.
92
92
  /// @group calendar
93
93
  $kendo-calendar-header-cell-font-size: var( --kendo-font-size-sm, inherit ) !default;
94
- /// Line height of the calendar header cell.
94
+ /// The line height of the calendar header cell.
95
95
  /// @group calendar
96
96
  $kendo-calendar-header-cell-line-height: 2 !default;
97
- /// Background color of the calendar header cell.
97
+ /// The background color of the calendar header cell.
98
98
  /// @group calendar
99
99
  $kendo-calendar-header-cell-bg: inherit !default;
100
- /// Text color of the calendar header cell.
100
+ /// The text color of the calendar header cell.
101
101
  /// @group calendar
102
102
  $kendo-calendar-header-cell-text: inherit !default;
103
103
 
104
- /// Horizontal padding of the calendar captions.
104
+ /// The horizontal padding of the calendar captions.
105
105
  /// @group calendar
106
106
  $kendo-calendar-caption-padding-x: map.get( $kendo-spacing, 3 ) !default;
107
- /// Vertical padding of the calendar captions.
107
+ /// The vertical padding of the calendar captions.
108
108
  /// @group calendar
109
109
  $kendo-calendar-caption-padding-y: map.get( $kendo-spacing, 1 ) !default;
110
- /// Height of the calendar captions.
110
+ /// The height of the calendar captions.
111
111
  /// @group calendar
112
112
  $kendo-calendar-caption-height: $kendo-calendar-cell-size !default;
113
- /// Font size of the calendar captions.
113
+ /// The font size of the calendar captions.
114
114
  /// @group calendar
115
115
  $kendo-calendar-caption-font-size: var( --kendo-font-size-sm, inherit ) !default;
116
- /// Line height of the calendar captions.
116
+ /// The line height of the calendar captions.
117
117
  /// @group calendar
118
118
  $kendo-calendar-caption-line-height: normal !default;
119
119
  /// Font weight of the calendar captions.
120
120
  /// @group calendar
121
121
  $kendo-calendar-caption-font-weight: bold !default;
122
- /// Text color of the calendar captions.
122
+ /// The text color of the calendar captions.
123
123
  /// @group calendar
124
124
  $kendo-calendar-caption-color: $kendo-subtle-text !default;
125
125
 
126
+ /// The width of the Calendar view.
127
+ /// @group calendar
126
128
  $kendo-calendar-view-width: ($kendo-calendar-cell-size * 7) !default;
129
+ /// The height of the Calendar view.
130
+ /// @group calendar
127
131
  $kendo-calendar-view-height: ($kendo-calendar-cell-size * 7) !default;
128
132
 
129
- /// Bottom padding of calendar views.
133
+ /// The bottom padding of Calendar views.
130
134
  /// @group calendar
131
- $kendo-calendar-view-padding-block-end: map.get( $kendo-spacing, 3 ) !default;
132
- /// Spacing between the views in the multiview calendar.
135
+ $kendo-calendar-view-padding-block-end: map.get( $kendo-spacing, 1 ) !default;
136
+ /// The spacing between the views in the multiview Calendar.
133
137
  /// @group calendar
134
138
  $kendo-calendar-view-gap: map.get( $kendo-spacing, 4 ) !default;
135
139
 
136
- /// Background color of the calendar weekend cell.
140
+ /// The background color of the calendar weekend cell.
137
141
  /// @group calendar
138
142
  $kendo-calendar-weekend-bg: inherit !default;
139
- /// Text color of the calendar weekend cell.
143
+ /// The text color of the calendar weekend cell.
140
144
  /// @group calendar
141
145
  $kendo-calendar-weekend-text: inherit !default;
142
146
 
143
- /// Text color of the calendar today cell.
147
+ /// The text color of the calendar today cell.
144
148
  /// @group calendar
145
149
  $kendo-calendar-today-text: if($kendo-enable-color-system, k-color( app-surface ), $kendo-color-white) !default; // use contrast function
146
- /// Background color of the calendar today cell.
150
+ /// The background color of the calendar today cell.
147
151
  /// @group calendar
148
152
  $kendo-calendar-today-bg: if($kendo-enable-color-system, k-color( primary ), k-get-theme-color-var( primary-100 )) !default;
149
- /// Text color of the calendar today cell when hovered.
153
+ /// The text color of the calendar today cell when hovered.
150
154
  /// @group calendar
151
155
  $kendo-calendar-today-hover-text: if($kendo-enable-color-system, k-color( app-surface ), $kendo-color-white) !default; // use contrast function
152
- /// Background color of the calendar today cell when hovered.
156
+ /// The background color of the calendar today cell when hovered.
153
157
  /// @group calendar
154
158
  $kendo-calendar-today-hover-bg: if($kendo-enable-color-system, k-color( primary-hover ), k-get-theme-color-var( primary-120 )) !default;
155
- /// Border radius of the calendar today cell.
159
+ /// The border radius of the calendar today cell.
156
160
  /// @group calendar
157
161
  $kendo-calendar-today-border-radius: 9999px !default;
158
162
 
159
- /// Background color of the calendar week number cell.
163
+ /// The background color of the calendar week number cell.
160
164
  /// @group calendar
161
165
  $kendo-calendar-week-number-bg: inherit !default;
162
- /// Text color of the calendar week number cell.
166
+ /// The text color of the calendar week number cell.
163
167
  /// @group calendar
164
168
  $kendo-calendar-week-number-text: var( --kendo-subtle-text, inherit ) !default;
165
169
 
166
- /// Background color of the other months calendar cells.
170
+ /// The background color of the other months calendar cells.
167
171
  /// @group calendar
168
172
  $kendo-calendar-other-month-bg: inherit !default;
169
- /// Text color of the other months calendar cells.
173
+ /// The text color of the other months calendar cells.
170
174
  /// @group calendar
171
175
  $kendo-calendar-other-month-text: var( --kendo-disabled-text, inherit ) !default;
172
176
 
173
- /// Background color of the calendar cells.
177
+ /// The background color of the calendar cells.
174
178
  /// @group calendar
175
179
  $kendo-calendar-cell-bg: inherit !default;
176
- /// Text color of the calendar cells.
180
+ /// The text color of the calendar cells.
177
181
  /// @group calendar
178
182
  $kendo-calendar-cell-text: inherit !default;
179
183
 
180
- /// Background color of the calendar cells when hovered.
184
+ /// The background color of the calendar cells when hovered.
181
185
  /// @group calendar
182
186
  $kendo-calendar-cell-hover-bg: var( --kendo-hover-bg, inherit ) !default;
183
- /// Text color of the calendar cells when hovered.
187
+ /// The text color of the calendar cells when hovered.
184
188
  /// @group calendar
185
189
  $kendo-calendar-cell-hover-text: var( --kendo-hover-text, inherit ) !default;
186
190
 
187
- /// Background color of the selected calendar cell.
191
+ /// The background color of the selected calendar cell.
188
192
  /// @group calendar
189
193
  $kendo-calendar-cell-selected-bg: var( --kendo-selected-bg, inherit ) !default;
190
- /// Text color of the selected calendar cell.
194
+ /// The text color of the selected calendar cell.
191
195
  /// @group calendar
192
196
  $kendo-calendar-cell-selected-text: var( --kendo-selected-text, inherit ) !default;
193
- /// Border color of the selected calendar cell.
197
+ /// The border color of the selected calendar cell.
194
198
  /// @group calendar
195
199
  $kendo-calendar-cell-selected-border: var( --kendo-selected-border, inherit ) !default;
196
- /// Shadow of the selected calendar cell.
200
+ /// The shadow of the selected calendar cell.
197
201
  /// @group calendar
198
202
  $kendo-calendar-cell-selected-shadow: inset 0 0 0 1px $kendo-calendar-cell-selected-border !default;
199
203
 
200
- /// Background color of the selected calendar cell when hovered.
204
+ /// The background color of the selected calendar cell when hovered.
201
205
  /// @group calendar
202
206
  $kendo-calendar-cell-selected-hover-bg: var( --kendo-selected-hover-bg, inherit ) !default;
203
- /// Text color of the selected calendar cell when hovered.
207
+ /// The text color of the selected calendar cell when hovered.
204
208
  /// @group calendar
205
209
  $kendo-calendar-cell-selected-hover-text: var( --kendo-selected-hover-text, inherit ) !default;
206
210
 
207
- /// Shadow of the selected calendar cell when focused.
211
+ /// The shadow of the selected calendar cell when focused.
208
212
  /// @group calendar
209
213
  $kendo-calendar-cell-focus-shadow: inset 0 0 0 1px if($kendo-enable-color-system, k-color( base-emphasis ), k-get-theme-color-var( neutral-130)) !default;
210
- /// Shadow of the selected calendar cell when selected and focused.
214
+ /// The shadow of the selected calendar cell when selected and focused.
211
215
  /// @group calendar
212
216
  $kendo-calendar-cell-selected-focus-shadow: $kendo-calendar-cell-focus-shadow !default;
213
217
 
214
218
 
215
219
  // Calendar navigation
216
- /// Width of the navigation in the infinite calendar.
220
+
221
+ /// The width of the navigation in the infinite Calendar.
217
222
  /// @group calendar
218
223
  $kendo-calendar-navigation-width: 5em !default;
219
- /// Height of the navigation items in the infinite calendar.
224
+ /// The height of the navigation items in the infinite Calendar.
220
225
  /// @group calendar
221
226
  $kendo-calendar-navigation-item-height: 2em !default;
222
227
 
223
- /// Background color of the navigation in the infinite calendar.
228
+ /// The background color of the navigation in the infinite Calendar.
224
229
  /// @group calendar
225
230
  $kendo-calendar-navigation-bg: if($kendo-enable-color-system, k-color( surface ), k-get-theme-color-var( neutral-10 )) !default;
226
- /// Text color of the navigation in the infinite calendar.
231
+ /// The text color of the navigation in the infinite Calendar.
227
232
  /// @group calendar
228
233
  $kendo-calendar-navigation-text: $kendo-calendar-header-text !default;
229
- /// Border color of the navigation in the infinite calendar.
234
+ /// The border color of the navigation in the infinite Calendar.
230
235
  /// @group calendar
231
236
  $kendo-calendar-navigation-border: $kendo-calendar-header-border !default;
232
237
 
238
+ /// The text color of the hovered items in the calendar navigation.
239
+ /// @group calendar
233
240
  $kendo-calendar-navigation-hover-text: $kendo-link-hover-text !default;
234
241
 
235
242
 
236
243
  // Infinite calendar
237
- /// Background color of the navigation in the infinite calendar.
244
+ /// The background color of the navigation in the infinite Calendar.
238
245
  /// @group calendar
239
246
  $kendo-infinite-calendar-header-padding-x: map.get( $kendo-spacing, 3 ) !default;
240
- /// Background color of the navigation in the infinite calendar.
247
+ /// The background color of the navigation in the infinite Calendar.
241
248
  /// @group calendar
242
249
  $kendo-infinite-calendar-header-padding-y: map.get( $kendo-spacing, 3 ) map.get( $kendo-spacing, 1 ) !default;
243
250
 
244
- /// Horizontal padding of the infinite calendar.
251
+ /// The horizontal padding of the infinite Calendar.
245
252
  /// @group calendar
246
253
  $kendo-infinite-calendar-view-padding-x: map.get( $kendo-spacing, 3 ) !default;
247
- /// Vertical padding of the infinite calendar.
254
+ /// The vertical padding of the infinite Calendar.
248
255
  /// @group calendar
249
256
  $kendo-infinite-calendar-view-padding-y: 0px !default;
257
+
258
+ /// The height of the infinite Calendar view.
259
+ /// @group calendar
250
260
  $kendo-infinite-calendar-view-height: ( $kendo-calendar-cell-size * 9 ) !default;
251
261
 
252
262
 
253
263
  // Range calendar
254
- /// Background color of the range selection in the calendar.
264
+ /// The background color of the range selection in the Calendar.
255
265
  /// @group calendar
256
266
  $kendo-calendar-range-bg: if($kendo-enable-color-system, k-color( base-active ), k-get-theme-color-var( neutral-30 )) !default;
257
- /// Text color of the range selection in the calendar.
267
+ /// The text color of the range selection in the Calendar.
258
268
  /// @group calendar
259
269
  $kendo-calendar-range-text: inherit !default;
260
- /// Border color of the range selection in the calendar.
270
+ /// The border color of the range selection in the Calendar.
261
271
  /// @group calendar
262
272
  $kendo-calendar-range-border: if($kendo-enable-color-system, k-color( base-emphasis ), k-get-theme-color-var( neutral-130 )) !default;
263
- /// Hover shadow of the start range selection in the calendar.
273
+ /// The shadow of the hovered start range selection in the Calendar.
264
274
  /// @group calendar
265
275
  $kendo-calendar-start-range-hover-shadow: inset 1px -1px 0 0 if($kendo-enable-color-system, k-color( base-emphasis ), k-get-theme-color-var( neutral-130 )), inset 0 1px 0 0 if($kendo-enable-color-system, k-color( base-emphasis ), k-get-theme-color-var( neutral-130 )) !default;
266
- /// Hover shadow of the mid range selection in the calendar.
276
+ /// The shadow of the hovered mid range selection in the Calendar.
267
277
  /// @group calendar
268
278
  $kendo-calendar-mid-range-hover-shadow: inset 0 -1px 0 0 if($kendo-enable-color-system, k-color( base-emphasis ), k-get-theme-color-var( neutral-130 )), inset 0 1px 0 0 if($kendo-enable-color-system, k-color( base-emphasis ), k-get-theme-color-var( neutral-130 )) !default;
269
- /// Hover shadow of the end range selection in the calendar.
279
+ /// The shadow of the hovered end range selection in the Calendar.
270
280
  /// @group calendar
271
281
  $kendo-calendar-end-range-hover-shadow: inset -1px -1px 0 0 if($kendo-enable-color-system, k-color( base-emphasis ), k-get-theme-color-var( neutral-130 )), inset 0 1px 0 0 if($kendo-enable-color-system, k-color( base-emphasis ), k-get-theme-color-var( neutral-130 )) !default;
272
282
 
273
283
 
274
284
  // Calendar sizes
285
+ /// The font size of the small Calendar.
286
+ /// @group calendar
275
287
  $kendo-calendar-sm-font-size: $kendo-font-size-sm !default;
288
+ /// The line height of the small Calendar.
289
+ /// @group calendar
276
290
  $kendo-calendar-sm-line-height: $kendo-line-height-sm !default;
291
+ /// The size of the small calendar cell.
292
+ /// @group calendar
277
293
  $kendo-calendar-sm-cell-size: 24px !default;
294
+ /// The horizontal padding of the cells in the small Calendar.
295
+ /// @group calendar
278
296
  $kendo-calendar-sm-cell-padding-x: map.get( $kendo-spacing, 0.5 ) !default;
297
+ /// The vertical padding of the cells in the small Calendar.
298
+ /// @group calendar
279
299
  $kendo-calendar-sm-cell-padding-y: map.get( $kendo-spacing, 0.5 ) !default;
300
+ /// The font size of the cells in the small Calendar.
301
+ /// @group calendar
280
302
  $kendo-calendar-sm-cell-font-size: $kendo-font-size-sm !default;
281
303
 
304
+ /// The font size of the medium Calendar.
305
+ /// @group calendar
282
306
  $kendo-calendar-md-font-size: $kendo-font-size-md !default;
307
+ /// The line height of the medium Calendar.
308
+ /// @group calendar
283
309
  $kendo-calendar-md-line-height: $kendo-line-height-md !default;
310
+ /// The size of the medium calendar cell.
311
+ /// @group calendar
284
312
  $kendo-calendar-md-cell-size: 28px !default;
313
+ /// The horizontal padding of the cells in the medium Calendar.
314
+ /// @group calendar
285
315
  $kendo-calendar-md-cell-padding-x: map.get( $kendo-spacing, 1 ) !default;
316
+ /// The vertical padding of the cells in the medium Calendar.
317
+ /// @group calendar
286
318
  $kendo-calendar-md-cell-padding-y: map.get( $kendo-spacing, 1 ) !default;
319
+ /// The font size of the cells in the medium Calendar.
320
+ /// @group calendar
287
321
  $kendo-calendar-md-cell-font-size: $kendo-font-size-sm !default;
288
322
 
323
+ /// The font size of the large Calendar.
324
+ /// @group calendar
289
325
  $kendo-calendar-lg-font-size: $kendo-font-size-md !default;
326
+ /// The line height of the large Calendar.
327
+ /// @group calendar
290
328
  $kendo-calendar-lg-line-height: $kendo-line-height-md !default;
329
+ /// The size of the large calendar cell.
330
+ /// @group calendar
291
331
  $kendo-calendar-lg-cell-size: 32px !default;
332
+ /// The horizontal padding of the cells in the large Calendar.
333
+ /// @group calendar
292
334
  $kendo-calendar-lg-cell-padding-x: map.get( $kendo-spacing, 1 ) !default;
335
+ /// The vertical padding of the cells in the large Calendar.
336
+ /// @group calendar
293
337
  $kendo-calendar-lg-cell-padding-y: map.get( $kendo-spacing, 1 ) !default;
338
+ /// The font size of the cells in the large Calendar.
339
+ /// @group calendar
294
340
  $kendo-calendar-lg-cell-font-size: $kendo-font-size-md !default;
295
341
 
342
+ /// The sizes Map of the Calendar.
343
+ /// @group calendar
296
344
  $kendo-calendar-sizes: (
297
345
  sm: (
298
346
  font-size: $kendo-calendar-sm-font-size,
package/scss/core/color-system/_swatch-legacy.scss CHANGED
@@ -3,7 +3,7 @@
3
3
  @if(core.$kendo-enable-color-system) {
4
4
  core.$kendo-body-bg: core.k-color( app-surface );
5
5
  core.$kendo-body-text: core.k-color( on-app-surface );
6
- core.$kendo-component-bg: core.$kendo-body-bg;
6
+ core.$kendo-component-bg: core.k-color( surface-alt );
7
7
  core.$kendo-component-text: core.$kendo-body-text;
8
8
  core.$kendo-component-border: color-mix(in srgb, core.k-color( border ) 16%, transparent);
9
9
  core.$kendo-hover-bg: core.k-color( base-hover );
package/scss/core/color-system/_swatch.scss CHANGED
@@ -5,7 +5,7 @@
5
5
  @forward "./palettes";
6
6
 
7
7
  // Config
8
- $kendo-enable-color-system: false !default;
8
+ $kendo-enable-color-system: true !default;
9
9
 
10
10
  // Colors
11
11
  $_default-colors: (