@progress/kendo-theme-default 10.2.0-dev.1 → 10.2.0-dev.3

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 (354) hide show
  1. package/dist/all.css +1 -1
  2. package/dist/default-blue.css +1 -1
  3. package/dist/default-dataviz-v4.css +1 -1
  4. package/dist/default-green.css +1 -1
  5. package/dist/default-main-dark.css +1 -1
  6. package/dist/default-main.css +1 -1
  7. package/dist/default-nordic.css +1 -1
  8. package/dist/default-ocean-blue-a11y.css +1 -1
  9. package/dist/default-ocean-blue.css +1 -1
  10. package/dist/default-orange.css +1 -1
  11. package/dist/default-purple.css +1 -1
  12. package/dist/default-turquoise.css +1 -1
  13. package/dist/default-urban.css +1 -1
  14. package/dist/meta/sassdoc-data.json +741 -957
  15. package/dist/meta/sassdoc-raw-data.json +331 -431
  16. package/dist/meta/variables.json +19 -19
  17. package/lib/swatches/default-blue.json +1 -1
  18. package/lib/swatches/default-dataviz-v4.json +1 -1
  19. package/lib/swatches/default-green.json +1 -1
  20. package/lib/swatches/default-main-dark.json +1 -1
  21. package/lib/swatches/default-main.json +1 -1
  22. package/lib/swatches/default-nordic.json +1 -1
  23. package/lib/swatches/default-ocean-blue-a11y.json +1 -1
  24. package/lib/swatches/default-ocean-blue.json +1 -1
  25. package/lib/swatches/default-orange.json +1 -1
  26. package/lib/swatches/default-purple.json +1 -1
  27. package/lib/swatches/default-turquoise.json +1 -1
  28. package/lib/swatches/default-urban.json +1 -1
  29. package/package.json +4 -4
  30. package/scss/_variables.scss +0 -11
  31. package/scss/action-buttons/_layout.scss +1 -67
  32. package/scss/action-buttons/_theme.scss +1 -16
  33. package/scss/action-buttons/_variables.scss +12 -0
  34. package/scss/action-sheet/_layout.scss +1 -397
  35. package/scss/action-sheet/_theme.scss +1 -100
  36. package/scss/action-sheet/_variables.scss +69 -0
  37. package/scss/adaptive/_layout.scss +1 -479
  38. package/scss/adaptive/_theme.scss +1 -99
  39. package/scss/adaptive/_variables.scss +21 -0
  40. package/scss/appbar/_layout.scss +1 -115
  41. package/scss/appbar/_theme.scss +1 -31
  42. package/scss/appbar/_variables.scss +19 -0
  43. package/scss/autocomplete/_layout.scss +1 -6
  44. package/scss/autocomplete/_theme.scss +1 -6
  45. package/scss/avatar/_layout.scss +1 -78
  46. package/scss/avatar/_theme.scss +1 -27
  47. package/scss/avatar/_variables.scss +9 -0
  48. package/scss/badge/_layout.scss +1 -149
  49. package/scss/badge/_theme.scss +1 -27
  50. package/scss/badge/_variables.scss +26 -0
  51. package/scss/bottom-navigation/_layout.scss +1 -117
  52. package/scss/bottom-navigation/_theme.scss +1 -57
  53. package/scss/bottom-navigation/_variables.scss +22 -0
  54. package/scss/breadcrumb/_layout.scss +1 -133
  55. package/scss/breadcrumb/_theme.scss +1 -100
  56. package/scss/breadcrumb/_variables.scss +64 -0
  57. package/scss/button/_layout.scss +1 -352
  58. package/scss/button/_theme.scss +1 -333
  59. package/scss/button/_variables.scss +92 -0
  60. package/scss/calendar/_layout.scss +1 -523
  61. package/scss/calendar/_theme.scss +1 -210
  62. package/scss/calendar/_variables.scss +99 -0
  63. package/scss/captcha/_layout.scss +1 -64
  64. package/scss/captcha/_theme.scss +1 -15
  65. package/scss/captcha/_variables.scss +17 -0
  66. package/scss/card/_layout.scss +1 -343
  67. package/scss/card/_theme.scss +1 -103
  68. package/scss/card/_variables.scss +58 -0
  69. package/scss/chart-wizard/_layout.scss +1 -42
  70. package/scss/chart-wizard/_theme.scss +1 -33
  71. package/scss/chart-wizard/_variables.scss +14 -0
  72. package/scss/chat/_layout.scss +1 -470
  73. package/scss/chat/_theme.scss +1 -99
  74. package/scss/chat/_variables.scss +67 -0
  75. package/scss/checkbox/_layout.scss +1 -230
  76. package/scss/checkbox/_theme.scss +1 -104
  77. package/scss/checkbox/_variables.scss +51 -0
  78. package/scss/chip/_layout.scss +1 -164
  79. package/scss/chip/_theme.scss +1 -146
  80. package/scss/chip/_variables.scss +46 -0
  81. package/scss/color-preview/_layout.scss +1 -79
  82. package/scss/color-preview/_theme.scss +1 -20
  83. package/scss/color-preview/_variables.scss +14 -0
  84. package/scss/coloreditor/_layout.scss +1 -117
  85. package/scss/coloreditor/_theme.scss +1 -27
  86. package/scss/coloreditor/_variables.scss +55 -0
  87. package/scss/colorgradient/_layout.scss +1 -233
  88. package/scss/colorgradient/_theme.scss +1 -86
  89. package/scss/colorgradient/_variables.scss +71 -0
  90. package/scss/colorpalette/_layout.scss +1 -71
  91. package/scss/colorpalette/_theme.scss +1 -26
  92. package/scss/colorpalette/_variables.scss +18 -0
  93. package/scss/colorpicker/_layout.scss +1 -13
  94. package/scss/colorpicker/_theme.scss +1 -5
  95. package/scss/combobox/_layout.scss +1 -6
  96. package/scss/combobox/_theme.scss +1 -6
  97. package/scss/core/color-system/_swatch-legacy.scss +76 -15
  98. package/scss/core/motion/index.import.scss +1 -0
  99. package/scss/dataviz/_layout.scss +1 -569
  100. package/scss/dataviz/_theme.scss +1 -115
  101. package/scss/dataviz/_variables.scss +105 -0
  102. package/scss/dateinput/_layout.scss +1 -6
  103. package/scss/dateinput/_theme.scss +1 -6
  104. package/scss/datepicker/_layout.scss +1 -5
  105. package/scss/datepicker/_theme.scss +1 -6
  106. package/scss/daterangepicker/_layout.scss +1 -47
  107. package/scss/daterangepicker/_theme.scss +1 -6
  108. package/scss/daterangepicker/_variables.scss +4 -0
  109. package/scss/datetimepicker/_layout.scss +1 -51
  110. package/scss/datetimepicker/_theme.scss +1 -6
  111. package/scss/datetimepicker/_variables.scss +4 -0
  112. package/scss/dialog/_layout.scss +1 -73
  113. package/scss/dialog/_theme.scss +1 -24
  114. package/scss/dialog/_variables.scss +11 -0
  115. package/scss/dock-manager/_layout.scss +1 -220
  116. package/scss/dock-manager/_theme.scss +1 -45
  117. package/scss/dock-manager/_variables.scss +38 -0
  118. package/scss/draggable/_layout.scss +1 -127
  119. package/scss/draggable/_theme.scss +1 -17
  120. package/scss/draggable/_variables.scss +23 -0
  121. package/scss/drawer/_layout.scss +1 -202
  122. package/scss/drawer/_theme.scss +1 -63
  123. package/scss/drawer/_variables.scss +34 -0
  124. package/scss/dropdowngrid/_layout.scss +1 -15
  125. package/scss/dropdowngrid/_theme.scss +1 -6
  126. package/scss/dropdownlist/_layout.scss +1 -38
  127. package/scss/dropdownlist/_theme.scss +1 -9
  128. package/scss/dropdowntree/_layout.scss +1 -39
  129. package/scss/dropdowntree/_theme.scss +1 -6
  130. package/scss/dropdowntree/_variables.scss +5 -0
  131. package/scss/dropzone/_layout.scss +1 -44
  132. package/scss/dropzone/_theme.scss +1 -36
  133. package/scss/dropzone/_variables.scss +22 -0
  134. package/scss/editor/_layout.scss +1 -648
  135. package/scss/editor/_theme.scss +1 -103
  136. package/scss/editor/_variables.scss +24 -0
  137. package/scss/expansion-panel/_layout.scss +1 -82
  138. package/scss/expansion-panel/_theme.scss +1 -44
  139. package/scss/expansion-panel/_variables.scss +25 -0
  140. package/scss/fab/_layout.scss +1 -145
  141. package/scss/fab/_theme.scss +1 -128
  142. package/scss/fab/_variables.scss +50 -0
  143. package/scss/filemanager/_layout.scss +1 -238
  144. package/scss/filemanager/_theme.scss +1 -112
  145. package/scss/filemanager/_variables.scss +60 -0
  146. package/scss/filter/_layout.scss +1 -93
  147. package/scss/filter/_theme.scss +1 -32
  148. package/scss/filter/_variables.scss +11 -0
  149. package/scss/floating-label/_layout.scss +1 -90
  150. package/scss/floating-label/_theme.scss +1 -30
  151. package/scss/floating-label/_variables.scss +18 -0
  152. package/scss/forms/_layout.scss +1 -379
  153. package/scss/forms/_theme.scss +1 -39
  154. package/scss/forms/_variables.scss +54 -0
  155. package/scss/gantt/_layout.scss +1 -921
  156. package/scss/gantt/_theme.scss +1 -279
  157. package/scss/gantt/_variables.scss +78 -0
  158. package/scss/grid/_layout.scss +1 -1374
  159. package/scss/grid/_theme.scss +1 -450
  160. package/scss/grid/_variables.scss +146 -0
  161. package/scss/gridlayout/_layout.scss +1 -6
  162. package/scss/gridlayout/_theme.scss +1 -6
  163. package/scss/icons/_layout.scss +1 -80
  164. package/scss/icons/_theme.scss +1 -1
  165. package/scss/icons/_variables.scss +13 -0
  166. package/scss/imageeditor/_layout.scss +1 -160
  167. package/scss/imageeditor/_theme.scss +1 -54
  168. package/scss/imageeditor/_variables.scss +34 -0
  169. package/scss/input/_layout.scss +1 -586
  170. package/scss/input/_theme.scss +1 -512
  171. package/scss/input/_variables.scss +139 -7
  172. package/scss/list/_layout.scss +1 -246
  173. package/scss/list/_theme.scss +1 -95
  174. package/scss/list/_variables.scss +87 -0
  175. package/scss/listbox/_layout.scss +1 -86
  176. package/scss/listbox/_theme.scss +1 -20
  177. package/scss/listbox/_variables.scss +18 -0
  178. package/scss/listgroup/_layout.scss +1 -191
  179. package/scss/listgroup/_theme.scss +1 -15
  180. package/scss/listgroup/_variables.scss +13 -0
  181. package/scss/listview/_layout.scss +1 -141
  182. package/scss/listview/_theme.scss +1 -43
  183. package/scss/listview/_variables.scss +21 -0
  184. package/scss/loader/_layout.scss +2 -582
  185. package/scss/loader/_theme.scss +1 -17
  186. package/scss/loader/_variables.scss +40 -0
  187. package/scss/map/_layout.scss +1 -138
  188. package/scss/map/_theme.scss +1 -34
  189. package/scss/map/_variables.scss +24 -0
  190. package/scss/maskedtextbox/_layout.scss +1 -6
  191. package/scss/maskedtextbox/_theme.scss +1 -6
  192. package/scss/mediaplayer/_layout.scss +1 -105
  193. package/scss/mediaplayer/_theme.scss +1 -23
  194. package/scss/mediaplayer/_variables.scss +16 -0
  195. package/scss/menu/_layout.scss +1 -320
  196. package/scss/menu/_theme.scss +1 -140
  197. package/scss/menu/_variables.scss +91 -0
  198. package/scss/menu-button/_layout.scss +1 -32
  199. package/scss/menu-button/_theme.scss +1 -6
  200. package/scss/menu-button/_variables.scss +4 -0
  201. package/scss/messagebox/_layout.scss +1 -23
  202. package/scss/messagebox/_theme.scss +1 -25
  203. package/scss/messagebox/_variables.scss +14 -0
  204. package/scss/multiselect/_layout.scss +1 -6
  205. package/scss/multiselect/_theme.scss +1 -6
  206. package/scss/no-data/_layout.scss +1 -22
  207. package/scss/no-data/_theme.scss +1 -10
  208. package/scss/no-data/_variables.scss +5 -0
  209. package/scss/notification/_functions.scss +17 -0
  210. package/scss/notification/_layout.scss +1 -73
  211. package/scss/notification/_theme.scss +1 -27
  212. package/scss/notification/_variables.scss +19 -14
  213. package/scss/numerictextbox/_layout.scss +1 -10
  214. package/scss/numerictextbox/_theme.scss +1 -6
  215. package/scss/orgchart/_layout.scss +1 -112
  216. package/scss/orgchart/_theme.scss +1 -53
  217. package/scss/orgchart/_variables.scss +47 -0
  218. package/scss/otp/_layout.scss +1 -37
  219. package/scss/otp/_theme.scss +1 -8
  220. package/scss/otp/_variables.scss +16 -0
  221. package/scss/overlay/_layout.scss +1 -16
  222. package/scss/overlay/_theme.scss +1 -17
  223. package/scss/overlay/_variables.scss +6 -0
  224. package/scss/pager/_layout.scss +1 -186
  225. package/scss/pager/_theme.scss +1 -21
  226. package/scss/pager/_variables.scss +48 -0
  227. package/scss/panel/_layout.scss +1 -29
  228. package/scss/panel/_theme.scss +1 -22
  229. package/scss/panel/_variables.scss +13 -0
  230. package/scss/panelbar/_layout.scss +1 -141
  231. package/scss/panelbar/_theme.scss +1 -209
  232. package/scss/panelbar/_variables.scss +86 -0
  233. package/scss/pdf-viewer/_layout.scss +1 -332
  234. package/scss/pdf-viewer/_theme.scss +1 -89
  235. package/scss/pdf-viewer/_variables.scss +43 -3
  236. package/scss/pivotgrid/_layout.scss +1 -654
  237. package/scss/pivotgrid/_theme.scss +1 -245
  238. package/scss/pivotgrid/_variables.scss +87 -0
  239. package/scss/popover/_layout.scss +1 -93
  240. package/scss/popover/_theme.scss +1 -41
  241. package/scss/popover/_variables.scss +29 -0
  242. package/scss/popup/_layout.scss +1 -79
  243. package/scss/popup/_theme.scss +1 -19
  244. package/scss/popup/_variables.scss +15 -0
  245. package/scss/progressbar/_layout.scss +1 -244
  246. package/scss/progressbar/_theme.scss +1 -52
  247. package/scss/progressbar/_variables.scss +25 -0
  248. package/scss/prompt/_layout.scss +1 -73
  249. package/scss/prompt/_theme.scss +1 -39
  250. package/scss/prompt/_variables.scss +23 -0
  251. package/scss/radio/_layout.scss +1 -226
  252. package/scss/radio/_theme.scss +1 -91
  253. package/scss/radio/_variables.scss +48 -0
  254. package/scss/rating/_layout.scss +1 -93
  255. package/scss/rating/_theme.scss +1 -43
  256. package/scss/rating/_variables.scss +19 -0
  257. package/scss/responsivepanel/_layout.scss +1 -47
  258. package/scss/responsivepanel/_theme.scss +1 -5
  259. package/scss/ripple/_layout.scss +1 -51
  260. package/scss/ripple/_theme.scss +1 -5
  261. package/scss/scheduler/_layout.scss +1 -1040
  262. package/scss/scheduler/_theme.scss +1 -236
  263. package/scss/scheduler/_variables.scss +82 -0
  264. package/scss/scroller/_layout.scss +1 -85
  265. package/scss/scroller/_theme.scss +1 -7
  266. package/scss/scrollview/_layout.scss +1 -165
  267. package/scss/scrollview/_theme.scss +1 -91
  268. package/scss/scrollview/_variables.scss +31 -0
  269. package/scss/searchbox/_layout.scss +1 -6
  270. package/scss/searchbox/_theme.scss +1 -6
  271. package/scss/signature/_layout.scss +1 -74
  272. package/scss/signature/_theme.scss +1 -13
  273. package/scss/signature/_variables.scss +27 -0
  274. package/scss/skeleton/_layout.scss +1 -92
  275. package/scss/skeleton/_theme.scss +1 -26
  276. package/scss/skeleton/_variables.scss +9 -0
  277. package/scss/slider/_layout.scss +1 -401
  278. package/scss/slider/_theme.scss +1 -80
  279. package/scss/slider/_variables.scss +40 -0
  280. package/scss/split-button/_layout.scss +1 -36
  281. package/scss/split-button/_theme.scss +1 -12
  282. package/scss/split-button/_variables.scss +12 -0
  283. package/scss/splitter/_layout.scss +1 -191
  284. package/scss/splitter/_theme.scss +1 -38
  285. package/scss/splitter/_variables.scss +22 -0
  286. package/scss/spreadsheet/_layout.scss +1 -905
  287. package/scss/spreadsheet/_theme.scss +1 -211
  288. package/scss/spreadsheet/_variables.scss +86 -0
  289. package/scss/stacklayout/_layout.scss +1 -5
  290. package/scss/stacklayout/_theme.scss +1 -5
  291. package/scss/stepper/_layout.scss +1 -291
  292. package/scss/stepper/_theme.scss +1 -238
  293. package/scss/stepper/_variables.scss +72 -0
  294. package/scss/switch/_layout.scss +1 -159
  295. package/scss/switch/_theme.scss +1 -169
  296. package/scss/switch/_variables.scss +59 -0
  297. package/scss/table/_layout.scss +1 -288
  298. package/scss/table/_theme.scss +1 -88
  299. package/scss/table/_variables.scss +43 -0
  300. package/scss/tabstrip/_layout.scss +1 -494
  301. package/scss/tabstrip/_theme.scss +1 -151
  302. package/scss/tabstrip/_variables.scss +65 -0
  303. package/scss/taskboard/_layout.scss +1 -217
  304. package/scss/taskboard/_theme.scss +1 -111
  305. package/scss/taskboard/_variables.scss +78 -0
  306. package/scss/textarea/_layout.scss +1 -8
  307. package/scss/textarea/_theme.scss +2 -7
  308. package/scss/textbox/_layout.scss +1 -6
  309. package/scss/textbox/_theme.scss +1 -6
  310. package/scss/tilelayout/_layout.scss +1 -47
  311. package/scss/tilelayout/_theme.scss +1 -24
  312. package/scss/tilelayout/_variables.scss +13 -0
  313. package/scss/time-marker/_layout.scss +1 -19
  314. package/scss/time-marker/_theme.scss +1 -21
  315. package/scss/time-marker/_variables.scss +5 -0
  316. package/scss/timedurationpicker/_layout.scss +1 -12
  317. package/scss/timedurationpicker/_theme.scss +1 -6
  318. package/scss/timeline/_layout.scss +1 -445
  319. package/scss/timeline/_theme.scss +1 -72
  320. package/scss/timeline/_variables.scss +53 -0
  321. package/scss/timepicker/_layout.scss +1 -12
  322. package/scss/timepicker/_theme.scss +1 -6
  323. package/scss/timeselector/_layout.scss +1 -260
  324. package/scss/timeselector/_theme.scss +1 -76
  325. package/scss/timeselector/_variables.scss +41 -0
  326. package/scss/toolbar/_layout.scss +1 -352
  327. package/scss/toolbar/_theme.scss +1 -192
  328. package/scss/toolbar/_variables.scss +50 -0
  329. package/scss/tooltip/_functions.scss +17 -0
  330. package/scss/tooltip/_layout.scss +1 -116
  331. package/scss/tooltip/_theme.scss +1 -36
  332. package/scss/tooltip/_variables.scss +20 -14
  333. package/scss/treelist/_layout.scss +1 -109
  334. package/scss/treelist/_theme.scss +1 -13
  335. package/scss/treelist/_variables.scss +5 -0
  336. package/scss/treeview/_layout.scss +1 -199
  337. package/scss/treeview/_theme.scss +1 -82
  338. package/scss/treeview/_variables.scss +52 -0
  339. package/scss/typography/_layout.scss +1 -124
  340. package/scss/typography/_theme.scss +1 -24
  341. package/scss/typography/_variables.scss +81 -0
  342. package/scss/upload/_layout.scss +1 -248
  343. package/scss/upload/_theme.scss +1 -105
  344. package/scss/upload/_variables.scss +35 -0
  345. package/scss/validator/_layout.scss +1 -25
  346. package/scss/validator/_theme.scss +1 -6
  347. package/scss/virtual-scroller/_layout.scss +1 -35
  348. package/scss/virtual-scroller/_theme.scss +1 -6
  349. package/scss/window/_layout.scss +1 -173
  350. package/scss/window/_theme.scss +1 -41
  351. package/scss/window/_variables.scss +33 -0
  352. package/scss/wizard/_layout.scss +1 -124
  353. package/scss/wizard/_theme.scss +1 -12
  354. package/scss/wizard/_variables.scss +13 -0
