@progress/kendo-theme-fluent 11.2.1-dev.0 → 11.3.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 (341) hide show
  1. package/dist/all.css +1 -1
  2. package/dist/fluent-main-dark.css +1 -1
  3. package/dist/fluent-main.css +1 -1
  4. package/dist/meta/sassdoc-data.json +24099 -27323
  5. package/dist/meta/sassdoc-raw-data.json +8421 -7718
  6. package/dist/meta/variables.json +7880 -8036
  7. package/lib/swatches/all.json +1 -1
  8. package/lib/swatches/fluent-main-dark.json +1 -1
  9. package/lib/swatches/fluent-main.json +1 -1
  10. package/package.json +4 -4
  11. package/scss/action-buttons/_layout.scss +2 -55
  12. package/scss/action-buttons/_theme.scss +2 -11
  13. package/scss/action-buttons/_variables.scss +17 -7
  14. package/scss/action-sheet/_layout.scss +11 -399
  15. package/scss/action-sheet/_theme.scss +14 -69
  16. package/scss/action-sheet/_variables.scss +129 -66
  17. package/scss/adaptive/_index.scss +0 -3
  18. package/scss/adaptive/_layout.scss +2 -457
  19. package/scss/adaptive/_theme.scss +2 -75
  20. package/scss/adaptive/_variables.scss +39 -18
  21. package/scss/appbar/_layout.scss +2 -114
  22. package/scss/appbar/_theme.scss +9 -20
  23. package/scss/appbar/_variables.scss +38 -71
  24. package/scss/avatar/_layout.scss +2 -73
  25. package/scss/avatar/_theme.scss +2 -16
  26. package/scss/avatar/_variables.scss +24 -82
  27. package/scss/badge/_layout.scss +3 -146
  28. package/scss/badge/_theme.scss +8 -21
  29. package/scss/badge/_variables.scss +41 -88
  30. package/scss/bottom-navigation/_layout.scss +5 -108
  31. package/scss/bottom-navigation/_theme.scss +73 -74
  32. package/scss/bottom-navigation/_variables.scss +58 -117
  33. package/scss/breadcrumb/_layout.scss +8 -132
  34. package/scss/breadcrumb/_theme.scss +15 -71
  35. package/scss/breadcrumb/_variables.scss +133 -71
  36. package/scss/button/_layout.scss +18 -182
  37. package/scss/button/_theme.scss +132 -113
  38. package/scss/button/_variables.scss +156 -301
  39. package/scss/calendar/_layout.scss +27 -383
  40. package/scss/calendar/_theme.scss +55 -127
  41. package/scss/calendar/_variables.scss +185 -100
  42. package/scss/captcha/_layout.scss +2 -59
  43. package/scss/captcha/_theme.scss +2 -9
  44. package/scss/captcha/_variables.scss +25 -9
  45. package/scss/card/_layout.scss +9 -314
  46. package/scss/card/_theme.scss +3 -103
  47. package/scss/card/_variables.scss +110 -60
  48. package/scss/chart-wizard/_layout.scss +2 -38
  49. package/scss/chart-wizard/_theme.scss +2 -28
  50. package/scss/chart-wizard/_variables.scss +25 -11
  51. package/scss/chat/_index.scss +0 -3
  52. package/scss/chat/_layout.scss +26 -450
  53. package/scss/chat/_theme.scss +9 -80
  54. package/scss/chat/_variables.scss +143 -71
  55. package/scss/checkbox/_layout.scss +14 -191
  56. package/scss/checkbox/_theme.scss +11 -100
  57. package/scss/checkbox/_variables.scss +165 -78
  58. package/scss/chip/_layout.scss +11 -137
  59. package/scss/chip/_theme.scss +56 -57
  60. package/scss/chip/_variables.scss +99 -94
  61. package/scss/color-preview/_layout.scss +4 -64
  62. package/scss/color-preview/_theme.scss +2 -27
  63. package/scss/color-preview/_variables.scss +23 -9
  64. package/scss/coloreditor/_layout.scss +21 -109
  65. package/scss/coloreditor/_theme.scss +3 -24
  66. package/scss/coloreditor/_variables.scss +92 -57
  67. package/scss/colorgradient/_layout.scss +12 -196
  68. package/scss/colorgradient/_theme.scss +27 -65
  69. package/scss/colorgradient/_variables.scss +134 -76
  70. package/scss/colorpalette/_layout.scss +6 -40
  71. package/scss/colorpalette/_theme.scss +10 -20
  72. package/scss/colorpalette/_variables.scss +39 -21
  73. package/scss/colorpicker/_layout.scss +2 -11
  74. package/scss/colorpicker/_theme.scss +2 -1
  75. package/scss/column-menu/_layout.scss +5 -56
  76. package/scss/column-menu/_theme.scss +1 -24
  77. package/scss/column-menu/_variables.scss +38 -17
  78. package/scss/combobox/_layout.scss +4 -2
  79. package/scss/combobox/_theme.scss +4 -2
  80. package/scss/core/functions/index.import.scss +1 -0
  81. package/scss/dataviz/_layout.scss +6 -543
  82. package/scss/dataviz/_theme.scss +12 -76
  83. package/scss/dataviz/_variables.scss +152 -33
  84. package/scss/daterangepicker/_layout.scss +2 -37
  85. package/scss/daterangepicker/_theme.scss +16 -7
  86. package/scss/daterangepicker/_variables.scss +9 -0
  87. package/scss/datetimepicker/_layout.scss +3 -41
  88. package/scss/datetimepicker/_theme.scss +3 -2
  89. package/scss/datetimepicker/_variables.scss +5 -1
  90. package/scss/dialog/_layout.scss +8 -53
  91. package/scss/dialog/_theme.scss +5 -25
  92. package/scss/dialog/_variables.scss +31 -60
  93. package/scss/dock-manager/_layout.scss +9 -193
  94. package/scss/dock-manager/_theme.scss +6 -28
  95. package/scss/dock-manager/_variables.scss +74 -36
  96. package/scss/draggable/_layout.scss +13 -59
  97. package/scss/draggable/_theme.scss +10 -15
  98. package/scss/draggable/_variables.scss +45 -23
  99. package/scss/drawer/_layout.scss +7 -198
  100. package/scss/drawer/_theme.scss +25 -52
  101. package/scss/drawer/_variables.scss +73 -45
  102. package/scss/dropdowngrid/_layout.scss +3 -11
  103. package/scss/dropdowngrid/_theme.scss +3 -3
  104. package/scss/dropdownlist/_layout.scss +4 -28
  105. package/scss/dropdownlist/_theme.scss +3 -7
  106. package/scss/dropdowntree/_layout.scss +2 -35
  107. package/scss/dropdowntree/_theme.scss +3 -4
  108. package/scss/dropdowntree/_variables.scss +4 -3
  109. package/scss/dropzone/_layout.scss +7 -31
  110. package/scss/dropzone/_theme.scss +2 -30
  111. package/scss/dropzone/_variables.scss +43 -21
  112. package/scss/editor/_layout.scss +3 -588
  113. package/scss/editor/_theme.scss +12 -78
  114. package/scss/editor/_variables.scss +45 -26
  115. package/scss/expansion-panel/_layout.scss +22 -57
  116. package/scss/expansion-panel/_theme.scss +13 -36
  117. package/scss/expansion-panel/_variables.scss +49 -28
  118. package/scss/fab/_layout.scss +11 -134
  119. package/scss/fab/_theme.scss +37 -126
  120. package/scss/fab/_variables.scss +104 -56
  121. package/scss/filemanager/_layout.scss +2 -240
  122. package/scss/filemanager/_theme.scss +8 -89
  123. package/scss/filemanager/_variables.scss +109 -56
  124. package/scss/filter/_layout.scss +8 -71
  125. package/scss/filter/_theme.scss +5 -14
  126. package/scss/filter/_variables.scss +20 -10
  127. package/scss/floating-label/_layout.scss +3 -75
  128. package/scss/floating-label/_theme.scss +4 -20
  129. package/scss/floating-label/_variables.scss +35 -17
  130. package/scss/forms/_index.scss +0 -1
  131. package/scss/forms/_layout.scss +5 -302
  132. package/scss/forms/_theme.scss +5 -24
  133. package/scss/forms/_variables.scss +73 -39
  134. package/scss/gantt/_layout.scss +5 -801
  135. package/scss/gantt/_theme.scss +17 -236
  136. package/scss/gantt/_variables.scss +142 -73
  137. package/scss/grid/_layout.scss +60 -1276
  138. package/scss/grid/_theme.scss +35 -343
  139. package/scss/grid/_variables.scss +306 -183
  140. package/scss/gridlayout/_layout.scss +1 -6
  141. package/scss/gridlayout/_theme.scss +1 -6
  142. package/scss/icons/_layout.scss +4 -33
  143. package/scss/icons/_theme.scss +7 -1
  144. package/scss/icons/_variables.scss +35 -9
  145. package/scss/imageeditor/_layout.scss +2 -152
  146. package/scss/imageeditor/_theme.scss +5 -42
  147. package/scss/imageeditor/_variables.scss +66 -32
  148. package/scss/index.scss +2 -1
  149. package/scss/input/_layout.scss +36 -468
  150. package/scss/input/_theme.scss +52 -128
  151. package/scss/input/_variables.scss +153 -208
  152. package/scss/list/_layout.scss +3 -252
  153. package/scss/list/_theme.scss +10 -81
  154. package/scss/list/_variables.scss +176 -92
  155. package/scss/listbox/_layout.scss +2 -80
  156. package/scss/listbox/_theme.scss +5 -8
  157. package/scss/listbox/_variables.scss +28 -13
  158. package/scss/listgroup/_layout.scss +2 -174
  159. package/scss/listgroup/_theme.scss +2 -8
  160. package/scss/listgroup/_variables.scss +23 -10
  161. package/scss/listview/_layout.scss +6 -133
  162. package/scss/listview/_theme.scss +8 -37
  163. package/scss/listview/_variables.scss +66 -39
  164. package/scss/loader/_layout.scss +15 -572
  165. package/scss/loader/_theme.scss +2 -14
  166. package/scss/loader/_variables.scss +90 -92
  167. package/scss/map/_layout.scss +7 -121
  168. package/scss/map/_theme.scss +5 -17
  169. package/scss/map/_variables.scss +40 -22
  170. package/scss/maskedtextbox/_layout.scss +3 -3
  171. package/scss/maskedtextbox/_theme.scss +3 -3
  172. package/scss/mediaplayer/_layout.scss +5 -72
  173. package/scss/mediaplayer/_theme.scss +5 -15
  174. package/scss/mediaplayer/_variables.scss +27 -14
  175. package/scss/menu/_layout.scss +25 -267
  176. package/scss/menu/_theme.scss +14 -73
  177. package/scss/menu/_variables.scss +135 -76
  178. package/scss/menu-button/_layout.scss +9 -14
  179. package/scss/menu-button/_theme.scss +5 -1
  180. package/scss/menu-button/_variables.scss +10 -0
  181. package/scss/messagebox/_layout.scss +2 -18
  182. package/scss/messagebox/_theme.scss +4 -19
  183. package/scss/messagebox/_variables.scss +33 -37
  184. package/scss/multiselect/_layout.scss +3 -4
  185. package/scss/multiselect/_theme.scss +3 -4
  186. package/scss/no-data/_layout.scss +2 -17
  187. package/scss/no-data/_theme.scss +2 -5
  188. package/scss/no-data/_variables.scss +7 -2
  189. package/scss/notification/_functions.scss +17 -0
  190. package/scss/notification/_layout.scss +2 -68
  191. package/scss/notification/_theme.scss +4 -28
  192. package/scss/notification/_variables.scss +50 -91
  193. package/scss/numerictextbox/_layout.scss +3 -7
  194. package/scss/numerictextbox/_theme.scss +3 -3
  195. package/scss/orgchart/_layout.scss +8 -99
  196. package/scss/orgchart/_theme.scss +4 -45
  197. package/scss/orgchart/_variables.scss +87 -45
  198. package/scss/otp/_layout.scss +1 -34
  199. package/scss/otp/_theme.scss +1 -7
  200. package/scss/otp/_variables.scss +25 -12
  201. package/scss/overlay/_layout.scss +2 -11
  202. package/scss/overlay/_theme.scss +4 -3
  203. package/scss/overlay/_variables.scss +7 -3
  204. package/scss/pager/_layout.scss +11 -145
  205. package/scss/pager/_theme.scss +7 -15
  206. package/scss/pager/_variables.scss +49 -26
  207. package/scss/panel/_layout.scss +2 -24
  208. package/scss/panel/_theme.scss +10 -13
  209. package/scss/panel/_variables.scss +23 -10
  210. package/scss/panelbar/_layout.scss +17 -95
  211. package/scss/panelbar/_theme.scss +15 -164
  212. package/scss/panelbar/_variables.scss +134 -68
  213. package/scss/pdf-viewer/_layout.scss +3 -327
  214. package/scss/pdf-viewer/_theme.scss +2 -80
  215. package/scss/pdf-viewer/_variables.scss +75 -36
  216. package/scss/pivotgrid/_index.scss +0 -6
  217. package/scss/pivotgrid/_layout.scss +44 -579
  218. package/scss/pivotgrid/_theme.scss +5 -192
  219. package/scss/pivotgrid/_variables.scss +144 -70
  220. package/scss/popover/_layout.scss +6 -73
  221. package/scss/popover/_theme.scss +2 -36
  222. package/scss/popover/_variables.scss +54 -27
  223. package/scss/popup/_layout.scss +5 -70
  224. package/scss/popup/_theme.scss +2 -9
  225. package/scss/popup/_variables.scss +25 -12
  226. package/scss/progressbar/_layout.scss +10 -196
  227. package/scss/progressbar/_theme.scss +11 -46
  228. package/scss/progressbar/_variables.scss +57 -34
  229. package/scss/prompt/_layout.scss +2 -75
  230. package/scss/prompt/_theme.scss +2 -35
  231. package/scss/prompt/_variables.scss +43 -20
  232. package/scss/radio/_layout.scss +12 -178
  233. package/scss/radio/_theme.scss +7 -75
  234. package/scss/radio/_variables.scss +72 -36
  235. package/scss/rating/_layout.scss +11 -57
  236. package/scss/rating/_theme.scss +8 -6
  237. package/scss/rating/_variables.scss +21 -13
  238. package/scss/responsivepanel/_layout.scss +2 -45
  239. package/scss/responsivepanel/_theme.scss +3 -3
  240. package/scss/ripple/_layout.scss +2 -50
  241. package/scss/ripple/_theme.scss +2 -2
  242. package/scss/scheduler/_layout.scss +11 -773
  243. package/scss/scheduler/_theme.scss +32 -167
  244. package/scss/scheduler/_variables.scss +149 -77
  245. package/scss/scroller/_layout.scss +2 -80
  246. package/scss/scroller/_theme.scss +2 -5
  247. package/scss/scrollview/_layout.scss +2 -159
  248. package/scss/scrollview/_theme.scss +11 -35
  249. package/scss/scrollview/_variables.scss +52 -29
  250. package/scss/searchbox/_layout.scss +2 -0
  251. package/scss/searchbox/_theme.scss +4 -1
  252. package/scss/searchbox/_variables.scss +1 -1
  253. package/scss/signature/_layout.scss +3 -67
  254. package/scss/signature/_theme.scss +3 -8
  255. package/scss/signature/_variables.scss +46 -25
  256. package/scss/skeleton/_layout.scss +2 -79
  257. package/scss/skeleton/_theme.scss +2 -17
  258. package/scss/skeleton/_variables.scss +15 -6
  259. package/scss/slider/_layout.scss +18 -203
  260. package/scss/slider/_theme.scss +31 -40
  261. package/scss/slider/_variables.scss +58 -41
  262. package/scss/speech-to-text-button/_layout.scss +1 -9
  263. package/scss/speech-to-text-button/_theme.scss +1 -3
  264. package/scss/split-button/_layout.scss +22 -18
  265. package/scss/split-button/_theme.scss +2 -1
  266. package/scss/split-button/_variables.scss +18 -9
  267. package/scss/splitter/_layout.scss +8 -171
  268. package/scss/splitter/_theme.scss +2 -31
  269. package/scss/splitter/_variables.scss +42 -20
  270. package/scss/spreadsheet/_layout.scss +50 -724
  271. package/scss/spreadsheet/_theme.scss +14 -182
  272. package/scss/spreadsheet/_variables.scss +172 -99
  273. package/scss/stacklayout/_layout.scss +1 -5
  274. package/scss/stacklayout/_theme.scss +1 -5
  275. package/scss/stepper/_layout.scss +9 -255
  276. package/scss/stepper/_theme.scss +4 -186
  277. package/scss/stepper/_variables.scss +125 -60
  278. package/scss/suggestion/_layout.scss +2 -38
  279. package/scss/suggestion/_theme.scss +3 -66
  280. package/scss/suggestion/_variables.scss +42 -19
  281. package/scss/switch/_layout.scss +2 -138
  282. package/scss/switch/_theme.scss +2 -136
  283. package/scss/switch/_variables.scss +99 -49
  284. package/scss/table/_layout.scss +6 -249
  285. package/scss/table/_theme.scss +9 -95
  286. package/scss/table/_variables.scss +100 -64
  287. package/scss/tabstrip/_layout.scss +2 -421
  288. package/scss/tabstrip/_theme.scss +12 -123
  289. package/scss/tabstrip/_variables.scss +113 -61
  290. package/scss/taskboard/_layout.scss +28 -178
  291. package/scss/taskboard/_theme.scss +20 -55
  292. package/scss/taskboard/_variables.scss +122 -63
  293. package/scss/textarea/_layout.scss +3 -6
  294. package/scss/textarea/_theme.scss +3 -4
  295. package/scss/textbox/_layout.scss +3 -4
  296. package/scss/textbox/_theme.scss +3 -4
  297. package/scss/tilelayout/_layout.scss +2 -36
  298. package/scss/tilelayout/_theme.scss +13 -10
  299. package/scss/tilelayout/_variables.scss +19 -8
  300. package/scss/time-marker/_layout.scss +2 -15
  301. package/scss/time-marker/_theme.scss +2 -17
  302. package/scss/time-marker/_variables.scss +7 -2
  303. package/scss/timedurationpicker/_layout.scss +3 -4
  304. package/scss/timedurationpicker/_theme.scss +3 -4
  305. package/scss/timeline/_layout.scss +8 -423
  306. package/scss/timeline/_theme.scss +11 -34
  307. package/scss/timeline/_variables.scss +108 -61
  308. package/scss/timepicker/_layout.scss +7 -3
  309. package/scss/timepicker/_theme.scss +3 -4
  310. package/scss/timeselector/_layout.scss +3 -223
  311. package/scss/timeselector/_theme.scss +5 -55
  312. package/scss/timeselector/_variables.scss +84 -41
  313. package/scss/toolbar/_layout.scss +11 -297
  314. package/scss/toolbar/_theme.scss +3 -167
  315. package/scss/toolbar/_variables.scss +65 -32
  316. package/scss/tooltip/_functions.scss +17 -0
  317. package/scss/tooltip/_layout.scss +13 -74
  318. package/scss/tooltip/_theme.scss +17 -23
  319. package/scss/tooltip/_variables.scss +50 -72
  320. package/scss/treelist/_layout.scss +3 -82
  321. package/scss/treelist/_theme.scss +4 -6
  322. package/scss/treelist/_variables.scss +7 -2
  323. package/scss/treeview/_layout.scss +8 -137
  324. package/scss/treeview/_theme.scss +20 -65
  325. package/scss/treeview/_variables.scss +88 -48
  326. package/scss/typography/_layout.scss +3 -113
  327. package/scss/typography/_theme.scss +2 -17
  328. package/scss/typography/_variables.scss +84 -3
  329. package/scss/upload/_layout.scss +7 -219
  330. package/scss/upload/_theme.scss +4 -90
  331. package/scss/upload/_variables.scss +66 -29
  332. package/scss/validator/_layout.scss +2 -16
  333. package/scss/validator/_theme.scss +2 -2
  334. package/scss/virtual-scroller/_layout.scss +2 -34
  335. package/scss/virtual-scroller/_theme.scss +2 -2
  336. package/scss/window/_layout.scss +9 -141
  337. package/scss/window/_theme.scss +7 -35
  338. package/scss/window/_variables.scss +65 -70
  339. package/scss/wizard/_layout.scss +8 -95
  340. package/scss/wizard/_theme.scss +4 -7
  341. package/scss/wizard/_variables.scss +24 -11
