summaryrefslogtreecommitdiff
path: root/src/styles/global.css
diff options
context:
space:
mode:
authorSolstice <solstice@local>2026-06-09 00:06:42 -0700
committerSolstice <solstice@local>2026-06-09 00:06:42 -0700
commit59708192eb000770ede58f21e5a397c65875eb3b (patch)
tree15c270cc1bb7e62094f45af0a91aa335c4e51ed2 /src/styles/global.css
chore: initial project scaffolding
- Tauri v2 + React + TypeScript (Vite) - Tailwind CSS v4 via @tailwindcss/vite - Zustand for state management - Design system: tokens.css, fonts, icons - tauri.conf.json: solstice, 900x640, min 700x520 - global.css imports tokens and Tailwind
Diffstat (limited to 'src/styles/global.css')
-rw-r--r--src/styles/global.css73
1 files changed, 73 insertions, 0 deletions
diff --git a/src/styles/global.css b/src/styles/global.css
new file mode 100644
index 0000000..2f1d37e
--- /dev/null
+++ b/src/styles/global.css
@@ -0,0 +1,73 @@
+@import "./tokens.css";
+@import "tailwindcss";
+
+@layer base {
+ :root {
+ /* Surface colors */
+ --color-ink-0: var(--ink-0);
+ --color-ink-1: var(--ink-1);
+ --color-ink-2: var(--ink-2);
+ --color-ink-3: var(--ink-3);
+ --color-ink-4: var(--ink-4);
+
+ /* Line colors */
+ --color-line-1: var(--line-1);
+ --color-line-2: var(--line-2);
+ --color-line-3: var(--line-3);
+
+ /* Foreground */
+ --color-fg-1: var(--fg-1);
+ --color-fg-2: var(--fg-2);
+ --color-fg-3: var(--fg-3);
+ --color-fg-4: var(--fg-4);
+
+ /* Accent */
+ --color-brass: var(--brass);
+ --color-brass-bright: var(--brass-bright);
+ --color-brass-deep: var(--brass-deep);
+ --color-brass-ink: var(--brass-ink);
+
+ /* Secondary palette */
+ --color-oxford: var(--oxford);
+ --color-oxford-light: var(--oxford-light);
+ --color-burgundy: var(--burgundy);
+ --color-burgundy-light: var(--burgundy-light);
+
+ /* Semantic */
+ --color-positive: var(--positive);
+ --color-positive-bg: var(--positive-bg);
+ --color-negative: var(--negative);
+ --color-negative-bg: var(--negative-bg);
+ --color-warning: var(--warning);
+ --color-warning-bg: var(--warning-bg);
+ --color-info: var(--info);
+ --color-info-bg: var(--info-bg);
+
+ /* Border radii */
+ --radius-1: var(--r-1);
+ --radius-2: var(--r-2);
+ --radius-3: var(--r-3);
+ --radius-4: var(--r-4);
+ --radius-full: var(--r-full);
+
+ /* Shadows */
+ --shadow-s1: var(--shadow-1);
+ --shadow-s2: var(--shadow-2);
+ --shadow-s3: var(--shadow-3);
+ --shadow-sbr: var(--shadow-brass);
+ }
+
+ html, body {
+ background: var(--ink-0);
+ color: var(--fg-2);
+ font-family: var(--font-sans);
+ font-size: var(--fs-16);
+ line-height: var(--lh-normal);
+ -webkit-font-smoothing: antialiased;
+ text-rendering: optimizeLegibility;
+ }
+
+ #root {
+ min-height: 100vh;
+ }
+}