@yakad/ui 1.2.68-beta → 1.2.70-beta

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 (129) hide show
  1. package/appBar/appBar.module.css +14 -14
  2. package/appBar/appBar.tsx +15 -15
  3. package/button/button.module.css +167 -167
  4. package/button/button.tsx +85 -85
  5. package/card/card.module.css +11 -11
  6. package/card/card.tsx +15 -15
  7. package/clickAwayListener/clickAwayListener.tsx +27 -27
  8. package/client.tsx +4 -4
  9. package/codeField/codeField.module.css +23 -23
  10. package/codeField/codeField.tsx +32 -32
  11. package/container/container.module.css +24 -24
  12. package/container/container.tsx +27 -27
  13. package/footer/footer.module.css +9 -9
  14. package/footer/footer.tsx +15 -15
  15. package/form/form.module.css +6 -6
  16. package/form/form.tsx +23 -23
  17. package/gridContainer/gridContainer.module.css +5 -5
  18. package/gridContainer/gridContainer.tsx +28 -28
  19. package/gridItem/gridItem.module.css +192 -192
  20. package/gridItem/gridItem.tsx +31 -31
  21. package/historyBack/historyBack.tsx +20 -20
  22. package/hr/hr.module.css +19 -19
  23. package/hr/hr.tsx +32 -32
  24. package/index.tsx +46 -46
  25. package/inputField/inputField.module.css +167 -167
  26. package/inputField/inputField.tsx +38 -38
  27. package/list/list.module.css +22 -22
  28. package/list/list.tsx +25 -25
  29. package/listItem/listItem.module.css +6 -6
  30. package/listItem/listItem.tsx +12 -12
  31. package/loading/loading.module.css +91 -91
  32. package/loading/loading.tsx +25 -25
  33. package/main/main.module.css +19 -19
  34. package/main/main.tsx +25 -25
  35. package/navigation/navigation.module.css +61 -58
  36. package/navigation/navigation.tsx +24 -24
  37. package/package.json +32 -32
  38. package/page/page.module.css +10 -10
  39. package/page/page.tsx +15 -15
  40. package/row/row.module.css +7 -7
  41. package/row/row.tsx +15 -15
  42. package/spacer/spacer.module.css +5 -5
  43. package/spacer/spacer.tsx +8 -8
  44. package/stack/stack.module.css +6 -6
  45. package/stack/stack.tsx +15 -15
  46. package/svgIcon/svgIcon.module.css +5 -5
  47. package/svgIcon/svgIcon.tsx +26 -26
  48. package/theme/theme.module.css +397 -397
  49. package/theme/theme.tsx +29 -28
  50. package/theme/zoom.css +3 -3
  51. package/tsconfig.json +13 -13
  52. package/appBar/appBar.d.ts +0 -3
  53. package/appBar/appBar.js +0 -9
  54. package/appBar/appBar.js.map +0 -1
  55. package/button/button.d.ts +0 -14
  56. package/button/button.js +0 -25
  57. package/button/button.js.map +0 -1
  58. package/card/card.d.ts +0 -3
  59. package/card/card.js +0 -9
  60. package/card/card.js.map +0 -1
  61. package/clickAwayListener/clickAwayListener.d.ts +0 -6
  62. package/clickAwayListener/clickAwayListener.js +0 -17
  63. package/clickAwayListener/clickAwayListener.js.map +0 -1
  64. package/client.d.ts +0 -3
  65. package/client.js +0 -4
  66. package/client.js.map +0 -1
  67. package/codeField/codeField.d.ts +0 -8
  68. package/codeField/codeField.js +0 -10
  69. package/codeField/codeField.js.map +0 -1
  70. package/container/container.d.ts +0 -8
  71. package/container/container.js +0 -9
  72. package/container/container.js.map +0 -1
  73. package/footer/footer.d.ts +0 -3
  74. package/footer/footer.js +0 -9
  75. package/footer/footer.js.map +0 -1
  76. package/form/form.d.ts +0 -3
  77. package/form/form.js +0 -12
  78. package/form/form.js.map +0 -1
  79. package/gridContainer/gridContainer.d.ts +0 -7
  80. package/gridContainer/gridContainer.js +0 -11
  81. package/gridContainer/gridContainer.js.map +0 -1
  82. package/gridItem/gridItem.d.ts +0 -10
  83. package/gridItem/gridItem.js +0 -10
  84. package/gridItem/gridItem.js.map +0 -1
  85. package/historyBack/historyBack.d.ts +0 -3
  86. package/historyBack/historyBack.js +0 -11
  87. package/historyBack/historyBack.js.map +0 -1
  88. package/hr/hr.d.ts +0 -8
  89. package/hr/hr.js +0 -12
  90. package/hr/hr.js.map +0 -1
  91. package/index.d.ts +0 -23
  92. package/index.js +0 -24
  93. package/index.js.map +0 -1
  94. package/inputField/inputField.d.ts +0 -12
  95. package/inputField/inputField.js +0 -11
  96. package/inputField/inputField.js.map +0 -1
  97. package/list/list.d.ts +0 -7
  98. package/list/list.js +0 -9
  99. package/list/list.js.map +0 -1
  100. package/listItem/listItem.d.ts +0 -3
  101. package/listItem/listItem.js +0 -7
  102. package/listItem/listItem.js.map +0 -1
  103. package/loading/loading.d.ts +0 -7
  104. package/loading/loading.js +0 -10
  105. package/loading/loading.js.map +0 -1
  106. package/main/main.d.ts +0 -6
  107. package/main/main.js +0 -10
  108. package/main/main.js.map +0 -1
  109. package/navigation/navigation.d.ts +0 -7
  110. package/navigation/navigation.js +0 -9
  111. package/navigation/navigation.js.map +0 -1
  112. package/page/page.d.ts +0 -3
  113. package/page/page.js +0 -9
  114. package/page/page.js.map +0 -1
  115. package/row/row.d.ts +0 -3
  116. package/row/row.js +0 -9
  117. package/row/row.js.map +0 -1
  118. package/spacer/spacer.d.ts +0 -3
  119. package/spacer/spacer.js +0 -7
  120. package/spacer/spacer.js.map +0 -1
  121. package/stack/stack.d.ts +0 -3
  122. package/stack/stack.js +0 -9
  123. package/stack/stack.js.map +0 -1
  124. package/svgIcon/svgIcon.d.ts +0 -6
  125. package/svgIcon/svgIcon.js +0 -12
  126. package/svgIcon/svgIcon.js.map +0 -1
  127. package/theme/theme.d.ts +0 -9
  128. package/theme/theme.js +0 -11
  129. package/theme/theme.js.map +0 -1