package/scss/input/_theme.scss CHANGED
@@ -1,515 +1,4 @@
1
- @use "../core/_index.scss" as *;
2
- @use "./_variables.scss" as *;
3
-
4
- @mixin kendo-input--theme-base() {
5
-
6
- // Solid input
7
- .k-input-solid {
8
- @include fill(
9
- $kendo-input-text,
10
- $kendo-input-bg,
11
- $kendo-input-border
12
- );
13
- @include box-shadow( $kendo-input-shadow );
14
-
15
- // Hover
16
- &:hover,
17
- &.k-hover {
18
- @include fill(
19
- $kendo-input-hover-text,
20
- $kendo-input-hover-bg,
21
- $kendo-input-hover-border
22
- );
23
- @include box-shadow( $kendo-input-hover-shadow );
24
- }
25
-
26
- // Focus
27
- &:focus,
28
- &.k-focus {
29
- @include fill (
30
- $kendo-input-focus-text,
31
- $kendo-input-focus-bg,
32
- $kendo-input-focus-border
33
- );
34
- @include focus-indicator( $kendo-input-focus-shadow );
35
- }
36
- &:focus-within {
37
- @include fill (
38
- $kendo-input-focus-text,
39
- $kendo-input-focus-bg,
40
- $kendo-input-focus-border
41
- );
42
- @include focus-indicator( $kendo-input-focus-shadow );
43
- }
44
-
45
- // Disabled
46
- &:disabled,
47
- &[disabled],
48
- &.k-disabled {
49
- @include fill(
50
- $kendo-input-disabled-text,
51
- $kendo-input-disabled-bg,
52
- $kendo-input-disabled-border,
53
- $kendo-input-disabled-gradient
54
- );
55
- @include box-shadow( $kendo-input-disabled-shadow );
56
- }
57
-
58
- // Invalid
59
- &.k-invalid,
60
- &.ng-invalid.ng-touched,
61
- &.ng-invalid.ng-dirty {
62
- @include fill( $border: $kendo-input-invalid-border );
63
-
64
- .k-input-validation-icon {
65
- color: $kendo-invalid-text;
66
- }
67
-
68
- &:focus,
69
- &.k-focus {
70
- @include focus-indicator( $kendo-input-invalid-shadow );
71
- }
72
- &:focus-within {
73
- @include focus-indicator( $kendo-input-invalid-shadow );
74
- }
75
- }
76
-
77
- // Prefix & Suffix
78
- .k-input-prefix {
79
- color: $kendo-input-prefix-text;
80
- }
81
-
82
- .k-input-suffix {
83
- color: $kendo-input-suffix-text;
84
- }
85
-
86
- .k-input-separator {
87
- border-color: $kendo-input-separator-text;
88
- }
89
- }
90
-
91
-
92
- // Solid picker
93
- .k-picker-solid {
94
- @include fill(
95
- $kendo-picker-text,
96
- $kendo-picker-bg,
97
- $kendo-picker-border,
98
- $kendo-picker-gradient
99
- );
100
-
101
- // Hover
102
- &:hover,
103
- &.k-hover {
104
- @include fill(
105
- $kendo-picker-hover-text,
106
- $kendo-picker-hover-bg,
107
- $kendo-picker-hover-border,
108
- $kendo-picker-hover-gradient
109
- );
110
- @include box-shadow( $kendo-picker-hover-shadow );
111
- }
112
-
113
- // Focus
114
- &:focus,
115
- &.k-focus {
116
- @include fill (
117
- $kendo-picker-focus-text,
118
- $kendo-picker-focus-bg,
119
- $kendo-picker-focus-border,
120
- $kendo-picker-focus-gradient
121
- );
122
- @include focus-indicator( $kendo-picker-focus-shadow );
123
- }
124
- &:focus-within {
125
- @include fill (
126
- $kendo-picker-focus-text,
127
- $kendo-picker-focus-bg,
128
- $kendo-picker-focus-border,
129
- $kendo-picker-focus-gradient
130
- );
131
- @include focus-indicator( $kendo-picker-focus-shadow );
132
- }
133
-
134
- // Disabled
135
- &:disabled,
136
- &[disabled],
137
- &.k-disabled {
138
- @include fill(
139
- $kendo-picker-disabled-text,
140
- $kendo-picker-disabled-bg,
141
- $kendo-picker-disabled-border,
142
- $kendo-picker-disabled-gradient
143
- );
144
- @include box-shadow( $kendo-picker-disabled-shadow );
145
- }
146
-
147
- // Invalid
148
- &.k-invalid,
149
- &.ng-invalid.ng-touched,
150
- &.ng-invalid.ng-dirty {
151
- @include fill( $border: $kendo-input-invalid-border );
152
-
153
- .k-input-validation-icon {
154
- color: $kendo-invalid-text;
155
- }
156
-
157
- &:focus,
158
- &.k-focus {
159
- @include focus-indicator( $kendo-input-invalid-shadow );
160
- }
161
- &:focus-within {
162
- @include focus-indicator( $kendo-input-invalid-shadow );
163
- }
164
- }
165
- }
166
-
167
-
168
- // Outline input
169
- .k-input-outline {
170
- @include fill (
171
- $kendo-input-outline-text,
172
- $kendo-input-outline-bg,
173
- $kendo-input-outline-border
174
- );
175
-
176
- & > .k-input-button {
177
- border-color: inherit;
178
- }
179
-
180
- & > .k-input-spinner {
181
- border-color: inherit;
182
-
183
- & > .k-spinner-increase,
184
- & > .k-spinner-decrease {
185
- border-color: inherit;
186
- }
187
- }
188
-
189
- // Hover
190
- &:hover,
191
- &.k-hover {
192
- @include fill (
193
- $kendo-input-outline-hover-text,
194
- $kendo-input-outline-hover-bg,
195
- $kendo-input-outline-hover-border
196
- );
197
- }
198
-
199
- // Focus
200
- &:focus,
201
- &.k-focus {
202
- @include fill (
203
- $kendo-input-outline-focus-text,
204
- $kendo-input-outline-focus-bg,
205
- $kendo-input-outline-focus-border
206
- );
207
- @include focus-indicator( $kendo-input-outline-focus-shadow );
208
- }
209
- &:focus-within {
210
- @include fill (
211
- $kendo-input-outline-focus-text,
212
- $kendo-input-outline-focus-bg,
213
- $kendo-input-outline-focus-border
214
- );
215
- @include focus-indicator( $kendo-input-outline-focus-shadow );
216
- }
217
-
218
- // Disabled
219
- &:disabled,
220
- &[disabled],
221
- &.k-disabled {
222
- @include fill(
223
- $kendo-input-disabled-text,
224
- $kendo-input-disabled-bg,
225
- $kendo-input-disabled-border,
226
- $kendo-input-disabled-gradient
227
- );
228
- @include box-shadow( $kendo-input-disabled-shadow );
229
- }
230
-
231
- // Invalid
232
- &.k-invalid,
233
- &.ng-invalid.ng-touched,
234
- &.ng-invalid.ng-dirty {
235
- @include fill( $border: $kendo-input-invalid-border );
236
-
237
- .k-input-validation-icon {
238
- color: $kendo-invalid-text;
239
- }
240
-
241
- &:focus,
242
- &.k-focus {
243
- @include focus-indicator( $kendo-input-invalid-shadow );
244
- }
245
- &:focus-within {
246
- @include focus-indicator( $kendo-input-invalid-shadow );
247
- }
248
- }
249
-
250
- // Prefix & Suffix
251
- .k-input-prefix {
252
- color: $kendo-input-prefix-text;
253
- }
254
-
255
- .k-input-suffix {
256
- color: $kendo-input-suffix-text;
257
- }
258
-
259
- .k-input-separator {
260
- border-color: $kendo-input-separator-text;
261
- }
262
- }
263
-
264
-
265
- // Outline picker
266
- .k-picker-outline {
267
- @include fill (
268
- $kendo-picker-outline-text,
269
- $kendo-picker-outline-bg,
270
- $kendo-picker-outline-border
271
- );
272
-
273
- // Hover
274
- &:hover,
275
- &.k-hover {
276
- @include fill (
277
- $kendo-picker-outline-hover-text,
278
- $kendo-picker-outline-hover-bg,
279
- $kendo-picker-outline-hover-border
280
- );
281
- }
282
-
283
- // Focus
284
- &:focus,
285
- &.k-focus {
286
- @include fill (
287
- $kendo-picker-outline-focus-text,
288
- $kendo-picker-outline-focus-bg,
289
- $kendo-picker-outline-focus-border
290
- );
291
- @include focus-indicator( $kendo-picker-outline-focus-shadow );
292
- }
293
- &:focus-within {
294
- @include fill (
295
- $kendo-picker-outline-focus-text,
296
- $kendo-picker-outline-focus-bg,
297
- $kendo-picker-outline-focus-border
298
- );
299
- @include focus-indicator( $kendo-picker-outline-focus-shadow );
300
- }
301
-
302
- &:focus:hover,
303
- &:focus.k-hover,
304
- &.k-focus:hover,
305
- &.k-focus.k-hover {
306
- @include fill (
307
- $kendo-picker-outline-hover-focus-text,
308
- $kendo-picker-outline-hover-focus-bg,
309
- $kendo-picker-outline-hover-focus-border
310
- );
311
- }
312
-
313
- // Disabled
314
- &:disabled,
315
- &[disabled],
316
- &.k-disabled {
317
- @include fill(
318
- $kendo-picker-disabled-text,
319
- $kendo-picker-disabled-bg,
320
- $kendo-picker-disabled-border,
321
- $kendo-picker-disabled-gradient
322
- );
323
- @include box-shadow( $kendo-picker-disabled-shadow );
324
- }
325
-
326
- // Invalid
327
- &.k-invalid,
328
- &.ng-invalid.ng-touched,
329
- &.ng-invalid.ng-dirty {
330
- @include fill( $border: $kendo-input-invalid-border );
331
-
332
- .k-input-validation-icon {
333
- color: $kendo-invalid-text;
334
- }
335
-
336
- &:focus,
337
- &.k-focus {
338
- @include focus-indicator( $kendo-input-invalid-shadow );
339
- }
340
- &:focus-within {
341
- @include focus-indicator( $kendo-input-invalid-shadow );
342
- }
343
- }
344
- }
345
-
346
-
347
- // Flat input
348
- .k-input-flat {
349
- @include fill (
350
- $kendo-input-flat-text,
351
- $kendo-input-flat-bg,
352
- $kendo-input-flat-border
353
- );
354
-
355
- // Hover
356
- &:hover,
357
- &.k-hover {
358
- @include fill (
359
- $kendo-input-flat-hover-text,
360
- $kendo-input-flat-hover-bg,
361
- $kendo-input-flat-hover-border
362
- );
363
- }
364
-
365
- // Focus
366
- &:focus,
367
- &.k-focus {
368
- @include fill (
369
- $kendo-input-flat-focus-text,
370
- $kendo-input-flat-focus-bg,
371
- $kendo-input-flat-focus-border
372
- );
373
- @include focus-indicator( $kendo-input-flat-focus-shadow );
374
- }
375
- &:focus-within {
376
- @include fill (
377
- $kendo-input-flat-focus-text,
378
- $kendo-input-flat-focus-bg,
379
- $kendo-input-flat-focus-border
380
- );
381
- @include focus-indicator( $kendo-input-flat-focus-shadow );
382
- }
383
-
384
- // Disabled
385
- &:disabled,
386
- &[disabled],
387
- &.k-disabled {
388
- @include fill(
389
- $kendo-input-disabled-text,
390
- $kendo-input-disabled-bg,
391
- $kendo-input-disabled-border,
392
- $kendo-input-disabled-gradient
393
- );
394
- @include box-shadow( $kendo-input-disabled-shadow );
395
- }
396
-
397
- // Invalid
398
- &.k-invalid,
399
- &.ng-invalid.ng-touched,
400
- &.ng-invalid.ng-dirty {
401
- @include fill( $border: $kendo-input-invalid-border );
402
-
403
- .k-input-validation-icon {
404
- color: $kendo-invalid-text;
405
- }
406
-
407
- &:focus,
408
- &.k-focus {
409
- @include focus-indicator( $kendo-input-invalid-shadow );
410
- }
411
- &:focus-within {
412
- @include focus-indicator( $kendo-input-invalid-shadow );
413
- }
414
- }
415
-
416
- // Prefix & Suffix
417
- .k-input-prefix {
418
- color: $kendo-input-prefix-text;
419
- }
420
-
421
- .k-input-suffix {
422
- color: $kendo-input-suffix-text;
423
- }
424
-
425
- .k-input-separator {
426
- border-color: $kendo-input-separator-text;
427
- }
428
- }
429
-
430
-
431
- // Flat picker
432
- .k-picker-flat {
433
- @include fill (
434
- $kendo-picker-flat-text,
435
- $kendo-picker-flat-bg,
436
- $kendo-picker-flat-border
437
- );
438
-
439
- // Hover
440
- &:hover,
441
- &.k-hover {
442
- @include fill (
443
- $kendo-picker-flat-hover-text,
444
- $kendo-picker-flat-hover-bg,
445
- $kendo-picker-flat-hover-border
446
- );
447
- }
448
-
449
- // Focus
450
- &:focus,
451
- &.k-focus {
452
- @include fill (
453
- $kendo-picker-flat-focus-text,
454
- $kendo-picker-flat-focus-bg,
455
- $kendo-picker-flat-focus-border
456
- );
457
- @include focus-indicator( $kendo-picker-flat-focus-shadow );
458
- }
459
- &:focus-within {
460
- @include fill (
461
- $kendo-picker-flat-focus-text,
462
- $kendo-picker-flat-focus-bg,
463
- $kendo-picker-flat-focus-border
464
- );
465
- @include focus-indicator( $kendo-picker-flat-focus-shadow );
466
- }
467
-
468
- &:focus:hover,
469
- &:focus.k-hover,
470
- &.k-focus:hover,
471
- &.k-focus.k-hover {
472
- @include fill (
473
- $kendo-picker-flat-hover-focus-text,
474
- $kendo-picker-flat-hover-focus-bg,
475
- $kendo-picker-flat-hover-focus-border
476
- );
477
- }
478
-
479
- // Disabled
480
- &:disabled,
481
- &[disabled],
482
- &.k-disabled {
483
- @include fill(
484
- $kendo-picker-disabled-text,
485
- $kendo-picker-disabled-bg,
486
- $kendo-picker-disabled-border,
487
- $kendo-picker-disabled-gradient
488
- );
489
- @include box-shadow( $kendo-picker-disabled-shadow );
490
- }
491
-
492
- // Invalid
493
- &.k-invalid,
494
- &.ng-invalid.ng-touched,
495
- &.ng-invalid.ng-dirty {
496
- @include fill( $border: $kendo-input-invalid-border );
497
-
498
- .k-input-validation-icon {
499
- color: $kendo-invalid-text;
500
- }
501
-
502
- &:focus,
503
- &.k-focus {
504
- @include focus-indicator( $kendo-input-invalid-shadow );
505
- }
506
- &:focus-within {
507
- @include focus-indicator( $kendo-input-invalid-shadow );
508
- }
509
- }
510
- }
511
-
512
- }
1
+ @use "@progress/kendo-theme-core/scss/components/input/_theme.scss" as *;
513
2
 
