@syncfusion/ej2-angular-inputs 26.2.4 → 26.2.5

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 (235) hide show
  1. package/package.json +6 -6
  2. package/styles/bootstrap-dark.css +1 -7406
  3. package/styles/bootstrap.css +1 -7388
  4. package/styles/bootstrap4.css +1 -7546
  5. package/styles/bootstrap5-dark.css +1 -7711
  6. package/styles/bootstrap5.css +1 -7711
  7. package/styles/color-picker/bootstrap-dark.css +1 -779
  8. package/styles/color-picker/bootstrap.css +1 -779
  9. package/styles/color-picker/bootstrap4.css +1 -865
  10. package/styles/color-picker/bootstrap5-dark.css +1 -845
  11. package/styles/color-picker/bootstrap5.css +1 -845
  12. package/styles/color-picker/fabric-dark.css +1 -779
  13. package/styles/color-picker/fabric.css +1 -784
  14. package/styles/color-picker/fluent-dark.css +1 -800
  15. package/styles/color-picker/fluent.css +1 -800
  16. package/styles/color-picker/fluent2.css +1 -2025
  17. package/styles/color-picker/highcontrast-light.css +1 -779
  18. package/styles/color-picker/highcontrast.css +1 -779
  19. package/styles/color-picker/material-dark.css +1 -793
  20. package/styles/color-picker/material.css +1 -826
  21. package/styles/color-picker/material3-dark.css +1 -1015
  22. package/styles/color-picker/material3.css +1 -1127
  23. package/styles/color-picker/tailwind-dark.css +1 -819
  24. package/styles/color-picker/tailwind.css +1 -819
  25. package/styles/data-form/bootstrap-dark.css +1 -232
  26. package/styles/data-form/bootstrap.css +1 -232
  27. package/styles/data-form/bootstrap4.css +1 -232
  28. package/styles/data-form/bootstrap5-dark.css +1 -232
  29. package/styles/data-form/bootstrap5.css +1 -232
  30. package/styles/data-form/fabric-dark.css +1 -232
  31. package/styles/data-form/fabric.css +1 -232
  32. package/styles/data-form/fluent-dark.css +1 -232
  33. package/styles/data-form/fluent.css +1 -232
  34. package/styles/data-form/fluent2.css +1 -1266
  35. package/styles/data-form/highcontrast-light.css +1 -232
  36. package/styles/data-form/highcontrast.css +1 -232
  37. package/styles/data-form/material-dark.css +1 -232
  38. package/styles/data-form/material.css +1 -232
  39. package/styles/data-form/material3-dark.css +1 -342
  40. package/styles/data-form/material3.css +1 -454
  41. package/styles/data-form/tailwind-dark.css +1 -232
  42. package/styles/data-form/tailwind.css +1 -232
  43. package/styles/fabric-dark.css +1 -7352
  44. package/styles/fabric.css +1 -7357
  45. package/styles/fluent-dark.css +1 -7505
  46. package/styles/fluent.css +1 -7505
  47. package/styles/fluent2.css +1 -25580
  48. package/styles/highcontrast-light.css +1 -7561
  49. package/styles/highcontrast.css +1 -7561
  50. package/styles/input/bootstrap-dark.css +1 -4372
  51. package/styles/input/bootstrap.css +1 -4372
  52. package/styles/input/bootstrap4.css +1 -4352
  53. package/styles/input/bootstrap5-dark.css +1 -4450
  54. package/styles/input/bootstrap5.css +1 -4450
  55. package/styles/input/fabric-dark.css +1 -4302
  56. package/styles/input/fabric.css +1 -4302
  57. package/styles/input/fluent-dark.css +1 -4333
  58. package/styles/input/fluent.css +1 -4333
  59. package/styles/input/fluent2.css +1 -10199
  60. package/styles/input/highcontrast-light.css +1 -4466
  61. package/styles/input/highcontrast.css +1 -4466
  62. package/styles/input/material-dark.css +1 -11663
  63. package/styles/input/material.css +1 -11683
  64. package/styles/input/material3-dark.css +1 -11613
  65. package/styles/input/material3.css +1 -11725
  66. package/styles/input/tailwind-dark.css +1 -4307
  67. package/styles/input/tailwind.css +1 -4307
  68. package/styles/maskedtextbox/bootstrap-dark.css +1 -31
  69. package/styles/maskedtextbox/bootstrap.css +1 -14
  70. package/styles/maskedtextbox/bootstrap4.css +1 -31
  71. package/styles/maskedtextbox/bootstrap5-dark.css +1 -31
  72. package/styles/maskedtextbox/bootstrap5.css +1 -31
  73. package/styles/maskedtextbox/fabric-dark.css +1 -31
  74. package/styles/maskedtextbox/fabric.css +1 -31
  75. package/styles/maskedtextbox/fluent-dark.css +1 -27
  76. package/styles/maskedtextbox/fluent.css +1 -27
  77. package/styles/maskedtextbox/fluent2.css +1 -1244
  78. package/styles/maskedtextbox/highcontrast-light.css +1 -31
  79. package/styles/maskedtextbox/highcontrast.css +1 -31
  80. package/styles/maskedtextbox/material-dark.css +1 -45
  81. package/styles/maskedtextbox/material.css +1 -65
  82. package/styles/maskedtextbox/material3-dark.css +1 -175
  83. package/styles/maskedtextbox/material3.css +1 -287
  84. package/styles/maskedtextbox/tailwind-dark.css +1 -31
  85. package/styles/maskedtextbox/tailwind.css +1 -31
  86. package/styles/material-dark.css +1 -14920
  87. package/styles/material.css +1 -14992
  88. package/styles/material3-dark.css +1 -16323
  89. package/styles/material3.css +1 -17667
  90. package/styles/numerictextbox/bootstrap-dark.css +1 -53
  91. package/styles/numerictextbox/bootstrap.css +1 -53
  92. package/styles/numerictextbox/bootstrap4.css +1 -48
  93. package/styles/numerictextbox/bootstrap5-dark.css +1 -48
  94. package/styles/numerictextbox/bootstrap5.css +1 -48
  95. package/styles/numerictextbox/fabric-dark.css +1 -48
  96. package/styles/numerictextbox/fabric.css +1 -48
  97. package/styles/numerictextbox/fluent-dark.css +1 -59
  98. package/styles/numerictextbox/fluent.css +1 -59
  99. package/styles/numerictextbox/fluent2.css +1 -1261
  100. package/styles/numerictextbox/highcontrast-light.css +1 -48
  101. package/styles/numerictextbox/highcontrast.css +1 -48
  102. package/styles/numerictextbox/material-dark.css +1 -62
  103. package/styles/numerictextbox/material.css +1 -82
  104. package/styles/numerictextbox/material3-dark.css +1 -192
  105. package/styles/numerictextbox/material3.css +1 -304
  106. package/styles/numerictextbox/tailwind-dark.css +1 -48
  107. package/styles/numerictextbox/tailwind.css +1 -48
  108. package/styles/otp-input/bootstrap-dark.css +1 -225
  109. package/styles/otp-input/bootstrap.css +1 -225
  110. package/styles/otp-input/bootstrap4.css +1 -225
  111. package/styles/otp-input/bootstrap5-dark.css +1 -225
  112. package/styles/otp-input/bootstrap5.css +1 -225
  113. package/styles/otp-input/fabric-dark.css +1 -225
  114. package/styles/otp-input/fabric.css +1 -225
  115. package/styles/otp-input/fluent-dark.css +1 -225
  116. package/styles/otp-input/fluent.css +1 -225
  117. package/styles/otp-input/fluent2.css +1 -1259
  118. package/styles/otp-input/highcontrast-light.css +1 -225
  119. package/styles/otp-input/highcontrast.css +1 -225
  120. package/styles/otp-input/material-dark.css +1 -225
  121. package/styles/otp-input/material.css +1 -225
  122. package/styles/otp-input/material3-dark.css +1 -335
  123. package/styles/otp-input/material3.css +1 -447
  124. package/styles/otp-input/tailwind-dark.css +1 -225
  125. package/styles/otp-input/tailwind.css +1 -225
  126. package/styles/rating/bootstrap-dark.css +1 -315
  127. package/styles/rating/bootstrap.css +1 -315
  128. package/styles/rating/bootstrap4.css +1 -315
  129. package/styles/rating/bootstrap5-dark.css +1 -316
  130. package/styles/rating/bootstrap5.css +1 -316
  131. package/styles/rating/fabric-dark.css +1 -315
  132. package/styles/rating/fabric.css +1 -315
  133. package/styles/rating/fluent-dark.css +1 -315
  134. package/styles/rating/fluent.css +1 -315
  135. package/styles/rating/fluent2.css +1 -1349
  136. package/styles/rating/highcontrast-light.css +1 -315
  137. package/styles/rating/highcontrast.css +1 -315
  138. package/styles/rating/material-dark.css +1 -315
  139. package/styles/rating/material.css +1 -315
  140. package/styles/rating/material3-dark.css +1 -434
  141. package/styles/rating/material3.css +1 -546
  142. package/styles/rating/tailwind-dark.css +1 -319
  143. package/styles/rating/tailwind.css +1 -319
  144. package/styles/signature/bootstrap-dark.css +1 -9
  145. package/styles/signature/bootstrap.css +1 -9
  146. package/styles/signature/bootstrap4.css +1 -9
  147. package/styles/signature/bootstrap5-dark.css +1 -9
  148. package/styles/signature/bootstrap5.css +1 -9
  149. package/styles/signature/fabric-dark.css +1 -9
  150. package/styles/signature/fabric.css +1 -9
  151. package/styles/signature/fluent-dark.css +1 -9
  152. package/styles/signature/fluent.css +1 -9
  153. package/styles/signature/fluent2.css +1 -1043
  154. package/styles/signature/highcontrast-light.css +1 -9
  155. package/styles/signature/highcontrast.css +1 -9
  156. package/styles/signature/material-dark.css +1 -9
  157. package/styles/signature/material.css +1 -9
  158. package/styles/signature/material3-dark.css +1 -119
  159. package/styles/signature/material3.css +1 -231
  160. package/styles/signature/tailwind-dark.css +1 -9
  161. package/styles/signature/tailwind.css +1 -9
  162. package/styles/slider/bootstrap-dark.css +1 -484
  163. package/styles/slider/bootstrap.css +1 -484
  164. package/styles/slider/bootstrap4.css +1 -563
  165. package/styles/slider/bootstrap5-dark.css +1 -643
  166. package/styles/slider/bootstrap5.css +1 -643
  167. package/styles/slider/fabric-dark.css +1 -504
  168. package/styles/slider/fabric.css +1 -504
  169. package/styles/slider/fluent-dark.css +1 -547
  170. package/styles/slider/fluent.css +1 -547
  171. package/styles/slider/fluent2.css +1 -1642
  172. package/styles/slider/highcontrast-light.css +1 -550
  173. package/styles/slider/highcontrast.css +1 -550
  174. package/styles/slider/material-dark.css +1 -677
  175. package/styles/slider/material.css +1 -662
  176. package/styles/slider/material3-dark.css +1 -873
  177. package/styles/slider/material3.css +1 -985
  178. package/styles/slider/tailwind-dark.css +1 -617
  179. package/styles/slider/tailwind.css +1 -617
  180. package/styles/tailwind-dark.css +1 -7548
  181. package/styles/tailwind.css +1 -7548
  182. package/styles/textarea/bootstrap-dark.css +1 -34
  183. package/styles/textarea/bootstrap.css +1 -34
  184. package/styles/textarea/bootstrap4.css +1 -34
  185. package/styles/textarea/bootstrap5-dark.css +1 -34
  186. package/styles/textarea/bootstrap5.css +1 -34
  187. package/styles/textarea/fabric-dark.css +1 -34
  188. package/styles/textarea/fabric.css +1 -34
  189. package/styles/textarea/fluent-dark.css +1 -34
  190. package/styles/textarea/fluent.css +1 -34
  191. package/styles/textarea/fluent2.css +1 -1247
  192. package/styles/textarea/highcontrast-light.css +1 -34
  193. package/styles/textarea/highcontrast.css +1 -34
  194. package/styles/textarea/material-dark.css +1 -48
  195. package/styles/textarea/material.css +1 -68
  196. package/styles/textarea/material3-dark.css +1 -178
  197. package/styles/textarea/material3.css +1 -290
  198. package/styles/textarea/tailwind-dark.css +1 -34
  199. package/styles/textarea/tailwind.css +1 -34
  200. package/styles/textbox/bootstrap-dark.css +1 -28
  201. package/styles/textbox/bootstrap.css +1 -28
  202. package/styles/textbox/bootstrap4.css +1 -28
  203. package/styles/textbox/bootstrap5-dark.css +1 -28
  204. package/styles/textbox/bootstrap5.css +1 -28
  205. package/styles/textbox/fabric-dark.css +1 -28
  206. package/styles/textbox/fabric.css +1 -28
  207. package/styles/textbox/fluent-dark.css +1 -28
  208. package/styles/textbox/fluent.css +1 -28
  209. package/styles/textbox/fluent2.css +1 -1241
  210. package/styles/textbox/highcontrast-light.css +1 -28
  211. package/styles/textbox/highcontrast.css +1 -28
  212. package/styles/textbox/material-dark.css +1 -42
  213. package/styles/textbox/material.css +1 -62
  214. package/styles/textbox/material3-dark.css +1 -172
  215. package/styles/textbox/material3.css +1 -284
  216. package/styles/textbox/tailwind-dark.css +1 -28
  217. package/styles/textbox/tailwind.css +1 -28
  218. package/styles/uploader/bootstrap-dark.css +1 -835
  219. package/styles/uploader/bootstrap.css +1 -835
  220. package/styles/uploader/bootstrap4.css +1 -835
  221. package/styles/uploader/bootstrap5-dark.css +1 -841
  222. package/styles/uploader/bootstrap5.css +1 -841
  223. package/styles/uploader/fabric-dark.css +1 -835
  224. package/styles/uploader/fabric.css +1 -835
  225. package/styles/uploader/fluent-dark.css +1 -887
  226. package/styles/uploader/fluent.css +1 -887
  227. package/styles/uploader/fluent2.css +1 -1880
  228. package/styles/uploader/highcontrast-light.css +1 -835
  229. package/styles/uploader/highcontrast.css +1 -835
  230. package/styles/uploader/material-dark.css +1 -835
  231. package/styles/uploader/material.css +1 -839
  232. package/styles/uploader/material3-dark.css +1 -951
  233. package/styles/uploader/material3.css +1 -1063
  234. package/styles/uploader/tailwind-dark.css +1 -870
  235. package/styles/uploader/tailwind.css +1 -870