package/theme/theme.module.css CHANGED
@@ -1,397 +1,397 @@
1
- .blue {
2
- --LightPrimaryColor: 11 87 208;
3
- --LightPrimaryContainerColor: 211 227 253;
4
- --LightSecondaryColor: 98 91 113;
5
- --LightSecondaryContainerColor: 232 222 248;
6
- --LightTertiaryColor: 196 238 208;
7
- --LightSurfaceColor: 34 34 34;
8
- --LightErrorColor: 179 38 30;
9
- --LightErrorContainerColor: 249 222 220;
10
- --LightOnPrimaryColor: 255 255 255;
11
- --LightOnPrimaryContainerColor: 4 30 73;
12
- --LightOnSecondaryColor: 255 255 255;
13
- --LightOnSecondaryContainerColor: 30 25 43;
14
- --LightOnTertiaryColor: 7 39 17;
15
- --LightOnErrorColor: 255 255 255;
16
- --LightOnErrorContainerColor: 65 14 11;
17
- /* neutral colors */
18
- --LightSurfaceColor: 254 247 255;
19
- --LightSurfaceVariantColor: 231 224 236;
20
- --LightSurfaceDimColor: 222 216 225;
21
- --LightSurfaceBrightColor: 254 247 255;
22
- --LightSurfaceContainerLowestColor: 255 255 255;
23
- --LightSurfaceContainerLowColor: 247 242 250;
24
- --LightSurfaceContainerColor: 243 237 247;
25
- --LightSurfaceContainerHightColor: 236 230 240;
26
- --LightSurfaceContainerHighestColor: 230 224 233;
27
- --LightOnSurfaceColor: 28 27 31;
28
- --LightOnSurfaceVariantColor: 73 69 78;
29
- --LightOutlineColor: 121 116 126;
30
- --LightOutlineVariantColor: 196 199 197;
31
-
32
- --DarkPrimaryColor: 168 199 250;
33
- --DarkPrimaryContainerColor: 8 66 160;
34
- --DarkSecondaryColor: 204 194 220;
35
- --DarkSecondaryContainerColor: 232 222 248;
36
- --DarkTertiaryColor: 7 39 17;
37
- --DarkErrorColor: 242 184 181;
38
- --DarkErrorContainerColor: 140 29 24;
39
- --DarkOnPrimaryColor: 6 46 111;
40
- --DarkOnPrimaryContainerColor: 211 227 253;
41
- --DarkOnSecondaryColor: 51 45 65;
42
- --DarkOnSecondaryContainerColor: 232 222 248;
43
- --DarkOnTertiaryColor: 196 238 208;
44
- --DarkOnErrorColor: 96 20 16;
45
- --DarkOnErrorContainerColor: 249 222 220;
46
- /* neutral colors */
47
- --DarkSurfaceColor: 20 18 24;
48
- --DarkSurfaceVariantColor: 73 69 79;
49
- --DarkSurfaceDimColor: 20 18 24;
50
- --DarkSurfaceBrightColor: 59 56 62;
51
- --DarkSurfaceContainerLowestColor: 15 13 19;
52
- --DarkSurfaceContainerLowColor: 29 27 32;
53
- --DarkSurfaceContainerColor: 33 31 38;
54
- --DarkSurfaceContainerHightColor: 43 41 48;
55
- --DarkSurfaceContainerHighestColor: 54 52 59;
56
- --DarkOnSurfaceColor: 230 225 229;
57
- --DarkOnSurfaceVariantColor: 202 196 208;
58
- --DarkOutlineColor: 147 143 153;
59
- --DarkOutlineVariantColor: 68 71 70;
60
- }
61
- .green {
62
- --LightPrimaryColor: 56 106 32;
63
- --LightPrimaryContainerColor: 184 243 151;
64
- --LightSecondaryColor: 98 91 113;
65
- --LightSecondaryContainerColor: 232 222 248;
66
- --LightTertiaryColor: 187 235 235;
67
- --LightErrorColor: 179 38 30;
68
- --LightErrorContainerColor: 249 222 220;
69
- --LightOnPrimaryColor: 255 255 255;
70
- --LightOnPrimaryContainerColor: 4 33 0;
71
- --LightOnSecondaryColor: 255 255 255;
72
- --LightOnSecondaryContainerColor: 30 25 43;
73
- --LightOnTertiaryColor: 0 32 33;
74
- --LightOnErrorColor: 255 255 255;
75
- --LightOnErrorContainerColor: 65 14 11;
76
- /* neutral colors */
77
- --LightSurfaceColor: 254 247 255;
78
- --LightSurfaceVariantColor: 231 224 236;
79
- --LightSurfaceDimColor: 222 216 225;
80
- --LightSurfaceBrightColor: 254 247 255;
81
- --LightSurfaceContainerLowestColor: 255 255 255;
82
- --LightSurfaceContainerLowColor: 247 242 250;
83
- --LightSurfaceContainerColor: 243 237 247;
84
- --LightSurfaceContainerHightColor: 236 230 240;
85
- --LightSurfaceContainerHighestColor: 230 224 233;
86
- --LightOnSurfaceColor: 28 27 31;
87
- --LightOnSurfaceVariantColor: 73 69 78;
88
- --LightOutlineColor: 121 116 126;
89
- --LightOutlineVariantColor: 196 199 197;
90
-
91
- --DarkPrimaryColor: 156 214 125;
92
- --DarkPrimaryContainerColor: 32 81 7;
93
- --DarkSecondaryColor: 204 194 220;
94
- --DarkSecondaryContainerColor: 232 222 248;
95
- --DarkTertiaryColor: 0 32 33;
96
- --DarkErrorColor: 242 184 181;
97
- --DarkErrorContainerColor: 140 29 24;
98
- --DarkOnPrimaryColor: 12 57 0;
99
- --DarkOnPrimaryContainerColor: 184 243 151;
100
- --DarkOnSecondaryColor: 51 45 65;
101
- --DarkOnSecondaryContainerColor: 232 222 248;
102
- --DarkOnTertiaryColor: 187 235 235;
103
- --DarkOnErrorColor: 96 20 16;
104
- --DarkOnErrorContainerColor: 249 222 220;
105
- /* neutral colors */
106
- --DarkSurfaceColor: 20 18 24;
107
- --DarkSurfaceVariantColor: 73 69 79;
108
- --DarkSurfaceDimColor: 20 18 24;
109
- --DarkSurfaceBrightColor: 59 56 62;
110
- --DarkSurfaceContainerLowestColor: 15 13 19;
111
- --DarkSurfaceContainerLowColor: 29 27 32;
112
- --DarkSurfaceContainerColor: 33 31 38;
113
- --DarkSurfaceContainerHightColor: 43 41 48;
114
- --DarkSurfaceContainerHighestColor: 54 52 59;
115
- --DarkOnSurfaceColor: 230 225 229;
116
- --DarkOnSurfaceVariantColor: 202 196 208;
117
- --DarkOutlineColor: 147 143 153;
118
- --DarkOutlineVariantColor: 68 71 70;
119
- }
120
-
121
- .red {
122
- --LightPrimaryColor: 156 65 70;
123
- --LightPrimaryContainerColor: 255 218 219;
124
- --LightSecondaryColor: 98 91 113;
125
- --LightSecondaryContainerColor: 232 222 248;
126
- --LightTertiaryColor: 255 221 170;
127
- --LightErrorColor: 179 38 30;
128
- --LightErrorContainerColor: 249 222 220;
129
- --LightOnPrimaryColor: 255 255 255;
130
- --LightOnPrimaryContainerColor: 64 0 8;
131
- --LightOnSecondaryColor: 255 255 255;
132
- --LightOnSecondaryContainerColor: 30 25 43;
133
- --LightOnTertiaryColor: 40 24 0;
134
- --LightOnErrorColor: 255 255 255;
135
- --LightOnErrorContainerColor: 65 14 11;
136
- /* neutral colors */
137
- --LightSurfaceColor: 254 247 255;
138
- --LightSurfaceVariantColor: 231 224 236;
139
- --LightSurfaceDimColor: 222 216 225;
140
- --LightSurfaceBrightColor: 254 247 255;
141
- --LightSurfaceContainerLowestColor: 255 255 255;
142
- --LightSurfaceContainerLowColor: 247 242 250;
143
- --LightSurfaceContainerColor: 243 237 247;
144
- --LightSurfaceContainerHightColor: 236 230 240;
145
- --LightSurfaceContainerHighestColor: 230 224 233;
146
- --LightOnSurfaceColor: 28 27 31;
147
- --LightOnSurfaceVariantColor: 73 69 78;
148
- --LightOutlineColor: 121 116 126;
149
- --LightOutlineVariantColor: 196 199 197;
150
-
151
- --DarkPrimaryColor: 255 179 181;
152
- --DarkPrimaryContainerColor: 125 42 48;
153
- --DarkSecondaryColor: 204 194 220;
154
- --DarkSecondaryContainerColor: 232 222 248;
155
- --DarkTertiaryColor: 40 24 0;
156
- --DarkErrorColor: 242 184 181;
157
- --DarkErrorContainerColor: 140 29 24;
158
- --DarkOnPrimaryColor: 95 18 27;
159
- --DarkOnPrimaryContainerColor: 255 218 219;
160
- --DarkOnSecondaryColor: 51 45 65;
161
- --DarkOnSecondaryContainerColor: 232 222 248;
162
- --DarkOnTertiaryColor: 255 221 170;
163
- --DarkOnErrorColor: 96 20 16;
164
- --DarkOnErrorContainerColor: 249 222 220;
165
- /* neutral colors */
166
- --DarkSurfaceColor: 20 18 24;
167
- --DarkSurfaceVariantColor: 73 69 79;
168
- --DarkSurfaceDimColor: 20 18 24;
169
- --DarkSurfaceBrightColor: 59 56 62;
170
- --DarkSurfaceContainerLowestColor: 15 13 19;
171
- --DarkSurfaceContainerLowColor: 29 27 32;
172
- --DarkSurfaceContainerColor: 33 31 38;
173
- --DarkSurfaceContainerHightColor: 43 41 48;
174
- --DarkSurfaceContainerHighestColor: 54 52 59;
175
- --DarkOnSurfaceColor: 230 225 229;
176
- --DarkOnSurfaceVariantColor: 202 196 208;
177
- --DarkOutlineColor: 147 143 153;
178
- --DarkOutlineVariantColor: 68 71 70;
179
- }
180
-
181
- .yellow {
182
- --LightPrimaryColor: 97 98 0;
183
- --LightPrimaryContainerColor: 232 233 113;
184
- --LightSecondaryColor: 98 91 113;
185
- --LightSecondaryContainerColor: 232 222 248;
186
- --LightTertiaryColor: 191 237 217;
187
- --LightErrorColor: 179 38 30;
188
- --LightErrorContainerColor: 249 222 220;
189
- --LightOnPrimaryColor: 255 255 255;
190
- --LightOnPrimaryContainerColor: 29 29 0;
191
- --LightOnSecondaryColor: 255 255 255;
192
- --LightOnSecondaryContainerColor: 30 25 43;
193
- --LightOnTertiaryColor: 0 33 23;
194
- --LightOnErrorColor: 255 255 255;
195
- --LightOnErrorContainerColor: 65 14 11;
196
- /* neutral colors */
197
- --LightSurfaceColor: 254 247 255;
198
- --LightSurfaceVariantColor: 231 224 236;
199
- --LightSurfaceDimColor: 222 216 225;
200
- --LightSurfaceBrightColor: 254 247 255;
201
- --LightSurfaceContainerLowestColor: 255 255 255;
202
- --LightSurfaceContainerLowColor: 247 242 250;
203
- --LightSurfaceContainerColor: 243 237 247;
204
- --LightSurfaceContainerHightColor: 236 230 240;
205
- --LightSurfaceContainerHighestColor: 230 224 233;
206
- --LightOnSurfaceColor: 28 27 31;
207
- --LightOnSurfaceVariantColor: 73 69 78;
208
- --LightOutlineColor: 121 116 126;
209
- --LightOutlineVariantColor: 196 199 197;
210
-
211
- --DarkPrimaryColor: 203 204 88;
212
- --DarkPrimaryContainerColor: 73 74 0;
213
- --DarkSecondaryColor: 204 194 220;
214
- --DarkSecondaryContainerColor: 232 222 248;
215
- --DarkTertiaryColor: 0 33 23;
216
- --DarkErrorColor: 242 184 181;
217
- --DarkErrorContainerColor: 140 29 24;
218
- --DarkOnPrimaryColor: 50 50 0;
219
- --DarkOnPrimaryContainerColor: 232 233 113;
220
- --DarkOnSecondaryColor: 51 45 65;
221
- --DarkOnSecondaryContainerColor: 232 222 248;
222
- --DarkOnTertiaryColor: 191 237 217;
223
- --DarkOnErrorColor: 96 20 16;
224
- --DarkOnErrorContainerColor: 249 222 220;
225
- /* neutral colors */
226
- --DarkSurfaceColor: 20 18 24;
227
- --DarkSurfaceVariantColor: 73 69 79;
228
- --DarkSurfaceDimColor: 20 18 24;
229
- --DarkSurfaceBrightColor: 59 56 62;
230
- --DarkSurfaceContainerLowestColor: 15 13 19;
231
- --DarkSurfaceContainerLowColor: 29 27 32;
232
- --DarkSurfaceContainerColor: 33 31 38;
233
- --DarkSurfaceContainerHightColor: 43 41 48;
234
- --DarkSurfaceContainerHighestColor: 54 52 59;
235
- --DarkOnSurfaceColor: 230 225 229;
236
- --DarkOnSurfaceVariantColor: 202 196 208;
237
- --DarkOutlineColor: 147 143 153;
238
- --DarkOutlineVariantColor: 68 71 70;
239
- }
240
- .purple {
241
- --LightPrimaryColor: 103 80 164;
242
- --LightPrimaryContainerColor: 234 221 255;
243
- --LightSecondaryColor: 98 91 113;
244
- --LightSecondaryContainerColor: 232 222 248;
245
- --LightTertiaryColor: 125 82 96;
246
- --LightTertiaryContainerColor: 255 216 228;
247
- --LightSurfaceColor: 34 34 34;
248
- --LightErrorColor: 179 38 30;
249
- --LightErrorContainerColor: 249 222 220;
250
- --LightOnPrimaryColor: 255 255 255;
251
- --LightOnPrimaryContainerColor: 33 0 94;
252
- --LightOnSecondaryColor: 255 255 255;
253
- --LightOnSecondaryContainerColor: 30 25 43;
254
- --LightOnTertiaryColor: 255 255 255;
255
- --LightOnTertiaryContainerColor: 55 11 30;
256
- --LightOnErrorColor: 255 255 255;
257
- --LightOnErrorContainerColor: 65 14 11;
258
- /* neutral colors */
259
- --LightSurfaceColor: 254 247 255;
260
- --LightSurfaceVariantColor: 231 224 236;
261
- --LightSurfaceDimColor: 222 216 225;
262
- --LightSurfaceBrightColor: 254 247 255;
263
- --LightSurfaceContainerLowestColor: 255 255 255;
264
- --LightSurfaceContainerLowColor: 247 242 250;
265
- --LightSurfaceContainerColor: 243 237 247;
266
- --LightSurfaceContainerHightColor: 236 230 240;
267
- --LightSurfaceContainerHighestColor: 230 224 233;
268
- --LightOnSurfaceColor: 28 27 31;
269
- --LightOnSurfaceVariantColor: 73 69 78;
270
- --LightOutlineColor: 121 116 126;
271
- --LightOutlineVariantColor: 196 199 197;
272
-
273
- --DarkPrimaryColor: 208 188 255;
274
- --DarkPrimaryContainerColor: 79 55 139;
275
- --DarkSecondaryColor: 204 194 220;
276
- --DarkSecondaryContainerColor: 232 222 248;
277
- --DarkTertiaryColor: 239 184 200;
278
- --DarkTertiaryContainerColor: 99 59 72;
279
- --DarkErrorColor: 242 184 181;
280
- --DarkErrorContainerColor: 140 29 24;
281
- --DarkOnPrimaryColor: 55 30 115;
282
- --DarkOnPrimaryContainerColor: 234 221 255;
283
- --DarkOnSecondaryColor: 51 45 65;
284
- --DarkOnSecondaryContainerColor: 232 222 248;
285
- --DarkOnTertiaryColor: 73 37 50;
286
- --DarkOnTertiaryContainerColor: 255 216 228;
287
- --DarkOnErrorColor: 96 20 16;
288
- --DarkOnErrorContainerColor: 249 222 220;
289
- /* neutral colors */
290
- --DarkSurfaceColor: 20 18 24;
291
- --DarkSurfaceVariantColor: 73 69 79;
292
- --DarkSurfaceDimColor: 20 18 24;
293
- --DarkSurfaceBrightColor: 59 56 62;
294
- --DarkSurfaceContainerLowestColor: 15 13 19;
295
- --DarkSurfaceContainerLowColor: 29 27 32;
296
- --DarkSurfaceContainerColor: 33 31 38;
297
- --DarkSurfaceContainerHightColor: 43 41 48;
298
- --DarkSurfaceContainerHighestColor: 54 52 59;
299
- --DarkOnSurfaceColor: 230 225 229;
300
- --DarkOnSurfaceVariantColor: 202 196 208;
301
- --DarkOutlineColor: 147 143 153;
302
- --DarkOutlineVariantColor: 68 71 70;
303
- }
304
-
305
- .system,
306
- .light {
307
- --primaryColor: var(--LightPrimaryColor);
308
- --primaryContainerColor: var(--LightPrimaryContainerColor);
309
- --secondaryColor: var(--LightSecondaryColor);
310
- --secondaryContainerColor: var(--LightSecondaryContainerColor);
311
- --tertiaryColor: var(--LightTertiaryColor);
312
- --errorColor: var(--LightErrorColor);
313
- --errorContainerColor: var(--LightErrorContainerColor);
314
- --onPrimaryColor: var(--LightOnPrimaryColor);
315
- --onPrimaryContainerColor: var(--LightOnPrimaryContainerColor);
316
- --onSecondaryColor: var(--LightOnSecondaryColor);
317
- --onSecondaryContainerColor: var(--LightOnSecondaryContainerColor);
318
- --onTertiaryColor: var(--LightOnTertiaryColor);
319
- --onErrorColor: var(--LightOnErrorColor);
320
- --onErrorContainerColor: var(--LightOnErrorContainerColor);
321
- --surfaceColor: var(--LightSurfaceColor);
322
- --surfaceVariantColor: var(--LightSurfaceVariantColor);
323
- --surfaceDimColor: var(--LightSurfaceDimColor);
324
- --surfaceBrightColor: var(--LightSurfaceBrightColor);
325
- --surfaceContainerLowestColor: var(--LightSurfaceContainerLowestColor);
326
- --surfaceContainerLowColor: var(--LightSurfaceContainerLowColor);
327
- --surfaceContainerColor: var(--LightSurfaceContainerColor);
328
- --surfaceContainerHightColor: var(--LightSurfaceContainerHightColor);
329
- --surfaceContainerHighestColor: var(--LightSurfaceContainerHighestColor);
330
- --onSurfaceColor: var(--LightOnSurfaceColor);
331
- --onSurfaceRGBColor: var(--LightOnSurfaceRGBColor);
332
- --onSurfaceVariantColor: var(--LightOnSurfaceVariantColor);
333
- --outlineColor: var(--LightOutlineColor);
334
- --outlineVariantColor: var(--LightOutlineVariantColor);
335
- }
336
- .dark {
337
- --primaryColor: var(--DarkPrimaryColor);
338
- --primaryContainerColor: var(--DarkPrimaryContainerColor);
339
- --secondaryColor: var(--DarkSecondaryColor);
340
- --secondaryContainerColor: var(--DarkSecondaryContainerColor);
341
- --tertiaryColor: var(--DarkTertiaryColor);
342
- --errorColor: var(--DarkErrorColor);
343
- --errorContainerColor: var(--DarkErrorContainerColor);
344
- --onPrimaryColor: var(--DarkOnPrimaryColor);
345
- --onPrimaryContainerColor: var(--DarkOnPrimaryContainerColor);
346
- --onSecondaryColor: var(--DarkOnSecondaryColor);
347
- --onSecondaryContainerColor: var(--DarkOnSecondaryContainerColor);
348
- --onTertiaryColor: var(--DarkOnTertiaryColor);
349
- --onErrorColor: var(--DarkOnErrorColor);
350
- --onErrorContainerColor: var(--DarkOnErrorContainerColor);
351
- --surfaceColor: var(--DarkSurfaceColor);
352
- --surfaceVariantColor: var(--DarkSurfaceVariantColor);
353
- --surfaceDimColor: var(--DarkSurfaceDimColor);
354
- --surfaceBrightColor: var(--DarkSurfaceBrightColor);
355
- --surfaceContainerLowestColor: var(--DarkSurfaceContainerLowestColor);
356
- --surfaceContainerLowColor: var(--DarkSurfaceContainerLowColor);
357
- --surfaceContainerColor: var(--DarkSurfaceContainerColor);
358
- --surfaceContainerHightColor: var(--DarkSurfaceContainerHightColor);
359
- --surfaceContainerHighestColor: var(--DarkSurfaceContainerHighestColor);
360
- --onSurfaceColor: var(--DarkOnSurfaceColor);
361
- --onSurfaceRGBColor: var(--DarkOnSurfaceRGBColor);
362
- --onSurfaceVariantColor: var(--DarkOnSurfaceVariantColor);
363
- --outlineColor: var(--DarkOutlineColor);
364
- --outlineVariantColor: var(--DarkOutlineVariantColor);
365
- }
366
- @media (prefers-color-scheme: dark) {
367
- .system {
368
- --primaryColor: var(--DarkPrimaryColor);
369
- --primaryContainerColor: var(--DarkPrimaryContainerColor);
370
- --secondaryColor: var(--DarkSecondaryColor);
371
- --secondaryContainerColor: var(--DarkSecondaryContainerColor);
372
- --tertiaryColor: var(--DarkTertiaryColor);
373
- --errorColor: var(--DarkErrorColor);
374
- --errorContainerColor: var(--DarkErrorContainerColor);
375
- --onPrimaryColor: var(--DarkOnPrimaryColor);
376
- --onPrimaryContainerColor: var(--DarkOnPrimaryContainerColor);
377
- --onSecondaryColor: var(--DarkOnSecondaryColor);
378
- --onSecondaryContainerColor: var(--DarkOnSecondaryContainerColor);
379
- --onTertiaryColor: var(--DarkOnTertiaryColor);
380
- --onErrorColor: var(--DarkOnErrorColor);
381
- --onErrorContainerColor: var(--DarkOnErrorContainerColor);
382
- --surfaceColor: var(--DarkSurfaceColor);
383
- --surfaceVariantColor: var(--DarkSurfaceVariantColor);
384
- --surfaceDimColor: var(--DarkSurfaceDimColor);
385
- --surfaceBrightColor: var(--DarkSurfaceBrightColor);
386
- --surfaceContainerLowestColor: var(--DarkSurfaceContainerLowestColor);
387
- --surfaceContainerLowColor: var(--DarkSurfaceContainerLowColor);
388
- --surfaceContainerColor: var(--DarkSurfaceContainerColor);
389
- --surfaceContainerHightColor: var(--DarkSurfaceContainerHightColor);
390
- --surfaceContainerHighestColor: var(--DarkSurfaceContainerHighestColor);
391
- --onSurfaceColor: var(--DarkOnSurfaceColor);
392
- --onSurfaceRGBColor: var(--DarkOnSurfaceRGBColor);
393
- --onSurfaceVariantColor: var(--DarkOnSurfaceVariantColor);
394
- --outlineColor: var(--DarkOutlineColor);
395
- --outlineVariantColor: var(--DarkOutlineVariantColor);
396
- }
397
- }
1
+ .blue {
2
+ --LightPrimaryColor: 11 87 208;
3
+ --LightPrimaryContainerColor: 211 227 253;
4
+ --LightSecondaryColor: 98 91 113;
5
+ --LightSecondaryContainerColor: 232 222 248;
6
+ --LightTertiaryColor: 196 238 208;
7
+ --LightSurfaceColor: 34 34 34;
8
+ --LightErrorColor: 179 38 30;
9
+ --LightErrorContainerColor: 249 222 220;
10
+ --LightOnPrimaryColor: 255 255 255;
11
+ --LightOnPrimaryContainerColor: 4 30 73;
12
+ --LightOnSecondaryColor: 255 255 255;
13
+ --LightOnSecondaryContainerColor: 30 25 43;
14
+ --LightOnTertiaryColor: 7 39 17;
15
+ --LightOnErrorColor: 255 255 255;
16
+ --LightOnErrorContainerColor: 65 14 11;
17
+ /* neutral colors */
18
+ --LightSurfaceColor: 254 247 255;
19
+ --LightSurfaceVariantColor: 231 224 236;
20
+ --LightSurfaceDimColor: 222 216 225;
21
+ --LightSurfaceBrightColor: 254 247 255;
22
+ --LightSurfaceContainerLowestColor: 255 255 255;
23
+ --LightSurfaceContainerLowColor: 247 242 250;
24
+ --LightSurfaceContainerColor: 243 237 247;
25
+ --LightSurfaceContainerHightColor: 236 230 240;
26
+ --LightSurfaceContainerHighestColor: 230 224 233;
27
+ --LightOnSurfaceColor: 28 27 31;
28
+ --LightOnSurfaceVariantColor: 73 69 78;
29
+ --LightOutlineColor: 121 116 126;
30
+ --LightOutlineVariantColor: 196 199 197;
31
+
32
+ --DarkPrimaryColor: 168 199 250;
33
+ --DarkPrimaryContainerColor: 8 66 160;
34
+ --DarkSecondaryColor: 204 194 220;
35
+ --DarkSecondaryContainerColor: 232 222 248;
36
+ --DarkTertiaryColor: 7 39 17;
37
+ --DarkErrorColor: 242 184 181;
38
+ --DarkErrorContainerColor: 140 29 24;
39
+ --DarkOnPrimaryColor: 6 46 111;
40
+ --DarkOnPrimaryContainerColor: 211 227 253;
41
+ --DarkOnSecondaryColor: 51 45 65;
42
+ --DarkOnSecondaryContainerColor: 232 222 248;
43
+ --DarkOnTertiaryColor: 196 238 208;
44
+ --DarkOnErrorColor: 96 20 16;
45
+ --DarkOnErrorContainerColor: 249 222 220;
46
+ /* neutral colors */
47
+ --DarkSurfaceColor: 20 18 24;
48
+ --DarkSurfaceVariantColor: 73 69 79;
49
+ --DarkSurfaceDimColor: 20 18 24;
50
+ --DarkSurfaceBrightColor: 59 56 62;
51
+ --DarkSurfaceContainerLowestColor: 15 13 19;
52
+ --DarkSurfaceContainerLowColor: 29 27 32;
53
+ --DarkSurfaceContainerColor: 33 31 38;
54
+ --DarkSurfaceContainerHightColor: 43 41 48;
55
+ --DarkSurfaceContainerHighestColor: 54 52 59;
56
+ --DarkOnSurfaceColor: 230 225 229;
57
+ --DarkOnSurfaceVariantColor: 202 196 208;
58
+ --DarkOutlineColor: 147 143 153;
59
+ --DarkOutlineVariantColor: 68 71 70;
60
+ }
61
+ .green {
62
+ --LightPrimaryColor: 56 106 32;
63
+ --LightPrimaryContainerColor: 184 243 151;
64
+ --LightSecondaryColor: 98 91 113;
65
+ --LightSecondaryContainerColor: 232 222 248;
66
+ --LightTertiaryColor: 187 235 235;
67
+ --LightErrorColor: 179 38 30;
68
+ --LightErrorContainerColor: 249 222 220;
69
+ --LightOnPrimaryColor: 255 255 255;
70
+ --LightOnPrimaryContainerColor: 4 33 0;
71
+ --LightOnSecondaryColor: 255 255 255;
72
+ --LightOnSecondaryContainerColor: 30 25 43;
73
+ --LightOnTertiaryColor: 0 32 33;
74
+ --LightOnErrorColor: 255 255 255;
75
+ --LightOnErrorContainerColor: 65 14 11;
76
+ /* neutral colors */
77
+ --LightSurfaceColor: 254 247 255;
78
+ --LightSurfaceVariantColor: 231 224 236;
79
+ --LightSurfaceDimColor: 222 216 225;
80
+ --LightSurfaceBrightColor: 254 247 255;
81
+ --LightSurfaceContainerLowestColor: 255 255 255;
82
+ --LightSurfaceContainerLowColor: 247 242 250;
83
+ --LightSurfaceContainerColor: 243 237 247;
84
+ --LightSurfaceContainerHightColor: 236 230 240;
85
+ --LightSurfaceContainerHighestColor: 230 224 233;
86
+ --LightOnSurfaceColor: 28 27 31;
87
+ --LightOnSurfaceVariantColor: 73 69 78;
88
+ --LightOutlineColor: 121 116 126;
89
+ --LightOutlineVariantColor: 196 199 197;
90
+
91
+ --DarkPrimaryColor: 156 214 125;
92
+ --DarkPrimaryContainerColor: 32 81 7;
93
+ --DarkSecondaryColor: 204 194 220;
94
+ --DarkSecondaryContainerColor: 232 222 248;
95
+ --DarkTertiaryColor: 0 32 33;
96
+ --DarkErrorColor: 242 184 181;
97
+ --DarkErrorContainerColor: 140 29 24;
98
+ --DarkOnPrimaryColor: 12 57 0;
99
+ --DarkOnPrimaryContainerColor: 184 243 151;
100
+ --DarkOnSecondaryColor: 51 45 65;
101
+ --DarkOnSecondaryContainerColor: 232 222 248;
102
+ --DarkOnTertiaryColor: 187 235 235;
103
+ --DarkOnErrorColor: 96 20 16;
104
+ --DarkOnErrorContainerColor: 249 222 220;
105
+ /* neutral colors */
106
+ --DarkSurfaceColor: 20 18 24;
107
+ --DarkSurfaceVariantColor: 73 69 79;
108
+ --DarkSurfaceDimColor: 20 18 24;
109
+ --DarkSurfaceBrightColor: 59 56 62;
110
+ --DarkSurfaceContainerLowestColor: 15 13 19;
111
+ --DarkSurfaceContainerLowColor: 29 27 32;
112
+ --DarkSurfaceContainerColor: 33 31 38;
113
+ --DarkSurfaceContainerHightColor: 43 41 48;
114
+ --DarkSurfaceContainerHighestColor: 54 52 59;
115
+ --DarkOnSurfaceColor: 230 225 229;
116
+ --DarkOnSurfaceVariantColor: 202 196 208;
117
+ --DarkOutlineColor: 147 143 153;
118
+ --DarkOutlineVariantColor: 68 71 70;
119
+ }
120
+
121
+ .red {
122
+ --LightPrimaryColor: 156 65 70;
123
+ --LightPrimaryContainerColor: 255 218 219;
124
+ --LightSecondaryColor: 98 91 113;
125
+ --LightSecondaryContainerColor: 232 222 248;
126
+ --LightTertiaryColor: 255 221 170;
127
+ --LightErrorColor: 179 38 30;
128
+ --LightErrorContainerColor: 249 222 220;
129
+ --LightOnPrimaryColor: 255 255 255;
130
+ --LightOnPrimaryContainerColor: 64 0 8;
131
+ --LightOnSecondaryColor: 255 255 255;
132
+ --LightOnSecondaryContainerColor: 30 25 43;
133
+ --LightOnTertiaryColor: 40 24 0;
134
+ --LightOnErrorColor: 255 255 255;
135
+ --LightOnErrorContainerColor: 65 14 11;
136
+ /* neutral colors */
137
+ --LightSurfaceColor: 254 247 255;
138
+ --LightSurfaceVariantColor: 231 224 236;
139
+ --LightSurfaceDimColor: 222 216 225;
140
+ --LightSurfaceBrightColor: 254 247 255;
141
+ --LightSurfaceContainerLowestColor: 255 255 255;
142
+ --LightSurfaceContainerLowColor: 247 242 250;
143
+ --LightSurfaceContainerColor: 243 237 247;
144
+ --LightSurfaceContainerHightColor: 236 230 240;
145
+ --LightSurfaceContainerHighestColor: 230 224 233;
146
+ --LightOnSurfaceColor: 28 27 31;
147
+ --LightOnSurfaceVariantColor: 73 69 78;
148
+ --LightOutlineColor: 121 116 126;
149
+ --LightOutlineVariantColor: 196 199 197;
150
+
151
+ --DarkPrimaryColor: 255 179 181;
152
+ --DarkPrimaryContainerColor: 125 42 48;
153
+ --DarkSecondaryColor: 204 194 220;
154
+ --DarkSecondaryContainerColor: 232 222 248;
155
+ --DarkTertiaryColor: 40 24 0;
156
+ --DarkErrorColor: 242 184 181;
157
+ --DarkErrorContainerColor: 140 29 24;
158
+ --DarkOnPrimaryColor: 95 18 27;
159
+ --DarkOnPrimaryContainerColor: 255 218 219;
160
+ --DarkOnSecondaryColor: 51 45 65;
161
+ --DarkOnSecondaryContainerColor: 232 222 248;
162
+ --DarkOnTertiaryColor: 255 221 170;
163
+ --DarkOnErrorColor: 96 20 16;
164
+ --DarkOnErrorContainerColor: 249 222 220;
165
+ /* neutral colors */
166
+ --DarkSurfaceColor: 20 18 24;
167
+ --DarkSurfaceVariantColor: 73 69 79;
168
+ --DarkSurfaceDimColor: 20 18 24;
169
+ --DarkSurfaceBrightColor: 59 56 62;
170
+ --DarkSurfaceContainerLowestColor: 15 13 19;
171
+ --DarkSurfaceContainerLowColor: 29 27 32;
172
+ --DarkSurfaceContainerColor: 33 31 38;
173
+ --DarkSurfaceContainerHightColor: 43 41 48;
174
+ --DarkSurfaceContainerHighestColor: 54 52 59;
175
+ --DarkOnSurfaceColor: 230 225 229;
176
+ --DarkOnSurfaceVariantColor: 202 196 208;
177
+ --DarkOutlineColor: 147 143 153;
178
+ --DarkOutlineVariantColor: 68 71 70;
179
+ }
180
+
181
+ .yellow {
182
+ --LightPrimaryColor: 97 98 0;
183
+ --LightPrimaryContainerColor: 232 233 113;
184
+ --LightSecondaryColor: 98 91 113;
185
+ --LightSecondaryContainerColor: 232 222 248;
186
+ --LightTertiaryColor: 191 237 217;
187
+ --LightErrorColor: 179 38 30;
188
+ --LightErrorContainerColor: 249 222 220;
189
+ --LightOnPrimaryColor: 255 255 255;
190
+ --LightOnPrimaryContainerColor: 29 29 0;
191
+ --LightOnSecondaryColor: 255 255 255;
192
+ --LightOnSecondaryContainerColor: 30 25 43;
193
+ --LightOnTertiaryColor: 0 33 23;
194
+ --LightOnErrorColor: 255 255 255;
195
+ --LightOnErrorContainerColor: 65 14 11;
196
+ /* neutral colors */
197
+ --LightSurfaceColor: 254 247 255;
198
+ --LightSurfaceVariantColor: 231 224 236;
199
+ --LightSurfaceDimColor: 222 216 225;
200
+ --LightSurfaceBrightColor: 254 247 255;
201
+ --LightSurfaceContainerLowestColor: 255 255 255;
202
+ --LightSurfaceContainerLowColor: 247 242 250;
203
+ --LightSurfaceContainerColor: 243 237 247;
204
+ --LightSurfaceContainerHightColor: 236 230 240;
205
+ --LightSurfaceContainerHighestColor: 230 224 233;
206
+ --LightOnSurfaceColor: 28 27 31;
207
+ --LightOnSurfaceVariantColor: 73 69 78;
208
+ --LightOutlineColor: 121 116 126;
209
+ --LightOutlineVariantColor: 196 199 197;
210
+
211
+ --DarkPrimaryColor: 203 204 88;
212
+ --DarkPrimaryContainerColor: 73 74 0;
213
+ --DarkSecondaryColor: 204 194 220;
214
+ --DarkSecondaryContainerColor: 232 222 248;
215
+ --DarkTertiaryColor: 0 33 23;
216
+ --DarkErrorColor: 242 184 181;
217
+ --DarkErrorContainerColor: 140 29 24;
218
+ --DarkOnPrimaryColor: 50 50 0;
219
+ --DarkOnPrimaryContainerColor: 232 233 113;
220
+ --DarkOnSecondaryColor: 51 45 65;
221
+ --DarkOnSecondaryContainerColor: 232 222 248;
222
+ --DarkOnTertiaryColor: 191 237 217;
223
+ --DarkOnErrorColor: 96 20 16;
224
+ --DarkOnErrorContainerColor: 249 222 220;
225
+ /* neutral colors */
226
+ --DarkSurfaceColor: 20 18 24;
227
+ --DarkSurfaceVariantColor: 73 69 79;
228
+ --DarkSurfaceDimColor: 20 18 24;
229
+ --DarkSurfaceBrightColor: 59 56 62;
230
+ --DarkSurfaceContainerLowestColor: 15 13 19;
231
+ --DarkSurfaceContainerLowColor: 29 27 32;
232
+ --DarkSurfaceContainerColor: 33 31 38;
233
+ --DarkSurfaceContainerHightColor: 43 41 48;
234
+ --DarkSurfaceContainerHighestColor: 54 52 59;
235
+ --DarkOnSurfaceColor: 230 225 229;
236
+ --DarkOnSurfaceVariantColor: 202 196 208;
237
+ --DarkOutlineColor: 147 143 153;
238
+ --DarkOutlineVariantColor: 68 71 70;
239
+ }
240
+ .purple {
241
+ --LightPrimaryColor: 103 80 164;
242
+ --LightPrimaryContainerColor: 234 221 255;
243
+ --LightSecondaryColor: 98 91 113;
244
+ --LightSecondaryContainerColor: 232 222 248;
245
+ --LightTertiaryColor: 125 82 96;
246
+ --LightTertiaryContainerColor: 255 216 228;
247
+ --LightSurfaceColor: 34 34 34;
248
+ --LightErrorColor: 179 38 30;
249
+ --LightErrorContainerColor: 249 222 220;
250
+ --LightOnPrimaryColor: 255 255 255;
251
+ --LightOnPrimaryContainerColor: 33 0 94;
252
+ --LightOnSecondaryColor: 255 255 255;
253
+ --LightOnSecondaryContainerColor: 30 25 43;
254
+ --LightOnTertiaryColor: 255 255 255;
255
+ --LightOnTertiaryContainerColor: 55 11 30;
256
+ --LightOnErrorColor: 255 255 255;
257
+ --LightOnErrorContainerColor: 65 14 11;
258
+ /* neutral colors */
259
+ --LightSurfaceColor: 254 247 255;
260
+ --LightSurfaceVariantColor: 231 224 236;
261
+ --LightSurfaceDimColor: 222 216 225;
262
+ --LightSurfaceBrightColor: 254 247 255;
263
+ --LightSurfaceContainerLowestColor: 255 255 255;
264
+ --LightSurfaceContainerLowColor: 247 242 250;
265
+ --LightSurfaceContainerColor: 243 237 247;
266
+ --LightSurfaceContainerHightColor: 236 230 240;
267
+ --LightSurfaceContainerHighestColor: 230 224 233;
268
+ --LightOnSurfaceColor: 28 27 31;
269
+ --LightOnSurfaceVariantColor: 73 69 78;
270
+ --LightOutlineColor: 121 116 126;
271
+ --LightOutlineVariantColor: 196 199 197;
272
+
273
+ --DarkPrimaryColor: 208 188 255;
274
+ --DarkPrimaryContainerColor: 79 55 139;
275
+ --DarkSecondaryColor: 204 194 220;
276
+ --DarkSecondaryContainerColor: 232 222 248;
277
+ --DarkTertiaryColor: 239 184 200;
278
+ --DarkTertiaryContainerColor: 99 59 72;
279
+ --DarkErrorColor: 242 184 181;
280
+ --DarkErrorContainerColor: 140 29 24;
281
+ --DarkOnPrimaryColor: 55 30 115;
282
+ --DarkOnPrimaryContainerColor: 234 221 255;
283
+ --DarkOnSecondaryColor: 51 45 65;
284
+ --DarkOnSecondaryContainerColor: 232 222 248;
285
+ --DarkOnTertiaryColor: 73 37 50;
286
+ --DarkOnTertiaryContainerColor: 255 216 228;
287
+ --DarkOnErrorColor: 96 20 16;
288
+ --DarkOnErrorContainerColor: 249 222 220;
289
+ /* neutral colors */
290
+ --DarkSurfaceColor: 20 18 24;
291
+ --DarkSurfaceVariantColor: 73 69 79;
292
+ --DarkSurfaceDimColor: 20 18 24;
293
+ --DarkSurfaceBrightColor: 59 56 62;
294
+ --DarkSurfaceContainerLowestColor: 15 13 19;
295
+ --DarkSurfaceContainerLowColor: 29 27 32;
296
+ --DarkSurfaceContainerColor: 33 31 38;
297
+ --DarkSurfaceContainerHightColor: 43 41 48;
298
+ --DarkSurfaceContainerHighestColor: 54 52 59;
299
+ --DarkOnSurfaceColor: 230 225 229;
300
+ --DarkOnSurfaceVariantColor: 202 196 208;
301
+ --DarkOutlineColor: 147 143 153;
302
+ --DarkOutlineVariantColor: 68 71 70;
303
+ }
304
+
305
+ .system,
306
+ .light {
307
+ --primaryColor: var(--LightPrimaryColor);
308
+ --primaryContainerColor: var(--LightPrimaryContainerColor);
309
+ --secondaryColor: var(--LightSecondaryColor);
310
+ --secondaryContainerColor: var(--LightSecondaryContainerColor);
311
+ --tertiaryColor: var(--LightTertiaryColor);
312
+ --errorColor: var(--LightErrorColor);
313
+ --errorContainerColor: var(--LightErrorContainerColor);
314
+ --onPrimaryColor: var(--LightOnPrimaryColor);
315
+ --onPrimaryContainerColor: var(--LightOnPrimaryContainerColor);
316
+ --onSecondaryColor: var(--LightOnSecondaryColor);
317
+ --onSecondaryContainerColor: var(--LightOnSecondaryContainerColor);
318
+ --onTertiaryColor: var(--LightOnTertiaryColor);
319
+ --onErrorColor: var(--LightOnErrorColor);
320
+ --onErrorContainerColor: var(--LightOnErrorContainerColor);
321
+ --surfaceColor: var(--LightSurfaceColor);
322
+ --surfaceVariantColor: var(--LightSurfaceVariantColor);
323
+ --surfaceDimColor: var(--LightSurfaceDimColor);
324
+ --surfaceBrightColor: var(--LightSurfaceBrightColor);
325
+ --surfaceContainerLowestColor: var(--LightSurfaceContainerLowestColor);
326
+ --surfaceContainerLowColor: var(--LightSurfaceContainerLowColor);
327
+ --surfaceContainerColor: var(--LightSurfaceContainerColor);
328
+ --surfaceContainerHightColor: var(--LightSurfaceContainerHightColor);
329
+ --surfaceContainerHighestColor: var(--LightSurfaceContainerHighestColor);
330
+ --onSurfaceColor: var(--LightOnSurfaceColor);
331
+ --onSurfaceRGBColor: var(--LightOnSurfaceRGBColor);
332
+ --onSurfaceVariantColor: var(--LightOnSurfaceVariantColor);
333
+ --outlineColor: var(--LightOutlineColor);
334
+ --outlineVariantColor: var(--LightOutlineVariantColor);
335
+ }
336
+ .dark {
337
+ --primaryColor: var(--DarkPrimaryColor);
338
+ --primaryContainerColor: var(--DarkPrimaryContainerColor);
339
+ --secondaryColor: var(--DarkSecondaryColor);
340
+ --secondaryContainerColor: var(--DarkSecondaryContainerColor);
341
+ --tertiaryColor: var(--DarkTertiaryColor);
342
+ --errorColor: var(--DarkErrorColor);
343
+ --errorContainerColor: var(--DarkErrorContainerColor);
344
+ --onPrimaryColor: var(--DarkOnPrimaryColor);
345
+ --onPrimaryContainerColor: var(--DarkOnPrimaryContainerColor);
346
+ --onSecondaryColor: var(--DarkOnSecondaryColor);
347
+ --onSecondaryContainerColor: var(--DarkOnSecondaryContainerColor);
348
+ --onTertiaryColor: var(--DarkOnTertiaryColor);
349
+ --onErrorColor: var(--DarkOnErrorColor);
350
+ --onErrorContainerColor: var(--DarkOnErrorContainerColor);
351
+ --surfaceColor: var(--DarkSurfaceColor);
352
+ --surfaceVariantColor: var(--DarkSurfaceVariantColor);
353
+ --surfaceDimColor: var(--DarkSurfaceDimColor);
354
+ --surfaceBrightColor: var(--DarkSurfaceBrightColor);
355
+ --surfaceContainerLowestColor: var(--DarkSurfaceContainerLowestColor);
356
+ --surfaceContainerLowColor: var(--DarkSurfaceContainerLowColor);
357
+ --surfaceContainerColor: var(--DarkSurfaceContainerColor);
358
+ --surfaceContainerHightColor: var(--DarkSurfaceContainerHightColor);
359
+ --surfaceContainerHighestColor: var(--DarkSurfaceContainerHighestColor);
360
+ --onSurfaceColor: var(--DarkOnSurfaceColor);
361
+ --onSurfaceRGBColor: var(--DarkOnSurfaceRGBColor);
362
+ --onSurfaceVariantColor: var(--DarkOnSurfaceVariantColor);
363
+ --outlineColor: var(--DarkOutlineColor);
364
+ --outlineVariantColor: var(--DarkOutlineVariantColor);
365
+ }
366
+ @media (prefers-color-scheme: dark) {
367
+ .system {
368
+ --primaryColor: var(--DarkPrimaryColor);
369
+ --primaryContainerColor: var(--DarkPrimaryContainerColor);
370
+ --secondaryColor: var(--DarkSecondaryColor);
371
+ --secondaryContainerColor: var(--DarkSecondaryContainerColor);
372
+ --tertiaryColor: var(--DarkTertiaryColor);
373
+ --errorColor: var(--DarkErrorColor);
374
+ --errorContainerColor: var(--DarkErrorContainerColor);
375
+ --onPrimaryColor: var(--DarkOnPrimaryColor);
376
+ --onPrimaryContainerColor: var(--DarkOnPrimaryContainerColor);
377
+ --onSecondaryColor: var(--DarkOnSecondaryColor);
378
+ --onSecondaryContainerColor: var(--DarkOnSecondaryContainerColor);
379
+ --onTertiaryColor: var(--DarkOnTertiaryColor);
380
+ --onErrorColor: var(--DarkOnErrorColor);
381
+ --onErrorContainerColor: var(--DarkOnErrorContainerColor);
382
+ --surfaceColor: var(--DarkSurfaceColor);
383
+ --surfaceVariantColor: var(--DarkSurfaceVariantColor);
384
+ --surfaceDimColor: var(--DarkSurfaceDimColor);
385
+ --surfaceBrightColor: var(--DarkSurfaceBrightColor);
386
+ --surfaceContainerLowestColor: var(--DarkSurfaceContainerLowestColor);
387
+ --surfaceContainerLowColor: var(--DarkSurfaceContainerLowColor);
388
+ --surfaceContainerColor: var(--DarkSurfaceContainerColor);
389
+ --surfaceContainerHightColor: var(--DarkSurfaceContainerHightColor);
390
+ --surfaceContainerHighestColor: var(--DarkSurfaceContainerHighestColor);
391
+ --onSurfaceColor: var(--DarkOnSurfaceColor);
392
+ --onSurfaceRGBColor: var(--DarkOnSurfaceRGBColor);
393
+ --onSurfaceVariantColor: var(--DarkOnSurfaceVariantColor);
394
+ --outlineColor: var(--DarkOutlineColor);
395
+ --outlineVariantColor: var(--DarkOutlineVariantColor);
396
+ }
397
+ }