@ntmats/hc-tokens 0.1.1 → 0.2.0
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.
- package/dist/tokens.css +82 -2
- package/package.json +1 -1
package/dist/tokens.css
CHANGED
|
@@ -143,7 +143,7 @@
|
|
|
143
143
|
--hc-shadow-knob: 0 1px 3px rgba(20, 20, 19, 0.12), 0 0 0 0.5px rgba(20, 20, 19, 0.06);
|
|
144
144
|
color-scheme: light;
|
|
145
145
|
}
|
|
146
|
-
|
|
146
|
+
.dark [data-hc-ds], [data-theme="dark"] [data-hc-ds] {
|
|
147
147
|
--hc-color-bg-page: #1b1a19;
|
|
148
148
|
--hc-color-bg-main: #262624;
|
|
149
149
|
--hc-color-bg-surface: #262624;
|
|
@@ -183,7 +183,87 @@
|
|
|
183
183
|
--hc-shadow-float: 0 0 0 1px var(--hc-color-border-strong), 0 12px 32px -10px rgba(0, 0, 0, 0.6);
|
|
184
184
|
color-scheme: dark;
|
|
185
185
|
}
|
|
186
|
-
[data-hc-ds][data-theme="light"]
|
|
186
|
+
.light [data-hc-ds], [data-theme="light"] [data-hc-ds] {
|
|
187
|
+
--hc-color-bg-page: #efeee7;
|
|
188
|
+
--hc-color-bg-main: #faf9f4;
|
|
189
|
+
--hc-color-bg-surface: #fffefb;
|
|
190
|
+
--hc-color-bg-elevated: #fffefb;
|
|
191
|
+
--hc-color-bg-glass: rgba(250, 249, 245, 0.62);
|
|
192
|
+
--hc-color-bg-muted: rgba(31, 30, 29, 0.06);
|
|
193
|
+
--hc-color-bg-muted-2: rgba(31, 30, 29, 0.03);
|
|
194
|
+
--hc-color-bg-overlay: rgba(20, 20, 19, 0.34);
|
|
195
|
+
--hc-color-text-primary: #141413;
|
|
196
|
+
--hc-color-text-secondary: #3d3d3a;
|
|
197
|
+
--hc-color-text-muted: #63625c;
|
|
198
|
+
--hc-color-placeholder: #8f8d85;
|
|
199
|
+
--hc-color-text-disabled: #c8c5bb;
|
|
200
|
+
--hc-color-text-inverse: #ffffff;
|
|
201
|
+
--hc-color-outline: rgba(31, 30, 29, 0.12);
|
|
202
|
+
--hc-color-border: rgba(31, 30, 29, 0.1);
|
|
203
|
+
--hc-color-border-strong: rgba(31, 30, 29, 0.18);
|
|
204
|
+
--hc-color-accent: #141413;
|
|
205
|
+
--hc-color-bg-contrast: #141413;
|
|
206
|
+
--hc-color-text-on-contrast: #faf9f5;
|
|
207
|
+
--hc-color-brand: #141413;
|
|
208
|
+
--hc-color-brand-soft: rgba(31, 30, 29, 0.055);
|
|
209
|
+
--hc-color-bg-warning: #fbefd2;
|
|
210
|
+
--hc-color-text-on-warning: #7a4100;
|
|
211
|
+
--hc-color-bg-success: #e4f2e4;
|
|
212
|
+
--hc-color-text-on-success: #1f6b2c;
|
|
213
|
+
--hc-color-bg-danger: #fbe9e5;
|
|
214
|
+
--hc-color-text-on-danger: #b42318;
|
|
215
|
+
--hc-focus-ring: #141413;
|
|
216
|
+
--hc-shadow-outline: 0 0 0 1px var(--hc-color-border);
|
|
217
|
+
--hc-shadow-soft: 0 0 0 1px var(--hc-color-border), 0 1px 2px rgba(20, 20, 19, 0.04);
|
|
218
|
+
--hc-shadow-card: 0 0 0 1px var(--hc-color-border), 0 1px 3px rgba(20, 20, 19, 0.04);
|
|
219
|
+
--hc-shadow-knob: 0 1px 3px rgba(20, 20, 19, 0.12), 0 0 0 0.5px rgba(20, 20, 19, 0.06);
|
|
220
|
+
--hc-shadow-modal: 0 0 0 1px var(--hc-color-border), 0 24px 64px -16px rgba(20, 20, 19, 0.26);
|
|
221
|
+
--hc-shadow-main: 0 -4px 14px -6px rgba(20, 20, 19, 0.10);
|
|
222
|
+
--hc-shadow-navigation: 0 1px 2px rgba(20, 20, 19, 0.04), 0 4px 16px -6px rgba(20, 20, 19, 0.12);
|
|
223
|
+
--hc-shadow-float: 0 0 0 1px var(--hc-color-border), 0 12px 32px -10px rgba(20, 20, 19, 0.2);
|
|
224
|
+
color-scheme: light;
|
|
225
|
+
}
|
|
226
|
+
[data-hc-ds][data-theme="dark"], .dark[data-hc-ds] {
|
|
227
|
+
--hc-color-bg-page: #1b1a19;
|
|
228
|
+
--hc-color-bg-main: #262624;
|
|
229
|
+
--hc-color-bg-surface: #262624;
|
|
230
|
+
--hc-color-bg-elevated: #30302e;
|
|
231
|
+
--hc-color-bg-glass: rgba(48, 48, 46, 0.6);
|
|
232
|
+
--hc-color-bg-muted: rgba(250, 249, 245, 0.07);
|
|
233
|
+
--hc-color-bg-muted-2: rgba(250, 249, 245, 0.035);
|
|
234
|
+
--hc-color-bg-overlay: rgba(0, 0, 0, 0.55);
|
|
235
|
+
--hc-color-text-primary: #faf9f5;
|
|
236
|
+
--hc-color-text-secondary: #dedcd1;
|
|
237
|
+
--hc-color-text-muted: #a8a59b;
|
|
238
|
+
--hc-color-placeholder: #7a776f;
|
|
239
|
+
--hc-color-text-disabled: #45443f;
|
|
240
|
+
--hc-color-text-inverse: #1f1e1d;
|
|
241
|
+
--hc-color-outline: rgba(250, 249, 245, 0.14);
|
|
242
|
+
--hc-color-border: rgba(250, 249, 245, 0.09);
|
|
243
|
+
--hc-color-border-strong: rgba(250, 249, 245, 0.17);
|
|
244
|
+
--hc-color-accent: #faf9f5;
|
|
245
|
+
--hc-color-bg-contrast: #faf9f5;
|
|
246
|
+
--hc-color-text-on-contrast: #1f1e1d;
|
|
247
|
+
--hc-color-brand: #faf9f5;
|
|
248
|
+
--hc-color-brand-soft: rgba(250, 249, 245, 0.07);
|
|
249
|
+
--hc-color-bg-warning: #3a2b0c;
|
|
250
|
+
--hc-color-text-on-warning: #f5d38a;
|
|
251
|
+
--hc-color-bg-success: #1c2e1f;
|
|
252
|
+
--hc-color-text-on-success: #8fd69d;
|
|
253
|
+
--hc-color-bg-danger: #3a1a16;
|
|
254
|
+
--hc-color-text-on-danger: #ffb4a6;
|
|
255
|
+
--hc-focus-ring: #faf9f5;
|
|
256
|
+
--hc-shadow-outline: 0 0 0 1px var(--hc-color-border-strong);
|
|
257
|
+
--hc-shadow-soft: 0 0 0 1px var(--hc-color-border-strong);
|
|
258
|
+
--hc-shadow-card: 0 0 0 1px var(--hc-color-border-strong);
|
|
259
|
+
--hc-shadow-knob: 0 1px 2px rgba(0, 0, 0, 0.45), 0 0 0 1px var(--hc-color-border-strong);
|
|
260
|
+
--hc-shadow-modal: 0 0 0 1px var(--hc-color-border-strong), 0 24px 64px -16px rgba(0, 0, 0, 0.7);
|
|
261
|
+
--hc-shadow-main: 0 -4px 14px -6px rgba(0, 0, 0, 0.28);
|
|
262
|
+
--hc-shadow-navigation: 0 2px 4px rgba(0, 0, 0, 0.12), 0 6px 18px -6px rgba(0, 0, 0, 0.28);
|
|
263
|
+
--hc-shadow-float: 0 0 0 1px var(--hc-color-border-strong), 0 12px 32px -10px rgba(0, 0, 0, 0.6);
|
|
264
|
+
color-scheme: dark;
|
|
265
|
+
}
|
|
266
|
+
[data-hc-ds][data-theme="light"], .light[data-hc-ds] {
|
|
187
267
|
--hc-color-bg-page: #efeee7;
|
|
188
268
|
--hc-color-bg-main: #faf9f4;
|
|
189
269
|
--hc-color-bg-surface: #fffefb;
|
package/package.json
CHANGED