@@ -3,342 +3,342 @@
3
3
 
4
4
  /// The width of the border around the Calendar.
5
5
  /// @group calendar
6
- $kendo-calendar-border-width: 1px !default;
6
+ $kendo-calendar-border-width: var( --kendo-calendar-border-width, 1px ) !default;
7
7
  /// The font family of the Calendar.
8
8
  /// @group calendar
9
- $kendo-calendar-font-family: var( --kendo-font-family, inherit ) !default;
9
+ $kendo-calendar-font-family: var( --kendo-calendar-font-family, var(--kendo-font-family, inherit) ) !default;
10
10
  /// The font size of the Calendar.
11
11
  /// @group calendar
12
- $kendo-calendar-font-size: var( --kendo-font-size, inherit ) !default;
12
+ $kendo-calendar-font-size: var( --kendo-calendar-font-size, var(--kendo-font-size, inherit) ) !default;
13
13
  /// The line height of the Calendar.
14
14
  /// @group calendar
15
- $kendo-calendar-line-height: var( --kendo-line-height, normal ) !default;
15
+ $kendo-calendar-line-height: var( --kendo-calendar-line-height, var(--kendo-line-height, normal) ) !default;
16
16
  /// The border-radius of the Calendar.
17
17
  /// @group calendar
18
- $kendo-calendar-border-radius: 0 !default;
18
+ $kendo-calendar-border-radius: var( --kendo-calendar-border-radius, 0 ) !default;
19
19
 
