diff options
Diffstat (limited to 'src/styles/global.css')
| -rw-r--r-- | src/styles/global.css | 77 |
1 files changed, 77 insertions, 0 deletions
diff --git a/src/styles/global.css b/src/styles/global.css new file mode 100644 index 0000000..719f8dc --- /dev/null +++ b/src/styles/global.css @@ -0,0 +1,77 @@ +@import 'tailwindcss'; + +@custom-variant dark (&:where([data-theme=dark], [data-theme=dark] *)); + +@theme inline { + --font-sans: + Geist, ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', + 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'; + --font-mono: + Geist Mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, + 'Liberation Mono', 'Courier New', monospace; + + --color-background: var(--background); + --color-foreground: var(--foreground); + + --color-primary: var(--primary); + --color-primary-foreground: var(--primary-foreground); + + --color-muted: var(--muted); + --color-muted-foreground: var(--muted-foreground); + + --color-destructive: var(--destructive); + --color-destructive-foreground: var(--destructive-foreground); + + --color-border: var(--border); + --color-ring: var(--ring); +} + +@font-face { + font-family: 'Geist'; + src: url('/fonts/GeistVF.woff2') format('woff2-variations'); + font-weight: 100 900; + font-style: normal; + font-display: swap; +} + +@font-face { + font-family: 'Geist Mono'; + src: url('/fonts/GeistMonoVF.woff2') format('woff2-variations'); + font-weight: 100 900; + font-style: normal; + font-display: swap; +} + +:root { + --background: oklch(1 0 0); + --foreground: oklch(0.145 0 0); + --primary: oklch(0.205 0 0); + --primary-foreground: oklch(0.985 0 0); + --muted: oklch(0.97 0 0); + --muted-foreground: oklch(0.556 0 0); + --destructive: oklch(0.577 0.245 27.325); + --border: oklch(0.922 0 0); + --ring: oklch(0.708 0 0); +} + +[data-theme='dark'] { + --background: oklch(0.145 0 0); + --foreground: oklch(0.985 0 0); + --primary: oklch(0.922 0 0); + --primary-foreground: oklch(0.205 0 0); + --muted: oklch(0.269 0 0); + --muted-foreground: oklch(0.708 0 0); + --destructive: oklch(0.704 0.191 22.216); + --border: oklch(1 0 0 / 10%); + --ring: oklch(0.556 0 0); +} + +@layer base { + *, + ::after, + ::before, + ::backdrop, + ::file-selector-button { + @apply border-border outline-ring/50 tracking-tight; + } +} |
