@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
package/scss/input/_theme.scss CHANGED
@@ -1,55 +1,33 @@
1
1
  @use "sass:map";
2
2
  @use "../core/_index.scss" as *;
3
3
  @use "./_variables.scss" as *;
4
+ @use "@progress/kendo-theme-core/scss/components/input/_theme.scss" as *;
4
5
 
5
6
  @mixin kendo-input--theme() {
6
7
 
8
+ @include kendo-input--theme-base();
9
+
7
10
  .k-input {
8
- color: var( --kendo-input-text, initial );
9
- background-color: var( --kendo-input-bg, initial );
10
- border-color: var( --kendo-input-border, initial );
11
-
12
- &:hover,
13
- &.k-hover {
14
- --kendo-input-text: var( --kendo-input-hover-text );
15
- --kendo-input-bg: var( --kendo-input-hover-bg );
16
- --kendo-input-border: var( --kendo-input-hover-border );
17
- }
18
11
 
19
12
  &:focus,
20
13
  &.k-focus,
21
14
  &:focus-within {
22
- --kendo-input-text: var( --kendo-input-focus-text );
23
- --kendo-input-bg: var( --kendo-input-focus-bg );
24
- --kendo-input-border: var( --kendo-input-focus-border );
25
15
 
26
16
  &::after {
27
- border-color: var( --kendo-input-focus-border, transparent );
17
+ border-color: $kendo-input-focus-border;
28
18
  }
29
19
  }
30
20
 
31
- &:focus:hover,
32
- &:focus.k-hover,
33
- &.k-focus:hover,
34
- &.k-focus.k-hover {
35
- --kendo-input-text: var( --kendo-input-hover-focus-text );
36
- --kendo-input-bg: var( --kendo-input-hover-focus-bg );
37
- --kendo-input-border: var( --kendo-input-hover-focus-border );
38
- }
39
-
40
21
  &:disabled,
41
22
  &[disabled],
42
23
  &.k-disabled {
43
- --kendo-input-text: var( --kendo-input-disabled-text );
44
- --kendo-input-bg: var( --kendo-input-disabled-bg );
45
- --kendo-input-border: var( --kendo-input-disabled-border );
46
24
 
47
25
  .k-input-prefix {
48
- color: var( --kendo-input-prefix-disabled-text, #{$kendo-input-prefix-disabled-text} );
26
+ color: $kendo-input-prefix-disabled-text;
49
27
  }
50
28
 
51
29
  .k-input-suffix {
52
- color: var( --kendo-input-suffix-disabled-text, #{$kendo-input-suffix-disabled-text} );
30
+ color: $kendo-input-suffix-disabled-text;
53
31
  }
54
32
 
55
33
  .k-input-button {
@@ -62,161 +40,107 @@
62
40
  &.k-invalid,
63
41
  &.ng-invalid.ng-touched,
64
42
  &.ng-invalid.ng-dirty {
65
- --kendo-input-border: var( --kendo-input-invalid-border, #{$kendo-input-invalid-border} );
43
+ border-color: $kendo-input-invalid-border;
66
44
 
67
45
  &::after {
68
- border-color: var( --kendo-input-invalid-border, #{$kendo-input-invalid-border} );
46
+ border-color: $kendo-input-invalid-border;
69
47
  }
70
48
 
71
49
  .k-input-validation-icon {
72
- color: var( --kendo-input-invalid-text, #{$kendo-input-invalid-text} );
50
+ color: $kendo-input-invalid-text;
73
51
  }
74
52
 
75
53
  &:focus:hover,
76
54
  &.k-focus:hover,
77
55
  &:focus.k-hover,
78
56
  &.k-focus.k-hover {
79
- --kendo-input-border: var( --kendo-input-invalid-border, #{$kendo-input-invalid-border} );
57
+ border-color: $kendo-input-invalid-border;
80
58
 
81
59
  .k-input-validation-icon {
82
- color: var( --kendo-input-invalid-text, #{$kendo-input-invalid-text} );
60
+ color: $kendo-input-invalid-text;
83
61
  }
84
62
  }
85
63
  }
64
+ }
86
65
 
87
- // Prefix & Suffix
88
- .k-input-prefix {
89
- color: var( --kendo-input-prefix-text, #{$kendo-input-prefix-text} );
90
- }
91
-
92
- .k-input-suffix {
93
- color: var( --kendo-input-suffix-text, #{$kendo-input-suffix-text} );
66
+ .k-input-outline {
67
+ &:disabled,
68
+ &[disabled],
69
+ &.k-disabled {
70
+ color: $kendo-input-outline-disabled-text;
71
+ background: $kendo-input-outline-disabled-bg;
72
+ border-color: $kendo-input-outline-disabled-border;
94
73
  }
74
+ }
95
75
 
96
- .k-input-separator {
97
- border-color: var( --kendo-input-separator-text, #{$kendo-input-separator-text} );
76
+ .k-input-flat {
77
+ &:disabled,
78
+ &[disabled],
79
+ &.k-disabled {
80
+ color: $kendo-input-flat-disabled-text;
81
+ background: $kendo-input-flat-disabled-bg;
82
+ border-color: $kendo-input-flat-disabled-border;
98
83
  }
99
84
  }
100
85
 
101
86
  .k-picker {
102
- color: var( --kendo-picker-text, initial );
103
- background-color: var( --kendo-picker-bg, initial );
104
- border-color: var( --kendo-picker-border, initial );
105
-
106
- &:hover,
107
- &.k-hover {
108
- --kendo-picker-text: var( --kendo-picker-hover-text );
109
- --kendo-picker-bg: var( --kendo-picker-hover-bg );
110
- --kendo-picker-border: var( --kendo-picker-hover-border );
111
- }
112
87
 
113
88
  &:focus,
114
89
  &.k-focus,
115
90
  &:focus-within {
116
- --kendo-picker-text: var( --kendo-picker-focus-text );
117
- --kendo-picker-bg: var( --kendo-picker-focus-bg );
118
- --kendo-picker-border: var( --kendo-picker-focus-border );
91
+ color: $kendo-picker-focus-text;
92
+ background-color: $kendo-picker-focus-bg;
93
+ border-color: $kendo-picker-focus-border;
119
94
 
120
95
  &::after {
121
- border-color: var( --kendo-picker-focus-border );
96
+ border-color: $kendo-picker-focus-border;
122
97
  }
123
98
  }
124
99
 
125
- &:focus:hover,
126
- &:focus.k-hover,
127
- &.k-focus:hover,
128
- &.k-focus.k-hover {
129
- --kendo-picker-text: var( --kendo-picker-hover-focus-text );
130
- --kendo-picker-bg: var( --kendo-picker-hover-focus-bg );
131
- --kendo-picker-border: var( --kendo-picker-hover-focus-border );
132
- }
133
-
134
- &:disabled,
135
- &[disabled],
136
- &.k-disabled {
137
- --kendo-picker-text: var( --kendo-picker-disabled-text );
138
- --kendo-picker-bg: var( --kendo-picker-disabled-bg );
139
- --kendo-picker-border: var( --kendo-picker-disabled-border );
140
- }
141
-
142
100
  // Invalid
143
101
  &.k-invalid,
144
102
  &.ng-invalid.ng-touched,
145
103
  &.ng-invalid.ng-dirty {
146
- --kendo-picker-border: var( --kendo-input-invalid-border, #{$kendo-input-invalid-border} );
104
+ border-color: $kendo-input-invalid-border;
147
105
 
148
106
  &::after {
149
- border-color: var( --kendo-input-invalid-border, #{$kendo-input-invalid-border} );
107
+ border-color: $kendo-input-invalid-border;
150
108
  }
151
109
 
152
110
  .k-input-validation-icon {
153
- color: var( --kendo-input-invalid-text, #{$kendo-input-invalid-text} );
111
+ color: $kendo-input-invalid-text;
154
112
  }
155
113
 
156
114
  &:focus:hover,
157
115
  &.k-focus:hover,
158
116
  &:focus.k-hover,
159
117
  &.k-focus.k-hover {
160
- --kendo-picker-border: var( --kendo-input-invalid-border, #{$kendo-input-invalid-border} );
118
+ border-color: $kendo-input-invalid-border;
161
119
 
162
120
  .k-input-validation-icon {
163
- color: var( --kendo-input-invalid-text, #{$kendo-input-invalid-text} );
121
+ color: $kendo-input-invalid-text;
164
122
  }
165
123
  }
166
124
  }
167
125
  }
168
126
 
169
- @each $component, $fill-modes in $kendo-input-theme-colors {
170
- @each $fill-mode, $color-props in $fill-modes {
171
-
172
- $_text-color: map.get( $color-props, text );
173
- $_background-color: map.get( $color-props, bg );
174
- $_border-color: map.get( $color-props, border );
175
-
176
- $_hover-text: map.get( $color-props, hover-text );
177
- $_hover-bg: map.get( $color-props, hover-bg );
178
- $_hover-border: map.get( $color-props, hover-border );
179
-
180
- $_focus-text: map.get( $color-props, focus-text );
181
- $_focus-bg: map.get( $color-props, focus-bg );
182
- $_focus-border: map.get( $color-props, focus-border );
183
-
184
- $_hover-focus-text: map.get( $color-props, hover-focus-text );
185
- $_hover-focus-bg: map.get( $color-props, hover-focus-bg );
186
- $_hover-focus-border: map.get( $color-props, hover-focus-border );
187
-
188
- $_disabled-text: map.get( $color-props, disabled-text );
189
- $_disabled-bg: map.get( $color-props, disabled-bg );
190
- $_disabled-border: map.get( $color-props, disabled-border );
191
-
192
- .k-#{$component}-#{$fill-mode} {
193
- --kendo-#{$component}-text: var( --kendo-#{$component}-#{$fill-mode}-text, #{$_text-color} );
194
- --kendo-#{$component}-bg: var( --kendo-#{$component}-#{$fill-mode}-bg, #{$_background-color} );
195
- --kendo-#{$component}-border: var( --kendo-#{$component}-#{$fill-mode}-border, #{$_border-color} );
196
-
197
-
198
- --kendo-#{$component}-hover-text: var( --kendo-#{$component}-#{$fill-mode}-hover-text, #{$_hover-text} );
199
- --kendo-#{$component}-hover-bg: var( --kendo-#{$component}-#{$fill-mode}-hover-bg, #{$_hover-bg} );
200
- --kendo-#{$component}-hover-border: var( --kendo-#{$component}-#{$fill-mode}-hover-border, #{$_hover-border} );
201
-
202
-
203
-
204
- --kendo-#{$component}-focus-text: var( --kendo-#{$component}-#{$fill-mode}-focus-text, #{$_focus-text} );
205
- --kendo-#{$component}-focus-bg: var( --kendo-#{$component}-#{$fill-mode}-focus-bg, #{$_focus-bg});
206
- --kendo-#{$component}-focus-border: var( --kendo-#{$component}-#{$fill-mode}-focus-border, #{$_focus-border} );
207
-
208
-
209
-
210
- --kendo-#{$component}-hover-focus-text: var( --kendo-#{$component}-#{$fill-mode}-hover-focus-text, #{$_hover-focus-text} );
211
- --kendo-#{$component}-hover-focus-bg: var( --kendo-#{$component}-#{$fill-mode}-hover-focus-bg, #{$_hover-focus-bg} );
212
- --kendo-#{$component}-hover-focus-border: var( --kendo-#{$component}-#{$fill-mode}-hover-focus-border, #{$_hover-focus-border} );
213
-
214
-
215
- --kendo-#{$component}-disabled-text: var( --kendo-#{$component}-#{$fill-mode}-disabled-text, #{$_disabled-text} );
216
- --kendo-#{$component}-disabled-bg: var( --kendo-#{$component}-#{$fill-mode}-disabled-bg, #{$_disabled-bg} );
217
- --kendo-#{$component}-disabled-border: var( --kendo-#{$component}-#{$fill-mode}-disabled-border, #{$_disabled-border} );
127
+ .k-picker-outline {
128
+ &:disabled,
129
+ &[disabled],
130
+ &.k-disabled {
131
+ color: $kendo-picker-outline-disabled-text;
132
+ background: $kendo-picker-outline-disabled-bg;
133
+ border-color: $kendo-picker-outline-disabled-border;
134
+ }
135
+ }
218
136
 
219
- }
137
+ .k-picker-flat {
138
+ &:disabled,
139
+ &[disabled],
140
+ &.k-disabled {
141
+ color: $kendo-picker-flat-disabled-text;
142
+ background: $kendo-picker-flat-disabled-bg;
143
+ border-color: $kendo-picker-flat-disabled-border;
220
144
  }
221
145
  }
222
146
  }