@syncfusion/ej2-base 25.2.7 → 26.1.35-7502

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 (201) hide show
  1. package/{README.md → ReadMe.md} +100 -100
  2. package/bin/syncfusion-license.js +104 -1
  3. package/dist/ej2-base.min.js +1 -10
  4. package/dist/ej2-base.umd.min.js +1 -10
  5. package/dist/ej2-base.umd.min.js.map +1 -1
  6. package/dist/es6/ej2-base.es2015.js +268 -486
  7. package/dist/es6/ej2-base.es2015.js.map +1 -1
  8. package/dist/es6/ej2-base.es5.js +307 -522
  9. package/dist/es6/ej2-base.es5.js.map +1 -1
  10. package/dist/global/ej2-base.min.js +1 -10
  11. package/dist/global/ej2-base.min.js.map +1 -1
  12. package/dist/global/index.d.ts +0 -9
  13. package/dist/ts/undefined +67 -0
  14. package/e2e/crypto.js +16 -16
  15. package/e2e/index.d.ts +27 -27
  16. package/e2e/m.protractor.config.js +286 -286
  17. package/e2e/modified-protractor/protractor.config.js +316 -316
  18. package/e2e/protractor.config.js +389 -389
  19. package/helpers/e2e/index.js +3 -3
  20. package/license +10 -10
  21. package/package.json +225 -161
  22. package/src/ajax.d.ts +1 -1
  23. package/src/ajax.js +3 -7
  24. package/src/animation-model.d.ts +41 -41
  25. package/src/animation.d.ts +1 -1
  26. package/src/animation.js +20 -22
  27. package/src/base.d.ts +2 -1
  28. package/src/base.js +4 -13
  29. package/src/browser.d.ts +1 -1
  30. package/src/browser.js +3 -4
  31. package/src/child-property.d.ts +1 -0
  32. package/src/child-property.js +2 -2
  33. package/src/component-model.d.ts +16 -16
  34. package/src/component.d.ts +4 -0
  35. package/src/component.js +28 -36
  36. package/src/dom.js +4 -11
  37. package/src/draggable-model.d.ts +113 -113
  38. package/src/draggable.js +20 -41
  39. package/src/droppable-model.d.ts +23 -23
  40. package/src/droppable.js +19 -20
  41. package/src/event-handler.js +2 -6
  42. package/src/fetch.js +1 -2
  43. package/src/hijri-parser.js +3 -3
  44. package/src/internationalization.d.ts +4 -0
  45. package/src/internationalization.js +0 -5
  46. package/src/intl/date-formatter.js +19 -33
  47. package/src/intl/date-parser.js +33 -62
  48. package/src/intl/intl-base.d.ts +9 -1
  49. package/src/intl/intl-base.js +19 -18
  50. package/src/intl/number-formatter.js +14 -7
  51. package/src/intl/number-parser.js +2 -6
  52. package/src/intl/parser-base.js +6 -11
  53. package/src/keyboard-model.d.ts +16 -16
  54. package/src/keyboard.js +19 -20
  55. package/src/module-loader.js +1 -0
  56. package/src/notify-property-change.d.ts +0 -20
  57. package/src/notify-property-change.js +16 -55
  58. package/src/observer.js +3 -6
  59. package/src/sanitize-helper.js +0 -1
  60. package/src/template-engine.js +1 -7
  61. package/src/template.js +13 -18
  62. package/src/touch-model.d.ts +39 -39
  63. package/src/touch.js +22 -27
  64. package/src/util.d.ts +4 -4
  65. package/src/util.js +12 -37
  66. package/src/validate-lic.js +4 -3
  67. package/styles/_all.scss +2 -2
  68. package/styles/_bds-dark-definition.scss +16 -15
  69. package/styles/_bds-definition.scss +16 -15
  70. package/styles/_bootstrap-dark-definition.scss +42 -42
  71. package/styles/_bootstrap-definition.scss +42 -42
  72. package/styles/_bootstrap4-definition.scss +11 -11
  73. package/styles/_bootstrap5-dark-definition.scss +9 -9
  74. package/styles/_bootstrap5-definition.scss +8 -8
  75. package/styles/_bootstrap5.3-dark-definition.scss +8 -0
  76. package/styles/_bootstrap5.3-definition.scss +8 -0
  77. package/styles/_fabric-dark-definition.scss +42 -42
  78. package/styles/_fabric-definition.scss +42 -42
  79. package/styles/_fluent-dark-definition.scss +9 -9
  80. package/styles/_fluent-definition.scss +9 -9
  81. package/styles/_fluent2-dark-definition.scss +9 -0
  82. package/styles/_fluent2-definition.scss +9 -0
  83. package/styles/_fluent2-highcontrast-definition.scss +9 -0
  84. package/styles/_fusionnew-dark-definition.scss +8 -8
  85. package/styles/_fusionnew-definition.scss +8 -8
  86. package/styles/_highcontrast-definition.scss +42 -42
  87. package/styles/_highcontrast-light-definition.scss +42 -42
  88. package/styles/_material-dark-definition.scss +49 -48
  89. package/styles/_material-definition.scss +50 -49
  90. package/styles/_material3-dark-definition.scss +15 -14
  91. package/styles/_material3-definition.scss +16 -15
  92. package/styles/_tailwind-dark-definition.scss +16 -15
  93. package/styles/_tailwind-definition.scss +16 -15
  94. package/styles/_tailwind3-dark-definition.scss +15 -0
  95. package/styles/_tailwind3-definition.scss +15 -0
  96. package/styles/animation/_all.scss +535 -560
  97. package/styles/bds-lite.css +3408 -0
  98. package/styles/bds-lite.scss +3 -0
  99. package/styles/bds.css +3408 -0
  100. package/styles/bds.scss +3 -0
  101. package/styles/bootstrap-dark-lite.css +3749 -0
  102. package/styles/bootstrap-dark-lite.scss +3 -0
  103. package/styles/bootstrap-dark.css +1075 -169
  104. package/styles/bootstrap-lite.css +3749 -0
  105. package/styles/bootstrap-lite.scss +3 -0
  106. package/styles/bootstrap.css +1075 -169
  107. package/styles/bootstrap4-lite.css +3390 -0
  108. package/styles/bootstrap4-lite.scss +3 -0
  109. package/styles/bootstrap4.css +1063 -169
  110. package/styles/bootstrap5-dark-lite.css +2966 -0
  111. package/styles/bootstrap5-dark-lite.scss +3 -0
  112. package/styles/bootstrap5-dark.css +1068 -171
  113. package/styles/bootstrap5-lite.css +2966 -0
  114. package/styles/bootstrap5-lite.scss +3 -0
  115. package/styles/bootstrap5.3-lite.css +3559 -0
  116. package/styles/bootstrap5.3-lite.scss +3 -0
  117. package/styles/bootstrap5.3.css +3559 -0
  118. package/styles/bootstrap5.3.scss +3 -0
  119. package/styles/bootstrap5.css +1066 -169
  120. package/styles/common/_all.scss +2 -2
  121. package/styles/common/_core.scss +111 -117
  122. package/styles/common/_mixin.scss +11 -9
  123. package/styles/definition/_bds-dark.scss +1193 -1178
  124. package/styles/definition/_bds.scss +1488 -1458
  125. package/styles/definition/_bootstrap-dark.scss +213 -219
  126. package/styles/definition/_bootstrap.scss +208 -215
  127. package/styles/definition/_bootstrap4.scss +159 -167
  128. package/styles/definition/_bootstrap5-dark.scss +481 -494
  129. package/styles/definition/_bootstrap5.3-dark.scss +1232 -0
  130. package/styles/definition/_bootstrap5.3.scss +1579 -0
  131. package/styles/definition/_bootstrap5.scss +481 -495
  132. package/styles/definition/_fabric-dark.scss +194 -200
  133. package/styles/definition/_fabric.scss +192 -198
  134. package/styles/definition/_fluent-dark.scss +494 -557
  135. package/styles/definition/_fluent.scss +494 -558
  136. package/styles/definition/_fluent2-dark.scss +1523 -0
  137. package/styles/definition/_fluent2-highcontrast.scss +1523 -0
  138. package/styles/definition/_fluent2.scss +2295 -0
  139. package/styles/definition/_fusionnew-dark.scss +330 -362
  140. package/styles/definition/_fusionnew.scss +331 -363
  141. package/styles/definition/_highcontrast-light.scss +189 -193
  142. package/styles/definition/_highcontrast.scss +189 -195
  143. package/styles/definition/_material-dark.scss +193 -198
  144. package/styles/definition/_material.scss +186 -192
  145. package/styles/definition/_material3-dark.scss +660 -710
  146. package/styles/definition/_material3.scss +729 -792
  147. package/styles/definition/_tailwind-dark.scss +445 -488
  148. package/styles/definition/_tailwind.scss +443 -485
  149. package/styles/definition/_tailwind3-dark.scss +1622 -0
  150. package/styles/definition/_tailwind3.scss +2093 -0
  151. package/styles/fabric-dark-lite.css +3734 -0
  152. package/styles/fabric-dark-lite.scss +3 -0
  153. package/styles/fabric-dark.css +1075 -169
  154. package/styles/fabric-lite.css +3734 -0
  155. package/styles/fabric-lite.scss +3 -0
  156. package/styles/fabric.css +1075 -169
  157. package/styles/fluent-dark-lite.css +2966 -0
  158. package/styles/fluent-dark-lite.scss +3 -0
  159. package/styles/fluent-dark.css +1066 -169
  160. package/styles/fluent-lite.css +2966 -0
  161. package/styles/fluent-lite.scss +3 -0
  162. package/styles/fluent.css +1066 -169
  163. package/styles/fluent2-lite.css +4017 -0
  164. package/styles/fluent2-lite.scss +3 -0
  165. package/styles/fluent2.css +4017 -0
  166. package/styles/fluent2.scss +3 -0
  167. package/styles/highcontrast-light-lite.css +3725 -0
  168. package/styles/highcontrast-light-lite.scss +3 -0
  169. package/styles/highcontrast-light.css +1075 -169
  170. package/styles/highcontrast-lite.css +3725 -0
  171. package/styles/highcontrast-lite.scss +3 -0
  172. package/styles/highcontrast.css +1075 -169
  173. package/styles/material-dark-lite.css +3702 -0
  174. package/styles/material-dark-lite.scss +3 -0
  175. package/styles/material-dark.css +1075 -169
  176. package/styles/material-lite.css +3702 -0
  177. package/styles/material-lite.scss +3 -0
  178. package/styles/material.css +1075 -169
  179. package/styles/material3-dark-lite.css +3021 -0
  180. package/styles/material3-dark-lite.scss +3 -0
  181. package/styles/material3-dark.css +1066 -170
  182. package/styles/material3-lite.css +3077 -0
  183. package/styles/material3-lite.scss +3 -0
  184. package/styles/material3.css +1066 -170
  185. package/styles/offline-theme/material-dark.css +1075 -169
  186. package/styles/offline-theme/material.css +1075 -169
  187. package/styles/offline-theme/tailwind-dark.css +1067 -170
  188. package/styles/offline-theme/tailwind.css +1067 -170
  189. package/styles/tailwind-dark-lite.css +2967 -0
  190. package/styles/tailwind-dark-lite.scss +3 -0
  191. package/styles/tailwind-dark.css +1067 -170
  192. package/styles/tailwind-lite.css +2967 -0
  193. package/styles/tailwind-lite.scss +3 -0
  194. package/styles/tailwind.css +1067 -170
  195. package/styles/tailwind3-lite.css +3775 -0
  196. package/styles/tailwind3-lite.scss +3 -0
  197. package/styles/tailwind3.css +3775 -0
  198. package/styles/tailwind3.scss +3 -0
  199. package/.eslintrc.json +0 -260
  200. package/CHANGELOG.md +0 -649
  201. package/tslint.json +0 -111
