@expressivecss/expressive 0.1.0-alpha.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (105) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +82 -0
  3. package/dist/css/expressive.css +9914 -0
  4. package/dist/css/expressive.min.css +1 -0
  5. package/dist/js/components/autocomplete.d.ts +152 -0
  6. package/dist/js/components/buttons.d.ts +66 -0
  7. package/dist/js/components/cards.d.ts +50 -0
  8. package/dist/js/components/carousel.d.ts +131 -0
  9. package/dist/js/components/chips.d.ts +135 -0
  10. package/dist/js/components/collapsible.d.ts +74 -0
  11. package/dist/js/components/datepicker.d.ts +336 -0
  12. package/dist/js/components/dropdown.d.ts +148 -0
  13. package/dist/js/components/index.d.ts +21 -0
  14. package/dist/js/components/materialbox.d.ts +97 -0
  15. package/dist/js/components/modal.d.ts +45 -0
  16. package/dist/js/components/parallax.d.ts +40 -0
  17. package/dist/js/components/pushpin.d.ts +51 -0
  18. package/dist/js/components/scrollspy.d.ts +80 -0
  19. package/dist/js/components/sidenav.d.ts +125 -0
  20. package/dist/js/components/slider.d.ts +101 -0
  21. package/dist/js/components/tabs.d.ts +80 -0
  22. package/dist/js/components/tap-target.d.ts +58 -0
  23. package/dist/js/components/timepicker.d.ts +207 -0
  24. package/dist/js/components/toast.d.ts +93 -0
  25. package/dist/js/components/tooltip.d.ts +117 -0
  26. package/dist/js/components/waves.d.ts +15 -0
  27. package/dist/js/expressive.js +8239 -0
  28. package/dist/js/expressive.js.map +1 -0
  29. package/dist/js/expressive.min.js +2 -0
  30. package/dist/js/expressive.min.js.map +1 -0
  31. package/dist/js/expressive.mjs +8206 -0
  32. package/dist/js/expressive.mjs.map +1 -0
  33. package/dist/js/forms/character-counter.d.ts +36 -0
  34. package/dist/js/forms/forms.d.ts +17 -0
  35. package/dist/js/forms/index.d.ts +4 -0
  36. package/dist/js/forms/range.d.ts +40 -0
  37. package/dist/js/forms/select.d.ts +77 -0
  38. package/dist/js/foundation/component.d.ts +73 -0
  39. package/dist/js/foundation/index.d.ts +2 -0
  40. package/dist/js/foundation/utils.d.ts +122 -0
  41. package/dist/js/index.d.ts +52 -0
  42. package/dist/js/plugins/docked-display.d.ts +34 -0
  43. package/dist/js/plugins/index.d.ts +1 -0
  44. package/package.json +71 -0
  45. package/src/scss/components/_appbar.scss +454 -0
  46. package/src/scss/components/_badges.scss +77 -0
  47. package/src/scss/components/_breadcrumb.scss +27 -0
  48. package/src/scss/components/_buttons.scss +412 -0
  49. package/src/scss/components/_cards.scss +267 -0
  50. package/src/scss/components/_carousel.scss +93 -0
  51. package/src/scss/components/_chips.scss +147 -0
  52. package/src/scss/components/_collapsible.scss +84 -0
  53. package/src/scss/components/_collection.scss +114 -0
  54. package/src/scss/components/_date-picker.scss +268 -0
  55. package/src/scss/components/_dropdown.scss +98 -0
  56. package/src/scss/components/_index.scss +28 -0
  57. package/src/scss/components/_material-box.scss +42 -0
  58. package/src/scss/components/_material-icons.scss +6 -0
  59. package/src/scss/components/_modal.scss +84 -0
  60. package/src/scss/components/_pagination.scss +45 -0
  61. package/src/scss/components/_parallax.scss +26 -0
  62. package/src/scss/components/_preloader.scss +422 -0
  63. package/src/scss/components/_pulse.scss +35 -0
  64. package/src/scss/components/_sidenav.scss +229 -0
  65. package/src/scss/components/_slider.scss +119 -0
  66. package/src/scss/components/_table-of-contents.scss +32 -0
  67. package/src/scss/components/_tabs.scss +176 -0
  68. package/src/scss/components/_tap-target.scss +102 -0
  69. package/src/scss/components/_time-picker.scss +294 -0
  70. package/src/scss/components/_toast.scss +70 -0
  71. package/src/scss/components/_tooltip.scss +49 -0
  72. package/src/scss/components/_transitions.scss +19 -0
  73. package/src/scss/components/_video.scss +15 -0
  74. package/src/scss/expressive.scss +7 -0
  75. package/src/scss/forms/_checkboxes.scss +199 -0
  76. package/src/scss/forms/_file-input.scss +41 -0
  77. package/src/scss/forms/_index.scss +17 -0
  78. package/src/scss/forms/_input-fields.scss +360 -0
  79. package/src/scss/forms/_radio-buttons.scss +114 -0
  80. package/src/scss/forms/_range.scss +148 -0
  81. package/src/scss/forms/_select.scss +108 -0
  82. package/src/scss/forms/_switches.scss +127 -0
  83. package/src/scss/foundation/_base.scss +71 -0
  84. package/src/scss/foundation/_color-palette.scss +402 -0
  85. package/src/scss/foundation/_index.scss +10 -0
  86. package/src/scss/foundation/_mixins.scss +198 -0
  87. package/src/scss/foundation/_motion.scss +70 -0
  88. package/src/scss/foundation/_normalize.scss +349 -0
  89. package/src/scss/foundation/_shape.scss +30 -0
  90. package/src/scss/foundation/_state-layers.scss +68 -0
  91. package/src/scss/foundation/_theme.scss +238 -0
  92. package/src/scss/foundation/_tokens.scss +511 -0
  93. package/src/scss/foundation/_variables.scss +57 -0
  94. package/src/scss/layout/_footer.scss +26 -0
  95. package/src/scss/layout/_grid.scss +172 -0
  96. package/src/scss/layout/_index.scss +3 -0
  97. package/src/scss/layout/_table.scss +119 -0
  98. package/src/scss/utilities/_a11y.scss +77 -0
  99. package/src/scss/utilities/_colors.scss +74 -0
  100. package/src/scss/utilities/_elevation.scss +63 -0
  101. package/src/scss/utilities/_helpers.scss +50 -0
  102. package/src/scss/utilities/_index.scss +7 -0
  103. package/src/scss/utilities/_responsive.scss +62 -0
  104. package/src/scss/utilities/_spacing.scss +38 -0
  105. package/src/scss/utilities/_typography.scss +115 -0