@@ -1,985 +1 @@
1
- :root {
2
- --color-sf-black: 0, 0, 0;
3
- --color-sf-white: 255, 255, 255;
4
- --color-sf-primary: 103, 80, 164;
5
- --color-sf-primary-container: 234, 221, 255;
6
- --color-sf-secondary: 98, 91, 113;
7
- --color-sf-secondary-container: 232, 222, 248;
8
- --color-sf-tertiary: 125, 82, 96;
9
- --color-sf-tertiary-container: 255, 216, 228;
10
- --color-sf-surface: 255, 255, 255;
11
- --color-sf-surface-variant: 231, 224, 236;
12
- --color-sf-background: var(--color-sf-surface);
13
- --color-sf-on-primary: 255, 255, 255;
14
- --color-sf-on-primary-container: 33, 0, 94;
15
- --color-sf-on-secondary: 255, 255, 255;
16
- --color-sf-on-secondary-container: 30, 25, 43;
17
- --color-sf-on-tertiary: 255, 255, 255;
18
- --color-sf-on-tertiary-containe: 55, 11, 30;
19
- --color-sf-on-surface: 28, 27, 31;
20
- --color-sf-on-surface-variant: 73, 69, 78;
21
- --color-sf-on-background: 28, 27, 31;
22
- --color-sf-outline: 121, 116, 126;
23
- --color-sf-outline-variant: 196, 199, 197;
24
- --color-sf-shadow: 0, 0, 0;
25
- --color-sf-surface-tint-color: 103, 80, 164;
26
- --color-sf-inverse-surface: 49, 48, 51;
27
- --color-sf-inverse-on-surface: 244, 239, 244;
28
- --color-sf-inverse-primary: 208, 188, 255;
29
- --color-sf-scrim: 0, 0, 0;
30
- --color-sf-error: 179, 38, 30;
31
- --color-sf-error-container: 249, 222, 220;
32
- --color-sf-on-error: 255, 250, 250;
33
- --color-sf-on-error-container: 65, 14, 11;
34
- --color-sf-success: 32, 81, 7;
35
- --color-sf-success-container: 209, 255, 186;
36
- --color-sf-on-success: 244, 255, 239;
37
- --color-sf-on-success-container: 13, 39, 0;
38
- --color-sf-info: 1, 87, 155;
39
- --color-sf-info-container: 233, 245, 255;
40
- --color-sf-on-info: 250, 253, 255;
41
- --color-sf-on-info-container: 0, 51, 91;
42
- --color-sf-warning: 145, 76, 0;
43
- --color-sf-warning-container: 254, 236, 222;
44
- --color-sf-on-warning: 255, 255, 255;
45
- --color-sf-on-warning-container: 47, 21, 0;
46
- --color-sf-spreadsheet-gridline: var(--color-sf-surface-variant);
47
- --color-sf-shadow-focus-ring1: 0 0 0 1px rgb(255, 255, 255), 0 0 0 3px rgb(0, 0, 0);
48
- --color-sf-diagram-palette-background: --color-sf-white;
49
- --color-sf-success-text: 255, 255, 255;
50
- --color-sf-warning-text: 255, 255, 255;
51
- --color-sf-danger-text: 255, 255, 255;
52
- --color-sf-info-text: 255, 255, 255;
53
- --color-sf-content-text-color-alt2: var(--color-sf-on-secondary-container);
54
- --color-sf-secondary-bg-color: var(--color-sf-surface);
55
- }
56
-
57
- .e-dark-mode {
58
- --color-sf-black: 0, 0, 0;
59
- --color-sf-white: 255, 255, 255;
60
- --color-sf-primary: 208, 188, 255;
61
- --color-sf-primary-container: 79, 55, 139;
62
- --color-sf-secondary: 204, 194, 220;
63
- --color-sf-secondary-container: 74, 68, 88;
64
- --color-sf-tertiary: 239, 184, 200;
65
- --color-sf-tertiary-container: 99, 59, 72;
66
- --color-sf-surface: 28, 27, 31;
67
- --color-sf-surface-variant: 28, 27, 31;
68
- --color-sf-background: var(--color-sf-surface);
69
- --color-sf-on-primary: 55, 30, 115;
70
- --color-sf-on-primary-container: 234, 221, 255;
71
- --color-sf-on-secondary: 51, 45, 65;
72
- --color-sf-on-secondary-container: 232, 222, 248;
73
- --color-sf-on-tertiary: 73, 37, 50;
74
- --color-sf-on-tertiary-containe: 255, 216, 228;
75
- --color-sf-on-surface: 230, 225, 229;
76
- --color-sf-on-surface-variant: 202, 196, 208;
77
- --color-sf-on-background: 230, 225, 229;
78
- --color-sf-outline: 147, 143, 153;
79
- --color-sf-outline-variant: 68, 71, 70;
80
- --color-sf-shadow: 0, 0, 0;
81
- --color-sf-surface-tint-color: 208, 188, 255;
82
- --color-sf-inverse-surface: 230, 225, 229;
83
- --color-sf-inverse-on-surface: 49, 48, 51;
84
- --color-sf-inverse-primary: 103, 80, 164;
85
- --color-sf-scrim: 0, 0, 0;
86
- --color-sf-error: 242, 184, 181;
87
- --color-sf-error-container: 140, 29, 24;
88
- --color-sf-on-error: 96, 20, 16;
89
- --color-sf-on-error-container: 249, 222, 220;
90
- --color-sf-success: 83, 202, 23;
91
- --color-sf-success-container: 22, 62, 2;
92
- --color-sf-on-success: 13, 39, 0;
93
- --color-sf-on-success-container: 183, 250, 150;
94
- --color-sf-info: 71, 172, 251;
95
- --color-sf-info-container: 0, 67, 120;
96
- --color-sf-on-info: 0, 51, 91;
97
- --color-sf-on-info-container: 173, 219, 255;
98
- --color-sf-warning: 245, 180, 130;
99
- --color-sf-warning-container: 123, 65, 0;
100
- --color-sf-on-warning: 99, 52, 0;
101
- --color-sf-on-warning-container: 255, 220, 193;
102
- --color-sf-spreadsheet-gridline: 231, 224, 236;
103
- --color-sf-shadow-focus-ring1: 0 0 0 1px #000, 0 0 0 3px #fff;
104
- --color-sf-success-text: 0, 0, 0;
105
- --color-sf-warning-text: 0, 0, 0;
106
- --color-sf-info-text: 0, 0, 0;
107
- --color-sf-danger-text: 0, 0, 0;
108
- --color-sf-diagram-palette-background: var(--color-sf-inverse-surface);
109
- --color-sf-content-text-color-alt2: var(--color-sf-on-secondary);
110
- }
111
-
112
- :root {
113
- --color-sf-black: 0, 0, 0;
114
- --color-sf-white: 255, 255, 255;
115
- --color-sf-primary: 103, 80, 164;
116
- --color-sf-primary-container: 234, 221, 255;
117
- --color-sf-secondary: 98, 91, 113;
118
- --color-sf-secondary-container: 232, 222, 248;
119
- --color-sf-tertiary: 125, 82, 96;
120
- --color-sf-tertiary-container: 255, 216, 228;
121
- --color-sf-surface: 255, 255, 255;
122
- --color-sf-surface-variant: 231, 224, 236;
123
- --color-sf-background: var(--color-sf-surface);
124
- --color-sf-on-primary: 255, 255, 255;
125
- --color-sf-on-primary-container: 33, 0, 94;
126
- --color-sf-on-secondary: 255, 255, 255;
127
- --color-sf-on-secondary-container: 30, 25, 43;
128
- --color-sf-on-tertiary: 255, 255, 255;
129
- --color-sf-on-tertiary-containe: 55, 11, 30;
130
- --color-sf-on-surface: 28, 27, 31;
131
- --color-sf-on-surface-variant: 73, 69, 78;
132
- --color-sf-on-background: 28, 27, 31;
133
- --color-sf-outline: 121, 116, 126;
134
- --color-sf-outline-variant: 196, 199, 197;
135
- --color-sf-shadow: 0, 0, 0;
136
- --color-sf-surface-tint-color: 103, 80, 164;
137
- --color-sf-inverse-surface: 49, 48, 51;
138
- --color-sf-inverse-on-surface: 244, 239, 244;
139
- --color-sf-inverse-primary: 208, 188, 255;
140
- --color-sf-scrim: 0, 0, 0;
141
- --color-sf-error: 179, 38, 30;
142
- --color-sf-error-container: 249, 222, 220;
143
- --color-sf-on-error: 255, 250, 250;
144
- --color-sf-on-error-container: 65, 14, 11;
145
- --color-sf-success: 32, 81, 7;
146
- --color-sf-success-container: 209, 255, 186;
147
- --color-sf-on-success: 244, 255, 239;
148
- --color-sf-on-success-container: 13, 39, 0;
149
- --color-sf-info: 1, 87, 155;
150
- --color-sf-info-container: 233, 245, 255;
151
- --color-sf-on-info: 250, 253, 255;
152
- --color-sf-on-info-container: 0, 51, 91;
153
- --color-sf-warning: 145, 76, 0;
154
- --color-sf-warning-container: 254, 236, 222;
155
- --color-sf-on-warning: 255, 255, 255;
156
- --color-sf-on-warning-container: 47, 21, 0;
157
- --color-sf-spreadsheet-gridline: var(--color-sf-surface-variant);
158
- --color-sf-shadow-focus-ring1: 0 0 0 1px rgb(255, 255, 255), 0 0 0 3px rgb(0, 0, 0);
159
- --color-sf-diagram-palette-background: --color-sf-white;
160
- --color-sf-success-text: 255, 255, 255;
161
- --color-sf-warning-text: 255, 255, 255;
162
- --color-sf-danger-text: 255, 255, 255;
163
- --color-sf-info-text: 255, 255, 255;
164
- --color-sf-content-text-color-alt2: var(--color-sf-on-secondary-container);
165
- --color-sf-secondary-bg-color: var(--color-sf-surface);
166
- }
167
-
168
- .e-dark-mode {
169
- --color-sf-black: 0, 0, 0;
170
- --color-sf-white: 255, 255, 255;
171
- --color-sf-primary: 208, 188, 255;
172
- --color-sf-primary-container: 79, 55, 139;
173
- --color-sf-secondary: 204, 194, 220;
174
- --color-sf-secondary-container: 74, 68, 88;
175
- --color-sf-tertiary: 239, 184, 200;
176
- --color-sf-tertiary-container: 99, 59, 72;
177
- --color-sf-surface: 28, 27, 31;
178
- --color-sf-surface-variant: 28, 27, 31;
179
- --color-sf-background: var(--color-sf-surface);
180
- --color-sf-on-primary: 55, 30, 115;
181
- --color-sf-on-primary-container: 234, 221, 255;
182
- --color-sf-on-secondary: 51, 45, 65;
183
- --color-sf-on-secondary-container: 232, 222, 248;
184
- --color-sf-on-tertiary: 73, 37, 50;
185
- --color-sf-on-tertiary-containe: 255, 216, 228;
186
- --color-sf-on-surface: 230, 225, 229;
187
- --color-sf-on-surface-variant: 202, 196, 208;
188
- --color-sf-on-background: 230, 225, 229;
189
- --color-sf-outline: 147, 143, 153;
190
- --color-sf-outline-variant: 68, 71, 70;
191
- --color-sf-shadow: 0, 0, 0;
192
- --color-sf-surface-tint-color: 208, 188, 255;
193
- --color-sf-inverse-surface: 230, 225, 229;
194
- --color-sf-inverse-on-surface: 49, 48, 51;
195
- --color-sf-inverse-primary: 103, 80, 164;
196
- --color-sf-scrim: 0, 0, 0;
197
- --color-sf-error: 242, 184, 181;
198
- --color-sf-error-container: 140, 29, 24;
199
- --color-sf-on-error: 96, 20, 16;
200
- --color-sf-on-error-container: 249, 222, 220;
201
- --color-sf-success: 83, 202, 23;
202
- --color-sf-success-container: 22, 62, 2;
203
- --color-sf-on-success: 13, 39, 0;
204
- --color-sf-on-success-container: 183, 250, 150;
205
- --color-sf-info: 71, 172, 251;
206
- --color-sf-info-container: 0, 67, 120;
207
- --color-sf-on-info: 0, 51, 91;
208
- --color-sf-on-info-container: 173, 219, 255;
209
- --color-sf-warning: 245, 180, 130;
210
- --color-sf-warning-container: 123, 65, 0;
211
- --color-sf-on-warning: 99, 52, 0;
212
- --color-sf-on-warning-container: 255, 220, 193;
213
- --color-sf-spreadsheet-gridline: 231, 224, 236;
214
- --color-sf-shadow-focus-ring1: 0 0 0 1px #000, 0 0 0 3px #fff;
215
- --color-sf-success-text: 0, 0, 0;
216
- --color-sf-warning-text: 0, 0, 0;
217
- --color-sf-info-text: 0, 0, 0;
218
- --color-sf-danger-text: 0, 0, 0;
219
- --color-sf-diagram-palette-background: var(--color-sf-inverse-surface);
220
- --color-sf-content-text-color-alt2: var(--color-sf-on-secondary);
221
- }
222
-
223
- /* stylelint-disable-line no-empty-source */
224
- /* stylelint-disable-line no-empty-source */
225
- /* stylelint-disable property-no-vendor-prefix */
226
- .e-control-wrapper.e-slider-container {
227
- -moz-user-select: none;
228
- -ms-user-select: none;
229
- -webkit-tap-highlight-color: transparent;
230
- -webkit-touch-callout: none;
231
- -webkit-user-select: none;
232
- -webkit-box-sizing: border-box;
233
- box-sizing: border-box;
234
- display: inline-block;
235
- height: 26px;
236
- line-height: normal;
237
- outline: none;
238
- position: relative;
239
- user-select: none;
240
- }
241
- .e-control-wrapper.e-slider-container.e-material-slider .e-slider .e-handle.e-material-handle {
242
- cursor: default;
243
- -webkit-transition: -webkit-transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
244
- transition: -webkit-transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
245
- transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
246
- transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), -webkit-transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
247
- z-index: 3;
248
- }
249
- .e-control-wrapper.e-slider-container::after {
250
- content: "Material3";
251
- display: none;
252
- }
253
- .e-control-wrapper.e-slider-container .e-slider {
254
- -webkit-box-sizing: border-box;
255
- box-sizing: border-box;
256
- cursor: pointer;
257
- display: block;
258
- outline: 0 none;
259
- padding: 0;
260
- position: relative;
261
- }
262
- .e-control-wrapper.e-slider-container .e-slider .e-handle {
263
- border-radius: 50%;
264
- -webkit-box-sizing: border-box;
265
- box-sizing: border-box;
266
- cursor: pointer;
267
- height: 20px;
268
- width: 20px;
269
- outline: none;
270
- position: absolute;
271
- -ms-touch-action: none;
272
- touch-action: none;
273
- -webkit-transition: left 300ms ease-out, right 300ms ease-out, bottom 300ms ease-out, -webkit-transform 300ms ease-out;
274
- transition: left 300ms ease-out, right 300ms ease-out, bottom 300ms ease-out, -webkit-transform 300ms ease-out;
275
- transition: left 300ms ease-out, right 300ms ease-out, bottom 300ms ease-out, transform 300ms ease-out;
276
- transition: left 300ms ease-out, right 300ms ease-out, bottom 300ms ease-out, transform 300ms ease-out, -webkit-transform 300ms ease-out;
277
- z-index: 10;
278
- }
279
- .e-control-wrapper.e-slider-container .e-slider .e-handle.e-large-thumb-size {
280
- -webkit-transform: scale(1.5);
281
- transform: scale(1.5);
282
- }
283
- .e-control-wrapper.e-slider-container .e-slider .e-handle.e-tab-handle {
284
- background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-on-primary), 0.08)), to(rgba(var(--color-sf-on-primary), 0.08))), rgba(var(--color-sf-primary));
285
- background: linear-gradient(0deg, rgba(var(--color-sf-on-primary), 0.08), rgba(var(--color-sf-on-primary), 0.08)), rgba(var(--color-sf-primary));
286
- -webkit-box-shadow: 0 0 0 10px rgba(var(--color-sf-primary), 0.12);
287
- box-shadow: 0 0 0 10px rgba(var(--color-sf-primary), 0.12);
288
- }
289
- .e-control-wrapper.e-slider-container.e-rtl.e-horizontal .e-slider .e-handle {
290
- margin: 0 -6px 0 0;
291
- }
292
- .e-control-wrapper.e-slider-container.e-rtl.e-horizontal .e-scale.e-h-scale .e-tick.e-first-tick {
293
- background-position: right center;
294
- left: 0;
295
- }
296
- .e-control-wrapper.e-slider-container.e-rtl.e-horizontal .e-scale.e-h-scale .e-tick.e-last-tick {
297
- background-position: left center;
298
- }
299
- .e-control-wrapper.e-slider-container.e-rtl.e-vertical {
300
- direction: ltr;
301
- }
302
- .e-control-wrapper.e-slider-container.e-disabled .e-btn {
303
- cursor: default;
304
- }
305
- .e-control-wrapper.e-slider-container.e-disabled .e-slider .e-handle {
306
- cursor: default;
307
- }
308
- .e-control-wrapper.e-slider-container.e-disabled .e-slider .e-handle.e-handle-disable {
309
- display: none;
310
- }
311
- .e-control-wrapper.e-slider-container.e-horizontal {
312
- height: 48px;
313
- width: 100%;
314
- }
315
- .e-control-wrapper.e-slider-container.e-horizontal .e-first-button {
316
- left: 0;
317
- margin-top: -14px;
318
- top: 50%;
319
- }
320
- .e-control-wrapper.e-slider-container.e-horizontal .e-first-button .e-button-icon {
321
- font-family: "e-icons";
322
- }
323
- .e-control-wrapper.e-slider-container.e-horizontal .e-first-button .e-button-icon::before {
324
- color: rgba(var(--color-sf-on-surface));
325
- content: "\e738";
326
- font-size: 17px;
327
- }
328
- .e-control-wrapper.e-slider-container.e-horizontal .e-first-button .e-button-icon {
329
- font-family: "e-icons";
330
- }
331
- .e-control-wrapper.e-slider-container.e-horizontal .e-first-button .e-button-icon::before {
332
- color: rgba(var(--color-sf-on-surface));
333
- content: "\e738";
334
- font-size: 16px;
335
- }
336
- .e-control-wrapper.e-slider-container.e-horizontal .e-second-button {
337
- right: 0;
338
- margin-top: -14px;
339
- top: 50%;
340
- }
341
- .e-control-wrapper.e-slider-container.e-horizontal .e-second-button .e-button-icon {
342
- font-family: "e-icons";
343
- }
344
- .e-control-wrapper.e-slider-container.e-horizontal .e-second-button .e-button-icon::before {
345
- color: rgba(var(--color-sf-on-surface));
346
- content: "\e75c";
347
- font-size: 17px;
348
- }
349
- .e-control-wrapper.e-slider-container.e-horizontal .e-second-button .e-button-icon {
350
- font-family: "e-icons";
351
- }
352
- .e-control-wrapper.e-slider-container.e-horizontal .e-second-button .e-button-icon::before {
353
- color: rgba(var(--color-sf-on-surface));
354
- content: "\e75c";
355
- font-size: 16px;
356
- }
357
- .e-control-wrapper.e-slider-container.e-horizontal.e-slider-btn {
358
- padding: 0 28px;
359
- }
360
- .e-control-wrapper.e-slider-container.e-horizontal .e-slider {
361
- height: 32px;
362
- width: 100%;
363
- position: relative;
364
- top: calc(50% - 16px);
365
- }
366
- .e-control-wrapper.e-slider-container.e-horizontal .e-slider-track {
367
- height: 4px;
368
- width: 100%;
369
- left: 0;
370
- position: absolute;
371
- overflow: hidden;
372
- background: rgba(var(--color-sf-surface-variant));
373
- border-radius: 4px;
374
- top: calc(50% - 4px);
375
- }
376
- .e-control-wrapper.e-slider-container.e-horizontal .e-handle {
377
- margin-left: -10px;
378
- top: calc(50% - 12px);
379
- }
380
- .e-control-wrapper.e-slider-container.e-horizontal.e-scale-both .e-range {
381
- height: 4px;
382
- }
383
- .e-control-wrapper.e-slider-container.e-horizontal .e-range {
384
- height: 4px;
385
- top: calc(50% - 2px);
386
- top: calc(50% - 4px);
387
- }
388
- .e-control-wrapper.e-slider-container.e-horizontal .e-limits {
389
- background-color: rgba(var(--color-sf-scrim), 0.5);
390
- position: absolute;
391
- height: 4px;
392
- top: calc(50% - 4px);
393
- }
394
- .e-control-wrapper.e-slider-container.e-vertical {
395
- height: inherit;
396
- width: 48px;
397
- padding: 38px 0;
398
- }
399
- .e-control-wrapper.e-slider-container.e-vertical .e-slider {
400
- height: 100%;
401
- width: 32px;
402
- left: calc(50% - 16px);
403
- position: relative;
404
- }
405
- .e-control-wrapper.e-slider-container.e-vertical .e-slider-track {
406
- background: rgba(var(--color-sf-surface-variant));
407
- bottom: 0;
408
- height: 100%;
409
- position: absolute;
410
- overflow: hidden;
411
- left: calc(50% - 2px);
412
- width: 4px;
413
- }
414
- .e-control-wrapper.e-slider-container.e-vertical.e-small-size.e-slider-btn {
415
- height: 100%;
416
- padding: 28px 0;
417
- }
418
- .e-control-wrapper.e-slider-container.e-vertical.e-small-size.e-slider-btn .e-slider {
419
- height: 100%;
420
- width: 4px;
421
- }
422
- .e-control-wrapper.e-slider-container.e-vertical .e-first-button {
423
- bottom: 0;
424
- margin-right: -14px;
425
- right: 50%;
426
- margin-right: -12px;
427
- }
428
- .e-control-wrapper.e-slider-container.e-vertical .e-first-button .e-button-icon {
429
- font-family: "e-icons";
430
- }
431
- .e-control-wrapper.e-slider-container.e-vertical .e-first-button .e-button-icon::before {
432
- color: rgba(var(--color-sf-on-surface));
433
- content: "\e734";
434
- font-size: 14px;
435
- }
436
- .e-control-wrapper.e-slider-container.e-vertical .e-first-button .e-button-icon {
437
- font-family: "e-icons";
438
- }
439
- .e-control-wrapper.e-slider-container.e-vertical .e-first-button .e-button-icon::before {
440
- color: rgba(var(--color-sf-on-surface));
441
- content: "\e734";
442
- font-size: 16px;
443
- }
444
- .e-control-wrapper.e-slider-container.e-vertical .e-second-button {
445
- top: 0;
446
- margin-right: -14px;
447
- right: 50%;
448
- margin-right: -12px;
449
- }
450
- .e-control-wrapper.e-slider-container.e-vertical .e-second-button .e-button-icon {
451
- font-family: "e-icons";
452
- }
453
- .e-control-wrapper.e-slider-container.e-vertical .e-second-button .e-button-icon::before {
454
- color: rgba(var(--color-sf-on-surface));
455
- content: "\e7dd";
456
- font-size: 14px;
457
- }
458
- .e-control-wrapper.e-slider-container.e-vertical .e-second-button .e-button-icon {
459
- font-family: "e-icons";
460
- }
461
- .e-control-wrapper.e-slider-container.e-vertical .e-second-button .e-button-icon::before {
462
- color: rgba(var(--color-sf-on-surface));
463
- content: "\e7dd";
464
- font-size: 16px;
465
- }
466
- .e-control-wrapper.e-slider-container.e-vertical.e-scale-both .e-slider .e-handle {
467
- margin-bottom: -10px;
468
- }
469
- .e-control-wrapper.e-slider-container.e-vertical .e-slider .e-handle {
470
- margin-bottom: -10px;
471
- left: calc(50% - 10px);
472
- }
473
- .e-control-wrapper.e-slider-container.e-vertical .e-slider .e-range {
474
- width: 6px;
475
- left: calc(50% - 3px);
476
- width: 4px;
477
- left: calc(50% - 2px);
478
- }
479
- .e-control-wrapper.e-slider-container.e-vertical .e-slider .e-limits {
480
- background-color: rgba(var(--color-sf-scrim), 0.5);
481
- position: absolute;
482
- width: 4px;
483
- left: calc(50% - 2px);
484
- }
485
- .e-control-wrapper.e-slider-container .e-range {
486
- border-radius: 4px;
487
- position: absolute;
488
- -webkit-transition: left 300ms ease-out, right 300ms ease-out, bottom 300ms ease-out, width 300ms ease-out, height 300ms ease-out;
489
- transition: left 300ms ease-out, right 300ms ease-out, bottom 300ms ease-out, width 300ms ease-out, height 300ms ease-out;
490
- }
491
- .e-control-wrapper.e-slider-container .e-range.e-drag-horizontal, .e-control-wrapper.e-slider-container .e-range.e-drag-vertical {
492
- cursor: pointer;
493
- }
494
- .e-control-wrapper.e-slider-container .e-tick-before.e-scale.e-h-scale .e-tick {
495
- height: 6px;
496
- top: -10px;
497
- }
498
- .e-control-wrapper.e-slider-container .e-tick-before.e-scale.e-h-scale .e-large {
499
- height: 12px;
500
- top: -10px;
501
- }
502
- .e-control-wrapper.e-slider-container .e-tick-before.e-scale.e-v-scale .e-tick {
503
- width: 6px;
504
- left: 5px;
505
- }
506
- .e-control-wrapper.e-slider-container .e-tick-before.e-scale.e-v-scale .e-large {
507
- width: 12px;
508
- left: 1px;
509
- }
510
- .e-control-wrapper.e-slider-container .e-tick-after.e-scale.e-h-scale .e-tick {
511
- height: 6px;
512
- top: 1px;
513
- }
514
- .e-control-wrapper.e-slider-container .e-tick-after.e-scale.e-h-scale .e-large {
515
- height: 12px;
516
- top: 5px;
517
- }
518
- .e-control-wrapper.e-slider-container .e-tick-after.e-scale.e-v-scale .e-tick {
519
- width: 6px;
520
- left: 17px;
521
- }
522
- .e-control-wrapper.e-slider-container .e-tick-after.e-scale.e-v-scale .e-large {
523
- width: 12px;
524
- left: 17px;
525
- }
526
- .e-control-wrapper.e-slider-container.e-scale-before .e-scale.e-v-scale {
527
- right: 9px;
528
- }
529
- .e-control-wrapper.e-slider-container.e-scale-after .e-scale.e-v-scale {
530
- right: 9px;
531
- }
532
- .e-control-wrapper.e-slider-container .e-tick-both.e-scale.e-h-scale .e-tick {
533
- height: 18px;
534
- top: -13px;
535
- }
536
- .e-control-wrapper.e-slider-container .e-tick-both.e-scale.e-h-scale .e-large {
537
- height: 26px;
538
- top: -10px;
539
- }
540
- .e-control-wrapper.e-slider-container .e-tick-both.e-scale.e-v-scale .e-tick {
541
- background-position: center;
542
- width: 18px;
543
- left: 5px;
544
- }
545
- .e-control-wrapper.e-slider-container .e-tick-both.e-scale.e-v-scale .e-large {
546
- width: 26px;
547
- left: 1px;
548
- }
549
- .e-control-wrapper.e-slider-container .e-scale {
550
- -webkit-box-sizing: content-box;
551
- box-sizing: content-box;
552
- font-family: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", sans-serif;
553
- height: 28px;
554
- width: 100%;
555
- line-height: normal;
556
- list-style: none outside none;
557
- margin: 0;
558
- outline: 0 none;
559
- padding: 0;
560
- position: absolute;
561
- top: 16px;
562
- z-index: 1;
563
- font-size: 12px;
564
- margin-top: -5px;
565
- }
566
- .e-control-wrapper.e-slider-container .e-scale .e-tick {
567
- background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAQSURBVHgBAQUA+v8AztTa/whsA3yqMpmsAAAAAElFTkSuQmCC");
568
- cursor: pointer;
569
- outline: none;
570
- position: relative;
571
- -webkit-user-select: none;
572
- -moz-user-select: none;
573
- -ms-user-select: none;
574
- user-select: none;
575
- background-position: center center;
576
- }
577
- .e-control-wrapper.e-slider-container .e-scale .e-tick.e-large {
578
- background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAQSURBVHgBAQUA+v8AbHV9/wUNAl7Qm4m+AAAAAElFTkSuQmCC");
579
- }
580
- .e-control-wrapper.e-slider-container .e-scale .e-tick .e-tick-value {
581
- color: rgba(var(--color-sf-on-secondary-container));
582
- font-family: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", sans-serif;
583
- font-size: 12px;
584
- outline: none;
585
- position: absolute;
586
- -webkit-user-select: none;
587
- -moz-user-select: none;
588
- -ms-user-select: none;
589
- user-select: none;
590
- white-space: nowrap;
591
- line-height: 1.5;
592
- }
593
- .e-control-wrapper.e-slider-container .e-scale.e-v-scale {
594
- height: 100%;
595
- width: 28px;
596
- left: calc(50% - 14px);
597
- top: 0;
598
- }
599
- .e-control-wrapper.e-slider-container .e-scale.e-v-scale .e-tick {
600
- background-repeat: repeat-x;
601
- }
602
- .e-control-wrapper.e-slider-container .e-scale.e-v-scale .e-tick.e-first-tick {
603
- background-position-y: center;
604
- }
605
- .e-control-wrapper.e-slider-container .e-scale.e-v-scale .e-tick.e-last-tick {
606
- background-position-y: bottom;
607
- margin-top: 2px;
608
- }
609
- .e-control-wrapper.e-slider-container .e-scale.e-h-scale .e-tick {
610
- display: inline-block;
611
- background-repeat: repeat-y;
612
- height: 100%;
613
- top: 0;
614
- }
615
- .e-control-wrapper.e-slider-container .e-scale.e-h-scale .e-tick .e-tick-value.e-tick-before, .e-control-wrapper.e-slider-container .e-scale.e-h-scale .e-tick .e-tick-value.e-tick-both:first-child {
616
- top: -18px;
617
- }
618
- .e-control-wrapper.e-slider-container .e-scale.e-h-scale .e-tick .e-tick-value.e-tick-after, .e-control-wrapper.e-slider-container .e-scale.e-h-scale .e-tick .e-tick-value.e-tick-both {
619
- bottom: -20px;
620
- }
621
- .e-control-wrapper.e-slider-container .e-scale.e-h-scale .e-tick.e-first-tick {
622
- background-position: left center;
623
- }
624
- .e-control-wrapper.e-slider-container .e-scale.e-h-scale .e-tick.e-last-tick {
625
- background-position: right center;
626
- }
627
- .e-control-wrapper.e-slider-container .e-scale.e-v-scale .e-tick .e-tick-value.e-tick-before {
628
- right: 17px;
629
- }
630
- .e-control-wrapper.e-slider-container .e-scale.e-v-scale .e-tick .e-tick-value.e-tick-after {
631
- left: 19px;
632
- }
633
- .e-control-wrapper.e-slider-container .e-scale.e-v-scale .e-tick .e-tick-value.e-tick-both {
634
- right: 44px;
635
- }
636
- .e-control-wrapper.e-slider-container .e-scale.e-v-scale .e-tick .e-tick-value.e-tick-both:first-child {
637
- left: 42px;
638
- }
639
-
640
- .e-slider-tooltip.e-tooltip-wrap.e-popup {
641
- background-color: rgba(var(--color-sf-primary));
642
- border: 0;
643
- border-radius: 8px;
644
- /* stylelint-disable */
645
- cursor: -webkit-grab;
646
- cursor: grab;
647
- /* stylelint-enable */
648
- opacity: 1;
649
- }
650
- .e-slider-tooltip.e-tooltip-wrap.e-popup.e-popup.e-popup-close {
651
- display: block;
652
- opacity: 0;
653
- }
654
- .e-slider-tooltip.e-tooltip-wrap.e-popup.e-material-tooltip-start {
655
- background-color: rgba(var(--color-sf-primary));
656
- }
657
- .e-slider-tooltip.e-tooltip-wrap.e-popup.e-material-tooltip-start .e-arrow-tip-outer.e-tip-bottom {
658
- border-top-color: rgba(var(--color-sf-primary));
659
- }
660
- .e-slider-tooltip.e-tooltip-wrap.e-popup.e-material-tooltip-start .e-arrow-tip-outer.e-tip-top {
661
- border-bottom-color: rgba(var(--color-sf-primary));
662
- }
663
- .e-slider-tooltip.e-tooltip-wrap.e-popup.e-material-tooltip-start .e-arrow-tip-outer.e-tip-right {
664
- border-left-color: rgba(var(--color-sf-primary));
665
- }
666
- .e-slider-tooltip.e-tooltip-wrap.e-popup.e-material-tooltip-start .e-arrow-tip-outer.e-tip-left {
667
- border-right-color: rgba(var(--color-sf-primary));
668
- }
669
- .e-slider-tooltip.e-tooltip-wrap.e-popup.e-tooltip-active {
670
- /* stylelint-disable */
671
- cursor: -webkit-grabbing;
672
- cursor: grabbing;
673
- /* stylelint-enable */
674
- }
675
- .e-slider-tooltip.e-tooltip-wrap.e-popup .e-arrow-tip {
676
- visibility: visible;
677
- }
678
- .e-slider-tooltip.e-tooltip-wrap.e-popup .e-tip-content {
679
- background-color: transparent;
680
- height: 16px;
681
- width: 100%;
682
- overflow: hidden;
683
- padding: 0 8px;
684
- top: calc(50% - 8px);
685
- position: relative;
686
- line-height: 16px;
687
- }
688
- .e-slider-tooltip.e-tooltip-wrap.e-popup .e-tip-content.e-material-tooltip-show {
689
- color: #fff;
690
- }
691
- .e-slider-tooltip.e-tooltip-wrap.e-popup .e-tip-content.e-material-tooltip-hide {
692
- color: transparent;
693
- }
694
- .e-slider-tooltip.e-tooltip-wrap.e-popup .e-arrow-tip-inner {
695
- color: rgba(var(--color-sf-primary));
696
- }
697
- .e-slider-tooltip.e-tooltip-wrap.e-popup .e-arrow-tip-outer.e-tip-bottom {
698
- border-top-color: rgba(var(--color-sf-primary));
699
- }
700
- .e-slider-tooltip.e-tooltip-wrap.e-popup .e-arrow-tip-outer.e-tip-top {
701
- border-bottom-color: rgba(var(--color-sf-primary));
702
- }
703
- .e-slider-tooltip.e-tooltip-wrap.e-popup .e-arrow-tip-outer.e-tip-right {
704
- border-left-color: rgba(var(--color-sf-primary));
705
- }
706
- .e-slider-tooltip.e-tooltip-wrap.e-popup .e-arrow-tip-outer.e-tip-left {
707
- border-right-color: rgba(var(--color-sf-primary));
708
- }
709
- .e-slider-tooltip.e-tooltip-wrap.e-popup.e-tooltip-wrap.e-popup.e-material-default {
710
- background-color: rgba(var(--color-sf-primary));
711
- border: 0;
712
- border-bottom-left-radius: 50%;
713
- border-bottom-right-radius: 0%;
714
- border-top-left-radius: 50%;
715
- border-top-right-radius: 50%;
716
- /* stylelint-disable */
717
- cursor: -webkit-grab;
718
- cursor: grab;
719
- /* stylelint-enable */
720
- opacity: 1;
721
- }
722
- .e-slider-tooltip.e-tooltip-wrap.e-popup.e-tooltip-wrap.e-popup.e-material-default.e-material-tooltip-start {
723
- background-color: rgba(var(--color-sf-primary));
724
- }
725
- .e-slider-tooltip.e-tooltip-wrap.e-popup.e-tooltip-wrap.e-popup.e-material-default.e-tooltip-active {
726
- /* stylelint-disable */
727
- cursor: -webkit-grabbing;
728
- cursor: grabbing;
729
- /* stylelint-enable */
730
- }
731
- .e-slider-tooltip.e-tooltip-wrap.e-popup.e-tooltip-wrap.e-popup.e-material-default .e-arrow-tip {
732
- visibility: hidden;
733
- }
734
- .e-slider-tooltip.e-tooltip-wrap.e-popup.e-tooltip-wrap.e-popup.e-material-default.e-slider-horizontal-before {
735
- -webkit-transform: rotate(45deg);
736
- transform: rotate(45deg);
737
- }
738
- .e-slider-tooltip.e-tooltip-wrap.e-popup.e-tooltip-wrap.e-popup.e-material-default.e-slider-horizontal-before .e-tip-content {
739
- -webkit-transform: rotate(-45deg);
740
- transform: rotate(-45deg);
741
- }
742
- .e-slider-tooltip.e-tooltip-wrap.e-popup.e-tooltip-wrap.e-popup.e-material-default.e-slider-horizontal-after {
743
- -webkit-transform: rotate(225deg);
744
- transform: rotate(225deg);
745
- }
746
- .e-slider-tooltip.e-tooltip-wrap.e-popup.e-tooltip-wrap.e-popup.e-material-default.e-slider-horizontal-after .e-tip-content {
747
- -webkit-transform: rotate(-225deg);
748
- transform: rotate(-225deg);
749
- }
750
- .e-slider-tooltip.e-tooltip-wrap.e-popup.e-tooltip-wrap.e-popup.e-material-default.e-slider-vertical-before {
751
- -webkit-transform: rotate(-45deg);
752
- transform: rotate(-45deg);
753
- }
754
- .e-slider-tooltip.e-tooltip-wrap.e-popup.e-tooltip-wrap.e-popup.e-material-default.e-slider-vertical-before .e-tip-content {
755
- -webkit-transform: rotate(45deg);
756
- transform: rotate(45deg);
757
- }
758
- .e-slider-tooltip.e-tooltip-wrap.e-popup.e-tooltip-wrap.e-popup.e-material-default.e-slider-vertical-after {
759
- -webkit-transform: rotate(-225deg);
760
- transform: rotate(-225deg);
761
- }
762
- .e-slider-tooltip.e-tooltip-wrap.e-popup.e-tooltip-wrap.e-popup.e-material-default.e-slider-vertical-after .e-tip-content {
763
- -webkit-transform: rotate(225deg);
764
- transform: rotate(225deg);
765
- }
766
- .e-slider-tooltip.e-tooltip-wrap.e-popup.e-tooltip-wrap.e-popup.e-material-default .e-tip-content {
767
- background-color: transparent;
768
- height: 16px;
769
- width: 100%;
770
- overflow: hidden;
771
- padding: 0;
772
- text-align: center;
773
- top: calc(50% - 10px);
774
- left: calc(50% - 16px);
775
- }
776
- .e-slider-tooltip.e-tooltip-wrap.e-popup.e-tooltip-wrap.e-popup.e-material-default .e-tip-content.e-material-tooltip-show {
777
- color: #fff;
778
- }
779
- .e-slider-tooltip.e-tooltip-wrap.e-popup.e-tooltip-wrap.e-popup.e-material-default .e-tip-content.e-material-tooltip-hide {
780
- color: transparent;
781
- }
782
-
783
- .e-slider-horizantal-color {
784
- height: 100%;
785
- top: 0;
786
- position: absolute;
787
- }
788
-
789
- .e-slider-vertical-color {
790
- position: absolute;
791
- width: 100%;
792
- left: -1px;
793
- }
794
-
795
- .e-bigger .e-slider-tooltip.e-tooltip-wrap.e-popup .e-tip-content {
796
- padding: 2px 4px;
797
- }
798
-
799
- .e-bigger .e-control-wrapper.e-slider-container .e-slider .e-handle,
800
- .e-control-wrapper.e-slider-container.e-bigger .e-slider .e-handle {
801
- height: 28px;
802
- width: 28px;
803
- }
804
- .e-bigger .e-control-wrapper.e-slider-container .e-slider-button,
805
- .e-control-wrapper.e-slider-container.e-bigger .e-slider-button {
806
- height: 18px;
807
- width: 18px;
808
- }
809
- .e-bigger .e-control-wrapper.e-slider-container.e-vertical.e-slider-btn,
810
- .e-control-wrapper.e-slider-container.e-bigger.e-vertical.e-slider-btn {
811
- padding: 34px 0;
812
- }
813
- .e-bigger .e-control-wrapper.e-slider-container.e-vertical .e-first-button,
814
- .e-bigger .e-control-wrapper.e-slider-container.e-vertical .e-second-button,
815
- .e-control-wrapper.e-slider-container.e-bigger.e-vertical .e-first-button,
816
- .e-control-wrapper.e-slider-container.e-bigger.e-vertical .e-second-button {
817
- margin-right: -12px;
818
- }
819
- .e-bigger .e-control-wrapper.e-slider-container.e-vertical .e-slider .e-slider-track,
820
- .e-control-wrapper.e-slider-container.e-bigger.e-vertical .e-slider .e-slider-track {
821
- width: 8px;
822
- left: calc(50% - 4px);
823
- }
824
- .e-bigger .e-control-wrapper.e-slider-container.e-vertical .e-slider .e-range,
825
- .e-control-wrapper.e-slider-container.e-bigger.e-vertical .e-slider .e-range {
826
- width: 8px;
827
- left: calc(50% - 4px);
828
- }
829
- .e-bigger .e-control-wrapper.e-slider-container.e-horizontal .e-slider .e-limits,
830
- .e-control-wrapper.e-slider-container.e-bigger.e-horizontal .e-slider .e-limits {
831
- height: 8px;
832
- top: calc(50% - 4px);
833
- }
834
- .e-bigger .e-control-wrapper.e-slider-container.e-vertical .e-slider .e-limits,
835
- .e-control-wrapper.e-slider-container.e-bigger.e-vertical .e-slider .e-limits {
836
- width: 8px;
837
- left: calc(50% - 4px);
838
- }
839
- .e-bigger .e-control-wrapper.e-slider-container.e-horizontal .e-slider-button.e-first-button,
840
- .e-bigger .e-control-wrapper.e-slider-container.e-horizontal .e-slider-button.e-second-button, .e-bigger .e-control-wrapper.e-slider-container.e-vertical .e-slider-button.e-first-button,
841
- .e-bigger .e-control-wrapper.e-slider-container.e-vertical .e-slider-button.e-second-button,
842
- .e-control-wrapper.e-slider-container.e-bigger.e-horizontal .e-slider-button.e-first-button,
843
- .e-control-wrapper.e-slider-container.e-bigger.e-horizontal .e-slider-button.e-second-button,
844
- .e-control-wrapper.e-slider-container.e-bigger.e-vertical .e-slider-button.e-first-button,
845
- .e-control-wrapper.e-slider-container.e-bigger.e-vertical .e-slider-button.e-second-button {
846
- border-radius: 12px;
847
- height: 24px;
848
- width: 24px;
849
- padding: 0;
850
- }
851
- .e-bigger .e-control-wrapper.e-slider-container.e-horizontal .e-slider-button.e-first-button .e-button-icon::before,
852
- .e-bigger .e-control-wrapper.e-slider-container.e-horizontal .e-slider-button.e-second-button .e-button-icon::before, .e-bigger .e-control-wrapper.e-slider-container.e-vertical .e-slider-button.e-first-button .e-button-icon::before,
853
- .e-bigger .e-control-wrapper.e-slider-container.e-vertical .e-slider-button.e-second-button .e-button-icon::before,
854
- .e-control-wrapper.e-slider-container.e-bigger.e-horizontal .e-slider-button.e-first-button .e-button-icon::before,
855
- .e-control-wrapper.e-slider-container.e-bigger.e-horizontal .e-slider-button.e-second-button .e-button-icon::before,
856
- .e-control-wrapper.e-slider-container.e-bigger.e-vertical .e-slider-button.e-first-button .e-button-icon::before,
857
- .e-control-wrapper.e-slider-container.e-bigger.e-vertical .e-slider-button.e-second-button .e-button-icon::before {
858
- font-size: 22px;
859
- }
860
- .e-bigger .e-control-wrapper.e-slider-container.e-horizontal .e-slider-button.e-first-button,
861
- .e-bigger .e-control-wrapper.e-slider-container.e-horizontal .e-slider-button.e-second-button,
862
- .e-control-wrapper.e-slider-container.e-bigger.e-horizontal .e-slider-button.e-first-button,
863
- .e-control-wrapper.e-slider-container.e-bigger.e-horizontal .e-slider-button.e-second-button {
864
- margin-top: -12px;
865
- }
866
- .e-bigger .e-control-wrapper.e-slider-container.e-horizontal .e-tick-both.e-scale.e-h-scale .e-tick,
867
- .e-control-wrapper.e-slider-container.e-bigger.e-horizontal .e-tick-both.e-scale.e-h-scale .e-tick {
868
- height: 24px;
869
- top: -14px;
870
- }
871
- .e-bigger .e-control-wrapper.e-slider-container.e-horizontal .e-tick-both.e-scale.e-h-scale .e-large,
872
- .e-control-wrapper.e-slider-container.e-bigger.e-horizontal .e-tick-both.e-scale.e-h-scale .e-large {
873
- height: 32px;
874
- top: -10px;
875
- }
876
- .e-bigger .e-control-wrapper.e-slider-container.e-horizontal .e-tick-before.e-scale.e-h-scale .e-tick,
877
- .e-control-wrapper.e-slider-container.e-bigger.e-horizontal .e-tick-before.e-scale.e-h-scale .e-tick {
878
- height: 8px;
879
- top: -12px;
880
- }
881
- .e-bigger .e-control-wrapper.e-slider-container.e-horizontal .e-tick-before.e-scale.e-h-scale .e-large,
882
- .e-control-wrapper.e-slider-container.e-bigger.e-horizontal .e-tick-before.e-scale.e-h-scale .e-large {
883
- height: 12px;
884
- top: -12px;
885
- }
886
- .e-bigger .e-control-wrapper.e-slider-container.e-horizontal .e-tick-after.e-scale.e-h-scale .e-tick,
887
- .e-control-wrapper.e-slider-container.e-bigger.e-horizontal .e-tick-after.e-scale.e-h-scale .e-tick {
888
- height: 8px;
889
- top: 4px;
890
- }
891
- .e-bigger .e-control-wrapper.e-slider-container.e-horizontal .e-tick-after.e-scale.e-h-scale .e-large,
892
- .e-control-wrapper.e-slider-container.e-bigger.e-horizontal .e-tick-after.e-scale.e-h-scale .e-large {
893
- height: 12px;
894
- top: 8px;
895
- }
896
- .e-bigger .e-control-wrapper.e-slider-container.e-vertical .e-tick-both.e-scale .e-tick,
897
- .e-control-wrapper.e-slider-container.e-bigger.e-vertical .e-tick-both.e-scale .e-tick {
898
- width: 24px;
899
- left: 2px;
900
- }
901
- .e-bigger .e-control-wrapper.e-slider-container.e-vertical .e-tick-both.e-scale .e-large,
902
- .e-control-wrapper.e-slider-container.e-bigger.e-vertical .e-tick-both.e-scale .e-large {
903
- width: 32px;
904
- left: -2px;
905
- }
906
- .e-bigger .e-control-wrapper.e-slider-container.e-vertical .e-tick-before.e-scale.e-v-scale .e-tick,
907
- .e-control-wrapper.e-slider-container.e-bigger.e-vertical .e-tick-before.e-scale.e-v-scale .e-tick {
908
- width: 8px;
909
- left: 2px;
910
- }
911
- .e-bigger .e-control-wrapper.e-slider-container.e-vertical .e-tick-before.e-scale.e-v-scale .e-large,
912
- .e-control-wrapper.e-slider-container.e-bigger.e-vertical .e-tick-before.e-scale.e-v-scale .e-large {
913
- width: 12px;
914
- left: -2px;
915
- }
916
- .e-bigger .e-control-wrapper.e-slider-container.e-vertical .e-tick-after.e-scale.e-v-scale .e-tick,
917
- .e-control-wrapper.e-slider-container.e-bigger.e-vertical .e-tick-after.e-scale.e-v-scale .e-tick {
918
- width: 8px;
919
- left: 18px;
920
- }
921
- .e-bigger .e-control-wrapper.e-slider-container.e-vertical .e-tick-after.e-scale.e-v-scale .e-large,
922
- .e-control-wrapper.e-slider-container.e-bigger.e-vertical .e-tick-after.e-scale.e-v-scale .e-large {
923
- width: 12px;
924
- left: 18px;
925
- }
926
- .e-bigger .e-control-wrapper.e-slider-container.e-horizontal .e-slider .e-slider-track,
927
- .e-bigger .e-control-wrapper.e-slider-container.e-horizontal .e-slider .e-range,
928
- .e-control-wrapper.e-slider-container.e-bigger.e-horizontal .e-slider .e-slider-track,
929
- .e-control-wrapper.e-slider-container.e-bigger.e-horizontal .e-slider .e-range {
930
- height: 8px;
931
- top: calc(50% - 4px);
932
- }
933
- .e-bigger .e-control-wrapper.e-slider-container.e-horizontal .e-slider .e-handle,
934
- .e-control-wrapper.e-slider-container.e-bigger.e-horizontal .e-slider .e-handle {
935
- margin-left: -10px;
936
- top: calc(50% - 14px);
937
- }
938
- .e-bigger .e-control-wrapper.e-slider-container.e-vertical .e-slider .e-handle,
939
- .e-control-wrapper.e-slider-container.e-bigger.e-vertical .e-slider .e-handle {
940
- left: calc(50% - 14px);
941
- margin-bottom: -9px;
942
- }
943
- .e-bigger .e-control-wrapper.e-slider-container .e-scale .e-tick .e-tick-value,
944
- .e-control-wrapper.e-slider-container.e-bigger .e-scale .e-tick .e-tick-value {
945
- font-size: 14px;
946
- }
947
-
948
- /* stylelint-enable property-no-vendor-prefix */
949
- .e-control-wrapper.e-slider-container.e-material-slider .e-slider .e-handle.e-handle-first, .e-control-wrapper.e-slider-container.e-material-slider .e-slider .e-handle.e-handle-second {
950
- background: transparent;
951
- border-color: transparent;
952
- -webkit-box-shadow: none;
953
- box-shadow: none;
954
- }
955
- .e-control-wrapper.e-slider-container .e-slider-button {
956
- background-color: rgba(var(--color-sf-on-surface-variant), 0.08);
957
- border: 1px solid linear-gradient(0deg, rgba(var(--color-sf-surface), 1), rgba(var(--color-sf-surface), 1));
958
- -webkit-box-sizing: border-box;
959
- box-sizing: border-box;
960
- cursor: pointer;
961
- outline: none;
962
- position: absolute;
963
- height: 24px;
964
- width: 24px;
965
- border-radius: 50%;
966
- padding: 4px;
967
- border: none;
968
- }
969
- .e-control-wrapper.e-slider-container .e-slider .e-range {
970
- background-color: rgba(var(--color-sf-primary));
971
- }
972
- .e-control-wrapper.e-slider-container .e-slider .e-handle {
973
- background-color: rgba(var(--color-sf-primary));
974
- border-color: rgba(var(--color-sf-primary));
975
- }
976
- .e-control-wrapper.e-slider-container .e-slider .e-handle.e-material-tooltip {
977
- background-color: transparent;
978
- border-color: transparent;
979
- }
980
- .e-control-wrapper.e-slider-container.e-slider-hover .e-slider-track {
981
- background-color: rgba(var(--color-sf-surface-variant));
982
- }
983
- .e-control-wrapper.e-slider-container.e-slider-hover .e-handle {
984
- border-color: rgba(var(--color-sf-primary));
985
- }
1
+ @import '@syncfusion/ej2-inputs/styles/slider/material3.css';