1
0
mirror of https://github.com/robonen/lorem-blog.git synced 2026-03-20 10:54:38 +00:00

feat(styles): enhance CSS variables for theming and add new color definitions

This commit is contained in:
2025-06-15 15:38:40 +07:00
parent e528230264
commit 268a6f6f42
4 changed files with 58 additions and 1 deletions

View File

@@ -21,23 +21,55 @@
--primary-dark: oklch(61% 0.1815 255.36);
--primary-light: oklch(96% 0.0148 251.16);
--danger: oklch(64% 0.2107 11.41);
/* Default theme */
--background: var(--gray-200);
--foreground: var(--black);
--surface: var(--white);
--surface-foreground: var(--black);
}
.dark {
--background: var(--black);
--foreground: var(--white);
--surface: var(--black);
--surface-foreground: var(--white);
}
@theme inline {
--gray-100: var(--gray-100);
--gray-200: var(--gray-200);
--gray-300: var(--gray-300);
--gray-400: var(--gray-400);
--gray-500: var(--gray-500);
--gray-600: var(--gray-600);
--gray-700: var(--gray-700);
--gray-800: var(--gray-800);
--gray-900: var(--gray-900);
--color-primary: var(--primary);
--color-primary-dark: var(--primary-dark);
--color-primary-light: var(--primary-light);
--color-danger: var(--danger);
--color-background: var(--background);
--color-foreground: var(--foreground);
--color-primary: var(--primary);
--color-foreground-muted: var(--gray-600);
--color-foreground-muted-light: var(--gray-500);
--color-surface: var(--surface);
--color-surface-foreground: var(--surface-foreground);
}
@layer base {
html {
scrollbar-gutter: stable;
}
body {
@apply bg-background text-foreground;
}