package/src/scss/foundation/_theme.scss ADDED
@@ -0,0 +1,238 @@
1
+ /* System Defaults — Light theme */
2
+ :root, :host {
3
+ color-scheme: light;
4
+
5
+ /* Core colors */
6
+ --md-sys-color-primary: var(--md-sys-color-primary-light);
7
+ --md-sys-color-on-primary: var(--md-sys-color-on-primary-light);
8
+ --md-sys-color-primary-container: var(--md-sys-color-primary-container-light);
9
+ --md-sys-color-on-primary-container: var(--md-sys-color-on-primary-container-light);
10
+ --md-sys-color-secondary: var(--md-sys-color-secondary-light);
11
+ --md-sys-color-on-secondary: var(--md-sys-color-on-secondary-light);
12
+ --md-sys-color-secondary-container: var(--md-sys-color-secondary-container-light);
13
+ --md-sys-color-on-secondary-container: var(--md-sys-color-on-secondary-container-light);
14
+ --md-sys-color-tertiary: var(--md-sys-color-tertiary-light);
15
+ --md-sys-color-on-tertiary: var(--md-sys-color-on-tertiary-light);
16
+ --md-sys-color-tertiary-container: var(--md-sys-color-tertiary-container-light);
17
+ --md-sys-color-on-tertiary-container: var(--md-sys-color-on-tertiary-container-light);
18
+ --md-sys-color-error: var(--md-sys-color-error-light);
19
+ --md-sys-color-on-error: var(--md-sys-color-on-error-light);
20
+ --md-sys-color-error-container: var(--md-sys-color-error-container-light);
21
+ --md-sys-color-on-error-container: var(--md-sys-color-on-error-container-light);
22
+
23
+ /* Surface colors */
24
+ --md-sys-color-background: var(--md-sys-color-background-light);
25
+ --md-sys-color-on-background: var(--md-sys-color-on-background-light);
26
+ --md-sys-color-surface: var(--md-sys-color-surface-light);
27
+ --md-sys-color-on-surface: var(--md-sys-color-on-surface-light);
28
+ --md-sys-color-surface-variant: var(--md-sys-color-surface-variant-light);
29
+ --md-sys-color-on-surface-variant: var(--md-sys-color-on-surface-variant-light);
30
+ --md-sys-color-surface-bright: var(--md-sys-color-surface-bright-light);
31
+ --md-sys-color-surface-dim: var(--md-sys-color-surface-dim-light);
32
+ --md-sys-color-surface-container-lowest: var(--md-sys-color-surface-container-lowest-light);
33
+ --md-sys-color-surface-container-low: var(--md-sys-color-surface-container-low-light);
34
+ --md-sys-color-surface-container: var(--md-sys-color-surface-container-light);
35
+ --md-sys-color-surface-container-high: var(--md-sys-color-surface-container-high-light);
36
+ --md-sys-color-surface-container-highest: var(--md-sys-color-surface-container-highest-light);
37
+
38
+ /* Utility colors */
39
+ --md-sys-color-outline: var(--md-sys-color-outline-light);
40
+ --md-sys-color-outline-variant: var(--md-sys-color-outline-variant-light);
41
+ --md-sys-color-inverse-surface: var(--md-sys-color-inverse-surface-light);
42
+ --md-sys-color-inverse-on-surface: var(--md-sys-color-inverse-on-surface-light);
43
+ --md-sys-color-inverse-primary: var(--md-sys-color-inverse-primary-light);
44
+ --md-sys-color-shadow: var(--md-sys-color-shadow-light);
45
+ --md-sys-color-surface-tint: var(--md-sys-color-surface-tint-light);
46
+ --md-sys-color-scrim: var(--md-sys-color-scrim-light);
47
+
48
+ /* Fixed colors */
49
+ --md-sys-color-primary-fixed: var(--md-sys-color-primary-fixed-light);
50
+ --md-sys-color-primary-fixed-dim: var(--md-sys-color-primary-fixed-dim-light);
51
+ --md-sys-color-on-primary-fixed: var(--md-sys-color-on-primary-fixed-light);
52
+ --md-sys-color-on-primary-fixed-variant: var(--md-sys-color-on-primary-fixed-variant-light);
53
+ --md-sys-color-secondary-fixed: var(--md-sys-color-secondary-fixed-light);
54
+ --md-sys-color-secondary-fixed-dim: var(--md-sys-color-secondary-fixed-dim-light);
55
+ --md-sys-color-on-secondary-fixed: var(--md-sys-color-on-secondary-fixed-light);
56
+ --md-sys-color-on-secondary-fixed-variant: var(--md-sys-color-on-secondary-fixed-variant-light);
57
+ --md-sys-color-tertiary-fixed: var(--md-sys-color-tertiary-fixed-light);
58
+ --md-sys-color-tertiary-fixed-dim: var(--md-sys-color-tertiary-fixed-dim-light);
59
+ --md-sys-color-on-tertiary-fixed: var(--md-sys-color-on-tertiary-fixed-light);
60
+ --md-sys-color-on-tertiary-fixed-variant: var(--md-sys-color-on-tertiary-fixed-variant-light);
61
+ }
62
+
63
+ /* ===================================================================== Dark theme (system preference) */
64
+
65
+ @media (prefers-color-scheme: dark) {
66
+ :root, :host {
67
+ color-scheme: dark;
68
+
69
+ /* Core colors */
70
+ --md-sys-color-primary: var(--md-sys-color-primary-dark);
71
+ --md-sys-color-on-primary: var(--md-sys-color-on-primary-dark);
72
+ --md-sys-color-primary-container: var(--md-sys-color-primary-container-dark);
73
+ --md-sys-color-on-primary-container: var(--md-sys-color-on-primary-container-dark);
74
+ --md-sys-color-secondary: var(--md-sys-color-secondary-dark);
75
+ --md-sys-color-on-secondary: var(--md-sys-color-on-secondary-dark);
76
+ --md-sys-color-secondary-container: var(--md-sys-color-secondary-container-dark);
77
+ --md-sys-color-on-secondary-container: var(--md-sys-color-on-secondary-container-dark);
78
+ --md-sys-color-tertiary: var(--md-sys-color-tertiary-dark);
79
+ --md-sys-color-on-tertiary: var(--md-sys-color-on-tertiary-dark);
80
+ --md-sys-color-tertiary-container: var(--md-sys-color-tertiary-container-dark);
81
+ --md-sys-color-on-tertiary-container: var(--md-sys-color-on-tertiary-container-dark);
82
+ --md-sys-color-error: var(--md-sys-color-error-dark);
83
+ --md-sys-color-on-error: var(--md-sys-color-on-error-dark);
84
+ --md-sys-color-error-container: var(--md-sys-color-error-container-dark);
85
+ --md-sys-color-on-error-container: var(--md-sys-color-on-error-container-dark);
86
+
87
+ /* Surface colors */
88
+ --md-sys-color-background: var(--md-sys-color-background-dark);
89
+ --md-sys-color-on-background: var(--md-sys-color-on-background-dark);
90
+ --md-sys-color-surface: var(--md-sys-color-surface-dark);
91
+ --md-sys-color-on-surface: var(--md-sys-color-on-surface-dark);
92
+ --md-sys-color-surface-variant: var(--md-sys-color-surface-variant-dark);
93
+ --md-sys-color-on-surface-variant: var(--md-sys-color-on-surface-variant-dark);
94
+ --md-sys-color-surface-bright: var(--md-sys-color-surface-bright-dark);
95
+ --md-sys-color-surface-dim: var(--md-sys-color-surface-dim-dark);
96
+ --md-sys-color-surface-container-lowest: var(--md-sys-color-surface-container-lowest-dark);
97
+ --md-sys-color-surface-container-low: var(--md-sys-color-surface-container-low-dark);
98
+ --md-sys-color-surface-container: var(--md-sys-color-surface-container-dark);
99
+ --md-sys-color-surface-container-high: var(--md-sys-color-surface-container-high-dark);
100
+ --md-sys-color-surface-container-highest: var(--md-sys-color-surface-container-highest-dark);
101
+
102
+ /* Utility colors */
103
+ --md-sys-color-outline: var(--md-sys-color-outline-dark);
104
+ --md-sys-color-outline-variant: var(--md-sys-color-outline-variant-dark);
105
+ --md-sys-color-inverse-surface: var(--md-sys-color-inverse-surface-dark);
106
+ --md-sys-color-inverse-on-surface: var(--md-sys-color-inverse-on-surface-dark);
107
+ --md-sys-color-inverse-primary: var(--md-sys-color-inverse-primary-dark);
108
+ --md-sys-color-shadow: var(--md-sys-color-shadow-dark);
109
+ --md-sys-color-surface-tint: var(--md-sys-color-surface-tint-dark);
110
+ --md-sys-color-scrim: var(--md-sys-color-scrim-dark);
111
+
112
+ /* Fixed colors */
113
+ --md-sys-color-primary-fixed: var(--md-sys-color-primary-fixed-dark);
114
+ --md-sys-color-primary-fixed-dim: var(--md-sys-color-primary-fixed-dim-dark);
115
+ --md-sys-color-on-primary-fixed: var(--md-sys-color-on-primary-fixed-dark);
116
+ --md-sys-color-on-primary-fixed-variant: var(--md-sys-color-on-primary-fixed-variant-dark);
117
+ --md-sys-color-secondary-fixed: var(--md-sys-color-secondary-fixed-dark);
118
+ --md-sys-color-secondary-fixed-dim: var(--md-sys-color-secondary-fixed-dim-dark);
119
+ --md-sys-color-on-secondary-fixed: var(--md-sys-color-on-secondary-fixed-dark);
120
+ --md-sys-color-on-secondary-fixed-variant: var(--md-sys-color-on-secondary-fixed-variant-dark);
121
+ --md-sys-color-tertiary-fixed: var(--md-sys-color-tertiary-fixed-dark);
122
+ --md-sys-color-tertiary-fixed-dim: var(--md-sys-color-tertiary-fixed-dim-dark);
123
+ --md-sys-color-on-tertiary-fixed: var(--md-sys-color-on-tertiary-fixed-dark);
124
+ --md-sys-color-on-tertiary-fixed-variant: var(--md-sys-color-on-tertiary-fixed-variant-dark);
125
+ }
126
+ }
127
+
128
+ /* ===================================================================== Explicit theme overrides */
129
+
130
+ :root[data-theme="light"],
131
+ :root[theme="light"] {
132
+ color-scheme: light;
133
+
134
+ --md-sys-color-primary: var(--md-sys-color-primary-light);
135
+ --md-sys-color-on-primary: var(--md-sys-color-on-primary-light);
136
+ --md-sys-color-primary-container: var(--md-sys-color-primary-container-light);
137
+ --md-sys-color-on-primary-container: var(--md-sys-color-on-primary-container-light);
138
+ --md-sys-color-secondary: var(--md-sys-color-secondary-light);
139
+ --md-sys-color-on-secondary: var(--md-sys-color-on-secondary-light);
140
+ --md-sys-color-secondary-container: var(--md-sys-color-secondary-container-light);
141
+ --md-sys-color-on-secondary-container: var(--md-sys-color-on-secondary-container-light);
142
+ --md-sys-color-tertiary: var(--md-sys-color-tertiary-light);
143
+ --md-sys-color-on-tertiary: var(--md-sys-color-on-tertiary-light);
144
+ --md-sys-color-tertiary-container: var(--md-sys-color-tertiary-container-light);
145
+ --md-sys-color-on-tertiary-container: var(--md-sys-color-on-tertiary-container-light);
146
+ --md-sys-color-error: var(--md-sys-color-error-light);
147
+ --md-sys-color-on-error: var(--md-sys-color-on-error-light);
148
+ --md-sys-color-error-container: var(--md-sys-color-error-container-light);
149
+ --md-sys-color-on-error-container: var(--md-sys-color-on-error-container-light);
150
+ --md-sys-color-outline: var(--md-sys-color-outline-light);
151
+ --md-sys-color-background: var(--md-sys-color-background-light);
152
+ --md-sys-color-on-background: var(--md-sys-color-on-background-light);
153
+ --md-sys-color-surface: var(--md-sys-color-surface-light);
154
+ --md-sys-color-on-surface: var(--md-sys-color-on-surface-light);
155
+ --md-sys-color-surface-variant: var(--md-sys-color-surface-variant-light);
156
+ --md-sys-color-on-surface-variant: var(--md-sys-color-on-surface-variant-light);
157
+ --md-sys-color-surface-bright: var(--md-sys-color-surface-bright-light);
158
+ --md-sys-color-surface-dim: var(--md-sys-color-surface-dim-light);
159
+ --md-sys-color-surface-container-lowest: var(--md-sys-color-surface-container-lowest-light);
160
+ --md-sys-color-surface-container-low: var(--md-sys-color-surface-container-low-light);
161
+ --md-sys-color-surface-container: var(--md-sys-color-surface-container-light);
162
+ --md-sys-color-surface-container-high: var(--md-sys-color-surface-container-high-light);
163
+ --md-sys-color-surface-container-highest: var(--md-sys-color-surface-container-highest-light);
164
+ --md-sys-color-outline-variant: var(--md-sys-color-outline-variant-light);
165
+ --md-sys-color-inverse-surface: var(--md-sys-color-inverse-surface-light);
166
+ --md-sys-color-inverse-on-surface: var(--md-sys-color-inverse-on-surface-light);
167
+ --md-sys-color-inverse-primary: var(--md-sys-color-inverse-primary-light);
168
+ --md-sys-color-shadow: var(--md-sys-color-shadow-light);
169
+ --md-sys-color-surface-tint: var(--md-sys-color-surface-tint-light);
170
+ --md-sys-color-scrim: var(--md-sys-color-scrim-light);
171
+ --md-sys-color-primary-fixed: var(--md-sys-color-primary-fixed-light);
172
+ --md-sys-color-primary-fixed-dim: var(--md-sys-color-primary-fixed-dim-light);
173
+ --md-sys-color-on-primary-fixed: var(--md-sys-color-on-primary-fixed-light);
174
+ --md-sys-color-on-primary-fixed-variant: var(--md-sys-color-on-primary-fixed-variant-light);
175
+ --md-sys-color-secondary-fixed: var(--md-sys-color-secondary-fixed-light);
176
+ --md-sys-color-secondary-fixed-dim: var(--md-sys-color-secondary-fixed-dim-light);
177
+ --md-sys-color-on-secondary-fixed: var(--md-sys-color-on-secondary-fixed-light);
178
+ --md-sys-color-on-secondary-fixed-variant: var(--md-sys-color-on-secondary-fixed-variant-light);
179
+ --md-sys-color-tertiary-fixed: var(--md-sys-color-tertiary-fixed-light);
180
+ --md-sys-color-tertiary-fixed-dim: var(--md-sys-color-tertiary-fixed-dim-light);
181
+ --md-sys-color-on-tertiary-fixed: var(--md-sys-color-on-tertiary-fixed-light);
182
+ --md-sys-color-on-tertiary-fixed-variant: var(--md-sys-color-on-tertiary-fixed-variant-light);
183
+ }
184
+
185
+ :root[data-theme="dark"],
186
+ :root[theme="dark"] {
187
+ color-scheme: dark;
188
+
189
+ --md-sys-color-primary: var(--md-sys-color-primary-dark);
190
+ --md-sys-color-on-primary: var(--md-sys-color-on-primary-dark);
191
+ --md-sys-color-primary-container: var(--md-sys-color-primary-container-dark);
192
+ --md-sys-color-on-primary-container: var(--md-sys-color-on-primary-container-dark);
193
+ --md-sys-color-secondary: var(--md-sys-color-secondary-dark);
194
+ --md-sys-color-on-secondary: var(--md-sys-color-on-secondary-dark);
195
+ --md-sys-color-secondary-container: var(--md-sys-color-secondary-container-dark);
196
+ --md-sys-color-on-secondary-container: var(--md-sys-color-on-secondary-container-dark);
197
+ --md-sys-color-tertiary: var(--md-sys-color-tertiary-dark);
198
+ --md-sys-color-on-tertiary: var(--md-sys-color-on-tertiary-dark);
199
+ --md-sys-color-tertiary-container: var(--md-sys-color-tertiary-container-dark);
200
+ --md-sys-color-on-tertiary-container: var(--md-sys-color-on-tertiary-container-dark);
201
+ --md-sys-color-error: var(--md-sys-color-error-dark);
202
+ --md-sys-color-on-error: var(--md-sys-color-on-error-dark);
203
+ --md-sys-color-error-container: var(--md-sys-color-error-container-dark);
204
+ --md-sys-color-on-error-container: var(--md-sys-color-on-error-container-dark);
205
+ --md-sys-color-outline: var(--md-sys-color-outline-dark);
206
+ --md-sys-color-background: var(--md-sys-color-background-dark);
207
+ --md-sys-color-on-background: var(--md-sys-color-on-background-dark);
208
+ --md-sys-color-surface: var(--md-sys-color-surface-dark);
209
+ --md-sys-color-on-surface: var(--md-sys-color-on-surface-dark);
210
+ --md-sys-color-surface-variant: var(--md-sys-color-surface-variant-dark);
211
+ --md-sys-color-on-surface-variant: var(--md-sys-color-on-surface-variant-dark);
212
+ --md-sys-color-surface-bright: var(--md-sys-color-surface-bright-dark);
213
+ --md-sys-color-surface-dim: var(--md-sys-color-surface-dim-dark);
214
+ --md-sys-color-surface-container-lowest: var(--md-sys-color-surface-container-lowest-dark);
215
+ --md-sys-color-surface-container-low: var(--md-sys-color-surface-container-low-dark);
216
+ --md-sys-color-surface-container: var(--md-sys-color-surface-container-dark);
217
+ --md-sys-color-surface-container-high: var(--md-sys-color-surface-container-high-dark);
218
+ --md-sys-color-surface-container-highest: var(--md-sys-color-surface-container-highest-dark);
219
+ --md-sys-color-outline-variant: var(--md-sys-color-outline-variant-dark);
220
+ --md-sys-color-inverse-surface: var(--md-sys-color-inverse-surface-dark);
221
+ --md-sys-color-inverse-on-surface: var(--md-sys-color-inverse-on-surface-dark);
222
+ --md-sys-color-inverse-primary: var(--md-sys-color-inverse-primary-dark);
223
+ --md-sys-color-shadow: var(--md-sys-color-shadow-dark);
224
+ --md-sys-color-surface-tint: var(--md-sys-color-surface-tint-dark);
225
+ --md-sys-color-scrim: var(--md-sys-color-scrim-dark);
226
+ --md-sys-color-primary-fixed: var(--md-sys-color-primary-fixed-dark);
227
+ --md-sys-color-primary-fixed-dim: var(--md-sys-color-primary-fixed-dim-dark);
228
+ --md-sys-color-on-primary-fixed: var(--md-sys-color-on-primary-fixed-dark);
229
+ --md-sys-color-on-primary-fixed-variant: var(--md-sys-color-on-primary-fixed-variant-dark);
230
+ --md-sys-color-secondary-fixed: var(--md-sys-color-secondary-fixed-dark);
231
+ --md-sys-color-secondary-fixed-dim: var(--md-sys-color-secondary-fixed-dim-dark);
232
+ --md-sys-color-on-secondary-fixed: var(--md-sys-color-on-secondary-fixed-dark);
233
+ --md-sys-color-on-secondary-fixed-variant: var(--md-sys-color-on-secondary-fixed-variant-dark);
234
+ --md-sys-color-tertiary-fixed: var(--md-sys-color-tertiary-fixed-dark);
235
+ --md-sys-color-tertiary-fixed-dim: var(--md-sys-color-tertiary-fixed-dim-dark);
236
+ --md-sys-color-on-tertiary-fixed: var(--md-sys-color-on-tertiary-fixed-dark);
237
+ --md-sys-color-on-tertiary-fixed-variant: var(--md-sys-color-on-tertiary-fixed-variant-dark);
238
+ }