514
3
 
515
4
  @mixin kendo-input--theme() {
package/scss/input/_variables.scss CHANGED
@@ -290,13 +290,6 @@ $kendo-input-prefix-text: $kendo-subtle-text !default;
290
290
  /// @group input
291
291
  $kendo-input-suffix-text: $kendo-subtle-text !default;
292
292
 
293
- /// The text color of the Input prefix.
294
- /// @group input
295
- $kendo-input-prefix-text: $kendo-subtle-text !default;
296
- /// The text color of the Input suffix.
297
- /// @group input
298
- $kendo-input-suffix-text: $kendo-subtle-text !default;
299
-
300
293
  /// The border color of the invalid Input components.
301
294
  /// @group input
302
295
  $kendo-input-invalid-border: $kendo-invalid-border !default;
@@ -453,3 +446,142 @@ $kendo-picker-flat-hover-focus-text: null !default;
453
446
  /// The border color of the flat hovered and focused Picker components.
454
447
  /// @group picker
455
448
  $kendo-picker-flat-hover-focus-border: null !default;
449
+
450
+ $kendo-use-input-button-width: true !default;
451
+ $kendo-use-input-spinner-width: true !default;
452
+ $kendo-use-input-spinner-icon-offset: false !default;
453
+
454
+ @forward "@progress/kendo-theme-core/scss/components/input/_variables.scss" with (
455
+ $kendo-input-default-width: $kendo-input-default-width,
456
+ $kendo-input-border-width: $kendo-input-border-width,
457
+ $kendo-input-border-height: $kendo-input-border-height,
458
+ $kendo-input-border-radius: $kendo-input-border-radius,
459
+ $kendo-input-padding-x: $kendo-input-padding-x,
460
+ $kendo-input-sm-padding-x: $kendo-input-sm-padding-x,
461
+ $kendo-input-md-padding-x: $kendo-input-md-padding-x,
462
+ $kendo-input-lg-padding-x: $kendo-input-lg-padding-x,
463
+ $kendo-input-padding-y: $kendo-input-padding-y,
464
+ $kendo-input-sm-padding-y: $kendo-input-sm-padding-y,
465
+ $kendo-input-md-padding-y: $kendo-input-md-padding-y,
466
+ $kendo-input-lg-padding-y: $kendo-input-lg-padding-y,
467
+ $kendo-input-font-family: $kendo-input-font-family,
468
+ $kendo-input-font-size: $kendo-input-font-size,
469
+ $kendo-input-sm-font-size: $kendo-input-sm-font-size,
470
+ $kendo-input-md-font-size: $kendo-input-md-font-size,
471
+ $kendo-input-lg-font-size: $kendo-input-lg-font-size,
472
+ $kendo-input-line-height: $kendo-input-line-height,
473
+ $kendo-input-sm-line-height: $kendo-input-sm-line-height,
474
+ $kendo-input-md-line-height: $kendo-input-md-line-height,
475
+ $kendo-input-lg-line-height: $kendo-input-lg-line-height,
476
+ $kendo-input-calc-size: $kendo-input-calc-size,
477
+ $kendo-input-sm-calc-size: $kendo-input-sm-calc-size,
478
+ $kendo-input-md-calc-size: $kendo-input-md-calc-size,
479
+ $kendo-input-lg-calc-size: $kendo-input-lg-calc-size,
480
+ $kendo-input-sizes: $kendo-input-sizes,
481
+ $kendo-input-bg: $kendo-input-bg,
482
+ $kendo-input-text: $kendo-input-text,
483
+ $kendo-input-border: $kendo-input-border,
484
+ $kendo-input-shadow: $kendo-input-shadow,
485
+ $kendo-input-hover-bg: $kendo-input-hover-bg,
486
+ $kendo-input-hover-text: $kendo-input-hover-text,
487
+ $kendo-input-hover-border: $kendo-input-hover-border,
488
+ $kendo-input-hover-shadow: $kendo-input-hover-shadow,
489
+ $kendo-input-focus-bg: $kendo-input-focus-bg,
490
+ $kendo-input-focus-text: $kendo-input-focus-text,
491
+ $kendo-input-focus-border: $kendo-input-focus-border,
492
+ $kendo-input-focus-shadow: $kendo-input-focus-shadow,
493
+ $kendo-input-selected-bg: $kendo-input-selected-bg,
494
+ $kendo-input-selected-text: $kendo-input-selected-text,
495
+ $kendo-input-disabled-bg: $kendo-input-disabled-bg,
496
+ $kendo-input-disabled-text: $kendo-input-disabled-text,
497
+ $kendo-input-disabled-border: $kendo-input-disabled-border,
498
+ $kendo-input-disabled-gradient: $kendo-input-disabled-gradient,
499
+ $kendo-input-disabled-shadow: $kendo-input-disabled-shadow,
500
+ $kendo-input-outline-bg: $kendo-input-outline-bg,
501
+ $kendo-input-outline-text: $kendo-input-outline-text,
502
+ $kendo-input-outline-border: $kendo-input-outline-border,
503
+ $kendo-input-outline-hover-bg: $kendo-input-outline-hover-bg,
504
+ $kendo-input-outline-hover-text: $kendo-input-outline-hover-text,
505
+ $kendo-input-outline-hover-border: $kendo-input-outline-hover-border,
506
+ $kendo-input-outline-focus-bg: $kendo-input-outline-focus-bg,
507
+ $kendo-input-outline-focus-text: $kendo-input-outline-focus-text,
508
+ $kendo-input-outline-focus-border: $kendo-input-outline-focus-border,
509
+ $kendo-input-outline-focus-shadow: $kendo-input-outline-focus-shadow,
510
+ $kendo-input-flat-bg: $kendo-input-flat-bg,
511
+ $kendo-input-flat-text: $kendo-input-flat-text,
512
+ $kendo-input-flat-border: $kendo-input-flat-border,
513
+ $kendo-input-flat-hover-bg: $kendo-input-flat-hover-bg,
514
+ $kendo-input-flat-hover-text: $kendo-input-flat-hover-text,
515
+ $kendo-input-flat-hover-border: $kendo-input-flat-hover-border,
516
+ $kendo-input-flat-focus-bg: $kendo-input-flat-focus-bg,
517
+ $kendo-input-flat-focus-text: $kendo-input-flat-focus-text,
518
+ $kendo-input-flat-focus-border: $kendo-input-flat-focus-border,
519
+ $kendo-input-flat-focus-shadow: $kendo-input-flat-focus-shadow,
520
+ $kendo-input-placeholder-text: $kendo-input-placeholder-text,
521
+ $kendo-input-placeholder-opacity: $kendo-input-placeholder-opacity,
522
+ $kendo-input-clear-value-text: $kendo-input-clear-value-text,
523
+ $kendo-input-clear-value-opacity: $kendo-input-clear-value-opacity,
524
+ $kendo-input-clear-value-hover-text: $kendo-input-clear-value-hover-text,
525
+ $kendo-input-clear-value-hover-opacity: $kendo-input-clear-value-hover-opacity,
526
+ $kendo-input-values-margin-y: $kendo-input-values-margin-y,
527
+ $kendo-input-values-margin-x: $kendo-input-values-margin-x,
528
+ $kendo-input-button-width: $kendo-input-button-width,
529
+ $kendo-input-button-border-width: $kendo-input-button-border-width,
530
+ $kendo-input-spinner-width: $kendo-input-spinner-width,
531
+ $kendo-input-spinner-icon-offset: $kendo-input-spinner-icon-offset,
532
+ $kendo-input-separator-text: $kendo-input-separator-text,
533
+ $kendo-input-separator-opacity: $kendo-input-separator-opacity,
534
+ $kendo-input-prefix-text: $kendo-input-prefix-text,
535
+ $kendo-input-suffix-text: $kendo-input-suffix-text,
536
+ $kendo-input-invalid-border: $kendo-input-invalid-border,
537
+ $kendo-input-invalid-shadow: $kendo-input-invalid-shadow,
538
+ $kendo-picker-bg: $kendo-picker-bg,
539
+ $kendo-picker-text: $kendo-picker-text,
540
+ $kendo-picker-border: $kendo-picker-border,
541
+ $kendo-picker-gradient: $kendo-picker-gradient,
542
+ $kendo-picker-shadow: $kendo-picker-shadow,
543
+ $kendo-picker-hover-bg: $kendo-picker-hover-bg,
544
+ $kendo-picker-hover-text: $kendo-picker-hover-text,
545
+ $kendo-picker-hover-border: $kendo-picker-hover-border,
546
+ $kendo-picker-hover-gradient: $kendo-picker-hover-gradient,
547
+ $kendo-picker-hover-shadow: $kendo-picker-hover-shadow,
548
+ $kendo-picker-focus-bg: $kendo-picker-focus-bg,
549
+ $kendo-picker-focus-text: $kendo-picker-focus-text,
550
+ $kendo-picker-focus-border: $kendo-picker-focus-border,
551
+ $kendo-picker-focus-gradient: $kendo-picker-focus-gradient,
552
+ $kendo-picker-focus-shadow: $kendo-picker-focus-shadow,
553
+ $kendo-picker-disabled-bg: $kendo-picker-disabled-bg,
554
+ $kendo-picker-disabled-text: $kendo-picker-disabled-text,
555
+ $kendo-picker-disabled-border: $kendo-picker-disabled-border,
556
+ $kendo-picker-disabled-gradient: $kendo-picker-disabled-gradient,
557
+ $kendo-picker-disabled-shadow: $kendo-picker-disabled-shadow,
558
+ $kendo-picker-outline-bg: $kendo-picker-outline-bg,
559
+ $kendo-picker-outline-text: $kendo-picker-outline-text,
560
+ $kendo-picker-outline-border: $kendo-picker-outline-border,
561
+ $kendo-picker-outline-hover-bg: $kendo-picker-outline-hover-bg,
562
+ $kendo-picker-outline-hover-text: $kendo-picker-outline-hover-text,
563
+ $kendo-picker-outline-hover-border: $kendo-picker-outline-hover-border,
564
+ $kendo-picker-outline-focus-bg: $kendo-picker-outline-focus-bg,
565
+ $kendo-picker-outline-focus-text: $kendo-picker-outline-focus-text,
566
+ $kendo-picker-outline-focus-border: $kendo-picker-outline-focus-border,
567
+ $kendo-picker-outline-focus-shadow: $kendo-picker-outline-focus-shadow,
568
+ $kendo-picker-outline-hover-focus-bg: $kendo-picker-outline-hover-focus-bg,
569
+ $kendo-picker-outline-hover-focus-text: $kendo-picker-outline-hover-focus-text,
570
+ $kendo-picker-outline-hover-focus-border: $kendo-picker-outline-hover-focus-border,
571
+ $kendo-picker-flat-bg: $kendo-picker-flat-bg,
572
+ $kendo-picker-flat-text: $kendo-picker-flat-text,
573
+ $kendo-picker-flat-border: $kendo-picker-flat-border,
574
+ $kendo-picker-flat-hover-bg: $kendo-picker-flat-hover-bg,
575
+ $kendo-picker-flat-hover-text: $kendo-picker-flat-hover-text,
576
+ $kendo-picker-flat-hover-border: $kendo-picker-flat-hover-border,
577
+ $kendo-picker-flat-focus-bg: $kendo-picker-flat-focus-bg,
578
+ $kendo-picker-flat-focus-text: $kendo-picker-flat-focus-text,
579
+ $kendo-picker-flat-focus-border: $kendo-picker-flat-focus-border,
580
+ $kendo-picker-flat-focus-shadow: $kendo-picker-flat-focus-shadow,
581
+ $kendo-picker-flat-hover-focus-bg: $kendo-picker-flat-hover-focus-bg,
582
+ $kendo-picker-flat-hover-focus-text: $kendo-picker-flat-hover-focus-text,
583
+ $kendo-picker-flat-hover-focus-border: $kendo-picker-flat-hover-focus-border,
584
+ $kendo-use-input-button-width: $kendo-use-input-button-width,
585
+ $kendo-use-input-spinner-width: $kendo-use-input-spinner-width,
586
+ $kendo-use-input-spinner-icon-offset: $kendo-use-input-spinner-icon-offset
587
+ );