fix(web): add --nl-* CSS token aliases — previous rename broke all styling since vars had no definitions

This commit is contained in:
saravanakumardb1 2026-03-21 20:48:35 -07:00
parent 304d2ae865
commit 8fdc7b57d0

View File

@ -1,5 +1,61 @@
@import "tailwindcss";
/* NoteLett design token aliases — map --nl-* to --ml-* from @bytelyst/design-tokens */
:root,
[data-theme="dark"] {
--nl-bg-canvas: var(--ml-bg-canvas);
--nl-bg-elevated: var(--ml-bg-elevated);
--nl-surface-card: var(--ml-surface-card);
--nl-surface-muted: var(--ml-surface-muted);
--nl-border-default: var(--ml-border-default);
--nl-border-strong: var(--ml-border-strong);
--nl-text-primary: var(--ml-text-primary);
--nl-text-secondary: var(--ml-text-secondary);
--nl-text-tertiary: var(--ml-text-tertiary);
--nl-accent-primary: var(--ml-accent-primary);
--nl-accent-secondary: var(--ml-accent-secondary);
--nl-success: var(--ml-success);
--nl-warning: var(--ml-warning);
--nl-danger: var(--ml-danger);
--nl-focus-ring: var(--ml-focus-ring);
--nl-overlay-scrim: var(--ml-overlay-scrim);
--nl-font-display: var(--ml-font-display);
--nl-font-body: var(--ml-font-body);
--nl-font-mono: var(--ml-font-mono);
--nl-fs-xs: var(--ml-fs-xs);
--nl-fs-sm: var(--ml-fs-sm);
--nl-fs-md: var(--ml-fs-md);
--nl-fs-lg: var(--ml-fs-lg);
--nl-fs-xl: var(--ml-fs-xl);
--nl-fs-2xl: var(--ml-fs-2xl);
--nl-fs-3xl: var(--ml-fs-3xl);
--nl-space-0: var(--ml-space-0);
--nl-space-1: var(--ml-space-1);
--nl-space-2: var(--ml-space-2);
--nl-space-3: var(--ml-space-3);
--nl-space-4: var(--ml-space-4);
--nl-space-5: var(--ml-space-5);
--nl-space-6: var(--ml-space-6);
--nl-space-7: var(--ml-space-7);
--nl-space-8: var(--ml-space-8);
--nl-space-10: var(--ml-space-10);
--nl-space-12: var(--ml-space-12);
--nl-space-16: var(--ml-space-16);
--nl-radius-xs: var(--ml-radius-xs);
--nl-radius-sm: var(--ml-radius-sm);
--nl-radius-md: var(--ml-radius-md);
--nl-radius-lg: var(--ml-radius-lg);
--nl-radius-xl: var(--ml-radius-xl);
--nl-radius-pill: var(--ml-radius-pill);
--nl-elevation-sm: var(--ml-elevation-sm);
--nl-elevation-md: var(--ml-elevation-md);
--nl-elevation-lg: var(--ml-elevation-lg);
--nl-motion-fast: var(--ml-motion-fast);
--nl-motion-base: var(--ml-motion-base);
--nl-motion-slow: var(--ml-motion-slow);
--nl-easing-standard: var(--ml-easing-standard);
}
* {
box-sizing: border-box;
}