20
20
  /// The size of the calendar cell.
21
21
  /// @group calendar
22
- $kendo-calendar-cell-size: 28px !default;
22
+ $kendo-calendar-cell-size: var( --kendo-calendar-cell-size, 28px ) !default;
23
23
 
24
24
  /// The background color of the Calendar.
25
25
  /// @group calendar
26
- $kendo-calendar-bg: k-color(surface-alt) !default;
26
+ $kendo-calendar-bg: var( --kendo-calendar-bg, k-color(surface-alt) ) !default;
27
27
  /// The text color of the Calendar.
28
28
  /// @group calendar
29
- $kendo-calendar-text: k-color(on-app-surface) !default;
29
+ $kendo-calendar-text: var( --kendo-calendar-text, k-color(on-app-surface) ) !default;
30
30
  /// The border color of the Calendar.
31
31
  /// @group calendar
32
- $kendo-calendar-border: color-mix(in srgb, k-color(border) 16%, transparent) !default;
32
+ $kendo-calendar-border: var( --kendo-calendar-border, color-mix(in srgb, k-color(border) 16%, transparent) ) !default;
33
33
 
34
34
  /// The horizontal padding of the calendar header.
35
35
  /// @group calendar
36
- $kendo-calendar-header-padding-x: k-spacing(1) !default;
36
+ $kendo-calendar-header-padding-x: var( --kendo-calendar-header-padding-x, k-spacing(1) ) !default;
37
37
  /// The vertical padding of the calendar header.
38
38
  /// @group calendar
39
- $kendo-calendar-header-padding-y: k-spacing(1) !default;
39
+ $kendo-calendar-header-padding-y: var( --kendo-calendar-header-padding-y, k-spacing(1) ) !default;
40
40
  /// Width of the bottom border of the calendar header.
41
41
  /// @group calendar