package/styles/definition/_tailwind3.scss ADDED
@@ -0,0 +1,2093 @@
1
+ @use 'sass:color';
2
+ @use 'sass:meta';
3
+ @use 'sass:list';
4
+ @import '../common/mixin.scss';
5
+
6
+ @function mapcolorvariable($pallete-name){
7
+ @return var(#{'--color-sf-'+ $pallete-name});
8
+ }
9
+
10
+ @function shade-color($color, $percentage) {
11
+ @return mix($black, $color, $percentage);
12
+ }
13
+
14
+ @function tint-color($color, $percentage) {
15
+ @return mix($white, $color, $percentage);
16
+ }
17
+
18
+ :root{
19
+ --color-sf-content-bg-color: rgba(255, 255, 255);
20
+ --color-sf-content-bg-color-alt1: #f9fafb;
21
+ --color-sf-content-bg-color-alt2: #f3f4f6;
22
+ --color-sf-content-bg-color-alt3: #e5e7eb;
23
+ --color-sf-content-bg-color-alt4: #9ca3af;
24
+ --color-sf-content-bg-color-alt5: #6b7280;
25
+ --color-sf-content-bg-color-hover: #f9fafb;
26
+ --color-sf-content-bg-color-pressed: #f3f4f6;
27
+ --color-sf-content-bg-color-focus: #f9fafb;
28
+ --color-sf-content-bg-color-selected: #e5e7eb;
29
+ --color-sf-content-bg-color-dragged: #f3f4f6;
30
+ --color-sf-content-bg-color-disabled: #ffffff;
31
+ --color-sf-flyout-bg-color: #ffffff;
32
+ --color-sf-flyout-bg-color-hover: #f3f4f6;
33
+ --color-sf-flyout-bg-color-pressed: #e5e7eb;
34
+ --color-sf-flyout-bg-color-focus: #f3f4f6;
35
+ --color-sf-flyout-bg-color-selected: #e5e7eb;
36
+ --color-sf-flyout-bg-color-disabled: #fff;
37
+ --color-sf-overlay-bg-color: rgba(107, 114, 128, .75);
38
+ --color-sf-table-bg-color-hover: #f9fafb;
39
+ --color-sf-table-bg-color-pressed: #f3f4f6;
40
+ --color-sf-table-bg-color-selected: #e5e7eb;
41
+ --color-sf-text-input-bg-color: #ffffff;
42
+ --color-sf-treeview-item-active-hover-bg: #e5e7eb;
43
+
44
+ // text-color
45
+ --color-sf-content-text-color: #111827;
46
+ --color-sf-content-text-color-alt1: #374151;
47
+ --color-sf-content-text-color-alt2: #4b5563;
48
+ --color-sf-content-text-color-alt3: #6b7280;
49
+ --color-sf-content-text-color-alt4: #9ca3af;
50
+ --color-sf-content-text-color-hover: #111827;
51
+ --color-sf-content-text-color-pressed: #111827;
52
+ --color-sf-content-text-color-focus: #111827;
53
+ --color-sf-content-text-color-selected: #111827;
54
+ --color-sf-content-text-color-dragged: #111827;
55
+ --color-sf-content-text-color-disabled: #9ca3af;
56
+ --color-sf-placeholder-text-color: #6b7280;
57
+ --color-sf-flyout-text-color: #111827;
58
+ --color-sf-flyout-text-color-hover: #111827;
59
+ --color-sf-flyout-text-color-pressed: #111827;
60
+ --color-sf-flyout-text-color-focus: #111827;
61
+ --color-sf-flyout-text-color-selected: #111827;
62
+ --color-sf-flyout-text-color-disabled: #9ca3af;
63
+ --color-sf-table-text-color-hover: #111827;
64
+ --color-sf-table-text-color-pressed: #111827;
65
+ --color-sf-table-text-color-selected: #111827;
66
+
67
+ // icon-color
68
+ --color-sf-icon-color: #6b7280;
69
+ --color-sf-icon-color-hover: #374151;
70
+ --color-sf-icon-color-pressed: #6b7280;
71
+ --color-sf-icon-color-disabled: #d1d5db;
72
+
73
+ // close-icon-color
74
+ --color-sf-close-icon-color: #9ca3af;
75
+ --color-sf-close-icon-color-hover: #6b7280;
76
+ --color-sf-close-icon-color-pressed: #6b7280;
77
+ --color-sf-close-icon-color-disabled: #d1d5db;
78
+
79
+ // border-color
80
+ --color-sf-border-light: #e5e7eb;
81
+ --color-sf-border: #d1d5db;
82
+ --color-sf-border-dark: #9ca3af;
83
+ --color-sf-border-hover: #d1d5db;
84
+ --color-sf-border-pressed: #9ca3af;
85
+ --color-sf-border-focus: #d1d5db;
86
+ --color-sf-border-selected: #9ca3af;
87
+ --color-sf-border-dragged: #e5e7eb;
88
+ --color-sf-border-disabled: #e5e7eb;
89
+ --color-sf-border-warning: #c2410c;
90
+ --color-sf-border-error: #dc2626;
91
+ --color-sf-border-success: #15803d;
92
+ --color-sf-spreadsheet-gridline: #dee2e6;
93
+ --color-sf-flyout-border: #e5e7eb;
94
+ --color-sf-dialog-border: #fff;
95
+
96
+ //sf Variables
97
+ --color-sf-primary: rgba(79, 70, 229);
98
+ --color-sf-primary-text-color: #fff;
99
+ --color-sf-primary-light: #818cf8;
100
+ --color-sf-primary-lighter: #e0e7ff;
101
+ --color-sf-primary-dark: #4338ca;
102
+ --color-sf-primary-darker: #3730a3;
103
+ --color-sf-secondary: #ffffff;
104
+ --color-sf-success: #15803d;
105
+ --color-sf-info: #0e7490;
106
+ --color-sf-warning: #c2410c;
107
+ --color-sf-danger: #dc2626;
108
+ --color-sf-success-light: #dcfce7;
109
+ --color-sf-info-light: #cffafe;
110
+ --color-sf-warning-light: #ffedd5;
111
+ --color-sf-danger-light: #fee2e2;
112
+ --color-sf-success-dark: #166534;
113
+ --color-sf-info-dark: #155e75;
114
+ --color-sf-warning-dark: #9a3412;
115
+ --color-sf-danger-dark: #b91c1c;
116
+ --color-sf-success-lighter: #f0fdf4;
117
+ --color-sf-info-lighter: #ecfeff;
118
+ --color-sf-warning-lighter: #fff7fd;
119
+ --color-sf-danger-lighter: #fef2f2;
120
+ --color-sf-black: 0, 0, 0;
121
+ --color-sf-white: 255, 255, 255;
122
+
123
+ // Primary-button
124
+ --color-sf-primary-bg-color: #4f46e5;
125
+ --color-sf-primary-border-color: #4f46e5;
126
+ --color-sf-primary-text: #fff;
127
+ --color-sf-primary-bg-color-hover: #4338ca;
128
+ --color-sf-primary-border-color-hover: #4338ca;
129
+ --color-sf-primary-text-hover: #ffffff;
130
+ --color-sf-primary-bg-color-pressed: #3730a3;
131
+ --color-sf-primary-border-color-pressed: #3730a3;
132
+ --color-sf-primary-text-pressed: #fff;
133
+ --color-sf-primary-bg-color-focus: #4338ca;
134
+ --color-sf-primary-border-color-focus: #4338ca;
135
+ --color-sf-primary-text-focus: #fff;
136
+ --color-sf-primary-bg-color-disabled: #a5b4fc;
137
+ --color-sf-primary-border-color-disabled: #a5b4fc;
138
+ --color-sf-primary-text-disabled: #fff;
139
+
140
+ // Secondary-button
141
+ --color-sf-secondary-bg-color: #fff;
142
+ --color-sf-secondary-border-color: #d1d5db;
143
+ --color-sf-secondary-text-color: #374151;
144
+ --color-sf-secondary-bg-color-hover: #f3f4f6;
145
+ --color-sf-secondary-border-color-hover: #d1d5db;
146
+ --color-sf-secondary-text-color-hover: #374151;
147
+ --color-sf-secondary-bg-color-pressed: #e5e7eb;
148
+ --color-sf-secondary-border-color-pressed: #d1d5db;
149
+ --color-sf-secondary-text-color-pressed: #374151;
150
+ --color-sf-secondary-bg-color-focus: #f3f4f6;
151
+ --color-sf-secondary-border-color-focus: #d1d5db;
152
+ --color-sf-secondary-text-color-focus: #374151;
153
+ --color-sf-secondary-bg-color-disabled: #fff;
154
+ --color-sf-secondary-border-color-disabled: #e5e7eb;
155
+ --color-sf-secondary-text-color-disabled: #9ca3af;
156
+
157
+ // Success-button
158
+ --color-sf-success-bg-color: #15803d;
159
+ --color-sf-success-border-color: #15803d;
160
+ --color-sf-success-text: #fff;
161
+ --color-sf-success-bg-color-hover: #166534;
162
+ --color-sf-success-border-color-hover: #166534;
163
+ --color-sf-success-text-hover: #fff;
164
+ --color-sf-success-bg-color-pressed: #14532d;
165
+ --color-sf-success-border-color-pressed: #14532d;
166
+ --color-sf-success-text-pressed: #fff;
167
+ --color-sf-success-bg-color-focus: #166534;
168
+ --color-sf-success-border-color-focus: #166534;
169
+ --color-sf-success-text-focus: #fff;
170
+ --color-sf-success-bg-color-disabled: #86efac;
171
+ --color-sf-success-border-color-disabled: #86efac;
172
+ --color-sf-success-text-disabled: #fff;
173
+
174
+ // Warning-button
175
+ --color-sf-warning-bg-color: #c2410c;
176
+ --color-sf-warning-border-color: #c2410c;
177
+ --color-sf-warning-text: #fff;
178
+ --color-sf-warning-bg-color-hover: #9a3412;
179
+ --color-sf-warning-border-color-hover: #9a3412;
180
+ --color-sf-warning-text-hover: #fff;
181
+ --color-sf-warning-bg-color-pressed: #7c2d12;
182
+ --color-sf-warning-border-color-pressed: #7c2d12;
183
+ --color-sf-warning-text-pressed: #fff;
184
+ --color-sf-warning-bg-color-focus: #9a3412;
185
+ --color-sf-warning-border-color-focus: #9a3412;
186
+ --color-sf-warning-text-focus: #fff;
187
+ --color-sf-warning-bg-color-disabled: #fdba74;
188
+ --color-sf-warning-border-color-disabled: #fdba74;
189
+ --color-sf-warning-text-disabled: #fff;
190
+
191
+ // Info-button
192
+ --color-sf-info-bg-color: #0e7490;
193
+ --color-sf-info-border-color: #0e7490;
194
+ --color-sf-info-text: #fff;
195
+ --color-sf-info-bg-color-hover: #155e75;
196
+ --color-sf-info-border-color-hover: #155e75;
197
+ --color-sf-info-text-hover: #fff;
198
+ --color-sf-info-bg-color-pressed: #164e63;
199
+ --color-sf-info-border-color-pressed: #164e63;
200
+ --color-sf-info-text-pressed: #fff;
201
+ --color-sf-info-bg-color-focus: #155e75;
202
+ --color-sf-info-border-color-focus: #155e75;
203
+ --color-sf-info-text-focus: #fff;
204
+ --color-sf-info-bg-color-disabled: #67e8f9;
205
+ --color-sf-info-border-color-disabled: #67e8f9;
206
+ --color-sf-info-text-disabled: #fff;
207
+
208
+ // danger-button
209
+ --color-sf-danger-bg-color: #dc2626;
210
+ --color-sf-danger-border-color: #dc2626;
211
+ --color-sf-danger-text: #fff;
212
+ --color-sf-danger-bg-color-hover: #b91c1c;
213
+ --color-sf-danger-border-color-hover: #b91c1c;
214
+ --color-sf-danger-text-hover: #fff;
215
+ --color-sf-danger-bg-color-pressed: #991b1b;
216
+ --color-sf-danger-border-color-pressed: #991b1b;
217
+ --color-sf-danger-text-pressed: #fff;
218
+ --color-sf-danger-bg-color-focus: #b91c1c;
219
+ --color-sf-danger-border-color-focus: #b91c1c;
220
+ --color-sf-danger-text-focus: #fff;
221
+ --color-sf-danger-bg-color-disabled: #fca5a5;
222
+ --color-sf-danger-border-color-disabled: #fca5a5;
223
+ --color-sf-danger-text-disabled: #fff;
224
+
225
+ //Outline button
226
+ --color-sf-primary-outline: #4f46e5;
227
+ --color-sf-secondary-outline: #d1d5db;
228
+ --color-sf-warning-outline: #c2410c;
229
+ --color-sf-danger-outline: #dc2626;
230
+ --color-sf-success-outline: #15803d;
231
+ --color-sf-info-outline: #0e7490;
232
+
233
+ // Tooltip
234
+ --color-sf-tooltip-bg-color: #111827;
235
+ --color-sf-tooltip-border: #111827;
236
+ --color-sf-tooltip-text-color: #f9fafb;
237
+
238
+ //Light
239
+ --color-sf-appbar-bg-color-alt1: #ffffff;
240
+ --color-sf-appbar-color-alt1: #111827;
241
+ --color-sf-appbar-border-color-alt1: #ffffff;
242
+ --color-sf-appbar-hover-bg-color-alt1: rgba(255, 255, 255, .39);
243
+
244
+ //dark
245
+ --color-sf-appbar-bg-color-alt2: #1f2937;
246
+ --color-sf-appbar-color-alt2: #ffffff;
247
+ --color-sf-appbar-border-color-alt2: #1f2937;
248
+ --color-sf-appbar-hover-bg-color-alt2: #818cf8;
249
+
250
+ //diagram Palette color
251
+ --color-sf-diagram-palette-background: #fff;
252
+ --color-sf-diagram-palette-hover-background: #f9fafb;
253
+ --color-sf-diagram-palette-selected-color: #e5e7eb;
254
+
255
+ //rating
256
+ --color-sf-rating-selected-color: #111827;
257
+ --color-sf-rating-unrated-color: #e5e7eb;
258
+ --color-sf-rating-selected-disabled-color: #9ca3af;
259
+ --color-sf-rating-unrated-disabled-color: #e5e7eb;
260
+ --color-sf-rating-selected-hover-color: #4f46e5;
261
+ --color-sf-rating-unrated-hover-color: #374151;
262
+ --color-sf-rating-pressed-color: #251bc3;
263
+
264
+ //Message default
265
+ --color-sf-msg-color: #374151;
266
+ --color-sf-msg-bg-color: #f9fafb;
267
+ --color-sf-msg-border-color: #e6e7ea;
268
+ --color-sf-msg-color-alt1: #111827;
269
+ --color-sf-msg-bg-color-alt1: rgba(255, 255, 255, .01);
270
+ --color-sf-msg-border-color-alt1: #e6e7ea;
271
+ --color-sf-msg-color-alt2: #374151;
272
+ --color-sf-msg-bg-color-alt2: #f9fafb;
273
+ --color-sf-msg-border-color-alt2: #f1f3f4;
274
+ --color-sf-msg-icon-color: #374151;
275
+ --color-sf-msg-icon-color-alt1: #111827;
276
+ --color-sf-msg-icon-color-alt2: #808691;
277
+ --color-sf-msg-close-icon-color: #374151;
278
+ --color-sf-msg-close-icon-color-alt1: #6b7280;
279
+ --color-sf-msg-close-icon-color-alt2: #374151;
280
+
281
+ //Message danger
282
+ --color-sf-msg-danger-color: #b91c1c;
283
+ --color-sf-msg-danger-bg-color: #fff5f5;
284
+ --color-sf-msg-danger-border-color: #fee2e2;
285
+ --color-sf-msg-danger-color-alt1: #dc2626;
286
+ --color-sf-msg-danger-bg-color-alt1: rgba(255, 255, 255, .01);
287
+ --color-sf-msg-danger-border-color-alt1: #fecaca;
288
+ --color-sf-msg-danger-color-alt2: #e45959;
289
+ --color-sf-msg-danger-bg-color-alt2: #fff5f5;
290
+ --color-sf-msg-danger-border-color-alt2: #fff5f5;
291
+ --color-sf-msg-danger-icon-color: #dc2626;
292
+ --color-sf-msg-danger-icon-color-alt1: #dc2626;
293
+ --color-sf-msg-danger-icon-color-alt2: #dc2626;
294
+ --color-sf-msg-danger-close-icon-color: #b91c1c;
295
+ --color-sf-msg-danger-close-icon-color-alt1: #6b7280;
296
+ --color-sf-msg-danger-close-icon-color-alt2: #6b7280;
297
+
298
+ //Message success
299
+ --color-sf-msg-success-color: #15803d;
300
+ --color-sf-msg-success-bg-color: #f0fdf4;
301
+ --color-sf-msg-success-border-color: #bbf7d0;
302
+ --color-sf-msg-success-color-alt1: #15803d;
303
+ --color-sf-msg-success-bg-color-alt1: rgba(255, 255, 255, .01);
304
+ --color-sf-msg-success-border-color-alt1: #bbf7d0;
305
+ --color-sf-msg-success-color-alt2: #15803d;
306
+ --color-sf-msg-success-bg-color-alt2: #f0fdf4;
307
+ --color-sf-msg-success-border-color-alt2: #f0fdf4;
308
+ --color-sf-msg-success-icon-color: #15803d;
309
+ --color-sf-msg-success-icon-color-alt1: #15803d;
310
+ --color-sf-msg-success-icon-color-alt2: #15803d;
311
+ --color-sf-msg-success-close-icon-color: #15803d;
312
+ --color-sf-msg-success-close-icon-color-alt1: #6b7280;
313
+ --color-sf-msg-success-close-icon-color-alt2: #6b7280;
314
+
315
+ //Message warning
316
+ --color-sf-msg-warning-color: #c2410c;
317
+ --color-sf-msg-warning-bg-color: #fff7ed;
318
+ --color-sf-msg-warning-border-color: #ffedd5;
319
+ --color-sf-msg-warning-color-alt1: #c2410c;
320
+ --color-sf-msg-warning-bg-color-alt1: rgba(255, 255, 255, .01);
321
+ --color-sf-msg-warning-border-color-alt1: #fed7aa;
322
+ --color-sf-msg-warning-color-alt2: #c2410c;
323
+ --color-sf-msg-warning-bg-color-alt2: #fff7ed;
324
+ --color-sf-msg-warning-border-color-alt2: #fff7ed;
325
+ --color-sf-msg-warning-icon-color: #c2410c;
326
+ --color-sf-msg-warning-icon-color-alt1: #c2410c;
327
+ --color-sf-msg-warning-icon-color-alt2: #c2410c;
328
+ --color-sf-msg-warning-close-icon-color: #c2410c;
329
+ --color-sf-msg-warning-close-icon-color-alt1: #6b7280;
330
+ --color-sf-msg-warning-close-icon-color-alt2: #6b7280;
331
+
332
+ //Message info
333
+ --color-sf-msg-info-color: #0e7490;
334
+ --color-sf-msg-info-bg-color: #ecfeff;
335
+ --color-sf-msg-info-border-color: #cffafe;
336
+ --color-sf-msg-info-color-alt1: #0e7490;
337
+ --color-sf-msg-info-bg-color-alt1: rgba(255, 255, 255, .01);
338
+ --color-sf-msg-info-border-color-alt1: #bae6fd;
339
+ --color-sf-msg-info-color-alt2: #0e7490;
340
+ --color-sf-msg-info-bg-color-alt2: #ecfeff;
341
+ --color-sf-msg-info-border-color-alt2: #ecfeff;
342
+ --color-sf-msg-info-icon-color: #0e7490;
343
+ --color-sf-msg-info-icon-color-alt1: #6b7280;
344
+ --color-sf-msg-info-icon-color-alt2: #0e7490;
345
+ --color-sf-msg-info-close-icon-color: #0e7490;
346
+ --color-sf-msg-info-close-icon-color-alt1: #6b7280;
347
+ --color-sf-msg-info-close-icon-color-alt2: #6b7280;
348
+
349
+ //badge
350
+ --color-sf-badge-light-bg-color: #faf9fa;
351
+ --color-sf-badge-light-border-color: #faf9fa;
352
+ --color-sf-badge-light-text-color: #000;
353
+ --color-sf-badge-dark-bg-color: #212529;
354
+ --color-sf-badge-dark-border-color: #212529;
355
+ --color-sf-badge-dark-text-color: #fff;
356
+
357
+ //tab
358
+ --color-sf-tab-border: #343a40;
359
+
360
+ //stepper
361
+ --color-sf-stepper: #fff;
362
+ --color-sf-shadow-color: #fff;
363
+ --color-sf-shadow-color1: ##000;
364
+
365
+ //breadcrumb
366
+ --color-sf-breadcrumb-item-hover-color: #374151;
367
+ --color-sf-breadcrumb-item-active-color: #4b5563;
368
+ --color-sf-breadcrumb-item-focus-border-color: $transparent;
369
+
370
+ // Transparent
371
+ --color-sf-transparent: rgba(255, 255, 255, 0);
372
+
373
+ //Primary-chip
374
+ --color-sf-chip-primary-bg-color: #eef2ff;
375
+ --color-sf-chip-primary-icon-color: rgba(67, 56, 202, .5);
376
+ --color-sf-chip-primary-border-color: #e0e7ff;
377
+ --color-sf-chip-primary-text: #4338ca;
378
+ --color-sf-chip-primary-icon-color-hover: #4338ca;
379
+ --color-sf-chip-primary-icon-color-pressed: #4338ca;
380
+ --color-sf-chip-primary-bg-color-hover: #eef2ff;
381
+ --color-sf-chip-primary-border-color-hover: #c7d2fe;
382
+ --color-sf-chip-primary-text-hover: #4338ca;
383
+ --color-sf-chip-primary-bg-color-pressed: #e0e7ff;
384
+ --color-sf-chip-primary-icon-bg-color-pressed: #c7d2fe;
385
+ --color-sf-chip-primary-icon-bg-color-hover: #c7d2fe;
386
+ --color-sf-chip-primary-border-color-pressed: #e0e7ff;
387
+ --color-sf-chip-primary-text-pressed: #4f46e5;
388
+ --color-sf-chip-primary-bg-color-disabled: #eef2ff;
389
+ --color-sf-chip-primary-border-color-disabled: #e0e7ff;
390
+ --color-sf-chip-primary-text-disabled: #a5b4fc;
391
+
392
+ //Secondary-chip
393
+ --color-sf-chip-secondary-bg-color: #f9fafb;
394
+ --color-sf-chip-secondary-icon-color: #9ca3af;
395
+ --color-sf-chip-secondary-border-color: #f3f4f6;
396
+ --color-sf-chip-secondary-text-color: #374151;
397
+ --color-sf-chip-secondary-icon-color-hover: #5f6875;
398
+ --color-sf-chip-secondary-icon-color-pressed: #5f6875;
399
+ --color-sf-chip-secondary-bg-color-hover: #f9fafb;
400
+ --color-sf-chip-secondary-border-color-hover: #e5e7eb;
401
+ --color-sf-chip-secondary-text-color-hover: #374151;
402
+ --color-sf-chip-secondary-bg-color-pressed: #e5e7eb;
403
+ --color-sf-chip-secondary-icon-bg-color-pressed: #d7dadf;
404
+ --color-sf-chip-secondary-icon-bg-color-hover: #d7dadf;
405
+ --color-sf-chip-secondary-border-color-pressed: #e5e7eb;
406
+ --color-sf-chip-secondary-text-color-pressed: #374151;
407
+ --color-sf-chip-secondary-bg-color-disabled: #f9fafb;
408
+ --color-sf-chip-secondary-border-color-disabled: #f3f4f6;
409
+ --color-sf-chip-secondary-text-color-disabled: #9ca3af;
410
+
411
+ //Success-chip
412
+ --color-sf-chip-success-bg-color: #f0fdf4;
413
+ --color-sf-chip-success-icon-color: rgba(21, 128, 61, .5);
414
+ --color-sf-chip-success-border-color: #bbf7d0;
415
+ --color-sf-chip-success-text: #15803d;
416
+ --color-sf-chip-success-icon-color-hover: #489f68;
417
+ --color-sf-chip-success-icon-color-pressed: #489f68;
418
+ --color-sf-chip-success-bg-color-hover: #f0fdf4;
419
+ --color-sf-chip-success-border-color-hover: #bbf7d0;
420
+ --color-sf-chip-success-text-hover: #15803d;
421
+ --color-sf-chip-success-bg-color-pressed: #bbf7d0;
422
+ --color-sf-chip-success-icon-bg-color-pressed: #c4ebd2;
423
+ --color-sf-chip-success-icon-bg-color-hover: #c4ebd2;
424
+ --color-sf-chip-success-border-color-pressed: #bbf7d0;
425
+ --color-sf-chip-success-text-pressed: #166534;
426
+ --color-sf-chip-success-bg-color-disabled: #f0fdf4;
427
+ --color-sf-chip-success-border-color-disabled: #bbf7d0;
428
+ --color-sf-chip-success-text-disabled: #86efac;
429
+
430
+ //Warning-chip
431
+ --color-sf-chip-warning-bg-color: #fff7ed;
432
+ --color-sf-chip-warning-icon-color: rgba(194, 65, 12, .5);
433
+ --color-sf-chip-warning-border-color: #ffedd5;
434
+ --color-sf-chip-warning-text: #c2410c;
435
+ --color-sf-chip-warning-icon-color-hover: #c2410c;
436
+ --color-sf-chip-warning-icon-color-pressed: #c2410c;
437
+ --color-sf-chip-warning-bg-color-hover: #fff7ed;
438
+ --color-sf-chip-warning-border-color-hover: #fed7aa;
439
+ --color-sf-chip-warning-text-hover: #c2410c;
440
+ --color-sf-chip-warning-bg-color-pressed: #fed7aa;
441
+ --color-sf-chip-warning-icon-bg-color-pressed: #fed7aa;
442
+ --color-sf-chip-warning-icon-bg-color-hover: #fed7aa;
443
+ --color-sf-chip-warning-border-color-pressed: #fed7aa;
444
+ --color-sf-chip-warning-text-pressed: #9a3412;
445
+ --color-sf-chip-warning-bg-color-disabled: #fff7ed;
446
+ --color-sf-chip-warning-border-color-disabled: #ffedd5;
447
+ --color-sf-chip-warning-text-disabled: #fdba74;
448
+
449
+ //danger-chip
450
+ --color-sf-chip-danger-bg-color: #fef2f2;
451
+ --color-sf-chip-danger-icon-color: rgba(185, 28, 28, .5);
452
+ --color-sf-chip-danger-border-color: #fee2e2;
453
+ --color-sf-chip-danger-text: #b91c1c;
454
+ --color-sf-chip-danger-icon-color-hover: #b91c1c;
455
+ --color-sf-chip-danger-icon-color-pressed: #b91c1c;
456
+ --color-sf-chip-danger-bg-color-hover: #fef2f2;
457
+ --color-sf-chip-danger-border-color-hover: #fecaca;
458
+ --color-sf-chip-danger-text-hover: #b91c1c;
459
+ --color-sf-chip-danger-bg-color-pressed: #fecaca;
460
+ --color-sf-chip-danger-icon-bg-color-pressed: #fecaca;
461
+ --color-sf-chip-danger-icon-bg-color-hover: #fecaca;
462
+ --color-sf-chip-danger-border-color-pressed: #fecaca;
463
+ --color-sf-chip-danger-text-pressed: #991b1b;
464
+ --color-sf-chip-danger-bg-color-disabled: #fef2f2;
465
+ --color-sf-chip-danger-border-color-disabled: #fee2e2;
466
+ --color-sf-chip-danger-text-disabled: #fca5a5;
467
+
468
+ //Info-chip
469
+ --color-sf-chip-info-bg-color: #ecfeff;
470
+ --color-sf-chip-info-icon-color: rgba(14, 116, 144, .5);
471
+ --color-sf-chip-info-border-color: #cffafe;
472
+ --color-sf-chip-info-text: #0e7490;
473
+ --color-sf-chip-info-icon-color-hover: #0e7490;
474
+ --color-sf-chip-info-icon-color-pressed: #0e7490;
475
+ --color-sf-chip-info-bg-color-hover: #ecfeff;
476
+ --color-sf-chip-info-border-color-hover: #a5f3fc;
477
+ --color-sf-chip-info-text-hover: #0e7490;
478
+ --color-sf-chip-info-bg-color-pressed: #a5f3fc;
479
+ --color-sf-chip-info-icon-bg-color-pressed: #a5f3fc;
480
+ --color-sf-chip-info-icon-bg-color-hover: #a5f3fc;
481
+ --color-sf-chip-info-border-color-pressed: #a5f3fc;
482
+ --color-sf-chip-info-text-pressed: #155e75;
483
+ --color-sf-chip-info-bg-color-disabled: #ecfeff;
484
+ --color-sf-chip-info-border-color-disabled: #cffafe;
485
+ --color-sf-chip-info-text-disabled: #67e8f9;
486
+ }
487
+
488
+ // backgroundcolor
489
+ $content-bg-color: mapcolorvariable('content-bg-color') !default;
490
+ $content-bg-color-alt1: mapcolorvariable('content-bg-color-alt1') !default;
491
+ $content-bg-color-alt2: mapcolorvariable('content-bg-color-alt2') !default;
492
+ $content-bg-color-alt3: mapcolorvariable('content-bg-color-alt3') !default;
493
+ $content-bg-color-alt4: mapcolorvariable('content-bg-color-alt4') !default;
494
+ $content-bg-color-alt5: mapcolorvariable('content-bg-color-alt5') !default;
495
+ $content-bg-color-hover: mapcolorvariable('content-bg-color-hover') !default;
496
+ $content-bg-color-pressed: mapcolorvariable('content-bg-color-pressed') !default;
497
+ $content-bg-color-focus: mapcolorvariable('content-bg-color-focus') !default;
498
+ $content-bg-color-selected: mapcolorvariable('content-bg-color-selected') !default;
499
+ $content-bg-color-dragged: mapcolorvariable('content-bg-color-dragged') !default;
500
+ $content-bg-color-disabled: mapcolorvariable('content-bg-color-disabled') !default;
501
+ $flyout-bg-color: mapcolorvariable('flyout-bg-color') !default;
502
+ $flyout-bg-color-hover: mapcolorvariable('flyout-bg-color-hover') !default;
503
+ $flyout-bg-color-pressed: mapcolorvariable('flyout-bg-color-pressed') !default;
504
+ $flyout-bg-color-selected: mapcolorvariable('flyout-bg-color-selected') !default;
505
+ $flyout-bg-color-focus: mapcolorvariable('flyout-bg-color-focus') !default;
506
+ $flyout-bg-color-disabled: mapcolorvariable('flyout-bg-color-disabled') !default;
507
+ $overlay-bg: mapcolorvariable('overlay-bg-color');
508
+ $table-bg-color-hover: mapcolorvariable('table-bg-color-hover') !default;
509
+ $table-bg-color-pressed: mapcolorvariable('table-bg-color-pressed') !default;
510
+ $table-bg-color-selected: mapcolorvariable('table-bg-color-selected') !default;
511
+ $text-input-bg-color: mapcolorvariable('text-input-bg-color') !default;
512
+ $treeview-item-active-hover-bg: mapcolorvariable('treeview-item-active-hover-bg') !default;
513
+
514
+ // text-color
515
+ $content-text-color: mapcolorvariable('content-text-color') !default;
516
+ $content-text-color-alt1: mapcolorvariable('content-text-color-alt1') !default;
517
+ $content-text-color-alt2: mapcolorvariable('content-text-color-alt2') !default;
518
+ $content-text-color-alt3: mapcolorvariable('content-text-color-alt3') !default;
519
+ $content-text-color-alt4: mapcolorvariable('content-text-color-alt4') !default;
520
+ $content-text-color-hover: mapcolorvariable('content-text-color-hover') !default;
521
+ $content-text-color-pressed: mapcolorvariable('content-text-color-pressed') !default;
522
+ $content-text-color-focus: mapcolorvariable('content-text-color-focus') !default;
523
+ $content-text-color-selected: mapcolorvariable('content-text-color-selected') !default;
524
+ $content-text-color-dragged: mapcolorvariable('content-text-color-dragged') !default;
525
+ $content-text-color-disabled: mapcolorvariable('content-text-color-disabled') !default;
526
+ $placeholder-text-color: mapcolorvariable('placeholder-text-color') !default;
527
+ $flyout-text-color: mapcolorvariable('flyout-text-color') !default;
528
+ $flyout-text-color-hover: mapcolorvariable('flyout-text-color-hover') !default;
529
+ $flyout-text-color-pressed: mapcolorvariable('flyout-text-color-pressed') !default;
530
+ $flyout-text-color-selected: mapcolorvariable('flyout-text-color-selected') !default;
531
+ $flyout-text-color-focus: mapcolorvariable('flyout-text-color-focus') !default;
532
+ $flyout-text-color-disabled: mapcolorvariable('flyout-text-color-disabled') !default;
533
+ $table-text-color-hover: mapcolorvariable('table-text-color-hover') !default;
534
+ $table-text-color-pressed: mapcolorvariable('table-text-color-pressed') !default;
535
+ $table-text-color-selected: mapcolorvariable('table-text-color-selected') !default;
536
+
537
+ // icon-color
538
+ $icon-color: mapcolorvariable('icon-color') !default;
539
+ $icon-color-hover: mapcolorvariable('icon-color-hover') !default;
540
+ $icon-color-pressed: mapcolorvariable('icon-color-pressed') !default;
541
+ $icon-color-disabled: mapcolorvariable('icon-color-disabled') !default;
542
+
543
+ // border-color
544
+ $border-light: mapcolorvariable('border-light') !default;
545
+ $border: mapcolorvariable('border') !default;
546
+ $border-dark: mapcolorvariable('border-dark') !default;
547
+ $border-hover: mapcolorvariable('border-hover') !default;
548
+ $border-pressed: mapcolorvariable('border-pressed') !default;
549
+ $border-focus: mapcolorvariable('border-focus') !default;
550
+ $border-selected: mapcolorvariable('border-selected') !default;
551
+ $border-dragged:mapcolorvariable('border-dragged') !default;
552
+ $border-disabled: mapcolorvariable('border-disabled') !default;
553
+ $border-warning: mapcolorvariable('border-warning') !default;
554
+ $border-error: mapcolorvariable('border-error') !default;
555
+ $border-success: mapcolorvariable('border-success') !default;
556
+ $spreadsheet-gridline: mapcolorvariable('spreadsheet-gridline') !default;
557
+ $flyout-border: mapcolorvariable('flyout-border') !default;
558
+ $dialog-border:mapcolorvariable('dialog-border') !default;
559
+
560
+ //sf Variables
561
+ $primary: mapcolorvariable('primary') !default;
562
+ $secondary: mapcolorvariable('secondary') !default;
563
+ $primary-text-color: mapcolorvariable('primary-text-color') !default;
564
+ $primary-light: mapcolorvariable('primary-light') !default;
565
+ $primary-lighter: mapcolorvariable('primary-lighter') !default;
566
+ $primary-dark: mapcolorvariable('primary-dark') !default;
567
+ $primary-darker: mapcolorvariable('primary-darker') !default;
568
+ $success: mapcolorvariable('success') !default;
569
+ $info: mapcolorvariable('info') !default;
570
+ $warning: mapcolorvariable('warning') !default;
571
+ $danger: mapcolorvariable('danger') !default;
572
+ $success-light: mapcolorvariable('success-light') !default;
573
+ $info-light: mapcolorvariable('info-light') !default;
574
+ $warning-light: mapcolorvariable('warning-light') !default;
575
+ $danger-light: mapcolorvariable('danger-light') !default;
576
+ $success-dark: mapcolorvariable('success-dark') !default;
577
+ $info-dark: mapcolorvariable('info-dark') !default;
578
+ $warning-dark: mapcolorvariable('warning-dark') !default;
579
+ $danger-dark: mapcolorvariable('danger-dark') !default;
580
+ $success-light-alt: mapcolorvariable('success-light-alt') !default;
581
+ $info-light-alt: mapcolorvariable('success-light-alt') !default;
582
+ $warning-light-alt: mapcolorvariable('warning-light-alt') !default;
583
+ $danger-light-alt: mapcolorvariable('danger-light-alt') !default;
584
+ $success-lighter: mapcolorvariable('success-lighter') !default;
585
+ $info-lighter: mapcolorvariable('info-lighter') !default;
586
+ $warning-lighter: mapcolorvariable('warning-lighter') !default;
587
+ $danger-lighter: mapcolorvariable('danger-lighter') !default;
588
+
589
+ // Primary-button
590
+ $primary-bg-color: mapcolorvariable('primary-bg-color') !default;
591
+ $primary-border-color: mapcolorvariable('primary-border-color') !default;
592
+ $primary-text: mapcolorvariable('primary-text') !default;
593
+ $primary-bg-color-hover: mapcolorvariable('primary-bg-color-hover') !default;
594
+ $primary-border-color-hover: mapcolorvariable('primary-border-color-hover') !default;
595
+ $primary-text-hover: mapcolorvariable('primary-text-hover') !default;
596
+ $primary-bg-color-pressed: mapcolorvariable('primary-bg-color-pressed') !default;
597
+ $primary-border-color-pressed: mapcolorvariable('primary-border-color-pressed') !default;
598
+ $primary-text-pressed: mapcolorvariable('primary-text-pressed') !default;
599
+ $primary-bg-color-focus: mapcolorvariable('primary-bg-color-focus') !default;
600
+ $primary-border-color-focus: mapcolorvariable('primary-border-color-focus') !default;
601
+ $primary-text-focus: mapcolorvariable('primary-text-focus') !default;
602
+ $primary-bg-color-disabled: mapcolorvariable('primary-bg-color-disabled') !default;
603
+ $primary-border-color-disabled: mapcolorvariable('primary-border-color-disabled') !default;
604
+ $primary-text-disabled: mapcolorvariable('primary-text-disabled') !default;
605
+
606
+ // Secondary-button
607
+ $secondary-bg-color: mapcolorvariable('secondary-bg-color') !default;
608
+ $secondary-border-color: mapcolorvariable('secondary-border-color') !default;
609
+ $secondary-text-color: mapcolorvariable('secondary-text-color') !default;
610
+ $secondary-bg-color-hover: mapcolorvariable('secondary-bg-color-hover') !default;
611
+ $secondary-border-color-hover: mapcolorvariable('secondary-border-color-hover') !default;
612
+ $secondary-text-color-hover: mapcolorvariable('secondary-text-color-hover') !default;
613
+ $secondary-bg-color-pressed: mapcolorvariable('secondary-bg-color-pressed') !default;
614
+ $secondary-border-color-pressed: mapcolorvariable('secondary-border-color-pressed') !default;
615
+ $secondary-text-color-pressed: mapcolorvariable('secondary-text-color-pressed') !default;
616
+ $secondary-bg-color-focus: mapcolorvariable('secondary-bg-color-focus') !default;
617
+ $secondary-border-color-focus: mapcolorvariable('secondary-border-color-focus') !default;
618
+ $secondary-text-color-focus: mapcolorvariable('secondary-text-color-focus') !default;
619
+ $secondary-bg-color-disabled: mapcolorvariable('secondary-bg-color-disabled') !default;
620
+ $secondary-border-color-disabled: mapcolorvariable('secondary-border-color-disabled') !default;
621
+ $secondary-text-color-disabled: mapcolorvariable('secondary-text-color-disabled') !default;
622
+
623
+ // Success-button
624
+ $success-bg-color: mapcolorvariable('success-bg-color') !default;
625
+ $success-border-color: mapcolorvariable('success-border-color') !default;
626
+ $success-text: mapcolorvariable('success-text') !default;
627
+ $success-bg-color-hover: mapcolorvariable('success-bg-color-hover') !default;
628
+ $success-border-color-hover: mapcolorvariable('success-border-color-hover') !default;
629
+ $success-text-hover: mapcolorvariable('success-text-hover') !default;
630
+ $success-bg-color-pressed: mapcolorvariable('success-bg-color-pressed') !default;
631
+ $success-border-color-pressed: mapcolorvariable('success-border-color-pressed') !default;
632
+ $success-text-pressed: mapcolorvariable('success-text-pressed') !default;
633
+ $success-bg-color-focus: mapcolorvariable('success-bg-color-focus') !default;
634
+ $success-border-color-focus: mapcolorvariable('success-border-color-focus') !default;
635
+ $success-text-focus: mapcolorvariable('success-text-focus') !default;
636
+ $success-bg-color-disabled: mapcolorvariable('success-bg-color-disabled') !default;
637
+ $success-border-color-disabled: mapcolorvariable('success-border-color-disabled') !default;
638
+ $success-text-disabled: mapcolorvariable('success-text-disabled') !default;
639
+
640
+ // Warning-button
641
+ $warning-bg-color: mapcolorvariable('warning-bg-color') !default;
642
+ $warning-border-color: mapcolorvariable('warning-border-color') !default;
643
+ $warning-text: mapcolorvariable('warning-text') !default;
644
+ $warning-bg-color-hover: mapcolorvariable('warning-bg-color-hover') !default;
645
+ $warning-border-color-hover: mapcolorvariable('warning-border-color-hover') !default;
646
+ $warning-text-hover: mapcolorvariable('warning-text-hover') !default;
647
+ $warning-bg-color-pressed: mapcolorvariable('warning-bg-color-pressed') !default;
648
+ $warning-border-color-pressed: mapcolorvariable('warning-border-color-pressed') !default;
649
+ $warning-text-pressed: mapcolorvariable('warning-text-pressed') !default;
650
+ $warning-bg-color-focus: mapcolorvariable('warning-bg-color-focus') !default;
651
+ $warning-border-color-focus: mapcolorvariable('warning-border-color-focus') !default;
652
+ $warning-text-focus: mapcolorvariable('warning-text-focus') !default;
653
+ $warning-bg-color-disabled: mapcolorvariable('warning-bg-color-disabled') !default;
654
+ $warning-border-color-disabled: mapcolorvariable('warning-border-color-disabled') !default;
655
+ $warning-text-disabled: mapcolorvariable('warning-text-disabled') !default;
656
+
657
+ // Info-button
658
+ $info-bg-color: mapcolorvariable('info-bg-color') !default;
659
+ $info-border-color: mapcolorvariable('info-border-color') !default;
660
+ $info-text: mapcolorvariable('info-text') !default;
661
+ $info-bg-color-hover: mapcolorvariable('info-bg-color-hover') !default;
662
+ $info-border-color-hover: mapcolorvariable('info-border-color-hover') !default;
663
+ $info-text-hover: mapcolorvariable('info-text-hover') !default;
664
+ $info-bg-color-pressed: mapcolorvariable('info-bg-color-pressed') !default;
665
+ $info-border-color-pressed: mapcolorvariable('info-border-color-pressed') !default;
666
+ $info-text-pressed: mapcolorvariable('info-text-pressed') !default;
667
+ $info-bg-color-focus: mapcolorvariable('info-bg-color-focus') !default;
668
+ $info-border-color-focus: mapcolorvariable('info-border-color-focus') !default;
669
+ $info-text-focus: mapcolorvariable('info-text-focus') !default;
670
+ $info-bg-color-disabled: mapcolorvariable('info-bg-color-disabled') !default;
671
+ $info-border-color-disabled: mapcolorvariable('info-border-color-disabled') !default;
672
+ $info-text-disabled: mapcolorvariable('info-text-disabled') !default;
673
+
674
+ // danger-button
675
+ $danger-bg-color: mapcolorvariable('danger-bg-color') !default;
676
+ $danger-border-color: mapcolorvariable('danger-border-color') !default;
677
+ $danger-text: mapcolorvariable('danger-text') !default;
678
+ $danger-bg-color-hover: mapcolorvariable('danger-bg-color-hover') !default;
679
+ $danger-border-color-hover: mapcolorvariable('danger-border-color-hover') !default;
680
+ $danger-text-hover: mapcolorvariable('danger-text-hover') !default;
681
+ $danger-bg-color-pressed: mapcolorvariable('danger-bg-color-pressed') !default;
682
+ $danger-border-color-pressed: mapcolorvariable('danger-border-color-pressed') !default;
683
+ $danger-text-pressed: mapcolorvariable('danger-text-pressed') !default;
684
+ $danger-bg-color-focus: mapcolorvariable('danger-bg-color-focus') !default;
685
+ $danger-border-color-focus: mapcolorvariable('danger-border-color-focus') !default;
686
+ $danger-text-focus: mapcolorvariable('danger-text-focus') !default;
687
+ $danger-bg-color-disabled: mapcolorvariable('danger-bg-color-disabled') !default;
688
+ $danger-border-color-disabled: mapcolorvariable('danger-border-color-disabled') !default;
689
+ $danger-text-disabled: mapcolorvariable('danger-text-disabled') !default;
690
+
691
+ //Outline button
692
+ $primary-outline: mapcolorvariable('primary-outline') !default;
693
+ $secondary-outline: mapcolorvariable('secondary-outline') !default;
694
+ $warning-outline: mapcolorvariable('warning-outline') !default;
695
+ $danger-outline: mapcolorvariable('danger-outline') !default;
696
+ $success-outline: mapcolorvariable('success-outline') !default;
697
+ $info-outline: mapcolorvariable('info-outline') !default;
698
+
699
+ // Tooltip
700
+ $tooltip-bg-color: mapcolorvariable('tooltip-bg-color') !default;
701
+ $tooltip-border: mapcolorvariable('tooltip-border') !default;
702
+ $tooltip-text-color: mapcolorvariable('tooltip-text-color') !default;
703
+
704
+ //appbar
705
+ //Light
706
+ $appbar-bg-color-alt1: mapcolorvariable('appbar-bg-color-alt1') !default;
707
+ $appbar-color-alt1:mapcolorvariable('appbar-color-alt1') !default;
708
+ $appbar-border-color-alt1: mapcolorvariable('appbar-border-color-alt1') !default;
709
+ $appbar-hover-bg-color-alt1: mapcolorvariable('appbar-hover-bg-color-alt1') !default;
710
+
711
+ //dark
712
+ $appbar-bg-color-alt2: mapcolorvariable('appbar-bg-color-alt2') !default;
713
+ $appbar-color-alt2: mapcolorvariable('appbar-color-alt2') !default;
714
+ $appbar-border-color-alt2: mapcolorvariable('appbar-border-color-alt2') !default;
715
+ $appbar-hover-bg-color-alt2: mapcolorvariable('appbar-hover-bg-color-alt2') !default;
716
+
717
+ //diagram Palette color
718
+ $diagram-palette-background: mapcolorvariable('diagram-palette-background') !default;
719
+ $diagram-palette-hover-background: mapcolorvariable('diagram-palette-hover-background') !default;
720
+ $diagram-palette-selected-background: mapcolorvariable('diagram-palette-selected-background') !default;
721
+
722
+ //rating
723
+ $rating-selected-color:mapcolorvariable('rating-selected-color') !default;
724
+ $rating-unrated-color: mapcolorvariable('rating-unrated-color') !default;
725
+ $rating-selected-disabled-color: mapcolorvariable('rating-selected-disabled-color') !default;
726
+ $rating-unrated-disabled-color: mapcolorvariable('rating-unrated-disabled-color') !default;
727
+ $rating-selected-hover-color: mapcolorvariable('rating-selected-hover-color') !default;
728
+ $rating-unrated-hover-color: mapcolorvariable('rating-unrated-hover-color') !default;
729
+ $rating-pressed-color: mapcolorvariable('rating-pressed-color') !default;
730
+
731
+ //Message component
732
+
733
+ //Message default
734
+ $msg-color: mapcolorvariable('msg-color') !default;
735
+ $msg-bg-color: mapcolorvariable('msg-bg-color') !default;
736
+ $msg-border-color:mapcolorvariable('msg-border-color') !default;
737
+ $msg-color-alt1: mapcolorvariable('msg-color-alt1') !default;
738
+ $msg-bg-color-alt1: mapcolorvariable('msg-bg-color-alt1') !default;
739
+ $msg-border-color-alt1: mapcolorvariable('msg-border-color-alt1') !default;
740
+ $msg-color-alt2: mapcolorvariable('msg-color-alt2') !default;
741
+ $msg-bg-color-alt2: mapcolorvariable('msg-bg-color-alt2') !default;
742
+ $msg-border-color-alt2: mapcolorvariable('msg-border-color-alt2') !default;
743
+ $msg-icon-color: mapcolorvariable('msg-icon-color') !default;
744
+ $msg-icon-color-alt1: mapcolorvariable('msg-icon-color-alt1') !default;
745
+ $msg-icon-color-alt2: mapcolorvariable('msg-icon-color-alt2') !default;
746
+ $msg-close-icon-color: mapcolorvariable('msg-close-icon-color') !default;
747
+ $msg-close-icon-color-alt1: mapcolorvariable('msg-close-icon-color-alt21') !default;
748
+ $msg-close-icon-color-alt2: mapcolorvariable('msg-close-icon-color-alt2') !default;
749
+
750
+ //Message success
751
+ $msg-success-color: mapcolorvariable('msg-success-color') !default;
752
+ $msg-success-bg-color: mapcolorvariable('msg-success-bg-color') !default;
753
+ $msg-success-border-color: mapcolorvariable('msg-success-border-color') !default;
754
+ $msg-success-color-alt1: mapcolorvariable('msg-success-color-alt1') !default;
755
+ $msg-success-bg-color-alt1: mapcolorvariable('msg-success-bg-color-alt1') !default;
756
+ $msg-success-border-color-alt1: mapcolorvariable('msg-success-border-color-alt1') !default;
757
+ $msg-success-color-alt2: mapcolorvariable('msg-success-color-alt2') !default;
758
+ $msg-success-bg-color-alt2: mapcolorvariable('msg-success-bg-color-alt2') !default;
759
+ $msg-success-border-color-alt2: mapcolorvariable('msg-success-border-color-alt2') !default;
760
+ $msg-success-icon-color: mapcolorvariable('msg-success-icon-color') !default;
761
+ $msg-success-icon-color-alt1:mapcolorvariable('msg-success-icon-color-alt1') !default;
762
+ $msg-success-icon-color-alt2: mapcolorvariable('msg-success-icon-color-alt2') !default;
763
+ $msg-success-close-icon-color: mapcolorvariable('msg-success-close-icon-color') !default;
764
+ $msg-success-close-icon-color-alt1: mapcolorvariable('msg-success-close-icon-color-alt1') !default;
765
+ $msg-success-close-icon-color-alt2: mapcolorvariable('msg-success-close-icon-color-alt2') !default;
766
+
767
+ //Message danger
768
+ $msg-danger-color: mapcolorvariable('msg-danger-color') !default;
769
+ $msg-danger-bg-color: mapcolorvariable('msg-danger-bg-color') !default;
770
+ $msg-danger-border-color: mapcolorvariable('msg-danger-border-color') !default;
771
+ $msg-danger-color-alt1: mapcolorvariable('msg-danger-color-alt1') !default;
772
+ $msg-danger-bg-color-alt1: mapcolorvariable('msg-danger-bg-color-alt1') !default;
773
+ $msg-danger-border-color-alt1: mapcolorvariable('msg-danger-border-color-alt1') !default;
774
+ $msg-danger-color-alt2: mapcolorvariable('msg-danger-color-alt2') !default;
775
+ $msg-danger-bg-color-alt2: mapcolorvariable('msg-danger-bg-color-alt2') !default;
776
+ $msg-danger-border-color-alt2: mapcolorvariable('msg-danger-border-color-alt2') !default;
777
+ $msg-danger-icon-color: mapcolorvariable('msg-danger-icon-color') !default;
778
+ $msg-danger-icon-color-alt1: mapcolorvariable('msg-danger-icon-color-alt1') !default;
779
+ $msg-danger-icon-color-alt2: mapcolorvariable('msg-danger-icon-color-alt2') !default;
780
+ $msg-danger-close-icon-color: mapcolorvariable('msg-danger-close-icon-color') !default;
781
+ $msg-danger-close-icon-color-alt1: mapcolorvariable('msg-danger-close-icon-color-alt1') !default;
782
+ $msg-danger-close-icon-color-alt2: mapcolorvariable('msg-danger-close-icon-color-alt2') !default;
783
+
784
+ //Message Info
785
+ $msg-info-color: mapcolorvariable('msg-info-color') !default;
786
+ $msg-info-bg-color: mapcolorvariable('msg-info-bg-color') !default;
787
+ $msg-info-border-color: mapcolorvariable('msg-info-border-color') !default;
788
+ $msg-info-color-alt1: mapcolorvariable('msg-info-color-alt1') !default;
789
+ $msg-info-bg-color-alt1: mapcolorvariable('msg-info-bg-color-alt1') !default;
790
+ $msg-info-border-color-alt1: mapcolorvariable('msg-info-border-color-alt1') !default;
791
+ $msg-info-color-alt2: mapcolorvariable('msg-info-color-alt2') !default;
792
+ $msg-info-bg-color-alt2: mapcolorvariable('msg-info-bg-color-alt2') !default;
793
+ $msg-info-border-color-alt2: mapcolorvariable('msg-info-border-color-alt2') !default;
794
+ $msg-info-icon-color: mapcolorvariable('msg-info-icon-color') !default;
795
+ $msg-info-icon-color-alt1: mapcolorvariable('msg-info-icon-color-alt1') !default;
796
+ $msg-info-icon-color-alt2:mapcolorvariable('msg-info-icon-color-alt2') !default;
797
+ $msg-info-close-icon-color: mapcolorvariable('msg-info-close-icon-color') !default;
798
+ $msg-info-close-icon-color-alt1: mapcolorvariable('msg-info-close-icon-color-alt1') !default;
799
+ $msg-info-close-icon-color-alt2: mapcolorvariable('msg-info-close-icon-color-alt2') !default;
800
+
801
+ //Message Warning
802
+ $msg-warning-color: mapcolorvariable('msg-warning-color') !default;
803
+ $msg-warning-bg-color: mapcolorvariable('msg-warning-bg-color') !default;
804
+ $msg-warning-border-color: mapcolorvariable('msg-warning-border-color') !default;
805
+ $msg-warning-color-alt1: mapcolorvariable('msg-warning-color-alt1') !default;
806
+ $msg-warning-bg-color-alt1: mapcolorvariable('msg-warning-bg-color-alt1') !default;
807
+ $msg-warning-border-color-alt1: mapcolorvariable('msg-warning-border-color-alt1') !default;
808
+ $msg-warning-color-alt2: mapcolorvariable('msg-warning-color-alt2') !default;
809
+ $msg-warning-bg-color-alt2: mapcolorvariable('msg-warning-bg-color-alt2') !default;
810
+ $msg-warning-border-color-alt2: mapcolorvariable('msg-warning-border-color-alt2') !default;
811
+ $msg-warning-icon-color: mapcolorvariable('msg-warning-icon-color') !default;
812
+ $msg-warning-icon-color-alt1: mapcolorvariable('msg-warning-icon-color-alt1') !default;
813
+ $msg-warning-icon-color-alt2: mapcolorvariable('msg-warning-icon-color-alt2') !default;
814
+ $msg-warning-close-icon-color: mapcolorvariable('msg-warning-close-icon-color') !default;
815
+ $msg-warning-close-icon-color-alt1: mapcolorvariable('msg-warning-close-icon-color-alt1') !default;
816
+ $msg-warning-close-icon-color-alt2: mapcolorvariable('msg-warning-close-icon-color-alt2') !default;
817
+
818
+
819
+ //Primary-chip
820
+ $chip-primary-bg-color: mapcolorvariable('chip-primary-bg-color') !default;
821
+ $chip-primary-icon-color: mapcolorvariable('chip-primary-icon-color') !default;
822
+ $chip-primary-border-color: mapcolorvariable('chip-primary-border-color') !default;
823
+ $chip-primary-text: mapcolorvariable('chip-primary-text') !default;
824
+ $chip-primary-icon-color-hover: mapcolorvariable('chip-primary-icon-color-hover') !default;
825
+ $chip-primary-icon-color-pressed: mapcolorvariable('chip-primary-icon-color-pressed') !default;
826
+ $chip-primary-bg-color-hover: mapcolorvariable('chip-primary-bg-color-hover') !default;
827
+ $chip-primary-border-color-hover: mapcolorvariable('chip-primary-border-color-hover') !default;
828
+ $chip-primary-text-hover: mapcolorvariable('chip-primary-text-hover') !default;
829
+ $chip-primary-bg-color-pressed: mapcolorvariable('chip-primary-bg-color-pressed') !default;
830
+ $chip-primary-icon-bg-color-pressed: mapcolorvariable('chip-primary-icon-bg-color-pressed') !default;
831
+ $chip-primary-icon-bg-color-hover: mapcolorvariable('chip-primary-icon-bg-color-hover') !default;
832
+ $chip-primary-border-color-pressed: mapcolorvariable('chip-primary-border-color-pressed') !default;
833
+ $chip-primary-text-pressed: mapcolorvariable('chip-primary-text-pressed') !default;
834
+ $chip-primary-bg-color-disabled: mapcolorvariable('chip-primary-bg-color-disabled') !default;
835
+ $chip-primary-border-color-disabled: mapcolorvariable('chip-primary-border-color-disabled') !default;
836
+ $chip-primary-text-disabled: mapcolorvariable('chip-primary-text-disabled') !default;
837
+
838
+
839
+ //Secondary-chip
840
+ $chip-secondary-bg-color: mapcolorvariable('chip-secondary-bg-color') !default;
841
+ $chip-secondary-icon-color: mapcolorvariable('chip-secondary-icon-color') !default;
842
+ $chip-secondary-border-color: mapcolorvariable('chip-secondary-border-color') !default;
843
+ $chip-secondary-text: mapcolorvariable('chip-secondary-text') !default;
844
+ $chip-secondary-icon-color-hover: mapcolorvariable('chip-secondary-icon-color-hover') !default;
845
+ $chip-secondary-icon-color-pressed: mapcolorvariable('chip-secondary-icon-color-pressed') !default;
846
+ $chip-secondary-bg-color-hover: mapcolorvariable('chip-secondary-bg-color-hover') !default;
847
+ $chip-secondary-border-color-hover: mapcolorvariable('chip-secondary-border-color-hover') !default;
848
+ $chip-secondary-text-hover: mapcolorvariable('chip-secondary-text-hover') !default;
849
+ $chip-secondary-bg-color-pressed: mapcolorvariable('chip-secondary-bg-color-pressed') !default;
850
+ $chip-secondary-icon-bg-color-pressed: mapcolorvariable('chip-secondary-icon-bg-color-pressed') !default;
851
+ $chip-secondary-icon-bg-color-hover: mapcolorvariable('chip-secondary-icon-bg-color-hover') !default;
852
+ $chip-secondary-border-color-pressed: mapcolorvariable('chip-secondary-border-color-pressed') !default;
853
+ $chip-secondary-text-pressed: mapcolorvariable('chip-secondary-text-pressed') !default;
854
+ $chip-secondary-bg-color-disabled: mapcolorvariable('chip-secondary-bg-color-disabled') !default;
855
+ $chip-secondary-border-color-disabled: mapcolorvariable('chip-secondary-border-color-disabled') !default;
856
+ $chip-secondary-text-disabled: mapcolorvariable('chip-secondary-text-disabled') !default;
857
+
858
+ //Success-chip
859
+ $chip-success-bg-color: mapcolorvariable('chip-success-bg-color') !default;
860
+ $chip-success-icon-color: mapcolorvariable('chip-success-icon-color') !default;
861
+ $chip-success-border-color: mapcolorvariable('chip-success-border-color') !default;
862
+ $chip-success-text: mapcolorvariable('chip-success-text') !default;
863
+ $chip-success-icon-color-hover: mapcolorvariable('chip-success-icon-color-hover') !default;
864
+ $chip-success-icon-color-pressed: mapcolorvariable('chip-success-icon-color-pressed') !default;
865
+ $chip-success-bg-color-hover: mapcolorvariable('chip-success-bg-color-hover') !default;
866
+ $chip-success-border-color-hover: mapcolorvariable('chip-success-border-color-hover') !default;
867
+ $chip-success-text-hover: mapcolorvariable('chip-success-text-hover') !default;
868
+ $chip-success-bg-color-pressed: mapcolorvariable('chip-success-bg-color-pressed') !default;
869
+ $chip-success-icon-bg-color-pressed: mapcolorvariable('chip-success-icon-bg-color-pressed') !default;
870
+ $chip-success-icon-bg-color-hover: mapcolorvariable('chip-success-icon-bg-color-hover') !default;
871
+ $chip-success-border-color-pressed: mapcolorvariable('chip-success-border-color-pressed') !default;
872
+ $chip-success-text-pressed: mapcolorvariable('chip-success-text-pressed') !default;
873
+ $chip-success-bg-color-disabled: mapcolorvariable('chip-success-bg-color-disabled') !default;
874
+ $chip-success-border-color-disabled: mapcolorvariable('chip-success-border-color-disabled') !default;
875
+ $chip-success-text-disabled: mapcolorvariable('chip-success-text-disabled') !default;
876
+
877
+ //Warning-chip
878
+ $chip-warning-bg-color: mapcolorvariable('chip-warning-bg-color') !default;
879
+ $chip-warning-icon-color: mapcolorvariable('chip-warning-icon-color') !default;
880
+ $chip-warning-border-color: mapcolorvariable('chip-warning-border-color') !default;
881
+ $chip-warning-text: mapcolorvariable('chip-warning-text') !default;
882
+ $chip-warning-icon-color-hover: mapcolorvariable('chip-warning-icon-color-hover') !default;
883
+ $chip-warning-icon-color-pressed: mapcolorvariable('chip-warning-icon-color-pressed') !default;
884
+ $chip-warning-bg-color-hover: mapcolorvariable('chip-warning-bg-color-hover') !default;
885
+ $chip-warning-border-color-hover: mapcolorvariable('chip-warning-border-color-hover') !default;
886
+ $chip-warning-text-hover: mapcolorvariable('chip-warning-text-hover') !default;
887
+ $chip-warning-bg-color-pressed: mapcolorvariable('chip-warning-bg-color-pressed') !default;
888
+ $chip-warning-icon-bg-color-pressed: mapcolorvariable('chip-warning-icon-bg-color-pressed') !default;
889
+ $chip-warning-icon-bg-color-hover: mapcolorvariable('chip-warning-icon-bg-color-hover') !default;
890
+ $chip-warning-border-color-pressed: mapcolorvariable('chip-warning-border-color-pressed') !default;
891
+ $chip-warning-text-pressed: mapcolorvariable('chip-warning-text-pressed') !default;
892
+ $chip-warning-bg-color-disabled: mapcolorvariable('chip-warning-bg-color-disabled') !default;
893
+ $chip-warning-border-color-disabled: mapcolorvariable('chip-warning-border-color-disabled') !default;
894
+ $chip-warning-text-disabled: mapcolorvariable('chip-warning-text-disabled') !default;
895
+
896
+
897
+ //danger-chip
898
+ $chip-danger-bg-color: mapcolorvariable('chip-danger-bg-color') !default;
899
+ $chip-danger-icon-color: mapcolorvariable('chip-danger-icon-color') !default;
900
+ $chip-danger-border-color: mapcolorvariable('chip-danger-border-color') !default;
901
+ $chip-danger-text: mapcolorvariable('chip-danger-text') !default;
902
+ $chip-danger-icon-color-hover: mapcolorvariable('chip-danger-icon-color-hover') !default;
903
+ $chip-danger-icon-color-pressed: mapcolorvariable('chip-danger-icon-color-pressed') !default;
904
+ $chip-danger-bg-color-hover: mapcolorvariable('chip-danger-bg-color-hover') !default;
905
+ $chip-danger-border-color-hover: mapcolorvariable('chip-danger-border-color-hover') !default;
906
+ $chip-danger-text-hover: mapcolorvariable('chip-danger-text-hover') !default;
907
+ $chip-danger-bg-color-pressed: mapcolorvariable('chip-danger-bg-color-pressed') !default;
908
+ $chip-danger-icon-bg-color-pressed: mapcolorvariable('chip-danger-icon-bg-color-pressed') !default;
909
+ $chip-danger-icon-bg-color-hover: mapcolorvariable('chip-danger-icon-bg-color-hover') !default;
910
+ $chip-danger-border-color-pressed: mapcolorvariable('chip-danger-border-color-pressed') !default;
911
+ $chip-danger-text-pressed: mapcolorvariable('chip-danger-text-pressed') !default;
912
+ $chip-danger-bg-color-disabled: mapcolorvariable('chip-danger-bg-color-disabled') !default;
913
+ $chip-danger-border-color-disabled: mapcolorvariable('chip-danger-border-color-disabled') !default;
914
+ $chip-danger-text-disabled: mapcolorvariable('chip-danger-text-disabled') !default;
915
+
916
+ //Info-chip
917
+ $chip-info-bg-color: mapcolorvariable('chip-info-bg-color') !default;
918
+ $chip-info-icon-color: mapcolorvariable('chip-info-icon-color') !default;
919
+ $chip-info-border-color: mapcolorvariable('chip-info-border-color') !default;
920
+ $chip-info-text: mapcolorvariable('chip-info-text') !default;
921
+ $chip-info-icon-color-hover: mapcolorvariable('chip-info-icon-color-hover') !default;
922
+ $chip-info-icon-color-pressed: mapcolorvariable('chip-info-icon-color-pressed') !default;
923
+ $chip-info-bg-color-hover: mapcolorvariable('chip-info-bg-color-hover') !default;
924
+ $chip-info-border-color-hover: mapcolorvariable('chip-info-border-color-hover') !default;
925
+ $chip-info-text-hover: mapcolorvariable('chip-info-text-hover') !default;
926
+ $chip-info-bg-color-pressed: mapcolorvariable('chip-info-bg-color-pressed') !default;
927
+ $chip-info-icon-bg-color-pressed: mapcolorvariable('chip-info-icon-bg-color-pressed') !default;
928
+ $chip-info-icon-bg-color-hover: mapcolorvariable('chip-info-icon-bg-color-hover') !default;
929
+ $chip-info-border-color-pressed: mapcolorvariable('chip-info-border-color-pressed') !default;
930
+ $chip-info-text-pressed: mapcolorvariable('chip-info-text-pressed') !default;
931
+ $chip-info-bg-color-disabled: mapcolorvariable('chip-info-bg-color-disabled') !default;
932
+ $chip-info-border-color-disabled: mapcolorvariable('chip-info-border-color-disabled') !default;
933
+ $chip-info-text-disabled: mapcolorvariable('chip-info-text-disabled') !default;
934
+
935
+ //badge
936
+ $badge-primary-bg-color-darken: mapcolorvariable('badge-primary-bg-color-darken') !default;
937
+ $badge-secondary-bg-color-darken: mapcolorvariable('badge-secondary-bg-color-darken') !default;
938
+ $badge-success-bg-color-darken: mapcolorvariable('badge-success-bg-color-darken') !default;
939
+ $badge-danger-bg-color-darken: mapcolorvariable('badge-danger-bg-color-darken') !default;
940
+ $badge-warning-bg-color-darken: mapcolorvariable('badge-warning-bg-color-darken') !default;
941
+ $badge-info-bg-color-darken: mapcolorvariable('badge-info-bg-color-darken') !default;
942
+ $badge-light-bg-color-darken: mapcolorvariable('badge-light-bg-color-darken') !default;
943
+ $badge-dark-bg-color-darken: mapcolorvariable('badge-dark-bg-color-darken') !default;
944
+
945
+ //tab
946
+ $tab-border: mapcolorvariable('tab-border') !default;
947
+
948
+ // close-icon-color
949
+ $close-icon-color: mapcolorvariable('close-icon-color') !default;
950
+ $close-icon-color-hover: mapcolorvariable('close-icon-color-hover') !default;
951
+ $close-icon-color-pressed: mapcolorvariable('close-icon-color-pressed') !default;
952
+ $close-icon-color-disabled: mapcolorvariable('close-icon-color-disabled') !default;
953
+
954
+ //badge
955
+ $badge-light-bg-color: mapcolorvariable('badge-light-bg-color') !default;
956
+ $badge-light-border-color: mapcolorvariable('badge-light-border-color') !default;
957
+ $badge-light-text-color: mapcolorvariable('badge-light-text-color') !default;
958
+ $badge-dark-bg-color: mapcolorvariable('badge-dark-bg-color') !default;
959
+ $badge-dark-border-color: mapcolorvariable('badge-dark-border-color') !default;
960
+ $badge-dark-text-color: mapcolorvariable('badge-dark-text-color') !default;
961
+
962
+ //breadcrumb
963
+ $breadcrumb-item-hover-color: mapcolorvariable('breadcrumb-item-hover-color') !default;
964
+ $breadcrumb-item-active-color: mapcolorvariable('breadcrumb-item-active-color') !default;
965
+ $breadcrumb-item-focus-border-color: mapcolorvariable('breadcrumb-item-focus-border-color') !default;
966
+
967
+ //stepper
968
+ $stepper: mapcolorvariable('stepper') !default;
969
+ $shadow-color: mapcolorvariable('shadow-color') !default;
970
+ $shadow-color1: mapcolorvariable('shadow-color1') !default;
971
+
972
+ $primary-shadow: mapcolorvariable('primary-shadow') !default;
973
+ $secondary-shadow: mapcolorvariable('secondary-shadow') !default;
974
+ $success-shadow: mapcolorvariable('success-shadow') !default;
975
+ $danger-shadow: mapcolorvariable('danger-shadow') !default;
976
+ $info-shadow: mapcolorvariable('info-shadow') !default;
977
+ $warning-shadow: mapcolorvariable('warning-shadow') !default;
978
+
979
+ // black
980
+ $black: mapcolorvariable('black') !default;
981
+
982
+ // White
983
+ $white: mapcolorvariable('white') !default;
984
+
985
+ // Transparent
986
+ $transparent: mapcolorvariable('transparent') !default;
987
+
988
+ // scss-docs-start gray-color-variables
989
+ $gray-50: #f9fafb !default;
990
+ $gray-100: #f3f4f6 !default;
991
+ $gray-200: #e5e7eb !default;
992
+ $gray-300: #d1d5db !default;
993
+ $gray-400: #9ca3af !default;
994
+ $gray-500: #6b7280 !default;
995
+ $gray-600: #4b5563 !default;
996
+ $gray-700: #374151 !default;
997
+ $gray-800: #1f2937 !default;
998
+ $gray-900: #111827 !default;
999
+ $gray-950: #030712 !default;
1000
+
1001
+ // scss-docs-start color-variables
1002
+ $blue: #0d6efd !default;
1003
+ $indigo: #6610f2 !default;
1004
+ $purple: #6f42c1 !default;
1005
+ $pink: #d63384 !default;
1006
+ $red: #dc3545 !default;
1007
+ $orange: #fd7e14 !default;
1008
+ $yellow: #ffc107 !default;
1009
+ $green: #198754 !default;
1010
+ $teal: #20c997 !default;
1011
+ $cyan: #0dcaf0 !default;
1012
+
1013
+ $primary: $primary !default;
1014
+ $primary-dark: $primary-dark !default;
1015
+ $primary-darker: $primary-darker !default;
1016
+ $secondary: $secondary !default;
1017
+ $success: $success !default;
1018
+ $info: $info !default;
1019
+ $warning: $warning !default;
1020
+ $danger: $danger !default;
1021
+ $success-light: $success-light !default;
1022
+ $info-light: $info-light !default;
1023
+ $warning-light: $warning-light !default;
1024
+ $danger-light: $danger-light !default;
1025
+ $primary-text-color: $primary-text-color !default;
1026
+ $primary-light: $primary-light !default;
1027
+ $primary-lighter: $primary-lighter !default;
1028
+ $success-dark: $success-dark !default;
1029
+ $info-dark: $info-dark !default;
1030
+ $warning-dark: $warning-dark !default;
1031
+ $danger-dark: $danger-dark !default;
1032
+ $success-light-alt: $success-light-alt !default;
1033
+ $info-light-alt: $info-light-alt !default;
1034
+ $warning-light-alt: $warning-light-alt !default;
1035
+ $danger-light-alt: $danger-light-alt !default;
1036
+
1037
+ // backgroundcolor
1038
+ $content-bg-color: $content-bg-color !default;
1039
+ $content-bg-color-alt1: $content-bg-color-alt1 !default;
1040
+ $content-bg-color-alt2: $content-bg-color-alt2 !default;
1041
+ $content-bg-color-alt3: $content-bg-color-alt3 !default;
1042
+ $content-bg-color-alt4: $content-bg-color-alt4 !default;
1043
+ $content-bg-color-alt5: $content-bg-color-alt5 !default;
1044
+ $content-bg-color-hover: $content-bg-color-hover !default;
1045
+ $content-bg-color-pressed: $content-bg-color-pressed !default;
1046
+ $content-bg-color-focus: $content-bg-color-focus !default;
1047
+ $content-bg-color-selected: $content-bg-color-selected !default;
1048
+ $content-bg-color-dragged: $content-bg-color-dragged !default;
1049
+ $content-bg-color-disabled: $content-bg-color-disabled !default;
1050
+ $flyout-bg-color: $flyout-bg-color !default;
1051
+ $flyout-bg-color-hover: $flyout-bg-color-hover !default;
1052
+ $flyout-bg-color-pressed: $flyout-bg-color-pressed !default;
1053
+ $flyout-bg-color-selected: $flyout-bg-color-selected !default;
1054
+ $flyout-bg-color-focus: $flyout-bg-color-focus !default;
1055
+ $flyout-bg-color-disabled: $flyout-bg-color-disabled !default;
1056
+ $overlay-bg-color: $overlay-bg !default;
1057
+ $table-bg-color-hover: $table-bg-color-hover !default;
1058
+ $table-bg-color-pressed: $table-bg-color-pressed !default;
1059
+ $table-bg-color-selected: $table-bg-color-selected !default;
1060
+
1061
+ // all theme common color
1062
+ $colorpicker-gradient-1: #f00 !default;
1063
+ $colorpicker-gradient-2: #ff0 !default;
1064
+ $ccolorpicker-gradient-3: #0f0 !default;
1065
+ $colorpicker-gradient-4: #0ff !default;
1066
+ $colorpicker-gradient-5: #00f !default;
1067
+ $colorpicker-gradient-6: #f0f !default;
1068
+ $colorpicker-gradient-7: #ff0004 !default;
1069
+ $spreadsheet-selection-1: #673ab8 !default;
1070
+ $spreadsheet-selection-2: #9c27b0 !default;
1071
+ $spreadsheet-selection-3: #029688 !default;
1072
+ $spreadsheet-selection-4: #4caf51 !default;
1073
+ $spreadsheet-selection-5: #fe9800 !default;
1074
+ $spreadsheet-selection-6: #3f52b5 !default;
1075
+
1076
+ // text-color
1077
+ $content-text-color: $content-text-color !default;
1078
+ $content-text-color-alt1: $content-text-color-alt1 !default;
1079
+ $content-text-color-alt2: $content-text-color-alt2 !default;
1080
+ $content-text-color-alt3: $content-text-color-alt3 !default;
1081
+ $content-text-color-alt4: $content-text-color-alt4 !default;
1082
+ $content-text-color-hover: $content-text-color-hover !default;
1083
+ $content-text-color-pressed: $content-text-color-pressed !default;
1084
+ $content-text-color-focus: $content-text-color-focus !default;
1085
+ $content-text-color-selected: $content-text-color-selected !default;
1086
+ $content-text-color-dragged: $content-text-color-dragged !default;
1087
+ $content-text-color-disabled: $content-text-color-disabled !default;
1088
+ $placeholder-text-color: $placeholder-text-color !default;
1089
+ $flyout-text-color: $flyout-text-color !default;
1090
+ $flyout-text-color-hover: $flyout-text-color-hover !default;
1091
+ $flyout-text-color-pressed: $flyout-text-color-pressed !default;
1092
+ $flyout-text-color-selected: $flyout-text-color-selected !default;
1093
+ $flyout-text-color-disabled: $flyout-text-color-disabled !default;
1094
+ $flyout-text-color-focus: $flyout-text-color-focus !default;
1095
+ $table-text-color-hover: $table-text-color-hover !default;
1096
+ $table-text-color-pressed: $table-text-color-pressed !default;
1097
+ $table-text-color-selected: $table-text-color-selected !default;
1098
+
1099
+ // icon-color
1100
+ $icon-color: $icon-color !default;
1101
+ $icon-color-hover: $icon-color-hover !default;
1102
+ $icon-color-pressed: $icon-color-pressed !default;
1103
+ $icon-color-disabled: $icon-color-disabled !default;
1104
+
1105
+ // close-icon-color
1106
+ $close-icon-color: $close-icon-color !default;
1107
+ $close-icon-color-hover: $close-icon-color-hover !default;
1108
+ $close-icon-color-pressed: $close-icon-color-pressed !default;
1109
+ $close-icon-color-disabled: $close-icon-color-disabled !default;
1110
+
1111
+ // border-color
1112
+ $border-light: $border-light !default;
1113
+ $border: $border !default;
1114
+ $border-dark: $border-dark !default;
1115
+ $border-hover: $border-hover !default;
1116
+ $border-pressed: $border-pressed !default;
1117
+ $border-focus: $border-focus !default;
1118
+ $border-selected: $border-selected !default;
1119
+ $border-dragged: $border-dragged !default;
1120
+ $border-disabled: $border-disabled !default;
1121
+ $border-warning: $border-warning !default;
1122
+ $border-error: $border-error !default;
1123
+ $border-success: $border-success !default;
1124
+ $spreadsheet-gridline: $spreadsheet-gridline !default;
1125
+ $flyout-border: $flyout-border !default;
1126
+
1127
+ // Tooltip
1128
+ $tooltip-bg-color: $tooltip-bg-color !default;
1129
+ $tooltip-border: $tooltip-border !default;
1130
+ $tooltip-text-color: $tooltip-text-color !default;
1131
+
1132
+ // shadow
1133
+ $shadow: 0 1px 2px -1px rgba($black, .1), 0 1px 3px 0 rgba($black, .1) !default;
1134
+ $shadow-sm: 0 1px 2px 0 rgba($black, .05) !default;
1135
+ $shadow-md: 0 2px 4px -2px rgba($black, .1), 0 4px 6px -1px rgba($black, .1) !default;
1136
+ $shadow-lg: 0 0 4px 0 rgba($black, .1), 0 4px 6px -4px rgba($black, .1),0 10px 15px -3px rgba($black, .1) !default;
1137
+ $shadow-xl: 0 8px 10px -6px rgba($black, .1), 0 20px 25px -5px rgba($black, .1) !default;
1138
+ $shadow-2xl: 0 25px 50px -12px rgba($black, .25) !default;
1139
+ $shadow-inner: inset 0 2px 4px 0 rgba($black, .05) !default;
1140
+ $shadow-none: 0 0 rgba($black, 0) !default;
1141
+ $shadow-focus-ring1: 0 0 0 2px $content-bg-color, 0 0 0 4px $primary !default;
1142
+ $shadow-focus-ring2: inset 0 0 0 2px $primary !default;
1143
+ $primary-shadow-focus: 0 0 0 4px rgba($primary, .5) !default;
1144
+ $fab-shadow: 0 4px 6px -4px rgba($black, .1), 0 10px 15px -3px rgba($black, .1) !default;
1145
+ $appbar-bottom-shadow: 0 4px 6px -1px rgba($black, .1), 0 2px 4px -2px rgba($black, .1) !default;
1146
+ $appbar-top-shadow: 0 -4px 6px -1px rgba($black, .06), 0 -2px 4px -2px rgba($black, .1) !default;
1147
+ $shadow-stepper-large: 0 0 0 4px rgba($content-bg-color) !default;
1148
+ $shadow-stepper-small: 0 0 0 4px rgba($content-bg-color) !default;
1149
+
1150
+ // shadow
1151
+ $shadow: 0 .8px 16px rgba($black, .15) !default;
1152
+ $shadow-sm: 0 2px 4px rgba($black, .075) !default;
1153
+ $shadow-md: 0 8px 12px rgba($black, .15) !default;
1154
+ $shadow-lg: 0 16px 48px rgba($black, .175) !default;
1155
+ $shadow-xl: 0 20px 25px -5px rgba($black, .1), 0 10px 10px -5px rgba($black, .04) !default;
1156
+ $shadow-2xl: 0 25px 50px -12px rgba($black, .25) !default;
1157
+ $shadow-inner: inset 0 1px 2px rgba($black, .075) !default;
1158
+ $shadow-none: 0 0 rgba($black, 0) !default;
1159
+ $shadow-focus-ring1: 0 0 0 4px rgba($primary-shadow, .25) !default;
1160
+ $shadow-focus-ring2: 0 0 0 4px rgba($primary-shadow, .25) !default;
1161
+ $primary-shadow-focus: 0 0 0 4px rgba($primary-shadow, .5) !default;
1162
+ $secondary-shadow-focus: 0 0 0 4px rgba($secondary-shadow, .5) !default;
1163
+ $success-shadow-focus: 0 0 0 4px rgba($success-shadow, .5) !default;
1164
+ $danger-shadow-focus: 0 0 0 4px rgba($danger-shadow, .5) !default;
1165
+ $info-shadow-focus: 0 0 0 4px rgba($info-shadow, .5) !default;
1166
+ $warning-shadow-focus: 0 0 0 4px rgba($warning-shadow, .5) !default;
1167
+ $keyboard-focus-shadow: inset 0 0 0 1px $shadow-color, inset 0 0 0 2px $shadow-color1 !default;
1168
+
1169
+ // fontfamily
1170
+ $font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', arial, 'Noto Sans', 'Liberation Sans', sans-serif, 'apple color emoji', 'Segoe UI emoji', 'Segoe UI Symbol', 'Noto color emoji' !default;
1171
+
1172
+ // default font Size
1173
+ $text-xxs: 10px !default;
1174
+ $text-xs: 12px !default;
1175
+ $text-sm: 14px !default;
1176
+ $text-base: 16px !default;
1177
+ $text-lg: 18px !default;
1178
+ $text-xl: 20px !default;
1179
+ $text-2xl: 24px !default;
1180
+ $text-3xl: 30px !default;
1181
+ $text-4xl: 36px !default;
1182
+ $text-5xl: 48px !default;
1183
+ $text-6xl: 60px !default;
1184
+ $text-7xl: 72px !default;
1185
+ $text-8xl: 96px !default;
1186
+ $text-9xl: 128px !default;
1187
+
1188
+ // heading
1189
+ $h1-font-size: 40px !default;
1190
+ $h2-font-size: 32px !default;
1191
+ $h3-font-size: 28px !default;
1192
+ $h4-font-size: $text-2xl !default;
1193
+ $h5-font-size: $text-xl !default;
1194
+ $h6-font-size: $text-base !default;
1195
+
1196
+ // display
1197
+
1198
+ // Line height
1199
+ $leading-none: 1 !default;
1200
+ $leading-tight: 1.25 !default;
1201
+ $leading-snug: 1.375 !default;
1202
+ $leading-normal: 1.5 !default;
1203
+ $leading-relaxed: 1.625 !default;
1204
+ $leading-loose: 2 !default;
1205
+
1206
+ // font Weight
1207
+ $font-weight: 400 !default;
1208
+ $font-weight-lighter: lighter !default;
1209
+ $font-weight-light: 300 !default;
1210
+ $font-weight-normal: 400 !default;
1211
+ $font-weight-medium: 500 !default;
1212
+ $font-weight-semibold: 600 !default;
1213
+ $font-weight-bold: 700 !default;
1214
+ $font-weight-bolder: bolder !default;
1215
+
1216
+ // Secondary-button
1217
+ $secondary-bg-color: $secondary-bg-color !default;
1218
+ $secondary-border-color: $secondary-border-color !default;
1219
+ $secondary-text-color: $secondary-text-color !default;
1220
+ $secondary-bg-color-hover: $secondary-bg-color-hover !default;
1221
+ $secondary-border-color-hover: $secondary-border-color-hover !default;
1222
+ $secondary-text-color-hover: $secondary-text-color-hover !default;
1223
+ $secondary-bg-color-pressed: $secondary-bg-color-pressed !default;
1224
+ $secondary-border-color-pressed: $secondary-border-color-pressed !default;
1225
+ $secondary-text-color-pressed: $secondary-text-color-pressed !default;
1226
+ $secondary-bg-color-focus: $secondary-bg-color-focus !default;
1227
+ $secondary-border-color-focus: $secondary-border-color-focus !default;
1228
+ $secondary-text-color-focus: $secondary-text-color-focus !default;
1229
+ $secondary-bg-color-disabled: $secondary-bg-color-disabled !default;
1230
+ $secondary-border-color-disabled: $secondary-bg-color-disabled !default;
1231
+ $secondary-text-color-disabled: rgba($secondary-text-color, .65) !default;
1232
+
1233
+ // Primary-button
1234
+
1235
+ $primary-bg-color: rgba($primary-bg-color, 1) !default;
1236
+ $primary-border-color: $primary-border-color !default;
1237
+ $primary-text: $primary-text !default;
1238
+ $primary-bg-color-hover: $primary-bg-color-hover !default;
1239
+ $primary-border-color-hover: $primary-border-color-hover !default;
1240
+ $primary-text-hover: $primary-text-hover !default;
1241
+ $primary-bg-color-pressed: $primary-bg-color-pressed !default;
1242
+ $primary-border-color-pressed: $primary-border-color-pressed !default;
1243
+ $primary-text-pressed: $primary-text-pressed !default;
1244
+ $primary-bg-color-focus: $primary-bg-color-focus !default;
1245
+ $primary-border-color-focus: $primary-border-color-focus !default;
1246
+ $primary-text-focus: $primary-text-focus !default;
1247
+ $primary-bg-color-disabled: $primary-bg-color-disabled !default;
1248
+ $primary-border-color-disabled: $primary-border-color-disabled !default;
1249
+ $primary-text-disabled: $primary-text-disabled !default;
1250
+
1251
+ // Success-button
1252
+ $success-bg-color: rgba($success-bg-color, 1) !default;
1253
+ $success-border-color: $success-border-color !default;
1254
+ $success-text: $success-text !default;
1255
+ $success-bg-color-hover: $success-bg-color-hover !default;
1256
+ $success-border-color-hover: $success-border-color-hover !default;
1257
+ $success-text-hover: $success-text-hover !default;
1258
+ $success-bg-color-pressed: $success-bg-color-pressed !default;
1259
+ $success-border-color-pressed: $success-border-color-pressed !default;
1260
+ $success-text-pressed: $success-text-pressed !default;
1261
+ $success-bg-color-focus: $success-bg-color-focus !default;
1262
+ $success-border-color-focus: $success-border-color-focus !default;
1263
+ $success-text-focus: $success-text-focus !default;
1264
+ $success-bg-color-disabled: $success-bg-color-disabled !default;
1265
+ $success-border-color-disabled: $success-border-color-disabled !default;
1266
+ $success-text-disabled: $success-text-disabled !default;
1267
+
1268
+ // Warning-button
1269
+ $warning-bg-color: rgba($warning-bg-color, 1) !default;
1270
+ $warning-border-color: $warning-border-color !default;
1271
+ $warning-text: $warning-text !default;
1272
+ $warning-bg-color-hover: $warning-bg-color-hover !default;
1273
+ $warning-border-color-hover: $warning-border-color-hover !default;
1274
+ $warning-text-hover: $warning-text-hover !default;
1275
+ $warning-bg-color-pressed: $warning-bg-color-pressed !default;
1276
+ $warning-border-color-pressed: $warning-border-color-pressed !default;
1277
+ $warning-text-pressed: $warning-text-pressed !default;
1278
+ $warning-bg-color-focus: $warning-bg-color-focus !default;
1279
+ $warning-border-color-focus: $warning-border-color-focus !default;
1280
+ $warning-text-focus: $warning-text-focus !default;
1281
+ $warning-bg-color-disabled: $warning-bg-color-disabled !default;
1282
+ $warning-border-color-disabled: $warning-border-color-disabled !default;
1283
+ $warning-text-disabled: $warning-text-disabled !default;
1284
+
1285
+ // Info-button
1286
+ $info-bg-color: rgba($info-bg-color, 1) !default;
1287
+ $info-border-color: $info-border-color !default;
1288
+ $info-text: $info-text !default;
1289
+ $info-bg-color-hover: $info-bg-color-hover !default;
1290
+ $info-border-color-hover: $info-border-color-hover !default;
1291
+ $info-text-hover: $info-text-hover !default;
1292
+ $info-bg-color-pressed: $info-bg-color-pressed !default;
1293
+ $info-border-color-pressed: $info-border-color-pressed !default;
1294
+ $info-text-pressed: $info-text-pressed !default;
1295
+ $info-bg-color-focus: $info-bg-color-focus !default;
1296
+ $info-border-color-focus: $info-border-color-focus !default;
1297
+ $info-text-focus: $info-text-focus !default;
1298
+ $info-bg-color-disabled: $info-bg-color-disabled !default;
1299
+ $info-border-color-disabled: $info-border-color-disabled !default;
1300
+ $info-text-disabled: $info-text-disabled !default;
1301
+
1302
+ // danger-button
1303
+ $danger-bg-color: rgba($danger-bg-color, 1) !default;
1304
+ $danger-border-color: $danger-border-color !default;
1305
+ $danger-text: $danger-text !default;
1306
+ $danger-bg-color-hover: $danger-bg-color-hover !default;
1307
+ $danger-border-color-hover: $danger-border-color-hover !default;
1308
+ $danger-text-hover: $danger-text-hover !default;
1309
+ $danger-bg-color-pressed: $danger-bg-color-pressed !default;
1310
+ $danger-border-color-pressed: $danger-border-color-pressed !default;
1311
+ $danger-text-pressed: $danger-text-pressed !default;
1312
+ $danger-bg-color-focus: $danger-bg-color-focus !default;
1313
+ $danger-border-color-focus: $danger-border-color-focus !default;
1314
+ $danger-text-focus: $danger-text-focus !default;
1315
+ $danger-bg-color-disabled: $danger-bg-color-disabled !default;
1316
+ $danger-border-color-disabled: $danger-border-color-disabled !default;
1317
+ $danger-text-disabled: $danger-text-disabled !default;
1318
+
1319
+ //Outline button
1320
+ $primary-outline: $primary-outline !default;
1321
+ $secondary-outline: $secondary-outline !default;
1322
+ $warning-outline: $warning-outline !default;
1323
+ $danger-outline: $danger-outline !default;
1324
+ $success-outline: $success-outline !default;
1325
+ $info-outline: $info-outline !default;
1326
+
1327
+ // chart series
1328
+ $series-1: #e5e7eb;
1329
+ $series-2: #d1d5db;
1330
+ $series-3: #9ca3af;
1331
+ $series-4: #1f2937;
1332
+ $series-5: #5a61f6;
1333
+ $series-6: #91bd34;
1334
+ $series-7: #267dda;
1335
+ $series-8: #01a8b5;
1336
+ $series-9: #de4383;
1337
+ $series-10: #107c10;
1338
+ $series-11: #d83b01;
1339
+ $series-12: #ffb900;
1340
+ $skin-name: 'tailwind3' !default;
1341
+ $theme-name: 'tailwind3' !default;
1342
+
1343
+ //diagram Palette color
1344
+ $diagram-palette-background: $diagram-palette-background !default;
1345
+ $diagram-palette-hover-background: $diagram-palette-hover-background !default;
1346
+ $diagram-palette-selected-background: $diagram-palette-selected-background !default;
1347
+
1348
+ //Message component
1349
+ //Message default
1350
+ $msg-color: $msg-color !default;
1351
+ $msg-bg-color: $msg-bg-color !default;
1352
+ $msg-border-color: $msg-border-color !default;
1353
+ $msg-color-alt1: $msg-color-alt1 !default;
1354
+ $msg-bg-color-alt1: $msg-bg-color-alt1 !default;
1355
+ $msg-border-color-alt1: $msg-border-color-alt1 !default;
1356
+ $msg-color-alt2: $msg-color-alt2 !default;
1357
+ $msg-bg-color-alt2: $msg-bg-color-alt2 !default;
1358
+ $msg-border-color-alt2: $msg-border-color-alt2 !default;
1359
+ $msg-icon-color: $msg-icon-color !default;
1360
+ $msg-icon-color-alt1: $msg-icon-color-alt1 !default;
1361
+ $msg-icon-color-alt2: $msg-icon-color-alt2 !default;
1362
+
1363
+ $msg-close-icon-color: $msg-close-icon-color !default;
1364
+ $msg-close-icon-color-alt1: $msg-close-icon-color-alt21 !default;
1365
+ $msg-close-icon-color-alt2: $msg-close-icon-color-alt2 !default;
1366
+
1367
+ //Message success
1368
+ $msg-success-color: $msg-success-color !default;
1369
+ $msg-success-bg-color: $msg-success-bg-color !default;
1370
+ $msg-success-border-color: $msg-success-border-color !default;
1371
+ $msg-success-color-alt1: $msg-success-color-alt1 !default;
1372
+ $msg-success-bg-color-alt1: $msg-success-bg-color-alt1 !default;
1373
+ $msg-success-border-color-alt1: $msg-success-border-color-alt1 !default;
1374
+ $msg-success-color-alt2: $msg-success-color-alt2 !default;
1375
+ $msg-success-bg-color-alt2: $msg-success-bg-color-alt2 !default;
1376
+ $msg-success-border-color-alt2: $msg-success-border-color-alt2 !default;
1377
+ $msg-success-icon-color: $msg-success-icon-color !default;
1378
+ $msg-success-icon-color-alt1: $msg-success-icon-color-alt1 !default;
1379
+ $msg-success-icon-color-alt2: $msg-success-icon-color-alt2 !default;
1380
+ $msg-success-close-icon-color: $msg-success-close-icon-color !default;
1381
+ $msg-success-close-icon-color-alt1: $msg-success-close-icon-color-alt1 !default;
1382
+ $msg-success-close-icon-color-alt2: $msg-success-close-icon-color-alt2 !default;
1383
+
1384
+ //Message danger
1385
+ $msg-danger-color: $msg-danger-color !default;
1386
+ $msg-danger-bg-color: $msg-danger-bg-color !default;
1387
+ $msg-danger-border-color: $msg-danger-border-color !default;
1388
+ $msg-danger-color-alt1: $msg-danger-color-alt1 !default;
1389
+ $msg-danger-bg-color-alt1: $msg-danger-bg-color-alt1 !default;
1390
+ $msg-danger-border-color-alt1: $msg-danger-border-color-alt1 !default;
1391
+ $msg-danger-color-alt2: $msg-danger-color-alt2 !default;
1392
+ $msg-danger-bg-color-alt2: $msg-danger-bg-color-alt2 !default;
1393
+ $msg-danger-border-color-alt2: $msg-danger-border-color-alt2 !default;
1394
+ $msg-danger-icon-color: $msg-danger-icon-color !default;
1395
+ $msg-danger-icon-color-alt1: $msg-danger-icon-color-alt1 !default;
1396
+ $msg-danger-icon-color-alt2: $msg-danger-icon-color-alt2 !default;
1397
+ $msg-danger-close-icon-color: $msg-danger-close-icon-color !default;
1398
+ $msg-danger-close-icon-color-alt1: $msg-danger-close-icon-color-alt1 !default;
1399
+ $msg-danger-close-icon-color-alt2: $msg-danger-close-icon-color-alt2 !default;
1400
+
1401
+ //Message Info
1402
+ $msg-info-color: $msg-info-color !default;
1403
+ $msg-info-bg-color: $msg-info-bg-color !default;
1404
+ $msg-info-border-color: $msg-info-border-color !default;
1405
+ $msg-info-color-alt1: $msg-info-color-alt1 !default;
1406
+ $msg-info-bg-color-alt1: $msg-info-bg-color-alt1 !default;
1407
+ $msg-info-border-color-alt1: $msg-info-border-color-alt1 !default;
1408
+ $msg-info-color-alt2: $msg-info-color-alt2 !default;
1409
+ $msg-info-bg-color-alt2: $msg-info-bg-color-alt2 !default;
1410
+ $msg-info-border-color-alt2: $msg-info-border-color-alt2 !default;
1411
+ $msg-info-icon-color: $msg-info-icon-color !default;
1412
+ $msg-info-icon-color-alt1: $msg-info-icon-color-alt1 !default;
1413
+ $msg-info-icon-color-alt2: $msg-info-icon-color-alt2 !default;
1414
+ $msg-info-close-icon-color: $msg-info-close-icon-color !default;
1415
+ $msg-info-close-icon-color-alt1: $msg-info-close-icon-color-alt1 !default;
1416
+ $msg-info-close-icon-color-alt2: $msg-info-close-icon-color-alt2 !default;
1417
+
1418
+ //Message Warning
1419
+ $msg-warning-color: $msg-warning-color !default;
1420
+ $msg-warning-bg-color: $msg-warning-bg-color !default;
1421
+ $msg-warning-border-color: $msg-warning-border-color !default;
1422
+ $msg-warning-color-alt1: $msg-warning-color-alt1 !default;
1423
+ $msg-warning-bg-color-alt1: $msg-warning-bg-color-alt1 !default;
1424
+ $msg-warning-border-color-alt1: $msg-warning-border-color-alt1 !default;
1425
+ $msg-warning-color-alt2: $msg-warning-color-alt2 !default;
1426
+ $msg-warning-bg-color-alt2: $msg-warning-bg-color-alt2 !default;
1427
+ $msg-warning-border-color-alt2: $msg-warning-border-color-alt2 !default;
1428
+ $msg-warning-icon-color: $msg-warning-icon-color !default;
1429
+ $msg-warning-icon-color-alt1: $msg-warning-icon-color-alt1 !default;
1430
+ $msg-warning-icon-color-alt2: $msg-warning-icon-color-alt2 !default;
1431
+ $msg-warning-close-icon-color: $msg-warning-close-icon-color !default;
1432
+ $msg-warning-close-icon-color-alt1: $msg-warning-close-icon-color-alt1 !default;
1433
+ $msg-warning-close-icon-color-alt2: $msg-warning-close-icon-color-alt2 !default;
1434
+
1435
+ //Primary-chip
1436
+ $chip-primary-bg-color: $chip-primary-bg-color;
1437
+ $chip-primary-icon-color: $chip-primary-icon-color;
1438
+ $chip-primary-border-color: $chip-primary-border-color;
1439
+ $chip-primary-text: $chip-primary-text;
1440
+ $chip-primary-icon-color-hover: $chip-primary-icon-color-hover;
1441
+ $chip-primary-icon-color-pressed: $chip-primary-icon-color-pressed;
1442
+ $chip-primary-bg-color-hover: $chip-primary-bg-color-hover;
1443
+ $chip-primary-border-color-hover: $chip-primary-border-color-hover;
1444
+ $chip-primary-text-hover: $chip-primary-text-hover;
1445
+ $chip-primary-bg-color-pressed: $chip-primary-bg-color-pressed;
1446
+ $chip-primary-icon-bg-color-pressed: $chip-primary-icon-bg-color-pressed;
1447
+ $chip-primary-icon-bg-color-hover: $chip-primary-icon-bg-color-hover;
1448
+ $chip-primary-border-color-pressed: $chip-primary-border-color-pressed;
1449
+ $chip-primary-text-pressed: $chip-primary-text-pressed;
1450
+ $chip-primary-bg-color-disabled: $chip-primary-bg-color-disabled;
1451
+ $chip-primary-border-color-disabled: $chip-primary-border-color-disabled;
1452
+ $chip-primary-text-disabled: $chip-primary-text-disabled;
1453
+
1454
+ //Secondary-chip
1455
+ $chip-secondary-bg-color: $chip-secondary-bg-color;
1456
+ $chip-secondary-icon-color: $chip-secondary-icon-color;
1457
+ $chip-secondary-border-color: $chip-secondary-border-color;
1458
+ $chip-secondary-text: $chip-secondary-text;
1459
+ $chip-secondary-icon-color-hover: $chip-secondary-icon-color-hover;
1460
+ $chip-secondary-icon-color-pressed: $chip-secondary-icon-color-pressed;
1461
+ $chip-secondary-bg-color-hover: $chip-secondary-bg-color-hover;
1462
+ $chip-secondary-border-color-hover: $chip-secondary-border-color-hover;
1463
+ $chip-secondary-text-hover: $chip-secondary-text-hover;
1464
+ $chip-secondary-bg-color-pressed: $chip-secondary-bg-color-pressed;
1465
+ $chip-secondary-icon-bg-color-pressed: $chip-secondary-icon-bg-color-pressed;
1466
+ $chip-secondary-icon-bg-color-hover: $chip-secondary-icon-bg-color-hover;
1467
+ $chip-secondary-border-color-pressed: $chip-secondary-border-color-pressed;
1468
+ $chip-secondary-text-pressed: $chip-secondary-text-pressed;
1469
+ $chip-secondary-bg-color-disabled: $chip-secondary-bg-color-disabled;
1470
+ $chip-secondary-border-color-disabled: $chip-secondary-border-color-disabled;
1471
+ $chip-secondary-text-disabled: $chip-secondary-text-disabled;
1472
+
1473
+ //Success-chip
1474
+ $chip-success-bg-color: $chip-success-bg-color;
1475
+ $chip-success-icon-color: $chip-success-icon-color;
1476
+ $chip-success-border-color: $chip-success-border-color;
1477
+ $chip-success-text: $chip-success-text;
1478
+ $chip-success-icon-color-hover: $chip-success-icon-color-hover;
1479
+ $chip-success-icon-color-pressed: $chip-success-icon-color-pressed;
1480
+ $chip-success-bg-color-hover: $chip-success-bg-color-hover;
1481
+ $chip-success-border-color-hover: $chip-success-border-color-hover;
1482
+ $chip-success-text-hover: $chip-success-text-hover;
1483
+ $chip-success-bg-color-pressed: $chip-success-bg-color-pressed;
1484
+ $chip-success-icon-bg-color-pressed: $chip-success-icon-bg-color-pressed;
1485
+ $chip-success-icon-bg-color-hover: $chip-success-icon-bg-color-hover;
1486
+ $chip-success-border-color-pressed: $chip-success-border-color-pressed;
1487
+ $chip-success-text-pressed: $chip-success-text-pressed;
1488
+ $chip-success-bg-color-disabled: $chip-success-bg-color-disabled;
1489
+ $chip-success-border-color-disabled: $chip-success-border-color-disabled;
1490
+ $chip-success-text-disabled: $chip-success-text-disabled;
1491
+
1492
+ //Warning-chip
1493
+ $chip-warning-bg-color: $chip-warning-bg-color;
1494
+ $chip-warning-icon-color: $chip-warning-icon-color;
1495
+ $chip-warning-border-color: $chip-warning-border-color;
1496
+ $chip-warning-text: $chip-warning-text;
1497
+ $chip-warning-icon-color-hover: $chip-warning-icon-color-hover;
1498
+ $chip-warning-icon-color-pressed: $chip-warning-icon-color-pressed;
1499
+ $chip-warning-bg-color-hover: $chip-warning-bg-color-hover;
1500
+ $chip-warning-border-color-hover: $chip-warning-border-color-hover;
1501
+ $chip-warning-text-hover: $chip-warning-text-hover;
1502
+ $chip-warning-bg-color-pressed: $chip-warning-bg-color-pressed;
1503
+ $chip-warning-icon-bg-color-pressed: $chip-warning-icon-bg-color-pressed;
1504
+ $chip-warning-icon-bg-color-hover: $chip-warning-icon-bg-color-hover;
1505
+ $chip-warning-border-color-pressed: $chip-warning-border-color-pressed;
1506
+ $chip-warning-text-pressed: $chip-warning-text-pressed;
1507
+ $chip-warning-bg-color-disabled: $chip-warning-bg-color-disabled;
1508
+ $chip-warning-border-color-disabled: $chip-warning-border-color-disabled;
1509
+ $chip-warning-text-disabled: $chip-warning-text-disabled;
1510
+
1511
+ //danger-chip
1512
+ $chip-danger-bg-color: $chip-danger-bg-color;
1513
+ $chip-danger-icon-color: $chip-danger-icon-color;
1514
+ $chip-danger-border-color: $chip-danger-border-color;
1515
+ $chip-danger-text: $chip-danger-text;
1516
+ $chip-danger-icon-color-hover: $chip-danger-icon-color-hover;
1517
+ $chip-danger-icon-color-pressed: $chip-danger-icon-color-pressed;
1518
+ $chip-danger-bg-color-hover: $chip-danger-bg-color-hover;
1519
+ $chip-danger-border-color-hover: $chip-danger-border-color-hover;
1520
+ $chip-danger-text-hover: $chip-danger-text-hover;
1521
+ $chip-danger-bg-color-pressed: $chip-danger-bg-color-pressed;
1522
+ $chip-danger-icon-bg-color-pressed: $chip-danger-icon-bg-color-pressed;
1523
+ $chip-danger-icon-bg-color-hover: $chip-danger-icon-bg-color-hover;
1524
+ $chip-danger-border-color-pressed: $chip-danger-border-color-pressed;
1525
+ $chip-danger-text-pressed: $chip-danger-text-pressed;
1526
+ $chip-danger-bg-color-disabled: $chip-danger-bg-color-disabled;
1527
+ $chip-danger-border-color-disabled: $chip-danger-border-color-disabled;
1528
+ $chip-danger-text-disabled: $chip-danger-text-disabled;
1529
+
1530
+ //Info-chip
1531
+ $chip-info-bg-color: $chip-info-bg-color;
1532
+ $chip-info-icon-color: $chip-info-icon-color;
1533
+ $chip-info-border-color: $chip-info-border-color;
1534
+ $chip-info-text: $chip-info-text;
1535
+ $chip-info-icon-color-hover: $chip-info-icon-color-hover;
1536
+ $chip-info-icon-color-pressed: $chip-info-icon-color-pressed;
1537
+ $chip-info-bg-color-hover: $chip-info-bg-color-hover;
1538
+ $chip-info-border-color-hover: $chip-info-border-color-hover;
1539
+ $chip-info-text-hover: $chip-info-text-hover;
1540
+ $chip-info-bg-color-pressed: $chip-info-bg-color-pressed;
1541
+ $chip-info-icon-bg-color-pressed: $chip-info-icon-bg-color-pressed;
1542
+ $chip-info-icon-bg-color-hover: $chip-info-icon-bg-color-hover;
1543
+ $chip-info-border-color-pressed: $chip-info-border-color-pressed;
1544
+ $chip-info-text-pressed: $chip-info-text-pressed;
1545
+ $chip-info-bg-color-disabled: $chip-info-bg-color-disabled;
1546
+ $chip-info-border-color-disabled: $chip-info-border-color-disabled;
1547
+ $chip-info-text-disabled: $chip-info-text-disabled;
1548
+
1549
+ //app bar Light
1550
+ $appbar-bg-color-alt1: $appbar-bg-color-alt1 !default;
1551
+ $appbar-color-alt1: $appbar-color-alt1 !default;
1552
+ $appbar-border-color-alt1: $appbar-border-color-alt1 !default;
1553
+ $appbar-hover-bg-color-alt1: $appbar-hover-bg-color-alt1 !default;
1554
+
1555
+ //dark
1556
+ $appbar-bg-color-alt2: $appbar-bg-color-alt2 !default;
1557
+ $appbar-color-alt2: $appbar-color-alt2 !default;
1558
+ $appbar-border-color-alt2: $appbar-border-color-alt2 !default;
1559
+ $appbar-hover-bg-color-alt2: $appbar-hover-bg-color-alt2 !default;
1560
+
1561
+ //shadow
1562
+ $appbar-bottom-shadow: none !default;
1563
+ $appbar-top-shadow: none !default;
1564
+
1565
+ //rating
1566
+ $rating-selected-color: $rating-selected-color !default;
1567
+ $rating-unrated-color: $rating-unrated-color !default;
1568
+ $rating-selected-disabled-color: $rating-selected-disabled-color !default;
1569
+ $rating-unrated-disabled-color: $rating-unrated-disabled-color !default;
1570
+ $rating-selected-hover-color: $rating-selected-hover-color !default;
1571
+ $rating-unrated-hover-color: $rating-unrated-hover-color !default;
1572
+ $rating-pressed-color: $rating-pressed-color !default;
1573
+
1574
+ //font-icons
1575
+ $font-icon-8: 8px !default;
1576
+ $font-icon-9: 9px !default;
1577
+ $font-icon-10: 10px !default;
1578
+ $font-icon-12: 12px !default;
1579
+ $font-icon-13: 13px !default;
1580
+ $font-icon-14: 14px !default;
1581
+ $font-icon-15: 15px !default;
1582
+ $font-icon-16: 16px !default;
1583
+ $font-icon-17: 17px !default;
1584
+ $font-icon-18: 18px !default;
1585
+ $font-icon-20: 20px !default;
1586
+ $font-icon-22: 22px !default;
1587
+ $font-icon-24: 24px !default;
1588
+ $font-icon-26: 26px !default;
1589
+ $font-icon-28: 28px !default;
1590
+ $font-icon-32: 32px !default;
1591
+
1592
+ //badge
1593
+ $badge-light-bg-color: $badge-light-bg-color;
1594
+ $badge-light-border-color: $badge-light-border-color;
1595
+ $badge-light-text-color: $badge-light-text-color;
1596
+ $badge-dark-bg-color: $badge-dark-bg-color;
1597
+ $badge-dark-border-color: $badge-dark-border-color;
1598
+ $badge-dark-text-color: $badge-dark-text-color;
1599
+
1600
+ //tab
1601
+ $tab-border: $tab-border;
1602
+
1603
+ //stepper
1604
+ $stepper:$stepper;
1605
+ $shadow-color: $shadow-color;
1606
+ $shadow-color1: $shadow-color1;
1607
+
1608
+ // black
1609
+ $black: $black;
1610
+
1611
+ // White
1612
+ $white: $white;
1613
+
1614
+ // Transparent
1615
+ $transparent: $transparent;
1616
+
1617
+ //missed variables
1618
+ $accordion-text-active-color: $primary !default;
1619
+
1620
+ //frozen
1621
+ $frozen-shadow: rgba(0, 0, 0, .12) !default;
1622
+ $frozen-shadow-2: rgba(0, 0, 0, .12) !default;
1623
+
1624
+ .e-dark-mode{
1625
+
1626
+ --color-sf-content-bg-color: rgba(17, 24, 39);
1627
+ --color-sf-content-bg-color-alt1: #1d2432;
1628
+ --color-sf-content-bg-color-alt2: #232937;
1629
+ --color-sf-content-bg-color-alt3: #282f3c;
1630
+ --color-sf-content-bg-color-alt4: #2f3542;
1631
+ --color-sf-content-bg-color-alt5: #343a47;
1632
+ --color-sf-content-bg-color-hover: #1a212f;
1633
+ --color-sf-content-bg-color-pressed: #242a38;
1634
+ --color-sf-content-bg-color-focus: #1a212f;
1635
+ --color-sf-content-bg-color-selected: #2e3441;
1636
+ --color-sf-content-bg-color-dragged: #242a38;
1637
+ --color-sf-content-bg-color-disabled: #111827;
1638
+ --color-sf-flyout-bg-color: #1a212f;
1639
+ --color-sf-flyout-bg-color-hover: #1f2634;
1640
+ --color-sf-flyout-bg-color-pressed: #242a38;
1641
+ --color-sf-flyout-bg-color-focus: #1f2634;
1642
+ --color-sf-flyout-bg-color-selected: #2e3441;
1643
+ --color-sf-flyout-bg-color-disabled: #1a212f;
1644
+ --color-sf-overlay-bg-color: rgba(107, 114, 128, .75);
1645
+ --color-sf-table-bg-color-hover: #1a212f;
1646
+ --color-sf-table-bg-color-pressed: #242a38;
1647
+ --color-sf-table-bg-color-selected: #2e3441;
1648
+ --color-sf-text-input-bg-color: rgba(255, 255, 255, .05);
1649
+ --color-sf-treeview-item-active-hover-bg: ##2e3441;
1650
+
1651
+ // text-color
1652
+ --color-sf-content-text-color: #fff;
1653
+ --color-sf-content-text-color-alt1: #e5e7eb;
1654
+ --color-sf-content-text-color-alt2: #d1d5db;
1655
+ --color-sf-content-text-color-alt3: #9ca3af;
1656
+ --color-sf-content-text-color-alt4: #6b7280;
1657
+ --color-sf-content-text-color-hover: #fff;
1658
+ --color-sf-content-text-color-pressed: #fff;
1659
+ --color-sf-content-text-color-focus: #fff;
1660
+ --color-sf-content-text-color-selected: #fff;
1661
+ --color-sf-content-text-color-dragged: #fff;
1662
+ --color-sf-content-text-color-disabled: #6b7280;
1663
+ --color-sf-placeholder-text-color: #6b7280;
1664
+ --color-sf-flyout-text-color: #fff;
1665
+ --color-sf-flyout-text-color-hover: #fff;
1666
+ --color-sf-flyout-text-color-pressed: #fff;
1667
+ --color-sf-flyout-text-color-focus: #fff;
1668
+ --color-sf-flyout-text-color-selected: #fff;
1669
+ --color-sf-flyout-text-color-disabled: #6b7280;
1670
+ --color-sf-table-text-color-hover: #fff;
1671
+ --color-sf-table-text-color-pressed: #fff;
1672
+ --color-sf-table-text-color-selected: #fff;
1673
+
1674
+ // icon-color
1675
+ --color-sf-icon-color: #d1d5db;
1676
+ --color-sf-icon-color-hover: #9ca3af;
1677
+ --color-sf-icon-color-pressed: #e5e7eb;
1678
+ --color-sf-icon-color-disabled: #4b5563;
1679
+
1680
+ // close-icon-color
1681
+ --color-sf-close-icon-color: #9ca3af;
1682
+ --color-sf-close-icon-color-hover: #9ca3af;
1683
+ --color-sf-close-icon-color-pressed: #9ca3af;
1684
+ --color-sf-close-icon-color-disabled: #6b7280;
1685
+
1686
+ // border-color
1687
+ --color-sf-border-light: #282f3c;
1688
+ --color-sf-border: #374151;
1689
+ --color-sf-border-dark: #9ca3af;
1690
+ --color-sf-border-hover: #4b5563;
1691
+ --color-sf-border-pressed: #6b7280;
1692
+ --color-sf-border-focus: #374151;
1693
+ --color-sf-border-selected: #4b5563;
1694
+ --color-sf-border-dragged: #374151;
1695
+ --color-sf-border-disabled: #374151;
1696
+ --color-sf-border-warning: #c2410c;
1697
+ --color-sf-border-error: #dc2626;
1698
+ --color-sf-border-success: #15803d;
1699
+ --color-sf-spreadsheet-gridline: #e5e7eb;
1700
+ --color-sf-flyout-border: #282f3c;
1701
+ --color-sf-dialog-border: rgba(255, 255, 255, .1);
1702
+
1703
+ //sf Variables
1704
+ --color-sf-primary: rgba(99, 102, 241);
1705
+ --color-sf-primary-text-color: #000;
1706
+ --color-sf-primary-light: #3730a3;
1707
+ --color-sf-primary-lighter: #1e1b4b;
1708
+ --color-sf-primary-dark: #818cf8;
1709
+ --color-sf-primary-darker: #4f46e5;
1710
+ --color-sf-secondary: rgba(255, 255, 255, .01);
1711
+ --color-sf-success: #22c55e;
1712
+ --color-sf-info: #38bdf8;
1713
+ --color-sf-warning: #f97316;
1714
+ --color-sf-danger: #f87171;
1715
+ --color-sf-success-light: #164c37;
1716
+ --color-sf-info-light: #0e485b;
1717
+ --color-sf-warning-light: #573422;
1718
+ --color-sf-danger-light: #54252f;
1719
+ --color-sf-success-dark: #4ade80;
1720
+ --color-sf-info-dark: #38bdf8;
1721
+ --color-sf-warning-dark: #fb923c;
1722
+ --color-sf-danger-dark: #ef4444;
1723
+ --color-sf-success-lighter: #122a2c;
1724
+ --color-sf-info-lighter: #102838;
1725
+ --color-sf-warning-lighter: #282125;
1726
+ --color-sf-danger-lighter: #271d2a;
1727
+ --color-sf-black: 0, 0, 0;
1728
+ --color-sf-white: 255, 255, 255;
1729
+
1730
+ // Primary-button
1731
+ --color-sf-primary-bg-color: #6366f1;
1732
+ --color-sf-primary-border-color: #6366f1;
1733
+ --color-sf-primary-text: #fff;
1734
+ --color-sf-primary-bg-color-hover: #818cf8;
1735
+ --color-sf-primary-border-color-hover: #818cf8;
1736
+ --color-sf-primary-text-hover: #ffffff;
1737
+ --color-sf-primary-bg-color-pressed: #4f46e5;
1738
+ --color-sf-primary-border-color-pressed: #4f46e5;
1739
+ --color-sf-primary-text-pressed: #fff;
1740
+ --color-sf-primary-bg-color-focus: #818cf8;
1741
+ --color-sf-primary-border-color-focus: #818cf8;
1742
+ --color-sf-primary-text-focus: #fff;
1743
+ --color-sf-primary-bg-color-disabled: #312e81;
1744
+ --color-sf-primary-border-color-disabled: #312e81;
1745
+ --color-sf-primary-text-disabled: rgba(255, 255, 255, .3);
1746
+
1747
+ // Secondary-button
1748
+ --color-sf-secondary-bg-color: rgba(255, 255, 255, .1);
1749
+ --color-sf-secondary-border-color: rgba(255, 255, 255, .1);
1750
+ --color-sf-secondary-text-color: #fff;
1751
+ --color-sf-secondary-bg-color-hover: rgba(255, 255, 255, .2);
1752
+ --color-sf-secondary-border-color-hover: rgba(255, 255, 255, .2);
1753
+ --color-sf-secondary-text-color-hover: #fff;
1754
+ --color-sf-secondary-bg-color-pressed: rgba(255, 255, 255, .3);
1755
+ --color-sf-secondary-border-color-pressed: rgba(255, 255, 255, .3);
1756
+ --color-sf-secondary-text-color-pressed: #fff;
1757
+ --color-sf-secondary-bg-color-focus: rgba(255, 255, 255, .2);
1758
+ --color-sf-secondary-border-color-focus: rgba(255, 255, 255, .2);
1759
+ --color-sf-secondary-text-color-focus: #fff;
1760
+ --color-sf-secondary-bg-color-disabled: rgba(255, 255, 255, .2);
1761
+ --color-sf-secondary-border-color-disabled: rgba(255, 255, 255, .2);
1762
+ --color-sf-secondary-text-color-disabled: rgba(255, 255, 255, .3);
1763
+
1764
+ // Success-button
1765
+ --color-sf-success-bg-color: #22c55e;
1766
+ --color-sf-success-border-color: #22c55e;
1767
+ --color-sf-success-text: #000;
1768
+ --color-sf-success-bg-color-hover: #4ade80;
1769
+ --color-sf-success-border-color-hover: #4ade80;
1770
+ --color-sf-success-text-hover: #000;
1771
+ --color-sf-success-bg-color-pressed: #16a34a;
1772
+ --color-sf-success-border-color-pressed: #16a34a;
1773
+ --color-sf-success-text-pressed: #000;
1774
+ --color-sf-success-bg-color-focus: #4ade80;
1775
+ --color-sf-success-border-color-focus: #4ade80;
1776
+ --color-sf-success-text-focus: #000;
1777
+ --color-sf-success-bg-color-disabled: #14532d;
1778
+ --color-sf-success-border-color-disabled: #14532d;
1779
+ --color-sf-success-text-disabled: rgba(0, 0, 0, .3);
1780
+
1781
+ // Warning-button
1782
+ --color-sf-warning-bg-color: #f97316;
1783
+ --color-sf-warning-border-color: #f97316;
1784
+ --color-sf-warning-text: #000;
1785
+ --color-sf-warning-bg-color-hover: #fb923c;
1786
+ --color-sf-warning-border-color-hover: #fb923c;
1787
+ --color-sf-warning-text-hover: #000;
1788
+ --color-sf-warning-bg-color-pressed: #ea580c;
1789
+ --color-sf-warning-border-color-pressed: #ea580c;
1790
+ --color-sf-warning-text-pressed: #000;
1791
+ --color-sf-warning-bg-color-focus: #fb923c;
1792
+ --color-sf-warning-border-color-focus: #fb923c;
1793
+ --color-sf-warning-text-focus: #000;
1794
+ --color-sf-warning-bg-color-disabled: #7c2d12;
1795
+ --color-sf-warning-border-color-disabled: #7c2d12;
1796
+ --color-sf-warning-text-disabled: rgba(255, 255, 255, .3);
1797
+
1798
+ // Info-button
1799
+ --color-sf-info-bg-color: #0ea5e9;
1800
+ --color-sf-info-border-color: #0ea5e9;
1801
+ --color-sf-info-text: #000;
1802
+ --color-sf-info-bg-color-hover: #38bdf8;
1803
+ --color-sf-info-border-color-hover: #38bdf8;
1804
+ --color-sf-info-text-hover: #000;
1805
+ --color-sf-info-bg-color-pressed: #0284c7;
1806
+ --color-sf-info-border-color-pressed: #0284c7;
1807
+ --color-sf-info-text-pressed: #000;
1808
+ --color-sf-info-bg-color-focus: #38bdf8;
1809
+ --color-sf-info-border-color-focus: #38bdf8;
1810
+ --color-sf-info-text-focus: #000;
1811
+ --color-sf-info-bg-color-disabled: #0c4a6e;
1812
+ --color-sf-info-border-color-disabled: #0c4a6e;
1813
+ --color-sf-info-text-disabled: rgba(255, 255, 255, .3);
1814
+
1815
+ // danger-button
1816
+ --color-sf-danger-bg-color: #f87171;
1817
+ --color-sf-danger-border-color: #f87171;
1818
+ --color-sf-danger-text: #000;
1819
+ --color-sf-danger-bg-color-hover: #ef4444;
1820
+ --color-sf-danger-border-color-hover: #ef4444;
1821
+ --color-sf-danger-text-hover: #fff;
1822
+ --color-sf-danger-bg-color-pressed: #dc2626;
1823
+ --color-sf-danger-border-color-pressed: #dc2626;
1824
+ --color-sf-danger-text-pressed: #fff;
1825
+ --color-sf-danger-bg-color-focus: #ef4444;
1826
+ --color-sf-danger-border-color-focus: #ef4444;
1827
+ --color-sf-danger-text-focus: #fff;
1828
+ --color-sf-danger-bg-color-disabled: #7f1d1d;
1829
+ --color-sf-danger-border-color-disabled: #7f1d1d;
1830
+ --color-sf-danger-text-disabled: rgba(255, 255, 255, .3);
1831
+
1832
+ //Outline button
1833
+ --color-sf-primary-outline: #6366f1;
1834
+ --color-sf-secondary-outline: rgba(255, 255, 255, .1);
1835
+ --color-sf-warning-outline: #f97316;
1836
+ --color-sf-danger-outline: #f87171;
1837
+ --color-sf-success-outline: #22c55e;
1838
+ --color-sf-info-outline: #38bdf8;
1839
+
1840
+ // Tooltip
1841
+ --color-sf-tooltip-bg-color: #f9fafb;
1842
+ --color-sf-tooltip-border: #f9fafb;
1843
+ --color-sf-tooltip-text-color: #1f2937;
1844
+
1845
+ //Light
1846
+ --color-sf-appbar-bg-color-alt1: #374151;
1847
+ --color-sf-appbar-color-alt1: #fff;
1848
+ --color-sf-appbar-border-color-alt1: #374151;
1849
+ --color-sf-appbar-hover-bg-color-alt1: #fff;
1850
+
1851
+ //dark
1852
+ --color-sf-appbar-bg-color-alt2: #e5e7eb;
1853
+ --color-sf-appbar-color-alt2: #111827;
1854
+ --color-sf-appbar-border-color-alt2: #e5e7eb;
1855
+ --color-sf-appbar-hover-bg-color-alt2: #fff;
1856
+
1857
+ //diagram Palette color
1858
+ --color-sf-diagram-palette-background: #e5e7eb;
1859
+ --color-sf-diagram-palette-hover-background: #d1d5db;
1860
+ --color-sf-diagram-palette-selected-color: #9ca3af;
1861
+
1862
+ //rating
1863
+ --color-sf-rating-selected-color: #d1d5db;
1864
+ --color-sf-rating-unrated-color: #374151;
1865
+ --color-sf-rating-selected-disabled-color: #6b7280;
1866
+ --color-sf-rating-unrated-disabled-color: #374151;
1867
+ --color-sf-rating-selected-hover-color: #4f46e5;
1868
+ --color-sf-rating-unrated-hover-color: #9ca3af;
1869
+ --color-sf-rating-pressed-color: #69e1f3;
1870
+
1871
+ //Message default
1872
+ --color-sf-msg-color: #9ca3af;
1873
+ --color-sf-msg-bg-color: #1f2937;
1874
+ --color-sf-msg-border-color: #374151;
1875
+ --color-sf-msg-color-alt1: #9ca3af;
1876
+ --color-sf-msg-bg-color-alt1: rgba(255, 255, 255, .01);
1877
+ --color-sf-msg-border-color-alt1: #374151;
1878
+ --color-sf-msg-color-alt2: #9ca3af;
1879
+ --color-sf-msg-bg-color-alt2: #1f2937;
1880
+ --color-sf-msg-border-color-alt2: #2c394c;
1881
+ --color-sf-msg-icon-color: #9ca3af;
1882
+ --color-sf-msg-icon-color-alt1: #9ca3af;
1883
+ --color-sf-msg-icon-color-alt2: #9ca3af;
1884
+ --color-sf-msg-close-icon-color: #9ca3af;
1885
+ --color-sf-msg-close-icon-color-alt1: #adb5bd;
1886
+ --color-sf-msg-close-icon-color-alt2: #9ca3af;
1887
+
1888
+ //Message danger
1889
+ --color-sf-msg-danger-color: #f87171;
1890
+ --color-sf-msg-danger-bg-color: #271d2a;
1891
+ --color-sf-msg-danger-border-color: #4f2530;
1892
+ --color-sf-msg-danger-color-alt1: #f87171;
1893
+ --color-sf-msg-danger-bg-color-alt1: rgba(255, 255, 255, .01);
1894
+ --color-sf-msg-danger-border-color-alt1: #4f2530;
1895
+ --color-sf-msg-danger-color-alt2: #f87171;
1896
+ --color-sf-msg-danger-bg-color-alt2: #271d2a;
1897
+ --color-sf-msg-danger-border-color-alt2: #271d2a;
1898
+ --color-sf-msg-danger-icon-color: #f87171;
1899
+ --color-sf-msg-danger-icon-color-alt1: #f87171;
1900
+ --color-sf-msg-danger-icon-color-alt2: #f87171;
1901
+ --color-sf-msg-danger-close-icon-color: #f87171;
1902
+ --color-sf-msg-danger-close-icon-color-alt1: #adb5bd;
1903
+ --color-sf-msg-danger-close-icon-color-alt2: #adb5bd;
1904
+
1905
+ //Message success
1906
+ --color-sf-msg-success-color: #22c55e;
1907
+ --color-sf-msg-success-bg-color: #122a2c;
1908
+ --color-sf-msg-success-border-color: #154936;
1909
+ --color-sf-msg-success-color-alt1: #22c55e;
1910
+ --color-sf-msg-success-bg-color-alt1: rgba(255, 255, 255, .01);
1911
+ --color-sf-msg-success-border-color-alt1: #154936;
1912
+ --color-sf-msg-success-color-alt2: #22c55e;
1913
+ --color-sf-msg-success-bg-color-alt2: #122a2c;
1914
+ --color-sf-msg-success-border-color-alt2: #122a2c;
1915
+ --color-sf-msg-success-icon-color: #22c55e;
1916
+ --color-sf-msg-success-icon-color-alt1: #22c55e;
1917
+ --color-sf-msg-success-icon-color-alt2: #22c55e;
1918
+ --color-sf-msg-success-close-icon-color: #22c55e;
1919
+ --color-sf-msg-success-close-icon-color-alt1: #adb5bd;
1920
+ --color-sf-msg-success-close-icon-color-alt2: #adb5bd;
1921
+
1922
+ //Message warning
1923
+ --color-sf-msg-warning-color: #fb923c;
1924
+ --color-sf-msg-warning-bg-color: #282125;
1925
+ --color-sf-msg-warning-border-color: #523122;
1926
+ --color-sf-msg-warning-color-alt1: #fb923c;
1927
+ --color-sf-msg-warning-bg-color-alt1: rgba(255, 255, 255, .01);
1928
+ --color-sf-msg-warning-border-color-alt1: #523122;
1929
+ --color-sf-msg-warning-color-alt2: #fb923c;
1930
+ --color-sf-msg-warning-bg-color-alt2: #282125;
1931
+ --color-sf-msg-warning-border-color-alt2: #282125;
1932
+ --color-sf-msg-warning-icon-color: #fb923c;
1933
+ --color-sf-msg-warning-icon-color-alt1: #fb923c;
1934
+ --color-sf-msg-warning-icon-color-alt2: #fb923c;
1935
+ --color-sf-msg-warning-close-icon-color: #fb923c;
1936
+ --color-sf-msg-warning-close-icon-color-alt1: #adb5bd;
1937
+ --color-sf-msg-warning-close-icon-color-alt2: #adb5bd;
1938
+
1939
+ //Message info
1940
+ --color-sf-msg-info-color: #22d3ee;
1941
+ --color-sf-msg-info-bg-color: #102838;
1942
+ --color-sf-msg-info-border-color: #0e4457;
1943
+ --color-sf-msg-info-color-alt1: #22d3ee;
1944
+ --color-sf-msg-info-bg-color-alt1: rgba(255, 255, 255, .01);
1945
+ --color-sf-msg-info-border-color-alt1: #0e4457;
1946
+ --color-sf-msg-info-color-alt2: #22d3ee;
1947
+ --color-sf-msg-info-bg-color-alt2: #102838;
1948
+ --color-sf-msg-info-border-color-alt2: #102838;
1949
+ --color-sf-msg-info-icon-color: #06b6d4;
1950
+ --color-sf-msg-info-icon-color-alt1: #22d3ee;
1951
+ --color-sf-msg-info-icon-color-alt2: #22d3ee;
1952
+ --color-sf-msg-info-close-icon-color: #22d3ee;
1953
+ --color-sf-msg-info-close-icon-color-alt1: #adb5bd;
1954
+ --color-sf-msg-info-close-icon-color-alt2: #adb5bd;
1955
+
1956
+ //badge
1957
+ --color-sf-badge-light-bg-color: #faf9fa;
1958
+ --color-sf-badge-light-border-color: #faf9fa;
1959
+ --color-sf-badge-light-text-color: #000;
1960
+ --color-sf-badge-dark-bg-color: #212529;
1961
+ --color-sf-badge-dark-border-color: #212529;
1962
+ --color-sf-badge-dark-text-color: #fff;
1963
+
1964
+ //tab
1965
+ --color-sf-tab-border: #343a40;
1966
+
1967
+ //stepper
1968
+ --color-sf-stepper: rgba(17, 24, 39);
1969
+ --color-sf-shadow-color: #{#fff};
1970
+ --color-sf-shadow-color1: #{#000};
1971
+
1972
+ //breadcrumb
1973
+ --color-sf-breadcrumb-item-hover-color: #e5e7eb;
1974
+ --color-sf-breadcrumb-item-active-color: #d1d5db;
1975
+ --color-sf-breadcrumb-item-focus-border-color: $transparent;
1976
+
1977
+ // Transparent
1978
+ --color-sf-transparent: rgba(255, 255, 255, .01);
1979
+
1980
+ //Primary-chip
1981
+ --color-sf-chip-primary-bg-color: rgba(99, 102, 241, .1);
1982
+ --color-sf-chip-primary-icon-color: rgba(99, 102, 241, .5);
1983
+ --color-sf-chip-primary-border-color: rgba(79, 70, 229, .5);
1984
+ --color-sf-chip-primary-text: #818cf8;
1985
+ --color-sf-chip-primary-icon-color-hover: #818cf8;
1986
+ --color-sf-chip-primary-icon-color-pressed: #818cf8;
1987
+ --color-sf-chip-primary-bg-color-hover: rgba(99, 102, 241, .1);
1988
+ --color-sf-chip-primary-border-color-hover: rgba(79, 70, 229, .7);
1989
+ --color-sf-chip-primary-text-hover: #818cf8;
1990
+ --color-sf-chip-primary-bg-color-pressed: rgba(99, 102, 241, .7);
1991
+ --color-sf-chip-primary-icon-bg-color-pressed: rgba(99, 102, 241, .7);
1992
+ --color-sf-chip-primary-icon-bg-color-hover: rgba(99, 102, 241, .7);
1993
+ --color-sf-chip-primary-border-color-pressed: rgba(99, 102, 241, .7);
1994
+ --color-sf-chip-primary-text-pressed: #c7d2fe;
1995
+ --color-sf-chip-primary-bg-color-disabled: rgba(99, 102, 241, .1);
1996
+ --color-sf-chip-primary-border-color-disabled: rgba(79, 70, 229, .5);
1997
+ --color-sf-chip-primary-text-disabled: #3730a3;
1998
+
1999
+ //Secondary-chip
2000
+ --color-sf-chip-secondary-bg-color: #1f2937;
2001
+ --color-sf-chip-secondary-icon-color: #6b7280;
2002
+ --color-sf-chip-secondary-border-color: #374151;
2003
+ --color-sf-chip-secondary-text-color: #9ca3af;
2004
+ --color-sf-chip-secondary-icon-color-hover: #9ca3af;
2005
+ --color-sf-chip-secondary-icon-color-pressed: #9ca3af;
2006
+ --color-sf-chip-secondary-bg-color-hover: #1f2937;
2007
+ --color-sf-chip-secondary-border-color-hover: #4b5563;
2008
+ --color-sf-chip-secondary-text-color-hover: #9ca3af;
2009
+ --color-sf-chip-secondary-bg-color-pressed: #4b5563;
2010
+ --color-sf-chip-secondary-icon-bg-color-pressed: #4b5563;
2011
+ --color-sf-chip-secondary-icon-bg-color-hover: #4b5563;
2012
+ --color-sf-chip-secondary-border-color-pressed: #4b5563;
2013
+ --color-sf-chip-secondary-text-color-pressed: #d1d5db;
2014
+ --color-sf-chip-secondary-bg-color-disabled: #1f2937;
2015
+ --color-sf-chip-secondary-border-color-disabled: #374151;
2016
+ --color-sf-chip-secondary-text-color-disabled: #4b5563;
2017
+
2018
+ //Success-chip
2019
+ --color-sf-chip-success-bg-color: rgba(34, 197, 94, .1);
2020
+ --color-sf-chip-success-icon-color: rgba(34, 197, 94, .5);
2021
+ --color-sf-chip-success-border-color: rgba(34, 197, 94, .2);
2022
+ --color-sf-chip-success-text: #22c55e;
2023
+ --color-sf-chip-success-icon-color-hover: #22c55e;
2024
+ --color-sf-chip-success-icon-color-pressed: #4ade80;
2025
+ --color-sf-chip-success-bg-color-hover: rgba(34, 197, 94, .1);
2026
+ --color-sf-chip-success-border-color-hover: rgba(34, 197, 94, .3);
2027
+ --color-sf-chip-success-text-hover: #22c55e;
2028
+ --color-sf-chip-success-bg-color-pressed: rgba(34, 197, 94, .3);
2029
+ --color-sf-chip-success-icon-bg-color-pressed: rgba(34, 197, 94, .3);
2030
+ --color-sf-chip-success-icon-bg-color-hover: rgba(34, 197, 94, .3);
2031
+ --color-sf-chip-success-border-color-pressed: rgba(34, 197, 94, .3);
2032
+ --color-sf-chip-success-text-pressed: #22c55e;
2033
+ --color-sf-chip-success-bg-color-disabled: rgba(34, 197, 94, .1);
2034
+ --color-sf-chip-success-border-color-disabled: rgba(34, 197, 94, .1);
2035
+ --color-sf-chip-success-text-disabled: #14532d;
2036
+
2037
+ //Warning-chip
2038
+ --color-sf-chip-warning-bg-color: rgba(249, 115, 22, .1);
2039
+ --color-sf-chip-warning-icon-color: rgba(249, 115, 22, .5);
2040
+ --color-sf-chip-warning-border-color: rgba(249, 115, 22, .2);
2041
+ --color-sf-chip-warning-text: #fb923c;
2042
+ --color-sf-chip-warning-icon-color-hover: #fb923c;
2043
+ --color-sf-chip-warning-icon-color-pressed: #fb923c;
2044
+ --color-sf-chip-warning-bg-color-hover: rgba(249, 115, 22, .1);
2045
+ --color-sf-chip-warning-border-color-hover: rgba(249, 115, 22, .3);
2046
+ --color-sf-chip-warning-text-hover: #fb923c;
2047
+ --color-sf-chip-warning-bg-color-pressed: rgba(249, 115, 22, .3);
2048
+ --color-sf-chip-warning-icon-bg-color-pressed: rgba(249, 115, 22, .3);
2049
+ --color-sf-chip-warning-icon-bg-color-hover: rgba(249, 115, 22, .3);
2050
+ --color-sf-chip-warning-border-color-pressed: rgba(249, 115, 22, .3);
2051
+ --color-sf-chip-warning-text-pressed: #fed7aa;
2052
+ --color-sf-chip-warning-bg-color-disabled: rgba(249, 115, 22, .1);
2053
+ --color-sf-chip-warning-border-color-disabled: rgba(249, 115, 22, .1);
2054
+ --color-sf-chip-warning-text-disabled: #9a3412;
2055
+
2056
+ //danger-chip
2057
+ --color-sf-chip-danger-bg-color: rgba(239, 68, 68, .1);
2058
+ --color-sf-chip-danger-icon-color: rgba(239, 68, 68, .5);
2059
+ --color-sf-chip-danger-border-color: rgba(239, 68, 68, .2);
2060
+ --color-sf-chip-danger-text: #f87171;
2061
+ --color-sf-chip-danger-icon-color-hover: #f87171;
2062
+ --color-sf-chip-danger-icon-color-pressed: #f87171;
2063
+ --color-sf-chip-danger-bg-color-hover: rgba(239, 68, 68, .1);
2064
+ --color-sf-chip-danger-border-color-hover: rgba(239, 68, 68, .3);
2065
+ --color-sf-chip-danger-text-hover: #f87171;
2066
+ --color-sf-chip-danger-bg-color-pressed: rgba(239, 68, 68, .3);
2067
+ --color-sf-chip-danger-icon-bg-color-pressed: rgba(239, 68, 68, .3);
2068
+ --color-sf-chip-danger-icon-bg-color-hover: rgba(239, 68, 68, .3);
2069
+ --color-sf-chip-danger-border-color-pressed: rgba(239, 68, 68, .3);
2070
+ --color-sf-chip-danger-text-pressed: #fca5a5;
2071
+ --color-sf-chip-danger-bg-color-disabled: rgba(239, 68, 68, .1);
2072
+ --color-sf-chip-danger-border-color-disabled: rgba(239, 68, 68, .2);
2073
+ --color-sf-chip-danger-text-disabled: #7f1d1d;
2074
+
2075
+ //Info-chip
2076
+ --color-sf-chip-info-bg-color: rgba(6, 182, 212, .1);
2077
+ --color-sf-chip-info-icon-color: rgba(6, 182, 212, .5);
2078
+ --color-sf-chip-info-border-color: rgba(6, 182, 212, .2);
2079
+ --color-sf-chip-info-text: #22d3ee;
2080
+ --color-sf-chip-info-icon-color-hover: #22d3ee;
2081
+ --color-sf-chip-info-icon-color-pressed: #22d3ee;
2082
+ --color-sf-chip-info-bg-color-hover: rgba(6, 182, 212, .1);
2083
+ --color-sf-chip-info-border-color-hover: rgba(6, 182, 212, .3);
2084
+ --color-sf-chip-info-text-hover: #22d3ee;
2085
+ --color-sf-chip-info-bg-color-pressed: rgba(6, 182, 212, .3);
2086
+ --color-sf-chip-info-icon-bg-color-pressed: rgba(6, 182, 212, .3);
2087
+ --color-sf-chip-info-icon-bg-color-hover: rgba(6, 182, 212, .3);
2088
+ --color-sf-chip-info-border-color-pressed: rgba(6, 182, 212, .3);
2089
+ --color-sf-chip-info-text-pressed: #22d3ee;
2090
+ --color-sf-chip-info-bg-color-disabled: rgba(6, 182, 212, .1);
2091
+ --color-sf-chip-info-border-color-disabled: rgba(6, 182, 212, .2);
2092
+ --color-sf-chip-info-text-disabled: #155e75;
2093
+ }