nils/papercrate
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

slightly warmer theme

Browse Source
This commit is contained in:
nils
2025-11-10 12:14:52 +01:00
parent 288c53364e
commit 9757fd0c10
1 changed files with 22 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/styles/base/theme.css
+22 -22
View File
@@ -6,19 +6,20 @@
--accent-hue-offset: -20deg;
--dark-hue-offset: 30deg;
--dark-foreground-hue-offset: 10deg;
--surface-hue-shift: -4deg;
/* --- Neutrals --- */
--bg: oklch(0.97 0.001 var(--neutral-hue));
--surface: oklch(0.985 0.001 var(--neutral-hue));
--surface-subtle: oklch(0.96 0.002 var(--neutral-hue));
--bg: oklch(0.97 0.001 calc(var(--neutral-hue) + var(--surface-hue-shift)));
--surface: oklch(0.985 0.001 calc(var(--neutral-hue) + var(--surface-hue-shift)));
--surface-subtle: oklch(0.96 0.002 calc(var(--neutral-hue) + var(--surface-hue-shift)));
--fg: oklch(0.32 0.005 calc(var(--neutral-hue) + var(--foreground-hue-offset)));
--muted: oklch(0.54 0.008 calc(var(--neutral-hue) + var(--foreground-hue-offset)));
--sidebar-fg: oklch(0.56 0.007 calc(var(--neutral-hue) + var(--foreground-hue-offset)));
--border: oklch(0.92 0.002 calc(var(--neutral-hue) + var(--foreground-hue-offset)));
/* --- Accent (primary) --- */
--accent: oklch(0.61 0.2 calc(var(--neutral-hue) + var(--foreground-hue-offset) + var(--accent-hue-offset)));
--accent-hover: oklch(0.70 0.02 calc(var(--neutral-hue) + var(--foreground-hue-offset) + var(--accent-hue-offset)));
--accent: oklch(0.61 0.16 calc(var(--neutral-hue) + var(--foreground-hue-offset) + var(--accent-hue-offset)));
--accent-hover: oklch(0.70 0.12 calc(var(--neutral-hue) + var(--foreground-hue-offset) + var(--accent-hue-offset)));
--on-accent: oklch(1 0 0);
--folder-icon-back: color-mix(in oklch, var(--accent) 78%, black 8%);
@@ -33,8 +34,8 @@
--accent-elevated: color-mix(in oklch, var(--accent) 16%, transparent);
--accent-elevated-strong: color-mix(in oklch, var(--accent) 22%, transparent);
--accent-outline: color-mix(in oklch, var(--accent) 45%, transparent);
--accent-outline-strong: color-mix(in oklch, var(--accent) 90%, transparent);
--accent-focus: color-mix(in oklch, var(--accent) 85%, transparent);
--accent-outline-strong: color-mix(in oklch, var(--accent) 80%, transparent);
--accent-focus: color-mix(in oklch, var(--accent) 75%, transparent);
--surface-overlay: color-mix(in oklch, white 82%, transparent);
/* -- Selection --- */
@@ -106,16 +107,16 @@
--dark-neutral-hue: calc(var(--neutral-hue) + var(--dark-hue-offset));
--dark-foreground-hue: calc(var(--neutral-hue) + var(--dark-foreground-hue-offset));
--bg: oklch(0.15 0.01 var(--dark-neutral-hue));
--surface: oklch(0.19 0.012 var(--dark-neutral-hue));
--surface-subtle: oklch(0.23 0.012 var(--dark-neutral-hue));
--bg: oklch(0.15 0.01 calc(var(--dark-neutral-hue) + var(--surface-hue-shift)));
--surface: oklch(0.19 0.012 calc(var(--dark-neutral-hue) + var(--surface-hue-shift)));
--surface-subtle: oklch(0.23 0.012 calc(var(--dark-neutral-hue) + var(--surface-hue-shift)));
--fg: oklch(0.89 0.015 var(--dark-foreground-hue));
--muted: oklch(0.72 0.02 var(--dark-foreground-hue));
--sidebar-fg: oklch(0.78 0.02 var(--dark-foreground-hue));
--border: oklch(0.33 0.01 var(--dark-foreground-hue));
--accent: oklch(0.75 0.2 calc(var(--dark-foreground-hue) + var(--accent-hue-offset)));
--accent-hover: oklch(0.82 0.16 calc(var(--dark-foreground-hue) + var(--accent-hue-offset)));
--accent: oklch(0.75 0.16 calc(var(--dark-foreground-hue) + var(--accent-hue-offset)));
--accent-hover: oklch(0.82 0.13 calc(var(--dark-foreground-hue) + var(--accent-hue-offset)));
--on-accent: oklch(0.15 0.015 var(--dark-foreground-hue));
--folder-icon-back: color-mix(in oklch, var(--accent) 72%, black 12%);
@@ -126,8 +127,8 @@
--accent-elevated: color-mix(in oklch, var(--accent) 28%, transparent);
--accent-elevated-strong: color-mix(in oklch, var(--accent) 38%, transparent);
--accent-outline: color-mix(in oklch, var(--accent) 55%, transparent);
--accent-outline-strong: color-mix(in oklch, var(--accent) 90%, transparent);
--accent-focus: color-mix(in oklch, var(--accent) 80%, transparent);
--accent-outline-strong: color-mix(in oklch, var(--accent) 80%, transparent);
--accent-focus: color-mix(in oklch, var(--accent) 72%, transparent);
--surface-overlay: color-mix(in oklch, black 60%, transparent);
--selection: oklch(0.44 0.04 220deg);
@@ -183,16 +184,16 @@
--dark-neutral-hue: calc(var(--neutral-hue) + var(--dark-hue-offset));
--dark-foreground-hue: calc(var(--neutral-hue) + var(--dark-foreground-hue-offset));
--bg: oklch(0.15 0.01 var(--dark-neutral-hue));
--surface: oklch(0.19 0.012 var(--dark-neutral-hue));
--surface-subtle: oklch(0.23 0.012 var(--dark-neutral-hue));
--bg: oklch(0.15 0.01 calc(var(--dark-neutral-hue) + var(--surface-hue-shift)));
--surface: oklch(0.19 0.012 calc(var(--dark-neutral-hue) + var(--surface-hue-shift)));
--surface-subtle: oklch(0.23 0.012 calc(var(--dark-neutral-hue) + var(--surface-hue-shift)));
--fg: oklch(0.89 0.015 var(--dark-foreground-hue));
--muted: oklch(0.72 0.02 var(--dark-foreground-hue));
--sidebar-fg: oklch(0.78 0.02 var(--dark-foreground-hue));
--border: oklch(0.33 0.01 var(--dark-foreground-hue));
--accent: oklch(0.75 0.2 calc(var(--dark-foreground-hue) + var(--accent-hue-offset)));
--accent-hover: oklch(0.82 0.16 calc(var(--dark-foreground-hue) + var(--accent-hue-offset)));
--accent: oklch(0.75 0.16 calc(var(--dark-foreground-hue) + var(--accent-hue-offset)));
--accent-hover: oklch(0.82 0.13 calc(var(--dark-foreground-hue) + var(--accent-hue-offset)));
--on-accent: oklch(0.15 0.015 var(--dark-foreground-hue));
--folder-icon-back: color-mix(in oklch, var(--accent) 72%, black 12%);
@@ -203,8 +204,8 @@
--accent-elevated: color-mix(in oklch, var(--accent) 28%, transparent);
--accent-elevated-strong: color-mix(in oklch, var(--accent) 38%, transparent);
--accent-outline: color-mix(in oklch, var(--accent) 55%, transparent);
--accent-outline-strong: color-mix(in oklch, var(--accent) 90%, transparent);
--accent-focus: color-mix(in oklch, var(--accent) 80%, transparent);
--accent-outline-strong: color-mix(in oklch, var(--accent) 80%, transparent);
--accent-focus: color-mix(in oklch, var(--accent) 72%, transparent);
--surface-overlay: color-mix(in oklch, black 60%, transparent);
--selection: oklch(0.44 0.04 220deg);
@@ -292,4 +293,3 @@ a:focus-visible {
#app {
height: 100%;
}