42
- $kendo-calendar-header-border-width: 1px !default;
43
- $kendo-calendar-header-min-width: ($kendo-calendar-cell-size * 8) !default;
42
+ $kendo-calendar-header-border-width: var( --kendo-calendar-header-border-width, 1px ) !default;
43
+ $kendo-calendar-header-min-width: var( --kendo-calendar-header-min-width, calc(#{$kendo-calendar-cell-size} * 8) ) !default;
44
44
 
45
45
  /// The background color of the calendar header.
46
46
  /// @group calendar
47
- $kendo-calendar-header-bg: k-color(surface) !default; // $kendo-component-header-bg
47
+ $kendo-calendar-header-bg: var( --kendo-calendar-header-bg, k-color(surface) ) !default; // $kendo-component-header-bg
48
48
  /// The text color of the calendar header.
49
49
  /// @group calendar
50
- $kendo-calendar-header-text: $kendo-calendar-text !default; // $kendo-component-header-text
50
+ $kendo-calendar-header-text: var( --kendo-calendar-header-text, #{$kendo-calendar-text} ) !default; // $kendo-component-header-text
51
51
  /// The border color of the calendar header.
52
52
  /// @group calendar
53
- $kendo-calendar-header-border: $kendo-calendar-border !default; // $kendo-component-header-border
53
+ $kendo-calendar-header-border: var( --kendo-calendar-header-border, #{$kendo-calendar-border} ) !default; // $kendo-component-header-border
54
54
 
55
55
  /// The spacing between the navigation buttons of the Calendar.
56
56
  /// @group calendar
57
- $kendo-calendar-nav-gap: k-spacing(0) !default;
57
+ $kendo-calendar-nav-gap: var( --kendo-calendar-nav-gap, k-spacing(0) ) !default;
58
58
 
59
59
  /// The horizontal padding of the calendar footer.
60
60
  /// @group calendar
61
- $kendo-calendar-footer-padding-x: k-spacing(1) !default;
61
+ $kendo-calendar-footer-padding-x: var( --kendo-calendar-footer-padding-x, k-spacing(1) ) !default;
62
62
  /// The vertical padding of the calendar footer.
63
63
  /// @group calendar
64
- $kendo-calendar-footer-padding-y: k-spacing(1) !default;
64
+ $kendo-calendar-footer-padding-y: var( --kendo-calendar-footer-padding-y, k-spacing(1) ) !default;
65
65
 
66
66
  /// The horizontal padding of the calendar cell.
67
67
  /// @group calendar
68
- $kendo-calendar-cell-padding-x: k-spacing(1.5) !default;
68
+ $kendo-calendar-cell-padding-x: var( --kendo-calendar-cell-padding-x, k-spacing(1) ) !default;
69
69
  /// The vertical padding of the calendar cell.
70
70
  /// @group calendar
71
- $kendo-calendar-cell-padding-y: $kendo-calendar-cell-padding-x !default;
71
+ $kendo-calendar-cell-padding-y: var( --kendo-calendar-cell-padding-y, #{$kendo-calendar-cell-padding-x} ) !default;
72
72
  /// The border radius of the calendar cell.
73
73
  /// @group calendar
74
- $kendo-calendar-cell-border-radius: var( --kendo-border-radius-md, 0) !default;
74
+ $kendo-calendar-cell-border-radius: var( --kendo-calendar-cell-border-radius, var( --kendo-calendar-border-radius-md, var( --kendo-border-radius-md, 0) ) ) !default;
75
75
 
76
76
  /// The horizontal padding of the calendar header cell.
77
77
  /// @group calendar
78
- $kendo-calendar-header-cell-padding-x: k-spacing(0) !default;
78
+ $kendo-calendar-header-cell-padding-x: var( --kendo-calendar-header-cell-padding-x, k-spacing(0) ) !default;
79
79
  /// Th vertical padding of the calendar header cell.
80
80
  /// @group calendar
81
- $kendo-calendar-header-cell-padding-y: k-spacing(0) !default;
81
+ $kendo-calendar-header-cell-padding-y: var( --kendo-calendar-header-cell-padding-y, k-spacing(0) ) !default;
82
82
  /// The width of the calendar header cell.
83
83
  /// @group calendar
84
- $kendo-calendar-header-cell-width: $kendo-calendar-cell-size !default;
84
+ $kendo-calendar-header-cell-width: var( --kendo-calendar-header-cell-width, #{$kendo-calendar-cell-size} ) !default;
85
85
  /// The height of the calendar header cell.
86
86
  /// @group calendar
87
- $kendo-calendar-header-cell-height: $kendo-calendar-cell-size !default;
87
+ $kendo-calendar-header-cell-height: var( --kendo-calendar-header-cell-height, #{$kendo-calendar-cell-size} ) !default;
88
88
  /// The font size of the calendar header cell.
89
89
  /// @group calendar
90
- $kendo-calendar-header-cell-font-size: var( --kendo-font-size-sm, inherit ) !default;
90
+ $kendo-calendar-header-cell-font-size: var( --kendo-calendar-header-cell-font-size, var( --kendo-calendar-font-size-sm, var( --kendo-font-size-sm, inherit ) ) ) !default;
91
91
  /// The line height of the calendar header cell.
92
92
  /// @group calendar
93
- $kendo-calendar-header-cell-line-height: 2 !default;
93
+ $kendo-calendar-header-cell-line-height: var( --kendo-calendar-header-cell-line-height, 2 ) !default;
94
94
  /// The text color of the calendar header cell.
95
95
  /// @group calendar
96
- $kendo-calendar-header-cell-text: inherit !default;
96
+ $kendo-calendar-header-cell-text: var( --kendo-calendar-header-cell-text, inherit ) !default;
97
97
 
98
98
  /// The horizontal padding of the calendar captions.
99
99
  /// @group calendar
100
- $kendo-calendar-caption-padding-x: k-spacing(3) !default;
100
+ $kendo-calendar-caption-padding-x: var( --kendo-calendar-caption-padding-x, k-spacing(3) ) !default;
101
101
  /// The vertical padding of the calendar captions.
102
102
  /// @group calendar
103
- $kendo-calendar-caption-padding-y: k-spacing(1) !default;
103
+ $kendo-calendar-caption-padding-y: var( --kendo-calendar-caption-padding-y, k-spacing(1) ) !default;
104
104
  /// The height of the calendar captions.
105
105
  /// @group calendar
106
- $kendo-calendar-caption-height: $kendo-calendar-cell-size !default;
106
+ $kendo-calendar-caption-height: var( --kendo-calendar-caption-height, #{$kendo-calendar-cell-size} ) !default;
107
107
  /// The font size of the calendar captions.
108
108
  /// @group calendar
109
- $kendo-calendar-caption-font-size: var( --kendo-font-size-sm, inherit ) !default;
109
+ $kendo-calendar-caption-font-size: var( --kendo-calendar-caption-font-size, var( --kendo-calendar-font-size-sm, var( --kendo-font-size-sm, inherit ) ) ) !default;
110
110
  /// The line height of the calendar captions.
111
111
  /// @group calendar
112
- $kendo-calendar-caption-line-height: normal !default;
112
+ $kendo-calendar-caption-line-height: var( --kendo-calendar-caption-line-height, normal ) !default;
113
113
  /// Font weight of the calendar captions.
114
114
  /// @group calendar
115
- $kendo-calendar-caption-font-weight: bold !default;
115
+ $kendo-calendar-caption-font-weight: var( --kendo-calendar-caption-font-weight, bold ) !default;
116
116
  /// The text color of the calendar captions.
117
117
  /// @group calendar
118
- $kendo-calendar-caption-color: k-color(subtle) !default;
118
+ $kendo-calendar-caption-color: var( --kendo-calendar-caption-color, k-color(subtle) ) !default;
119
119
 
120
120
  /// The width of the Calendar view.
121
121
  /// @group calendar
122
- $kendo-calendar-view-width: ($kendo-calendar-cell-size * 7) !default;
122
+ $kendo-calendar-view-width: var( --kendo-calendar-view-width, calc(#{$kendo-calendar-cell-size} * 7) ) !default;
123
123
  /// The height of the Calendar view.
124
124
  /// @group calendar
125
- $kendo-calendar-view-height: ($kendo-calendar-cell-size * 7) !default;
125
+ $kendo-calendar-view-height: var( --kendo-calendar-view-height, calc(#{$kendo-calendar-cell-size} * 7) ) !default;
126
126
 
127
127
  /// The bottom padding of Calendar views.
128
128
  /// @group calendar
129
- $kendo-calendar-view-padding-block-end: k-spacing(1) !default;
129
+ $kendo-calendar-view-padding-block-end: var( --kendo-calendar-view-padding-block-end, k-spacing(1) ) !default;
130
130
  /// The spacing between the views in the multiview Calendar.
131
131
  /// @group calendar
132
- $kendo-calendar-view-gap: k-spacing(4) !default;
132
+ $kendo-calendar-view-gap: var( --kendo-calendar-view-gap, k-spacing(4) ) !default;
133
133
 
134
134
  /// The background color of the calendar weekend cell.
135
135
  /// @group calendar
136
- $kendo-calendar-weekend-bg: inherit !default;
136
+ $kendo-calendar-weekend-bg: var( --kendo-calendar-weekend-bg, inherit ) !default;
137
137
  /// The text color of the calendar weekend cell.
138
138
  /// @group calendar
139
- $kendo-calendar-weekend-text: inherit !default;
139
+ $kendo-calendar-weekend-text: var( --kendo-calendar-weekend-text, inherit ) !default;
140
140
 
141
141
  /// The text color of the calendar today cell.
142
142
  /// @group calendar
143
- $kendo-calendar-today-text: k-color(app-surface) !default; // use contrast function
143
+ $kendo-calendar-today-text: var( --kendo-calendar-today-text, k-color(app-surface) ) !default; // use contrast function
144
144
  /// The background color of the calendar today cell.
145
145
  /// @group calendar
146
- $kendo-calendar-today-bg: k-color(primary) !default;
146
+ $kendo-calendar-today-bg: var( --kendo-calendar-today-bg, k-color(primary) ) !default;
147
147
  /// The text color of the calendar today cell when hovered.
148
148
  /// @group calendar
149
- $kendo-calendar-today-hover-text: k-color(app-surface) !default; // use contrast function
149
+ $kendo-calendar-today-hover-text: var( --kendo-calendar-today-hover-text, k-color(app-surface) ) !default; // use contrast function
150
150
  /// The background color of the calendar today cell when hovered.
151
151
  /// @group calendar
152
- $kendo-calendar-today-hover-bg: k-color(primary-hover) !default;
152
+ $kendo-calendar-today-hover-bg: var( --kendo-calendar-today-hover-bg, k-color(primary-hover) ) !default;
153
153
  /// The border radius of the calendar today cell.
154
154
  /// @group calendar
155
- $kendo-calendar-today-border-radius: 9999px !default;
155
+ $kendo-calendar-today-border-radius: var( --kendo-calendar-today-border-radius, 9999px ) !default;
156
156
  /// The font weight of the current day in the Calendar.
157
157
  /// @group calendar
158
- $kendo-calendar-today-font-weight: var( --kendo-font-weight-bold, normal ) !default;
158
+ $kendo-calendar-today-font-weight: var( --kendo-calendar-today-font-weight, var( --kendo-calendar-font-weight-bold, var( --kendo-font-weight-bold, normal ) ) ) !default;
159
159
  /// The box shadow of the current day in the Calendar.
160
160
  /// @group calendar
161
- $kendo-calendar-today-box-shadow: null !default;
161
+ $kendo-calendar-today-box-shadow: var( --kendo-calendar-today-box-shadow, null ) !default;
162
162
 
163
163
  /// The background color of the calendar week number cell.
164
164
  /// @group calendar
165
- $kendo-calendar-week-number-bg: inherit !default;
165
+ $kendo-calendar-week-number-bg: var( --kendo-calendar-week-number-bg, inherit ) !default;
166
166
  /// The text color of the calendar week number cell.
167
167
  /// @group calendar
168
- $kendo-calendar-week-number-text: k-color(subtle) !default;
168
+ $kendo-calendar-week-number-text: var( --kendo-calendar-week-number-text, k-color(subtle) ) !default;
169
169
 
170
170
  /// The background color of the other months calendar cells.
171
171
  /// @group calendar
172
- $kendo-calendar-other-month-bg: inherit !default;
172
+ $kendo-calendar-other-month-bg: var( --kendo-calendar-other-month-bg, inherit ) !default;
173
173
  /// The text color of the other months calendar cells.
174
174
  /// @group calendar
175
- $kendo-calendar-other-month-text: color-mix(in srgb, k-color(on-app-surface) 46%, transparent) !default;
175
+ $kendo-calendar-other-month-text: var( --kendo-calendar-other-month-text, color-mix(in srgb, k-color(on-app-surface) 46%, transparent) ) !default;
176
176
 
177
177
  /// The background color of the calendar cells when hovered.
178
178
  /// @group calendar
179
- $kendo-calendar-cell-hover-bg: k-color(base-hover) !default;
179
+ $kendo-calendar-cell-hover-bg: var( --kendo-calendar-cell-hover-bg, k-color(base-hover) ) !default;
180
180
  /// The text color of the calendar cells when hovered.
181
181
  /// @group calendar
182
- $kendo-calendar-cell-hover-text: k-color(on-base) !default;
182
+ $kendo-calendar-cell-hover-text: var( --kendo-calendar-cell-hover-text, k-color(on-base) ) !default;
183
183
 
184
184
  /// The background color of the selected calendar cell.
185
185
  /// @group calendar
186
- $kendo-calendar-cell-selected-bg: k-color(base-active) !default;
186
+ $kendo-calendar-cell-selected-bg: var( --kendo-calendar-cell-selected-bg, k-color(base-active) ) !default;
187
187
  /// The text color of the selected calendar cell.
188
188
  /// @group calendar
189
- $kendo-calendar-cell-selected-text: k-color(on-base) !default;
189
+ $kendo-calendar-cell-selected-text: var( --kendo-calendar-cell-selected-text, k-color(on-base) ) !default;
190
190
  /// The border color of the selected calendar cell.
191
191
  /// @group calendar
192
- $kendo-calendar-cell-selected-border: color-mix(in srgb, k-color(border-alt) 76%, transparent) !default;
192
+ $kendo-calendar-cell-selected-border: var( --kendo-calendar-cell-selected-border, color-mix(in srgb, k-color(border-alt) 76%, transparent) ) !default;
193
193
  /// The shadow of the selected calendar cell.
194
194
  /// @group calendar
195
- $kendo-calendar-cell-selected-shadow: inset 0 0 0 1px $kendo-calendar-cell-selected-border !default;
195
+ $kendo-calendar-cell-selected-shadow: var( --kendo-calendar-cell-selected-shadow, inset 0 0 0 1px #{$kendo-calendar-cell-selected-border} ) !default;
196
196
 
197
197
  /// The background color of the selected calendar cell when hovered.
198
198
  /// @group calendar
199
- $kendo-calendar-cell-selected-hover-bg: k-color(base-subtle-active) !default;
199
+ $kendo-calendar-cell-selected-hover-bg: var( --kendo-calendar-cell-selected-hover-bg, k-color(base-subtle-active) ) !default;
200
200
  /// The text color of the selected calendar cell when hovered.
201
201
  /// @group calendar
202
- $kendo-calendar-cell-selected-hover-text: k-color(on-base) !default;
202
+ $kendo-calendar-cell-selected-hover-text: var( --kendo-calendar-cell-selected-hover-text, k-color(on-base) ) !default;
203
203
 
204
204
  /// The shadow of the selected calendar cell when focused.
205
205
  /// @group calendar
206
- $kendo-calendar-cell-focus-shadow: inset 0 0 0 1px k-color(base-emphasis) !default;
206
+ $kendo-calendar-cell-focus-shadow: var( --kendo-calendar-cell-focus-shadow, inset 0 0 0 1px k-color(base-emphasis) ) !default;
207
207
  /// The shadow of the selected calendar cell when selected and focused.
208
208
  /// @group calendar
209
- $kendo-calendar-cell-selected-focus-shadow: $kendo-calendar-cell-focus-shadow !default;
209
+ $kendo-calendar-cell-selected-focus-shadow: var( --kendo-calendar-cell-selected-focus-shadow, #{$kendo-calendar-cell-focus-shadow} ) !default;
210
210
 
211
211
 
212
212
  // Calendar navigation
213
213
 
214
214
  /// The width of the navigation in the infinite Calendar.
215
215
  /// @group calendar
216
- $kendo-calendar-navigation-width: 5em !default;
216
+ $kendo-calendar-navigation-width: var( --kendo-calendar-navigation-width, 5em ) !default;
217
217
  /// The height of the navigation items in the infinite Calendar.
218
218
  /// @group calendar
219
- $kendo-calendar-navigation-item-height: 2em !default;
219
+ $kendo-calendar-navigation-item-height: var( --kendo-calendar-navigation-item-height, 2em ) !default;
220
220
 
221
221
  /// The background color of the navigation in the infinite Calendar.
222
222
  /// @group calendar
223
- $kendo-calendar-navigation-bg: k-color(surface) !default;
223
+ $kendo-calendar-navigation-bg: var( --kendo-calendar-navigation-bg, k-color(surface) ) !default;
224
224
  /// The text color of the navigation in the infinite Calendar.
225
225
  /// @group calendar
226
- $kendo-calendar-navigation-text: $kendo-calendar-header-text !default;
226
+ $kendo-calendar-navigation-text: var( --kendo-calendar-navigation-text, #{$kendo-calendar-header-text} ) !default;
227
227
  /// The border color of the navigation in the infinite Calendar.
228
228
  /// @group calendar
229
- $kendo-calendar-navigation-border: $kendo-calendar-header-border !default;
229
+ $kendo-calendar-navigation-border: var( --kendo-calendar-navigation-border, #{$kendo-calendar-header-border} ) !default;
230
230
 
231
231
  /// The text color of the hovered items in the calendar navigation.
232
232
  /// @group calendar
233
- $kendo-calendar-navigation-hover-text: k-color(primary-hover) !default;
233
+ $kendo-calendar-navigation-hover-text: var( --kendo-calendar-navigation-hover-text, k-color(primary-hover) ) !default;
234
234
  /// The text color of the marker in the Calendar navigation.
235
235
  /// @group calendar
236
- $kendo-calendar-navigation-marker-text: currentColor !default;
236
+ $kendo-calendar-navigation-marker-text: var( --kendo-calendar-navigation-marker-text, currentColor ) !default;
237
237
 
238
238
 
239
239
  // Infinite calendar
240
240
  /// The background color of the navigation in the infinite Calendar.
241
241
  /// @group calendar
242
242
 
243
- $kendo-infinite-calendar-header-padding-x: k-spacing(3) !default;
243
+ $kendo-infinite-calendar-header-padding-x: var( --kendo-infinite-calendar-header-padding-x, k-spacing(3) ) !default;
244
244
  /// The background color of the navigation in the infinite Calendar.
245
245
  /// @group calendar
246
- $kendo-infinite-calendar-header-padding-y: k-spacing(3) k-spacing(1) !default;
246
+ $kendo-infinite-calendar-header-padding-y: var( --kendo-infinite-calendar-header-padding-y, k-spacing(3) k-spacing(1) ) !default;
247
247
 
248
248
  /// The horizontal padding of the infinite Calendar.
249
249
  /// @group calendar
250
- $kendo-infinite-calendar-view-padding-x: k-spacing(3) !default;
250
+ $kendo-infinite-calendar-view-padding-x: var( --kendo-infinite-calendar-view-padding-x, k-spacing(3) ) !default;
251
251
  /// The vertical padding of the infinite Calendar.
252
252
  /// @group calendar
253
- $kendo-infinite-calendar-view-padding-y: k-spacing(0) !default;
253
+ $kendo-infinite-calendar-view-padding-y: var( --kendo-infinite-calendar-view-padding-y, k-spacing(0) ) !default;
254
254
 
255
255
  /// The height of the infinite Calendar view.
256
256
  /// @group calendar
257
- $kendo-infinite-calendar-view-height: ( $kendo-calendar-cell-size * 9 ) !default;
257
+ $kendo-infinite-calendar-view-height: var( --kendo-infinite-calendar-view-height, calc( #{$kendo-calendar-cell-size} * 9 ) ) !default;
258
258
 
259
259
 
260
260
  // Range calendar
261
261
  /// The background color of the range selection in the Calendar.
262
262
  /// @group calendar
263
- $kendo-calendar-range-bg: k-color(base-active) !default;
263
+ $kendo-calendar-range-bg: var( --kendo-calendar-range-bg, k-color(base-active) ) !default;
264
264
  /// The text color of the range selection in the Calendar.
265
265
  /// @group calendar
266
- $kendo-calendar-range-text: inherit !default;
266
+ $kendo-calendar-range-text: var( --kendo-calendar-range-text, inherit ) !default;
267
267
  /// The border color of the range selection in the Calendar.
268
268
  /// @group calendar
269
- $kendo-calendar-range-border: k-color(base-emphasis) !default;
269
+ $kendo-calendar-range-border: var( --kendo-calendar-range-border, k-color(base-emphasis) ) !default;
270
270
  /// The shadow of the hovered start range selection in the Calendar.
271
271
  /// @group calendar
272
- $kendo-calendar-start-range-hover-shadow: inset 1px -1px 0 0 k-color(base-emphasis), inset 0 1px 0 0 k-color(base-emphasis) !default;
272
+ $kendo-calendar-start-range-hover-shadow: var( --kendo-calendar-start-range-hover-shadow, inset 1px -1px 0 0 k-color(base-emphasis), inset 0 1px 0 0 k-color(base-emphasis) ) !default;
273
273
  /// The shadow of the hovered mid range selection in the Calendar.
274
274
  /// @group calendar
275
- $kendo-calendar-mid-range-hover-shadow: inset 0 -1px 0 0 k-color(base-emphasis), inset 0 1px 0 0 k-color(base-emphasis) !default;
275
+ $kendo-calendar-mid-range-hover-shadow: var( --kendo-calendar-mid-range-hover-shadow, inset 0 -1px 0 0 k-color(base-emphasis), inset 0 1px 0 0 k-color(base-emphasis) ) !default;
276
276
  /// The shadow of the hovered end range selection in the Calendar.
277
277
  /// @group calendar
278
- $kendo-calendar-end-range-hover-shadow: inset -1px -1px 0 0 k-color(base-emphasis), inset 0 1px 0 0 k-color(base-emphasis) !default;
278
+ $kendo-calendar-end-range-hover-shadow: var( --kendo-calendar-end-range-hover-shadow, inset -1px -1px 0 0 k-color(base-emphasis), inset 0 1px 0 0 k-color(base-emphasis) ) !default;
279
279
  /// The shadow of the hovered start-end range selection in the Calendar.
280
280
  /// @group calendar
281
- $kendo-calendar-start-end-range-hover-shadow: inset 1px -1px 0 0 k-color(base-emphasis), inset -1px 1px 0 0 k-color(base-emphasis) !default;
281
+ $kendo-calendar-start-end-range-hover-shadow: var( --kendo-calendar-start-end-range-hover-shadow, inset 1px -1px 0 0 k-color(base-emphasis), inset -1px 1px 0 0 k-color(base-emphasis) ) !default;
282
282
 
283
283
 
284
284
  // Calendar sizes
285
285
 
286
286
  /// The font size of the small Calendar.
287
287
  /// @group calendar
288
- $kendo-calendar-sm-font-size: var( --kendo-font-size-sm, inherit ) !default;
288
+ $kendo-calendar-sm-font-size: var( --kendo-calendar-sm-font-size, var( --kendo-calendar-font-size-sm, var( --kendo-font-size-sm, inherit ) ) ) !default;
289
289
  /// The line height of the small Calendar.
290
290
  /// @group calendar
291
- $kendo-calendar-sm-line-height: var( --kendo-line-height-sm, normal ) !default;
291
+ $kendo-calendar-sm-line-height: var( --kendo-calendar-sm-line-height, var( --kendo-calendar-line-height-sm, var( --kendo-line-height-sm, normal ) ) ) !default;
292
292
  /// The size of the cells in the small Calendar.
293
293
  /// @group calendar
294
- $kendo-calendar-sm-cell-size: 24px !default;
294
+ $kendo-calendar-sm-cell-size: var( --kendo-calendar-sm-cell-size, 24px ) !default;
295
295
  /// The horizontal padding of the cells in the small Calendar.
296
296
  /// @group calendar
297
- $kendo-calendar-sm-cell-padding-x: k-spacing(0.5) !default;
297
+ $kendo-calendar-sm-cell-padding-x: var( --kendo-calendar-sm-cell-padding-x, k-spacing(0.5) ) !default;
298
298
  /// The vertical padding of the cells in the small Calendar.
299
299
  /// @group calendar
300
- $kendo-calendar-sm-cell-padding-y: k-spacing(0.5) !default;
300
+ $kendo-calendar-sm-cell-padding-y: var( --kendo-calendar-sm-cell-padding-y, k-spacing(0.5) ) !default;
301
301
  /// The font size of the cells in the small Calendar.
302
302
  /// @group calendar
303
- $kendo-calendar-sm-cell-font-size: var( --kendo-font-size-sm, inherit ) !default;
303
+ $kendo-calendar-sm-cell-font-size: var( --kendo-calendar-sm-cell-font-size, var( --kendo-calendar-font-size-sm, var( --kendo-font-size-sm, inherit ) ) ) !default;
304
304
 
305
305
  /// The font size of the medium Calendar.
306
306
  /// @group calendar
307
- $kendo-calendar-md-font-size: var( --kendo-font-size, inherit ) !default;
307
+ $kendo-calendar-md-font-size: var( --kendo-calendar-md-font-size, var( --kendo-calendar-font-size, var( --kendo-font-size, inherit ) ) ) !default;
308
308
  /// The line height of the medium Calendar.
309
309
  /// @group calendar
310
- $kendo-calendar-md-line-height: var( --kendo-line-height, normal ) !default;
310
+ $kendo-calendar-md-line-height: var( --kendo-calendar-md-line-height, var( --kendo-calendar-line-height, var( --kendo-line-height, normal ) ) ) !default;
311
311
  /// The size of the cells in the medium Calendar.
312
312
  /// @group calendar
313
- $kendo-calendar-md-cell-size: 28px !default;
313
+ $kendo-calendar-md-cell-size: var( --kendo-calendar-md-cell-size, 28px ) !default;
314
314
  /// The horizontal padding of the cells in the medium Calendar.
315
315
  /// @group calendar
316
- $kendo-calendar-md-cell-padding-x: k-spacing(1) !default;
316
+ $kendo-calendar-md-cell-padding-x: var( --kendo-calendar-md-cell-padding-x, k-spacing(1) ) !default;
317
317
  /// The vertical padding of the cells in the medium Calendar.
318
318
  /// @group calendar
319
- $kendo-calendar-md-cell-padding-y: k-spacing(1) !default;
319
+ $kendo-calendar-md-cell-padding-y: var( --kendo-calendar-md-cell-padding-y, k-spacing(1) ) !default;
320
320
  /// The font size of the cells in the medium Calendar.
321
321
  /// @group calendar
322
- $kendo-calendar-md-cell-font-size: var( --kendo-font-size-sm, inherit ) !default;
322
+ $kendo-calendar-md-cell-font-size: var( --kendo-calendar-md-cell-font-size, var( --kendo-calendar-font-size-sm, var( --kendo-font-size-sm, inherit ) ) ) !default;
323
323
 
324
324
  /// The font size of the large Calendar.
325
325
  /// @group calendar
326
- $kendo-calendar-lg-font-size: var( --kendo-font-size, inherit ) !default;
326
+ $kendo-calendar-lg-font-size: var( --kendo-calendar-lg-font-size, var( --kendo-calendar-font-size, var( --kendo-font-size, inherit ) ) ) !default;
327
327
  /// The line height of the large Calendar.
328
328
  /// @group calendar
329
- $kendo-calendar-lg-line-height: var( --kendo-line-height, normal ) !default;
329
+ $kendo-calendar-lg-line-height: var( --kendo-calendar-lg-line-height, var( --kendo-calendar-line-height, var( --kendo-line-height, normal ) ) ) !default;
330
330
  /// The size of the cells in the large Calendar.
331
331
  /// @group calendar
332
- $kendo-calendar-lg-cell-size: 32px !default;
332
+ $kendo-calendar-lg-cell-size: var( --kendo-calendar-lg-cell-size, 32px ) !default;
333
333
  /// The horizontal padding of the cells in the large Calendar.
334
334
  /// @group calendar
335
- $kendo-calendar-lg-cell-padding-x: k-spacing(1) !default;
335
+ $kendo-calendar-lg-cell-padding-x: var( --kendo-calendar-lg-cell-padding-x, k-spacing(1) ) !default;
336
336
  /// The vertical padding of the cells in the large Calendar.
337
337
  /// @group calendar
338
- $kendo-calendar-lg-cell-padding-y: k-spacing(1) !default;
338
+ $kendo-calendar-lg-cell-padding-y: var( --kendo-calendar-lg-cell-padding-y, k-spacing(1) ) !default;
339
339
  /// The font size of the cells in the large Calendar.
340
340
  /// @group calendar
341
- $kendo-calendar-lg-cell-font-size: var( --kendo-font-size, inherit ) !default;
341
+ $kendo-calendar-lg-cell-font-size: var( --kendo-calendar-lg-cell-font-size, var( --kendo-calendar-font-size, var( --kendo-font-size, inherit ) ) ) !default;
342
342
 
343
343
  /// The sizes Map of the Calendar.
344
344
  /// @group calendar
@@ -368,3 +368,88 @@ $kendo-calendar-sizes: (
368
368
  cell-font-size: $kendo-calendar-lg-cell-font-size
369
369
  )
370
370
  ) !default;
371
+
372
+ @forward "@progress/kendo-theme-core/scss/components/calendar/_variables.scss" with (
373
+ $kendo-calendar-border-width: $kendo-calendar-border-width,
374
+ $kendo-calendar-font-family: $kendo-calendar-font-family,
375
+ $kendo-calendar-font-size: $kendo-calendar-font-size,
376
+ $kendo-calendar-line-height: $kendo-calendar-line-height,
377
+ $kendo-calendar-border-radius: $kendo-calendar-border-radius,
378
+ $kendo-calendar-cell-size: $kendo-calendar-cell-size,
379
+ $kendo-calendar-bg: $kendo-calendar-bg,
380
+ $kendo-calendar-text: $kendo-calendar-text,
381
+ $kendo-calendar-border: $kendo-calendar-border,
382
+ $kendo-calendar-header-padding-x: $kendo-calendar-header-padding-x,
383
+ $kendo-calendar-header-padding-y: $kendo-calendar-header-padding-y,
384
+ $kendo-calendar-header-border-width: $kendo-calendar-header-border-width,
385
+ $kendo-calendar-header-bg: $kendo-calendar-header-bg,
386
+ $kendo-calendar-header-text: $kendo-calendar-header-text,
387
+ $kendo-calendar-header-border: $kendo-calendar-header-border,
388
+ $kendo-calendar-nav-gap: $kendo-calendar-nav-gap,
389
+ $kendo-calendar-footer-padding-x: $kendo-calendar-footer-padding-x,
390
+ $kendo-calendar-footer-padding-y: $kendo-calendar-footer-padding-y,
391
+ $kendo-calendar-cell-padding-x: $kendo-calendar-cell-padding-x,
392
+ $kendo-calendar-cell-padding-y: $kendo-calendar-cell-padding-y,
393
+ $kendo-calendar-cell-border-radius: $kendo-calendar-cell-border-radius,
394
+ $kendo-calendar-header-cell-padding-x: $kendo-calendar-header-cell-padding-x,
395
+ $kendo-calendar-header-cell-padding-y: $kendo-calendar-header-cell-padding-y,
396
+ $kendo-calendar-header-cell-width: $kendo-calendar-header-cell-width,
397
+ $kendo-calendar-header-cell-height: $kendo-calendar-header-cell-height,
398
+ $kendo-calendar-header-cell-font-size: $kendo-calendar-header-cell-font-size,
399
+ $kendo-calendar-header-cell-line-height: $kendo-calendar-header-cell-line-height,
400
+ $kendo-calendar-header-cell-text: $kendo-calendar-header-cell-text,
401
+ $kendo-calendar-caption-padding-x: $kendo-calendar-caption-padding-x,
402
+ $kendo-calendar-caption-padding-y: $kendo-calendar-caption-padding-y,
403
+ $kendo-calendar-caption-height: $kendo-calendar-caption-height,
404
+ $kendo-calendar-caption-font-size: $kendo-calendar-caption-font-size,
405
+ $kendo-calendar-caption-line-height: $kendo-calendar-caption-line-height,
406
+ $kendo-calendar-caption-font-weight: $kendo-calendar-caption-font-weight,
407
+ $kendo-calendar-view-width: $kendo-calendar-view-width,
408
+ $kendo-calendar-view-height: $kendo-calendar-view-height,
409
+ $kendo-calendar-view-gap: $kendo-calendar-view-gap,
410
+ $kendo-calendar-weekend-bg: $kendo-calendar-weekend-bg,
411
+ $kendo-calendar-weekend-text: $kendo-calendar-weekend-text,
412
+ $kendo-calendar-today-font-weight: $kendo-calendar-today-font-weight,
413
+ $kendo-calendar-today-box-shadow: $kendo-calendar-today-box-shadow,
414
+ $kendo-calendar-week-number-bg: $kendo-calendar-week-number-bg,
415
+ $kendo-calendar-week-number-text: $kendo-calendar-week-number-text,
416
+ $kendo-calendar-other-month-bg: $kendo-calendar-other-month-bg,
417
+ $kendo-calendar-other-month-text: $kendo-calendar-other-month-text,
418
+ $kendo-calendar-cell-hover-bg: $kendo-calendar-cell-hover-bg,
419
+ $kendo-calendar-cell-hover-text: $kendo-calendar-cell-hover-text,
420
+ $kendo-calendar-cell-selected-bg: $kendo-calendar-cell-selected-bg,
421
+ $kendo-calendar-cell-selected-text: $kendo-calendar-cell-selected-text,
422
+ $kendo-calendar-cell-selected-hover-bg: $kendo-calendar-cell-selected-hover-bg,
423
+ $kendo-calendar-cell-selected-hover-text: $kendo-calendar-cell-selected-hover-text,
424
+ $kendo-calendar-cell-focus-shadow: $kendo-calendar-cell-focus-shadow,
425
+ $kendo-calendar-cell-selected-focus-shadow: $kendo-calendar-cell-selected-focus-shadow,
426
+ $kendo-calendar-navigation-width: $kendo-calendar-navigation-width,
427
+ $kendo-calendar-navigation-item-height: $kendo-calendar-navigation-item-height,
428
+ $kendo-calendar-navigation-bg: $kendo-calendar-navigation-bg,
429
+ $kendo-calendar-navigation-text: $kendo-calendar-navigation-text,
430
+ $kendo-calendar-navigation-border: $kendo-calendar-navigation-border,
431
+ $kendo-calendar-navigation-hover-text: $kendo-calendar-navigation-hover-text,
432
+ $kendo-calendar-navigation-marker-text: $kendo-calendar-navigation-marker-text,
433
+ $kendo-calendar-range-bg: $kendo-calendar-range-bg,
434
+ $kendo-infinite-calendar-header-padding-x: $kendo-infinite-calendar-header-padding-x,
435
+ $kendo-infinite-calendar-header-padding-y: $kendo-infinite-calendar-header-padding-y,
436
+ $kendo-infinite-calendar-view-padding-x: $kendo-infinite-calendar-view-padding-x,
437
+ $kendo-infinite-calendar-view-padding-y: $kendo-infinite-calendar-view-padding-y,
438
+ $kendo-infinite-calendar-view-height: $kendo-infinite-calendar-view-height,
439
+ $kendo-calendar-sm-font-size: $kendo-calendar-sm-font-size,
440
+ $kendo-calendar-sm-line-height: $kendo-calendar-sm-line-height,
441
+ $kendo-calendar-sm-cell-size: $kendo-calendar-sm-cell-size,
442
+ $kendo-calendar-sm-cell-padding-x: $kendo-calendar-sm-cell-padding-x,
443
+ $kendo-calendar-sm-cell-padding-y: $kendo-calendar-sm-cell-padding-y,
444
+ $kendo-calendar-md-font-size: $kendo-calendar-md-font-size,
445
+ $kendo-calendar-md-line-height: $kendo-calendar-md-line-height,
446
+ $kendo-calendar-md-cell-size: $kendo-calendar-md-cell-size,
447
+ $kendo-calendar-md-cell-padding-x: $kendo-calendar-md-cell-padding-x,
448
+ $kendo-calendar-md-cell-padding-y: $kendo-calendar-md-cell-padding-y,
449
+ $kendo-calendar-lg-font-size: $kendo-calendar-lg-font-size,
450
+ $kendo-calendar-lg-line-height: $kendo-calendar-lg-line-height,
451
+ $kendo-calendar-lg-cell-size: $kendo-calendar-lg-cell-size,
452
+ $kendo-calendar-lg-cell-padding-x: $kendo-calendar-lg-cell-padding-x,
453
+ $kendo-calendar-lg-cell-padding-y: $kendo-calendar-lg-cell-padding-y,
454
+ $kendo-calendar-sizes: $kendo-calendar-sizes
455
+ );
@@ -1,63 +1,6 @@
1
1
  @use "./_variables.scss" as *;
2
+ @use "@progress/kendo-theme-core/scss/components/captcha/_layout.scss" as *;
2
3
 
3
4
  @mixin kendo-captcha--layout() {
4
-
5
- // Captcha
6
- .k-captcha {
7
- width: var( --kendo-captcha-width, #{$kendo-captcha-width} );
8
- box-sizing: border-box;
9
- font-size: var( --kendo-captcha-font-size, #{$kendo-captcha-font-size} );
10
- font-family: var( --kendo-captcha-font-family, #{$kendo-captcha-font-family} );
11
- line-height: var( --kendo-captcha-line-height, #{$kendo-captcha-line-height} );
12
- display: flex;
13
- flex-flow: column nowrap;
14
- gap: var( --kendo-captcha-spacing, #{$kendo-captcha-spacing} );
15
-
16
- *,
17
- *::before,
18
- *::after {
19
- box-sizing: border-box;
20
- }
21
- }
22
-
23
- // Image
24
- .k-captcha-image-wrap {
25
- position: relative;
26
- gap: var( --kendo-captcha-image-wrap-spacing, #{$kendo-captcha-image-wrap-spacing} );
27
- }
28
-
29
- .k-captcha-image-controls {
30
- position: relative;
31
- gap: var( --kendo-captcha-image-controls-spacing, #{$kendo-captcha-image-controls-spacing} );
32
- }
33
-
34
- .k-captcha-image {
35
- width: 100%;
36
- height: 100%;
37
- overflow: hidden;
38
- }
39
-
40
- .k-captcha-image > img {
41
- width: 100%;
42
- height: 100%;
43
- display: block;
44
- object-fit: cover;
45
- }
46
-
47
- // Loading
48
- .k-captcha-loading .k-captcha-image {
49
- height: auto;
50
- }
51
-
52
- // Volume Control
53
- .k-captcha-volume-control {
54
- height: 100%;
55
- }
56
-
57
- // Verification Success
58
- .k-captcha-validation-message {
59
- margin-block-start: var( --kendo-captcha-validation-offset-y, #{$kendo-captcha-validation-offset-y} );
60
- font-size: var( --kendo-captcha-validation-font-size, #{$kendo-captcha-validation-font-size} );
61
- }
62
-
5
+ @include kendo-captcha--layout-base();
63
6
  }
@@ -1,15 +1,8 @@
1
1
  @use "../core/_index.scss" as *;
2
2
  @use "./_variables.scss" as *;
3
+ @use "@progress/kendo-theme-core/scss/components/captcha/_theme.scss" as *;
3
4
 
4
5
  @mixin kendo-captcha--theme() {
5
-
6
- // Captcha
7
- .k-captcha {
8
- @include fill(
9
- var( --kendo-captcha-text, #{$kendo-captcha-text} ),
10
- var( --kendo-captcha-bg, #{$kendo-captcha-bg} ),
11
- var( --kendo-captcha-border, #{$kendo-captcha-border} )
12
- );
13
- }
6
+ @include kendo-captcha--theme-base();
14
7
 
15
8
  }