themes: generate all 22 from Omarchy, with contrast as a test rather than a taste
The eleven ported themes declared 34 of an 84-token contract. The missing fifty were every surface
(--panel-bg, --card-bg, --glass-bg), every state colour (--success, --warning, --busy, --info), the
header, the scrollbars and the grid — so they fell back to whatever the base stylesheet or the
previously applied theme had left behind. They also carried thirteen tokens nothing in this codebase
reads (--chart-1..5, --sidebar-*), which is the tell: they came from a shadcn template, not from the
contract in the README beside them.
So "highlights mask the content" and "text fades into the background" were not taste. They were
absence, and no amount of re-picking colours would have fixed them.
Generated now, from Omarchy 4's colors.toml, which is genuinely semantic — three background depths,
four foreground weights, accent, selection, muted, mode — and consistent: all 24 keys present in all 22
themes, checked. One mapping in scripts/themes/map.ts means one place to be wrong, one place to fix,
and an Omarchy update becomes a re-run.
Every foreground is driven through ensureContrast against the surface it actually sits on, and the
generator then re-checks sixteen pairs per theme and EXITS NONZERO on a failure. It found four real
bugs in my own mapping, which is the argument for having written it first:
- `on(fill)` picked the better of two palette extremes without checking either passed; rose-pine's
tones are all mid and came out between 2.2:1 and 4.2:1
- ensureContrast chose black or white by a luminance>0.5 test rather than by measuring. rose-pine's
rose sits at 0.25, so it drove toward white and capped at 3.5:1 where black reaches 6:1 easily
- --muted-foreground was derived against the raised surface but renders on the high one; everforest
landed at 4.44:1 and miasma at 4.00 — near-misses that look fine in a screenshot
- borders were held to 3:1, which would ring every panel in a hard line. A panel edge is decoration;
what must be discernible is a form field's boundary, so --input is checked and --border is not
35 failures at first run, 0 now.
The registry and the stylesheet imports are written from the same list, because the old port maintained
them by hand and drifted — catppuccin-mocha sat in THEMES after its stylesheet was gone. That file is
now deleted; Omarchy renamed it to catppuccin.
Eleven new themes arrive with this: ethereal, flexoki-light, hackerman, last-horizon, lumon, lupine,
miasma, retro-82, solitude, vantablack, white. Duck and Plain are Officer's own and are never generated.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
Claude Opus 5
@@ -17,17 +17,28 @@
|
||||
@import './themes/duck-dark.css';
|
||||
@import './themes/plain.css';
|
||||
|
||||
/* Palette themes — 20 standard tokens each, every surface derived. */
|
||||
@import './themes/tokyo-night.css';
|
||||
@import './themes/catppuccin-mocha.css';
|
||||
/* Palette themes — generated from Omarchy by scripts/generate-themes.ts. Do not edit this block. */
|
||||
@import './themes/catppuccin.css';
|
||||
@import './themes/catppuccin-latte.css';
|
||||
@import './themes/ethereal.css';
|
||||
@import './themes/everforest.css';
|
||||
@import './themes/flexoki-light.css';
|
||||
@import './themes/gruvbox.css';
|
||||
@import './themes/hackerman.css';
|
||||
@import './themes/kanagawa.css';
|
||||
@import './themes/last-horizon.css';
|
||||
@import './themes/lumon.css';
|
||||
@import './themes/lupine.css';
|
||||
@import './themes/matte-black.css';
|
||||
@import './themes/miasma.css';
|
||||
@import './themes/nord.css';
|
||||
@import './themes/osaka-jade.css';
|
||||
@import './themes/retro-82.css';
|
||||
@import './themes/ristretto.css';
|
||||
@import './themes/rose-pine.css';
|
||||
@import './themes/solitude.css';
|
||||
@import './themes/tokyo-night.css';
|
||||
@import './themes/vantablack.css';
|
||||
@import './themes/white.css';
|
||||
|
||||
@import './chrome.css';
|
||||
|
||||
@@ -1,50 +1,94 @@
|
||||
/*
|
||||
CATPPUCCIN LATTE — ported from the published palette, unchanged.
|
||||
Catppuccin Latte — generated from Omarchy's palette by scripts/generate-themes.ts.
|
||||
|
||||
A PALETTE theme: it supplies the standard tokens and nothing else. Panels, the header, the dock, glass,
|
||||
grid lines and scrollbars are all derived from these by `base.css`, so this file never mentions them.
|
||||
DO NOT EDIT BY HAND. Change the mapping in scripts/themes/map.ts and re-run, so every theme moves
|
||||
together — the previous port drifted precisely because each file was edited on its own.
|
||||
|
||||
That is the contract working as intended — a theme anyone has already written, dropped in whole. Compare
|
||||
`duck-*.css`, which additionally declares a texture.
|
||||
Source: basecamp/omarchy themes/catppuccin-latte/colors.toml (mode: light)
|
||||
*/
|
||||
|
||||
[data-theme='catppuccin-latte'] {
|
||||
/* The mark. Declared by every theme rather than inherited from a default: a theme that ships a
|
||||
brand should say so, and a white-labelled build replaces this line rather than hunting for the
|
||||
default that was quietly supplying it. */
|
||||
--logo-src: '/officer-logo.svg';
|
||||
|
||||
--radius: 0.625rem;
|
||||
--background: #eff1f5;
|
||||
--foreground: #4c4f69;
|
||||
--card: #e6e9ef;
|
||||
--card: #dce0e8;
|
||||
--card-foreground: #4c4f69;
|
||||
--popover: #e6e9ef;
|
||||
--popover: #dce0e8;
|
||||
--popover-foreground: #4c4f69;
|
||||
--muted: #e3e4e8;
|
||||
--muted-foreground: #5c5f77;
|
||||
--accent: #e3e4e8;
|
||||
--accent-foreground: #4c4f69;
|
||||
--primary: #1e66f5;
|
||||
--primary-foreground: #eff1f5;
|
||||
--secondary: #ccd0da;
|
||||
--primary-foreground: #f5f5f6;
|
||||
--secondary: #e3e4e8;
|
||||
--secondary-foreground: #4c4f69;
|
||||
--muted: #dce0e8;
|
||||
--muted-foreground: #6c6f85;
|
||||
--accent: #04a5e5;
|
||||
--accent-foreground: #eff1f5;
|
||||
--cta: #1e66f5;
|
||||
--cta-foreground: #f5f5f6;
|
||||
--ctahover: #1a5ad8;
|
||||
--success: #40a02b;
|
||||
--success-foreground: #22242f;
|
||||
--warning: #df8e1d;
|
||||
--warning-foreground: #333547;
|
||||
--destructive: #d20f39;
|
||||
--destructive-foreground: #eff1f5;
|
||||
--border: #ccd0da;
|
||||
--input: #ccd0da;
|
||||
--destructive-foreground: #e9eaec;
|
||||
--info: #1e66f5;
|
||||
--info-foreground: #f5f5f6;
|
||||
--busy: #d84e2b;
|
||||
--busy-foreground: #101011;
|
||||
--busy-ink: #bd4426;
|
||||
--border: #caced8;
|
||||
--input: #caced8;
|
||||
--ring: #1e66f5;
|
||||
--chart-1: #1e66f5;
|
||||
--chart-2: #df8e1d;
|
||||
--chart-3: #40a02b;
|
||||
--chart-4: #179299;
|
||||
--chart-5: #8839ef;
|
||||
--sidebar: #e6e9ef;
|
||||
--sidebar-foreground: #6c6f85;
|
||||
--sidebar-primary: #1e66f5;
|
||||
--sidebar-primary-foreground: #eff1f5;
|
||||
--sidebar-accent: #dce0e8;
|
||||
--sidebar-accent-foreground: #4c4f69;
|
||||
--sidebar-border: #ccd0da;
|
||||
--sidebar-ring: #1e66f5;
|
||||
--radius: 0.625rem;
|
||||
--chart-primary: #1e66f5;
|
||||
--chart-secondary: #ea76cb;
|
||||
--status-success: #40a02b;
|
||||
--status-warning: #df8e1d;
|
||||
--status-in-progress: #1e66f5;
|
||||
--page-bg: #eff1f5;
|
||||
--page-bg-src: '';
|
||||
--panel-bg: rgb(220 224 232 / 0.72);
|
||||
--panel-border: rgb(202 206 216 / 0.9);
|
||||
--panel-border-bare: rgb(202 206 216 / 0.55);
|
||||
--panel-raised-bg: rgb(220 224 232 / 0.95);
|
||||
--panel-raised-border: rgb(202 206 216 / 1);
|
||||
--panel-accent: #1e66f5;
|
||||
--panel-header-bg: rgb(227 228 232 / 0.6);
|
||||
--panel-header-fg: #4c4f69;
|
||||
--panel-radius: 0.75rem;
|
||||
--panel-blur: 12px;
|
||||
--card-bg: #dce0e8;
|
||||
--glass-bg: rgb(220 224 232 / 0.55);
|
||||
--glass-border: rgb(202 206 216 / 0.7);
|
||||
--dock-bg: rgb(220 224 232 / 0.7);
|
||||
--dock-border: rgb(202 206 216 / 0.8);
|
||||
--dock-tooltip-bg: #e3e4e8;
|
||||
--header-bg: rgb(220 224 232 / 0.8);
|
||||
--header-border: rgb(202 206 216 / 0.9);
|
||||
--header-fg: #4c4f69;
|
||||
--header-blur: 12px;
|
||||
--pixel-grid-color: rgb(121 124 136 / 0.07);
|
||||
--card-grid-color: rgb(121 124 136 / 0.05);
|
||||
--panel-grid-color: rgb(121 124 136 / 0.06);
|
||||
--scrollbar-thumb: rgb(172 176 190 / 0.6);
|
||||
--scrollbar-thumb-hover: rgb(172 176 190 / 0.85);
|
||||
--scrollbar-thin-thumb: rgb(172 176 190 / 0.45);
|
||||
--scrollbar-thin-thumb-hover: rgb(172 176 190 / 0.7);
|
||||
--brand: #1e66f5;
|
||||
--brand-foreground: #f5f5f6;
|
||||
--brand-primary: #1e66f5;
|
||||
--brand-accent: #179299;
|
||||
--brand-warm: #d84e2b;
|
||||
--brand-deep: #e3e4e8;
|
||||
--brand-muted: #acb0be;
|
||||
--ink: #4c4f69;
|
||||
--surface-warm: #dce0e8;
|
||||
--naturegreen: #40a02b;
|
||||
--naturegreen-foreground: #22242f;
|
||||
--duck-dark: #4c4f69;
|
||||
--duck-teal: #179299;
|
||||
--duck-yellow: #df8e1d;
|
||||
--duck-orange: #d84e2b;
|
||||
--duck-forest: #40a02b;
|
||||
--duck-beige: #ced2db;
|
||||
--logo-src: '/officer-logo.svg';
|
||||
}
|
||||
|
||||
@@ -1,50 +0,0 @@
|
||||
/*
|
||||
CATPPUCCIN MOCHA — ported from the published palette, unchanged.
|
||||
|
||||
A PALETTE theme: it supplies the standard tokens and nothing else. Panels, the header, the dock, glass,
|
||||
grid lines and scrollbars are all derived from these by `base.css`, so this file never mentions them.
|
||||
|
||||
That is the contract working as intended — a theme anyone has already written, dropped in whole. Compare
|
||||
`duck-*.css`, which additionally declares a texture.
|
||||
*/
|
||||
|
||||
[data-theme='catppuccin-mocha'] {
|
||||
/* The mark. Declared by every theme rather than inherited from a default: a theme that ships a
|
||||
brand should say so, and a white-labelled build replaces this line rather than hunting for the
|
||||
default that was quietly supplying it. */
|
||||
--logo-src: '/officer-logo.svg';
|
||||
|
||||
--radius: 0.625rem;
|
||||
--background: #1e1e2e;
|
||||
--foreground: #cdd6f4;
|
||||
--card: #181825;
|
||||
--card-foreground: #cdd6f4;
|
||||
--popover: #181825;
|
||||
--popover-foreground: #cdd6f4;
|
||||
--primary: #89b4fa;
|
||||
--primary-foreground: #1e1e2e;
|
||||
--secondary: #45475a;
|
||||
--secondary-foreground: #cdd6f4;
|
||||
--muted: #313244;
|
||||
--muted-foreground: #7f849c;
|
||||
--accent: #89dceb;
|
||||
--accent-foreground: #1e1e2e;
|
||||
--destructive: #f38ba8;
|
||||
--destructive-foreground: #1e1e2e;
|
||||
--border: #45475a;
|
||||
--input: #45475a;
|
||||
--ring: #89b4fa;
|
||||
--chart-1: #89b4fa;
|
||||
--chart-2: #f9e2af;
|
||||
--chart-3: #a6e3a1;
|
||||
--chart-4: #94e2d5;
|
||||
--chart-5: #cba6f7;
|
||||
--sidebar: #181825;
|
||||
--sidebar-foreground: #7f849c;
|
||||
--sidebar-primary: #89b4fa;
|
||||
--sidebar-primary-foreground: #1e1e2e;
|
||||
--sidebar-accent: #313244;
|
||||
--sidebar-accent-foreground: #cdd6f4;
|
||||
--sidebar-border: #45475a;
|
||||
--sidebar-ring: #89b4fa;
|
||||
}
|
||||
@@ -0,0 +1,94 @@
|
||||
/*
|
||||
Catppuccin — generated from Omarchy's palette by scripts/generate-themes.ts.
|
||||
|
||||
DO NOT EDIT BY HAND. Change the mapping in scripts/themes/map.ts and re-run, so every theme moves
|
||||
together — the previous port drifted precisely because each file was edited on its own.
|
||||
|
||||
Source: basecamp/omarchy themes/catppuccin/colors.toml (mode: dark)
|
||||
*/
|
||||
[data-theme='catppuccin'] {
|
||||
--background: #101019;
|
||||
--foreground: #cdd6f4;
|
||||
--card: #1e1e2e;
|
||||
--card-foreground: #cdd6f4;
|
||||
--popover: #1e1e2e;
|
||||
--popover-foreground: #cdd6f4;
|
||||
--muted: #313244;
|
||||
--muted-foreground: #bac2de;
|
||||
--accent: #313244;
|
||||
--accent-foreground: #cdd6f4;
|
||||
--primary: #89b4fa;
|
||||
--primary-foreground: #101019;
|
||||
--secondary: #313244;
|
||||
--secondary-foreground: #cdd6f4;
|
||||
--cta: #89b4fa;
|
||||
--cta-foreground: #101019;
|
||||
--ctahover: #97bdfb;
|
||||
--success: #a6e3a1;
|
||||
--success-foreground: #101019;
|
||||
--warning: #f9e2af;
|
||||
--warning-foreground: #101019;
|
||||
--destructive: #f38ba8;
|
||||
--destructive-foreground: #101019;
|
||||
--info: #89b4fa;
|
||||
--info-foreground: #101019;
|
||||
--busy: #f6b6ab;
|
||||
--busy-foreground: #101019;
|
||||
--busy-ink: #f6b6ab;
|
||||
--border: #4a4c5f;
|
||||
--input: #4a4c5f;
|
||||
--ring: #89b4fa;
|
||||
--radius: 0.625rem;
|
||||
--chart-primary: #89b4fa;
|
||||
--chart-secondary: #f5c2e7;
|
||||
--status-success: #a6e3a1;
|
||||
--status-warning: #f9e2af;
|
||||
--status-in-progress: #89b4fa;
|
||||
--page-bg: #101019;
|
||||
--page-bg-src: '';
|
||||
--panel-bg: rgb(30 30 46 / 0.72);
|
||||
--panel-border: rgb(74 76 95 / 0.9);
|
||||
--panel-border-bare: rgb(74 76 95 / 0.55);
|
||||
--panel-raised-bg: rgb(30 30 46 / 0.95);
|
||||
--panel-raised-border: rgb(74 76 95 / 1);
|
||||
--panel-accent: #89b4fa;
|
||||
--panel-header-bg: rgb(49 50 68 / 0.6);
|
||||
--panel-header-fg: #cdd6f4;
|
||||
--panel-radius: 0.75rem;
|
||||
--panel-blur: 12px;
|
||||
--card-bg: #1e1e2e;
|
||||
--glass-bg: rgb(30 30 46 / 0.55);
|
||||
--glass-border: rgb(74 76 95 / 0.7);
|
||||
--dock-bg: rgb(30 30 46 / 0.7);
|
||||
--dock-border: rgb(74 76 95 / 0.8);
|
||||
--dock-tooltip-bg: #313244;
|
||||
--header-bg: rgb(30 30 46 / 0.8);
|
||||
--header-border: rgb(74 76 95 / 0.9);
|
||||
--header-fg: #cdd6f4;
|
||||
--header-blur: 12px;
|
||||
--pixel-grid-color: rgb(108 112 134 / 0.07);
|
||||
--card-grid-color: rgb(108 112 134 / 0.05);
|
||||
--panel-grid-color: rgb(108 112 134 / 0.06);
|
||||
--scrollbar-thumb: rgb(88 91 112 / 0.6);
|
||||
--scrollbar-thumb-hover: rgb(88 91 112 / 0.85);
|
||||
--scrollbar-thin-thumb: rgb(88 91 112 / 0.45);
|
||||
--scrollbar-thin-thumb-hover: rgb(88 91 112 / 0.7);
|
||||
--brand: #89b4fa;
|
||||
--brand-foreground: #101019;
|
||||
--brand-primary: #89b4fa;
|
||||
--brand-accent: #94e2d5;
|
||||
--brand-warm: #f6b6ab;
|
||||
--brand-deep: #101019;
|
||||
--brand-muted: #585b70;
|
||||
--ink: #cdd6f4;
|
||||
--surface-warm: #1e1e2e;
|
||||
--naturegreen: #a6e3a1;
|
||||
--naturegreen-foreground: #101019;
|
||||
--duck-dark: #cdd6f4;
|
||||
--duck-teal: #94e2d5;
|
||||
--duck-yellow: #f9e2af;
|
||||
--duck-orange: #f6b6ab;
|
||||
--duck-forest: #a6e3a1;
|
||||
--duck-beige: #303042;
|
||||
--logo-src: '/officer-logo.svg';
|
||||
}
|
||||
@@ -0,0 +1,94 @@
|
||||
/*
|
||||
Ethereal — generated from Omarchy's palette by scripts/generate-themes.ts.
|
||||
|
||||
DO NOT EDIT BY HAND. Change the mapping in scripts/themes/map.ts and re-run, so every theme moves
|
||||
together — the previous port drifted precisely because each file was edited on its own.
|
||||
|
||||
Source: basecamp/omarchy themes/ethereal/colors.toml (mode: dark)
|
||||
*/
|
||||
[data-theme='ethereal'] {
|
||||
--background: #030610;
|
||||
--foreground: #ffcead;
|
||||
--card: #060B1E;
|
||||
--card-foreground: #ffcead;
|
||||
--popover: #060B1E;
|
||||
--popover-foreground: #ffcead;
|
||||
--muted: #131a3a;
|
||||
--muted-foreground: #c9b8a6;
|
||||
--accent: #131a3a;
|
||||
--accent-foreground: #ffcead;
|
||||
--primary: #7d82d9;
|
||||
--primary-foreground: #030610;
|
||||
--secondary: #131a3a;
|
||||
--secondary-foreground: #ffcead;
|
||||
--cta: #7d82d9;
|
||||
--cta-foreground: #030610;
|
||||
--ctahover: #8d91de;
|
||||
--success: #92a593;
|
||||
--success-foreground: #030610;
|
||||
--warning: #E9BB4F;
|
||||
--warning-foreground: #030610;
|
||||
--destructive: #ED5B5A;
|
||||
--destructive-foreground: #030610;
|
||||
--info: #7d82d9;
|
||||
--info-foreground: #030610;
|
||||
--busy: #eb8b54;
|
||||
--busy-foreground: #030610;
|
||||
--busy-ink: #eb8b54;
|
||||
--border: #3d3b44;
|
||||
--input: #3d3b44;
|
||||
--ring: #7d82d9;
|
||||
--radius: 0.625rem;
|
||||
--chart-primary: #7d82d9;
|
||||
--chart-secondary: #c89dc1;
|
||||
--status-success: #92a593;
|
||||
--status-warning: #E9BB4F;
|
||||
--status-in-progress: #7d82d9;
|
||||
--page-bg: #030610;
|
||||
--page-bg-src: '';
|
||||
--panel-bg: rgb(6 11 30 / 0.72);
|
||||
--panel-border: rgb(61 59 68 / 0.9);
|
||||
--panel-border-bare: rgb(61 59 68 / 0.55);
|
||||
--panel-raised-bg: rgb(6 11 30 / 0.95);
|
||||
--panel-raised-border: rgb(61 59 68 / 1);
|
||||
--panel-accent: #7d82d9;
|
||||
--panel-header-bg: rgb(19 26 58 / 0.6);
|
||||
--panel-header-fg: #ffcead;
|
||||
--panel-radius: 0.75rem;
|
||||
--panel-blur: 12px;
|
||||
--card-bg: #060B1E;
|
||||
--glass-bg: rgb(6 11 30 / 0.55);
|
||||
--glass-border: rgb(61 59 68 / 0.7);
|
||||
--dock-bg: rgb(6 11 30 / 0.7);
|
||||
--dock-border: rgb(61 59 68 / 0.8);
|
||||
--dock-tooltip-bg: #131a3a;
|
||||
--header-bg: rgb(6 11 30 / 0.8);
|
||||
--header-border: rgb(61 59 68 / 0.9);
|
||||
--header-fg: #ffcead;
|
||||
--header-blur: 12px;
|
||||
--pixel-grid-color: rgb(109 125 182 / 0.07);
|
||||
--card-grid-color: rgb(109 125 182 / 0.05);
|
||||
--panel-grid-color: rgb(109 125 182 / 0.06);
|
||||
--scrollbar-thumb: rgb(109 125 182 / 0.6);
|
||||
--scrollbar-thumb-hover: rgb(109 125 182 / 0.85);
|
||||
--scrollbar-thin-thumb: rgb(109 125 182 / 0.45);
|
||||
--scrollbar-thin-thumb-hover: rgb(109 125 182 / 0.7);
|
||||
--brand: #7d82d9;
|
||||
--brand-foreground: #030610;
|
||||
--brand-primary: #7d82d9;
|
||||
--brand-accent: #a3bfd1;
|
||||
--brand-warm: #eb8b54;
|
||||
--brand-deep: #030610;
|
||||
--brand-muted: #6d7db6;
|
||||
--ink: #ffcead;
|
||||
--surface-warm: #060B1E;
|
||||
--naturegreen: #92a593;
|
||||
--naturegreen-foreground: #030610;
|
||||
--duck-dark: #ffcead;
|
||||
--duck-teal: #a3bfd1;
|
||||
--duck-yellow: #E9BB4F;
|
||||
--duck-orange: #eb8b54;
|
||||
--duck-forest: #92a593;
|
||||
--duck-beige: #1f1f2c;
|
||||
--logo-src: '/officer-logo.svg';
|
||||
}
|
||||
@@ -1,50 +1,94 @@
|
||||
/*
|
||||
EVERFOREST — ported from the published palette, unchanged.
|
||||
Everforest — generated from Omarchy's palette by scripts/generate-themes.ts.
|
||||
|
||||
A PALETTE theme: it supplies the standard tokens and nothing else. Panels, the header, the dock, glass,
|
||||
grid lines and scrollbars are all derived from these by `base.css`, so this file never mentions them.
|
||||
DO NOT EDIT BY HAND. Change the mapping in scripts/themes/map.ts and re-run, so every theme moves
|
||||
together — the previous port drifted precisely because each file was edited on its own.
|
||||
|
||||
That is the contract working as intended — a theme anyone has already written, dropped in whole. Compare
|
||||
`duck-*.css`, which additionally declares a texture.
|
||||
Source: basecamp/omarchy themes/everforest/colors.toml (mode: dark)
|
||||
*/
|
||||
|
||||
[data-theme='everforest'] {
|
||||
/* The mark. Declared by every theme rather than inherited from a default: a theme that ships a
|
||||
brand should say so, and a white-labelled build replaces this line rather than hunting for the
|
||||
default that was quietly supplying it. */
|
||||
--logo-src: '/officer-logo.svg';
|
||||
|
||||
--radius: 0.625rem;
|
||||
--background: #2d353b;
|
||||
--background: #181d20;
|
||||
--foreground: #d3c6aa;
|
||||
--card: #272e33;
|
||||
--card: #2d353b;
|
||||
--card-foreground: #d3c6aa;
|
||||
--popover: #272e33;
|
||||
--popover: #2d353b;
|
||||
--popover-foreground: #d3c6aa;
|
||||
--primary: #a7c080;
|
||||
--primary-foreground: #2d353b;
|
||||
--secondary: #3d484d;
|
||||
--muted: #343f44;
|
||||
--muted-foreground: #9faba2;
|
||||
--accent: #343f44;
|
||||
--accent-foreground: #d3c6aa;
|
||||
--primary: #7fbbb3;
|
||||
--primary-foreground: #181d20;
|
||||
--secondary: #343f44;
|
||||
--secondary-foreground: #d3c6aa;
|
||||
--muted: #374247;
|
||||
--muted-foreground: #859289;
|
||||
--accent: #83c092;
|
||||
--accent-foreground: #2d353b;
|
||||
--cta: #7fbbb3;
|
||||
--cta-foreground: #181d20;
|
||||
--ctahover: #8ec3bc;
|
||||
--success: #a7c080;
|
||||
--success-foreground: #181d20;
|
||||
--warning: #dbbc7f;
|
||||
--warning-foreground: #181d20;
|
||||
--destructive: #e67e80;
|
||||
--destructive-foreground: #d3c6aa;
|
||||
--border: #3d484d;
|
||||
--input: #3d484d;
|
||||
--ring: #a7c080;
|
||||
--chart-1: #a7c080;
|
||||
--chart-2: #dbbc7f;
|
||||
--chart-3: #83c092;
|
||||
--chart-4: #7fbbb3;
|
||||
--chart-5: #d699b6;
|
||||
--sidebar: #272e33;
|
||||
--sidebar-foreground: #859289;
|
||||
--sidebar-primary: #a7c080;
|
||||
--sidebar-primary-foreground: #2d353b;
|
||||
--sidebar-accent: #374247;
|
||||
--sidebar-accent-foreground: #d3c6aa;
|
||||
--sidebar-border: #3d484d;
|
||||
--sidebar-ring: #a7c080;
|
||||
--destructive-foreground: #181d20;
|
||||
--info: #7fbbb3;
|
||||
--info-foreground: #181d20;
|
||||
--busy: #e09d7f;
|
||||
--busy-foreground: #181d20;
|
||||
--busy-ink: #e09d7f;
|
||||
--border: #4c5557;
|
||||
--input: #4c5557;
|
||||
--ring: #7fbbb3;
|
||||
--radius: 0.625rem;
|
||||
--chart-primary: #7fbbb3;
|
||||
--chart-secondary: #d699b6;
|
||||
--status-success: #a7c080;
|
||||
--status-warning: #dbbc7f;
|
||||
--status-in-progress: #7fbbb3;
|
||||
--page-bg: #181d20;
|
||||
--page-bg-src: '';
|
||||
--panel-bg: rgb(45 53 59 / 0.72);
|
||||
--panel-border: rgb(76 85 87 / 0.9);
|
||||
--panel-border-bare: rgb(76 85 87 / 0.55);
|
||||
--panel-raised-bg: rgb(45 53 59 / 0.95);
|
||||
--panel-raised-border: rgb(76 85 87 / 1);
|
||||
--panel-accent: #7fbbb3;
|
||||
--panel-header-bg: rgb(52 63 68 / 0.6);
|
||||
--panel-header-fg: #d3c6aa;
|
||||
--panel-radius: 0.75rem;
|
||||
--panel-blur: 12px;
|
||||
--card-bg: #2d353b;
|
||||
--glass-bg: rgb(45 53 59 / 0.55);
|
||||
--glass-border: rgb(76 85 87 / 0.7);
|
||||
--dock-bg: rgb(45 53 59 / 0.7);
|
||||
--dock-border: rgb(76 85 87 / 0.8);
|
||||
--dock-tooltip-bg: #343f44;
|
||||
--header-bg: rgb(45 53 59 / 0.8);
|
||||
--header-border: rgb(76 85 87 / 0.9);
|
||||
--header-fg: #d3c6aa;
|
||||
--header-blur: 12px;
|
||||
--pixel-grid-color: rgb(119 126 130 / 0.07);
|
||||
--card-grid-color: rgb(119 126 130 / 0.05);
|
||||
--panel-grid-color: rgb(119 126 130 / 0.06);
|
||||
--scrollbar-thumb: rgb(71 82 88 / 0.6);
|
||||
--scrollbar-thumb-hover: rgb(71 82 88 / 0.85);
|
||||
--scrollbar-thin-thumb: rgb(71 82 88 / 0.45);
|
||||
--scrollbar-thin-thumb-hover: rgb(71 82 88 / 0.7);
|
||||
--brand: #7fbbb3;
|
||||
--brand-foreground: #181d20;
|
||||
--brand-primary: #7fbbb3;
|
||||
--brand-accent: #83c092;
|
||||
--brand-warm: #e09d7f;
|
||||
--brand-deep: #181d20;
|
||||
--brand-muted: #475258;
|
||||
--ink: #d3c6aa;
|
||||
--surface-warm: #2d353b;
|
||||
--naturegreen: #a7c080;
|
||||
--naturegreen-foreground: #181d20;
|
||||
--duck-dark: #d3c6aa;
|
||||
--duck-teal: #83c092;
|
||||
--duck-yellow: #dbbc7f;
|
||||
--duck-orange: #e09d7f;
|
||||
--duck-forest: #a7c080;
|
||||
--duck-beige: #3e4446;
|
||||
--logo-src: '/officer-logo.svg';
|
||||
}
|
||||
|
||||
@@ -0,0 +1,94 @@
|
||||
/*
|
||||
Flexoki Light — generated from Omarchy's palette by scripts/generate-themes.ts.
|
||||
|
||||
DO NOT EDIT BY HAND. Change the mapping in scripts/themes/map.ts and re-run, so every theme moves
|
||||
together — the previous port drifted precisely because each file was edited on its own.
|
||||
|
||||
Source: basecamp/omarchy themes/flexoki-light/colors.toml (mode: light)
|
||||
*/
|
||||
[data-theme='flexoki-light'] {
|
||||
--background: #FFFCF0;
|
||||
--foreground: #100F0F;
|
||||
--card: #E6E4D9;
|
||||
--card-foreground: #100F0F;
|
||||
--popover: #E6E4D9;
|
||||
--popover-foreground: #100F0F;
|
||||
--muted: #f2efe4;
|
||||
--muted-foreground: #403E3C;
|
||||
--accent: #f2efe4;
|
||||
--accent-foreground: #100F0F;
|
||||
--primary: #205EA6;
|
||||
--primary-foreground: #e5e2d8;
|
||||
--secondary: #f2efe4;
|
||||
--secondary-foreground: #100F0F;
|
||||
--cta: #205EA6;
|
||||
--cta-foreground: #e5e2d8;
|
||||
--ctahover: #1c5392;
|
||||
--success: #879A39;
|
||||
--success-foreground: #100F0F;
|
||||
--warning: #D0A215;
|
||||
--warning-foreground: #100F0F;
|
||||
--destructive: #D14D41;
|
||||
--destructive-foreground: #0d0c0c;
|
||||
--info: #205EA6;
|
||||
--info-foreground: #e5e2d8;
|
||||
--busy: #d0772b;
|
||||
--busy-foreground: #100F0F;
|
||||
--busy-ink: #ac6223;
|
||||
--border: #cbc9c0;
|
||||
--input: #cbc9c0;
|
||||
--ring: #205EA6;
|
||||
--radius: 0.625rem;
|
||||
--chart-primary: #205EA6;
|
||||
--chart-secondary: #CE5D97;
|
||||
--status-success: #879A39;
|
||||
--status-warning: #D0A215;
|
||||
--status-in-progress: #205EA6;
|
||||
--page-bg: #FFFCF0;
|
||||
--page-bg-src: '';
|
||||
--panel-bg: rgb(230 228 217 / 0.72);
|
||||
--panel-border: rgb(203 201 192 / 0.9);
|
||||
--panel-border-bare: rgb(203 201 192 / 0.55);
|
||||
--panel-raised-bg: rgb(230 228 217 / 0.95);
|
||||
--panel-raised-border: rgb(203 201 192 / 1);
|
||||
--panel-accent: #205EA6;
|
||||
--panel-header-bg: rgb(242 239 228 / 0.6);
|
||||
--panel-header-fg: #100F0F;
|
||||
--panel-radius: 0.75rem;
|
||||
--panel-blur: 12px;
|
||||
--card-bg: #E6E4D9;
|
||||
--glass-bg: rgb(230 228 217 / 0.55);
|
||||
--glass-border: rgb(203 201 192 / 0.7);
|
||||
--dock-bg: rgb(230 228 217 / 0.7);
|
||||
--dock-border: rgb(203 201 192 / 0.8);
|
||||
--dock-tooltip-bg: #f2efe4;
|
||||
--header-bg: rgb(230 228 217 / 0.8);
|
||||
--header-border: rgb(203 201 192 / 0.9);
|
||||
--header-fg: #100F0F;
|
||||
--header-blur: 12px;
|
||||
--pixel-grid-color: rgb(132 130 125 / 0.07);
|
||||
--card-grid-color: rgb(132 130 125 / 0.05);
|
||||
--panel-grid-color: rgb(132 130 125 / 0.06);
|
||||
--scrollbar-thumb: rgb(183 181 172 / 0.6);
|
||||
--scrollbar-thumb-hover: rgb(183 181 172 / 0.85);
|
||||
--scrollbar-thin-thumb: rgb(183 181 172 / 0.45);
|
||||
--scrollbar-thin-thumb-hover: rgb(183 181 172 / 0.7);
|
||||
--brand: #205EA6;
|
||||
--brand-foreground: #e5e2d8;
|
||||
--brand-primary: #205EA6;
|
||||
--brand-accent: #3AA99F;
|
||||
--brand-warm: #d0772b;
|
||||
--brand-deep: #f2efe4;
|
||||
--brand-muted: #B7B5AC;
|
||||
--ink: #100F0F;
|
||||
--surface-warm: #E6E4D9;
|
||||
--naturegreen: #879A39;
|
||||
--naturegreen-foreground: #100F0F;
|
||||
--duck-dark: #100F0F;
|
||||
--duck-teal: #3AA99F;
|
||||
--duck-yellow: #D0A215;
|
||||
--duck-orange: #d0772b;
|
||||
--duck-forest: #879A39;
|
||||
--duck-beige: #d1cfc5;
|
||||
--logo-src: '/officer-logo.svg';
|
||||
}
|
||||
@@ -1,50 +1,94 @@
|
||||
/*
|
||||
GRUVBOX — ported from the published palette, unchanged.
|
||||
Gruvbox — generated from Omarchy's palette by scripts/generate-themes.ts.
|
||||
|
||||
A PALETTE theme: it supplies the standard tokens and nothing else. Panels, the header, the dock, glass,
|
||||
grid lines and scrollbars are all derived from these by `base.css`, so this file never mentions them.
|
||||
DO NOT EDIT BY HAND. Change the mapping in scripts/themes/map.ts and re-run, so every theme moves
|
||||
together — the previous port drifted precisely because each file was edited on its own.
|
||||
|
||||
That is the contract working as intended — a theme anyone has already written, dropped in whole. Compare
|
||||
`duck-*.css`, which additionally declares a texture.
|
||||
Source: basecamp/omarchy themes/gruvbox/colors.toml (mode: dark)
|
||||
*/
|
||||
|
||||
[data-theme='gruvbox'] {
|
||||
/* The mark. Declared by every theme rather than inherited from a default: a theme that ships a
|
||||
brand should say so, and a white-labelled build replaces this line rather than hunting for the
|
||||
default that was quietly supplying it. */
|
||||
--logo-src: '/officer-logo.svg';
|
||||
|
||||
--radius: 0.625rem;
|
||||
--background: #282828;
|
||||
--foreground: #ebdbb2;
|
||||
--card: #1d2021;
|
||||
--card-foreground: #ebdbb2;
|
||||
--popover: #1d2021;
|
||||
--popover-foreground: #ebdbb2;
|
||||
--primary: #83a598;
|
||||
--primary-foreground: #282828;
|
||||
--secondary: #504945;
|
||||
--secondary-foreground: #ebdbb2;
|
||||
--background: #161616;
|
||||
--foreground: #d4be98;
|
||||
--card: #282828;
|
||||
--card-foreground: #d4be98;
|
||||
--popover: #282828;
|
||||
--popover-foreground: #d4be98;
|
||||
--muted: #3c3836;
|
||||
--muted-foreground: #a89984;
|
||||
--accent: #8ec07c;
|
||||
--accent-foreground: #282828;
|
||||
--destructive: #fb4934;
|
||||
--destructive-foreground: #ebdbb2;
|
||||
--border: #504945;
|
||||
--input: #504945;
|
||||
--ring: #83a598;
|
||||
--chart-1: #83a598;
|
||||
--chart-2: #fabd2f;
|
||||
--chart-3: #b8bb26;
|
||||
--chart-4: #8ec07c;
|
||||
--chart-5: #d3869b;
|
||||
--sidebar: #1d2021;
|
||||
--sidebar-foreground: #a89984;
|
||||
--sidebar-primary: #83a598;
|
||||
--sidebar-primary-foreground: #282828;
|
||||
--sidebar-accent: #3c3836;
|
||||
--sidebar-accent-foreground: #ebdbb2;
|
||||
--sidebar-border: #504945;
|
||||
--sidebar-ring: #83a598;
|
||||
--muted-foreground: #bdae93;
|
||||
--accent: #3c3836;
|
||||
--accent-foreground: #d4be98;
|
||||
--primary: #7daea3;
|
||||
--primary-foreground: #161616;
|
||||
--secondary: #3c3836;
|
||||
--secondary-foreground: #d4be98;
|
||||
--cta: #7daea3;
|
||||
--cta-foreground: #161616;
|
||||
--ctahover: #8db8ae;
|
||||
--success: #a9b665;
|
||||
--success-foreground: #161616;
|
||||
--warning: #d8a657;
|
||||
--warning-foreground: #161616;
|
||||
--destructive: #ea6962;
|
||||
--destructive-foreground: #161616;
|
||||
--info: #7daea3;
|
||||
--info-foreground: #161616;
|
||||
--busy: #e1875c;
|
||||
--busy-foreground: #161616;
|
||||
--busy-ink: #e1875c;
|
||||
--border: #524e46;
|
||||
--input: #524e46;
|
||||
--ring: #7daea3;
|
||||
--radius: 0.625rem;
|
||||
--chart-primary: #7daea3;
|
||||
--chart-secondary: #d3869b;
|
||||
--status-success: #a9b665;
|
||||
--status-warning: #d8a657;
|
||||
--status-in-progress: #7daea3;
|
||||
--page-bg: #161616;
|
||||
--page-bg-src: '';
|
||||
--panel-bg: rgb(40 40 40 / 0.72);
|
||||
--panel-border: rgb(82 78 70 / 0.9);
|
||||
--panel-border-bare: rgb(82 78 70 / 0.55);
|
||||
--panel-raised-bg: rgb(40 40 40 / 0.95);
|
||||
--panel-raised-border: rgb(82 78 70 / 1);
|
||||
--panel-accent: #7daea3;
|
||||
--panel-header-bg: rgb(60 56 54 / 0.6);
|
||||
--panel-header-fg: #d4be98;
|
||||
--panel-radius: 0.75rem;
|
||||
--panel-blur: 12px;
|
||||
--card-bg: #282828;
|
||||
--glass-bg: rgb(40 40 40 / 0.55);
|
||||
--glass-border: rgb(82 78 70 / 0.7);
|
||||
--dock-bg: rgb(40 40 40 / 0.7);
|
||||
--dock-border: rgb(82 78 70 / 0.8);
|
||||
--dock-tooltip-bg: #3c3836;
|
||||
--header-bg: rgb(40 40 40 / 0.8);
|
||||
--header-border: rgb(82 78 70 / 0.9);
|
||||
--header-fg: #d4be98;
|
||||
--header-blur: 12px;
|
||||
--pixel-grid-color: rgb(124 111 100 / 0.07);
|
||||
--card-grid-color: rgb(124 111 100 / 0.05);
|
||||
--panel-grid-color: rgb(124 111 100 / 0.06);
|
||||
--scrollbar-thumb: rgb(102 92 84 / 0.6);
|
||||
--scrollbar-thumb-hover: rgb(102 92 84 / 0.85);
|
||||
--scrollbar-thin-thumb: rgb(102 92 84 / 0.45);
|
||||
--scrollbar-thin-thumb-hover: rgb(102 92 84 / 0.7);
|
||||
--brand: #7daea3;
|
||||
--brand-foreground: #161616;
|
||||
--brand-primary: #7daea3;
|
||||
--brand-accent: #89b482;
|
||||
--brand-warm: #e1875c;
|
||||
--brand-deep: #161616;
|
||||
--brand-muted: #665c54;
|
||||
--ink: #d4be98;
|
||||
--surface-warm: #282828;
|
||||
--naturegreen: #a9b665;
|
||||
--naturegreen-foreground: #161616;
|
||||
--duck-dark: #d4be98;
|
||||
--duck-teal: #89b482;
|
||||
--duck-yellow: #d8a657;
|
||||
--duck-orange: #e1875c;
|
||||
--duck-forest: #a9b665;
|
||||
--duck-beige: #393733;
|
||||
--logo-src: '/officer-logo.svg';
|
||||
}
|
||||
|
||||
@@ -0,0 +1,94 @@
|
||||
/*
|
||||
Hackerman — generated from Omarchy's palette by scripts/generate-themes.ts.
|
||||
|
||||
DO NOT EDIT BY HAND. Change the mapping in scripts/themes/map.ts and re-run, so every theme moves
|
||||
together — the previous port drifted precisely because each file was edited on its own.
|
||||
|
||||
Source: basecamp/omarchy themes/hackerman/colors.toml (mode: dark)
|
||||
*/
|
||||
[data-theme='hackerman'] {
|
||||
--background: #06060c;
|
||||
--foreground: #ddf7ff;
|
||||
--card: #0B0C16;
|
||||
--card-foreground: #ddf7ff;
|
||||
--popover: #0B0C16;
|
||||
--popover-foreground: #ddf7ff;
|
||||
--muted: #151828;
|
||||
--muted-foreground: #b5c5db;
|
||||
--accent: #151828;
|
||||
--accent-foreground: #ddf7ff;
|
||||
--primary: #82FB9C;
|
||||
--primary-foreground: #06060c;
|
||||
--secondary: #151828;
|
||||
--secondary-foreground: #ddf7ff;
|
||||
--cta: #82FB9C;
|
||||
--cta-foreground: #06060c;
|
||||
--ctahover: #91fba8;
|
||||
--success: #4fe88f;
|
||||
--success-foreground: #06060c;
|
||||
--warning: #50f7d4;
|
||||
--warning-foreground: #06060c;
|
||||
--destructive: #50f872;
|
||||
--destructive-foreground: #06060c;
|
||||
--info: #829dd4;
|
||||
--info-foreground: #06060c;
|
||||
--busy: #50f7a3;
|
||||
--busy-foreground: #06060c;
|
||||
--busy-ink: #50f7a3;
|
||||
--border: #3b404d;
|
||||
--input: #3b404d;
|
||||
--ring: #82FB9C;
|
||||
--radius: 0.625rem;
|
||||
--chart-primary: #82FB9C;
|
||||
--chart-secondary: #86a7df;
|
||||
--status-success: #4fe88f;
|
||||
--status-warning: #50f7d4;
|
||||
--status-in-progress: #829dd4;
|
||||
--page-bg: #06060c;
|
||||
--page-bg-src: '';
|
||||
--panel-bg: rgb(11 12 22 / 0.72);
|
||||
--panel-border: rgb(59 64 77 / 0.9);
|
||||
--panel-border-bare: rgb(59 64 77 / 0.55);
|
||||
--panel-raised-bg: rgb(11 12 22 / 0.95);
|
||||
--panel-raised-border: rgb(59 64 77 / 1);
|
||||
--panel-accent: #82FB9C;
|
||||
--panel-header-bg: rgb(21 24 40 / 0.6);
|
||||
--panel-header-fg: #ddf7ff;
|
||||
--panel-radius: 0.75rem;
|
||||
--panel-blur: 12px;
|
||||
--card-bg: #0B0C16;
|
||||
--glass-bg: rgb(11 12 22 / 0.55);
|
||||
--glass-border: rgb(59 64 77 / 0.7);
|
||||
--dock-bg: rgb(11 12 22 / 0.7);
|
||||
--dock-border: rgb(59 64 77 / 0.8);
|
||||
--dock-tooltip-bg: #151828;
|
||||
--header-bg: rgb(11 12 22 / 0.8);
|
||||
--header-border: rgb(59 64 77 / 0.9);
|
||||
--header-fg: #ddf7ff;
|
||||
--header-blur: 12px;
|
||||
--pixel-grid-color: rgb(106 110 149 / 0.07);
|
||||
--card-grid-color: rgb(106 110 149 / 0.05);
|
||||
--panel-grid-color: rgb(106 110 149 / 0.06);
|
||||
--scrollbar-thumb: rgb(45 52 80 / 0.6);
|
||||
--scrollbar-thumb-hover: rgb(45 52 80 / 0.85);
|
||||
--scrollbar-thin-thumb: rgb(45 52 80 / 0.45);
|
||||
--scrollbar-thin-thumb-hover: rgb(45 52 80 / 0.7);
|
||||
--brand: #82FB9C;
|
||||
--brand-foreground: #06060c;
|
||||
--brand-primary: #82FB9C;
|
||||
--brand-accent: #7cf8f7;
|
||||
--brand-warm: #50f7a3;
|
||||
--brand-deep: #06060c;
|
||||
--brand-muted: #2d3450;
|
||||
--ink: #ddf7ff;
|
||||
--surface-warm: #0B0C16;
|
||||
--naturegreen: #4fe88f;
|
||||
--naturegreen-foreground: #06060c;
|
||||
--duck-dark: #ddf7ff;
|
||||
--duck-teal: #7cf8f7;
|
||||
--duck-yellow: #50f7d4;
|
||||
--duck-orange: #50f7a3;
|
||||
--duck-forest: #4fe88f;
|
||||
--duck-beige: #20242d;
|
||||
--logo-src: '/officer-logo.svg';
|
||||
}
|
||||
@@ -1,50 +1,94 @@
|
||||
/*
|
||||
KANAGAWA — ported from the published palette, unchanged.
|
||||
Kanagawa — generated from Omarchy's palette by scripts/generate-themes.ts.
|
||||
|
||||
A PALETTE theme: it supplies the standard tokens and nothing else. Panels, the header, the dock, glass,
|
||||
grid lines and scrollbars are all derived from these by `base.css`, so this file never mentions them.
|
||||
DO NOT EDIT BY HAND. Change the mapping in scripts/themes/map.ts and re-run, so every theme moves
|
||||
together — the previous port drifted precisely because each file was edited on its own.
|
||||
|
||||
That is the contract working as intended — a theme anyone has already written, dropped in whole. Compare
|
||||
`duck-*.css`, which additionally declares a texture.
|
||||
Source: basecamp/omarchy themes/kanagawa/colors.toml (mode: dark)
|
||||
*/
|
||||
|
||||
[data-theme='kanagawa'] {
|
||||
/* The mark. Declared by every theme rather than inherited from a default: a theme that ships a
|
||||
brand should say so, and a white-labelled build replaces this line rather than hunting for the
|
||||
default that was quietly supplying it. */
|
||||
--logo-src: '/officer-logo.svg';
|
||||
|
||||
--radius: 0.625rem;
|
||||
--background: #1f1f28;
|
||||
--background: #111116;
|
||||
--foreground: #dcd7ba;
|
||||
--card: #16161d;
|
||||
--card: #1f1f28;
|
||||
--card-foreground: #dcd7ba;
|
||||
--popover: #16161d;
|
||||
--popover: #1f1f28;
|
||||
--popover-foreground: #dcd7ba;
|
||||
--primary: #7e9cd8;
|
||||
--primary-foreground: #1f1f28;
|
||||
--secondary: #2a2a37;
|
||||
--secondary-foreground: #dcd7ba;
|
||||
--muted: #223249;
|
||||
--muted-foreground: #727169;
|
||||
--accent: #7fb4ca;
|
||||
--accent-foreground: #1f1f28;
|
||||
--destructive: #e82424;
|
||||
--destructive-foreground: #dcd7ba;
|
||||
--border: #2a2a37;
|
||||
--input: #2a2a37;
|
||||
--ring: #7e9cd8;
|
||||
--chart-1: #7e9cd8;
|
||||
--chart-2: #ffa066;
|
||||
--chart-3: #98bb6c;
|
||||
--chart-4: #7aa89f;
|
||||
--chart-5: #957fb8;
|
||||
--sidebar: #16161d;
|
||||
--sidebar-foreground: #727169;
|
||||
--sidebar-primary: #7e9cd8;
|
||||
--sidebar-primary-foreground: #1f1f28;
|
||||
--sidebar-accent: #223249;
|
||||
--sidebar-accent-foreground: #dcd7ba;
|
||||
--sidebar-border: #2a2a37;
|
||||
--sidebar-ring: #7e9cd8;
|
||||
--muted-foreground: #c8c093;
|
||||
--accent: #223249;
|
||||
--accent-foreground: #dcd7ba;
|
||||
--primary: #dcd7ba;
|
||||
--primary-foreground: #111116;
|
||||
--secondary: #223249;
|
||||
--secondary-foreground: #dcd7ba;
|
||||
--cta: #dcd7ba;
|
||||
--cta-foreground: #111116;
|
||||
--ctahover: #e0dcc2;
|
||||
--success: #76946a;
|
||||
--success-foreground: #111116;
|
||||
--warning: #c0a36e;
|
||||
--warning-foreground: #111116;
|
||||
--destructive: #c34043;
|
||||
--destructive-foreground: #f3f3f3;
|
||||
--info: #7e9cd8;
|
||||
--info-foreground: #111116;
|
||||
--busy: #c17158;
|
||||
--busy-foreground: #111116;
|
||||
--busy-ink: #c17158;
|
||||
--border: #4e4c46;
|
||||
--input: #4e4c46;
|
||||
--ring: #dcd7ba;
|
||||
--radius: 0.625rem;
|
||||
--chart-primary: #dcd7ba;
|
||||
--chart-secondary: #957fb8;
|
||||
--status-success: #76946a;
|
||||
--status-warning: #c0a36e;
|
||||
--status-in-progress: #7e9cd8;
|
||||
--page-bg: #111116;
|
||||
--page-bg-src: '';
|
||||
--panel-bg: rgb(31 31 40 / 0.72);
|
||||
--panel-border: rgb(78 76 70 / 0.9);
|
||||
--panel-border-bare: rgb(78 76 70 / 0.55);
|
||||
--panel-raised-bg: rgb(31 31 40 / 0.95);
|
||||
--panel-raised-border: rgb(78 76 70 / 1);
|
||||
--panel-accent: #dcd7ba;
|
||||
--panel-header-bg: rgb(34 50 73 / 0.6);
|
||||
--panel-header-fg: #dcd7ba;
|
||||
--panel-radius: 0.75rem;
|
||||
--panel-blur: 12px;
|
||||
--card-bg: #1f1f28;
|
||||
--glass-bg: rgb(31 31 40 / 0.55);
|
||||
--glass-border: rgb(78 76 70 / 0.7);
|
||||
--dock-bg: rgb(31 31 40 / 0.7);
|
||||
--dock-border: rgb(78 76 70 / 0.8);
|
||||
--dock-tooltip-bg: #223249;
|
||||
--header-bg: rgb(31 31 40 / 0.8);
|
||||
--header-border: rgb(78 76 70 / 0.9);
|
||||
--header-fg: #dcd7ba;
|
||||
--header-blur: 12px;
|
||||
--pixel-grid-color: rgb(114 113 105 / 0.07);
|
||||
--card-grid-color: rgb(114 113 105 / 0.05);
|
||||
--panel-grid-color: rgb(114 113 105 / 0.06);
|
||||
--scrollbar-thumb: rgb(84 84 109 / 0.6);
|
||||
--scrollbar-thumb-hover: rgb(84 84 109 / 0.85);
|
||||
--scrollbar-thin-thumb: rgb(84 84 109 / 0.45);
|
||||
--scrollbar-thin-thumb-hover: rgb(84 84 109 / 0.7);
|
||||
--brand: #dcd7ba;
|
||||
--brand-foreground: #111116;
|
||||
--brand-primary: #dcd7ba;
|
||||
--brand-accent: #6a9589;
|
||||
--brand-warm: #c17158;
|
||||
--brand-deep: #111116;
|
||||
--brand-muted: #54546D;
|
||||
--ink: #dcd7ba;
|
||||
--surface-warm: #1f1f28;
|
||||
--naturegreen: #76946a;
|
||||
--naturegreen-foreground: #111116;
|
||||
--duck-dark: #dcd7ba;
|
||||
--duck-teal: #6a9589;
|
||||
--duck-yellow: #c0a36e;
|
||||
--duck-orange: #c17158;
|
||||
--duck-forest: #76946a;
|
||||
--duck-beige: #323137;
|
||||
--logo-src: '/officer-logo.svg';
|
||||
}
|
||||
|
||||
@@ -0,0 +1,94 @@
|
||||
/*
|
||||
Last Horizon — generated from Omarchy's palette by scripts/generate-themes.ts.
|
||||
|
||||
DO NOT EDIT BY HAND. Change the mapping in scripts/themes/map.ts and re-run, so every theme moves
|
||||
together — the previous port drifted precisely because each file was edited on its own.
|
||||
|
||||
Source: basecamp/omarchy themes/last-horizon/colors.toml (mode: dark)
|
||||
*/
|
||||
[data-theme='last-horizon'] {
|
||||
--background: #060606;
|
||||
--foreground: #FAFCFB;
|
||||
--card: #0c0b0c;
|
||||
--card-foreground: #FAFCFB;
|
||||
--popover: #0c0b0c;
|
||||
--popover-foreground: #FAFCFB;
|
||||
--muted: #0c0b0c;
|
||||
--muted-foreground: #cfd3cd;
|
||||
--accent: #0c0b0c;
|
||||
--accent-foreground: #FAFCFB;
|
||||
--primary: #b59790;
|
||||
--primary-foreground: #060606;
|
||||
--secondary: #0c0b0c;
|
||||
--secondary-foreground: #FAFCFB;
|
||||
--cta: #b59790;
|
||||
--cta-foreground: #060606;
|
||||
--ctahover: #bea39d;
|
||||
--success: #87a9b0;
|
||||
--success-foreground: #060606;
|
||||
--warning: #6B5E73;
|
||||
--warning-foreground: #e3dedd;
|
||||
--destructive: #c38b7b;
|
||||
--destructive-foreground: #060606;
|
||||
--info: #b59790;
|
||||
--info-foreground: #060606;
|
||||
--busy: #6B5E73;
|
||||
--busy-foreground: #e3dedd;
|
||||
--busy-ink: #817688;
|
||||
--border: #434342;
|
||||
--input: #434342;
|
||||
--ring: #b59790;
|
||||
--radius: 0.625rem;
|
||||
--chart-primary: #b59790;
|
||||
--chart-secondary: #c4d8e2;
|
||||
--status-success: #87a9b0;
|
||||
--status-warning: #6B5E73;
|
||||
--status-in-progress: #b59790;
|
||||
--page-bg: #060606;
|
||||
--page-bg-src: '';
|
||||
--panel-bg: rgb(12 11 12 / 0.72);
|
||||
--panel-border: rgb(67 67 66 / 0.9);
|
||||
--panel-border-bare: rgb(67 67 66 / 0.55);
|
||||
--panel-raised-bg: rgb(12 11 12 / 0.95);
|
||||
--panel-raised-border: rgb(67 67 66 / 1);
|
||||
--panel-accent: #b59790;
|
||||
--panel-header-bg: rgb(12 11 12 / 0.6);
|
||||
--panel-header-fg: #FAFCFB;
|
||||
--panel-radius: 0.75rem;
|
||||
--panel-blur: 12px;
|
||||
--card-bg: #0c0b0c;
|
||||
--glass-bg: rgb(12 11 12 / 0.55);
|
||||
--glass-border: rgb(67 67 66 / 0.7);
|
||||
--dock-bg: rgb(12 11 12 / 0.7);
|
||||
--dock-border: rgb(67 67 66 / 0.8);
|
||||
--dock-tooltip-bg: #0c0b0c;
|
||||
--header-bg: rgb(12 11 12 / 0.8);
|
||||
--header-border: rgb(67 67 66 / 0.9);
|
||||
--header-fg: #FAFCFB;
|
||||
--header-blur: 12px;
|
||||
--pixel-grid-color: rgb(101 91 94 / 0.07);
|
||||
--card-grid-color: rgb(101 91 94 / 0.05);
|
||||
--panel-grid-color: rgb(101 91 94 / 0.06);
|
||||
--scrollbar-thumb: rgb(88 78 81 / 0.6);
|
||||
--scrollbar-thumb-hover: rgb(88 78 81 / 0.85);
|
||||
--scrollbar-thin-thumb: rgb(88 78 81 / 0.45);
|
||||
--scrollbar-thin-thumb-hover: rgb(88 78 81 / 0.7);
|
||||
--brand: #b59790;
|
||||
--brand-foreground: #060606;
|
||||
--brand-primary: #b59790;
|
||||
--brand-accent: #a5a0b6;
|
||||
--brand-warm: #6B5E73;
|
||||
--brand-deep: #060606;
|
||||
--brand-muted: #584e51;
|
||||
--ink: #FAFCFB;
|
||||
--surface-warm: #0c0b0c;
|
||||
--naturegreen: #87a9b0;
|
||||
--naturegreen-foreground: #060606;
|
||||
--duck-dark: #FAFCFB;
|
||||
--duck-teal: #a5a0b6;
|
||||
--duck-yellow: #6B5E73;
|
||||
--duck-orange: #6B5E73;
|
||||
--duck-forest: #87a9b0;
|
||||
--duck-beige: #242324;
|
||||
--logo-src: '/officer-logo.svg';
|
||||
}
|
||||
@@ -0,0 +1,94 @@
|
||||
/*
|
||||
Lumon — generated from Omarchy's palette by scripts/generate-themes.ts.
|
||||
|
||||
DO NOT EDIT BY HAND. Change the mapping in scripts/themes/map.ts and re-run, so every theme moves
|
||||
together — the previous port drifted precisely because each file was edited on its own.
|
||||
|
||||
Source: basecamp/omarchy themes/lumon/colors.toml (mode: dark)
|
||||
*/
|
||||
[data-theme='lumon'] {
|
||||
--background: #0b1216;
|
||||
--foreground: #d6e2ee;
|
||||
--card: #16242d;
|
||||
--card-foreground: #d6e2ee;
|
||||
--popover: #16242d;
|
||||
--popover-foreground: #d6e2ee;
|
||||
--muted: #1b2d40;
|
||||
--muted-foreground: #d6e2ee;
|
||||
--accent: #1b2d40;
|
||||
--accent-foreground: #d6e2ee;
|
||||
--primary: #8bc9eb;
|
||||
--primary-foreground: #0b1216;
|
||||
--secondary: #1b2d40;
|
||||
--secondary-foreground: #d6e2ee;
|
||||
--cta: #8bc9eb;
|
||||
--cta-foreground: #0b1216;
|
||||
--ctahover: #99cfed;
|
||||
--success: #5e95bc;
|
||||
--success-foreground: #0b1216;
|
||||
--warning: #6fa4c9;
|
||||
--warning-foreground: #0b1216;
|
||||
--destructive: #4d86b0;
|
||||
--destructive-foreground: #0b1216;
|
||||
--info: #6fb8e3;
|
||||
--info-foreground: #0b1216;
|
||||
--busy: #8bc9eb;
|
||||
--busy-foreground: #0b1216;
|
||||
--busy-ink: #8bc9eb;
|
||||
--border: #4c5963;
|
||||
--input: #4c5963;
|
||||
--ring: #8bc9eb;
|
||||
--radius: 0.625rem;
|
||||
--chart-primary: #8bc9eb;
|
||||
--chart-secondary: #8bc9eb;
|
||||
--status-success: #5e95bc;
|
||||
--status-warning: #6fa4c9;
|
||||
--status-in-progress: #6fb8e3;
|
||||
--page-bg: #0b1216;
|
||||
--page-bg-src: '';
|
||||
--panel-bg: rgb(22 36 45 / 0.72);
|
||||
--panel-border: rgb(76 89 99 / 0.9);
|
||||
--panel-border-bare: rgb(76 89 99 / 0.55);
|
||||
--panel-raised-bg: rgb(22 36 45 / 0.95);
|
||||
--panel-raised-border: rgb(76 89 99 / 1);
|
||||
--panel-accent: #8bc9eb;
|
||||
--panel-header-bg: rgb(27 45 64 / 0.6);
|
||||
--panel-header-fg: #d6e2ee;
|
||||
--panel-radius: 0.75rem;
|
||||
--panel-blur: 12px;
|
||||
--card-bg: #16242d;
|
||||
--glass-bg: rgb(22 36 45 / 0.55);
|
||||
--glass-border: rgb(76 89 99 / 0.7);
|
||||
--dock-bg: rgb(22 36 45 / 0.7);
|
||||
--dock-border: rgb(76 89 99 / 0.8);
|
||||
--dock-tooltip-bg: #1b2d40;
|
||||
--header-bg: rgb(22 36 45 / 0.8);
|
||||
--header-border: rgb(76 89 99 / 0.9);
|
||||
--header-fg: #d6e2ee;
|
||||
--header-blur: 12px;
|
||||
--pixel-grid-color: rgb(77 134 176 / 0.07);
|
||||
--card-grid-color: rgb(77 134 176 / 0.05);
|
||||
--panel-grid-color: rgb(77 134 176 / 0.06);
|
||||
--scrollbar-thumb: rgb(48 72 96 / 0.6);
|
||||
--scrollbar-thumb-hover: rgb(48 72 96 / 0.85);
|
||||
--scrollbar-thin-thumb: rgb(48 72 96 / 0.45);
|
||||
--scrollbar-thin-thumb-hover: rgb(48 72 96 / 0.7);
|
||||
--brand: #8bc9eb;
|
||||
--brand-foreground: #0b1216;
|
||||
--brand-primary: #8bc9eb;
|
||||
--brand-accent: #b4e4f6;
|
||||
--brand-warm: #8bc9eb;
|
||||
--brand-deep: #0b1216;
|
||||
--brand-muted: #304860;
|
||||
--ink: #d6e2ee;
|
||||
--surface-warm: #16242d;
|
||||
--naturegreen: #5e95bc;
|
||||
--naturegreen-foreground: #0b1216;
|
||||
--duck-dark: #d6e2ee;
|
||||
--duck-teal: #b4e4f6;
|
||||
--duck-yellow: #6fa4c9;
|
||||
--duck-orange: #8bc9eb;
|
||||
--duck-forest: #5e95bc;
|
||||
--duck-beige: #293740;
|
||||
--logo-src: '/officer-logo.svg';
|
||||
}
|
||||
@@ -0,0 +1,94 @@
|
||||
/*
|
||||
Lupine — generated from Omarchy's palette by scripts/generate-themes.ts.
|
||||
|
||||
DO NOT EDIT BY HAND. Change the mapping in scripts/themes/map.ts and re-run, so every theme moves
|
||||
together — the previous port drifted precisely because each file was edited on its own.
|
||||
|
||||
Source: basecamp/omarchy themes/lupine/colors.toml (mode: light)
|
||||
*/
|
||||
[data-theme='lupine'] {
|
||||
--background: #fafafa;
|
||||
--foreground: #212121;
|
||||
--card: #f5f5f5;
|
||||
--card-foreground: #212121;
|
||||
--popover: #f5f5f5;
|
||||
--popover-foreground: #212121;
|
||||
--muted: #ececec;
|
||||
--muted-foreground: #424242;
|
||||
--accent: #ececec;
|
||||
--accent-foreground: #212121;
|
||||
--primary: #3264eb;
|
||||
--primary-foreground: #f2f2f2;
|
||||
--secondary: #ececec;
|
||||
--secondary-foreground: #212121;
|
||||
--cta: #3264eb;
|
||||
--cta-foreground: #f2f2f2;
|
||||
--ctahover: #2c58cf;
|
||||
--success: #4a2fd0;
|
||||
--success-foreground: #dedede;
|
||||
--warning: #026fde;
|
||||
--warning-foreground: #f9f9f9;
|
||||
--destructive: #c900c4;
|
||||
--destructive-foreground: #f9f9f9;
|
||||
--info: #3264eb;
|
||||
--info-foreground: #f2f2f2;
|
||||
--busy: #026fde;
|
||||
--busy-foreground: #f9f9f9;
|
||||
--busy-ink: #026fde;
|
||||
--border: #d1d1d1;
|
||||
--input: #d1d1d1;
|
||||
--ring: #3264eb;
|
||||
--radius: 0.625rem;
|
||||
--chart-primary: #3264eb;
|
||||
--chart-secondary: #8a4ad7;
|
||||
--status-success: #4a2fd0;
|
||||
--status-warning: #026fde;
|
||||
--status-in-progress: #3264eb;
|
||||
--page-bg: #fafafa;
|
||||
--page-bg-src: '';
|
||||
--panel-bg: rgb(245 245 245 / 0.72);
|
||||
--panel-border: rgb(209 209 209 / 0.9);
|
||||
--panel-border-bare: rgb(209 209 209 / 0.55);
|
||||
--panel-raised-bg: rgb(245 245 245 / 0.95);
|
||||
--panel-raised-border: rgb(209 209 209 / 1);
|
||||
--panel-accent: #3264eb;
|
||||
--panel-header-bg: rgb(236 236 236 / 0.6);
|
||||
--panel-header-fg: #212121;
|
||||
--panel-radius: 0.75rem;
|
||||
--panel-blur: 12px;
|
||||
--card-bg: #f5f5f5;
|
||||
--glass-bg: rgb(245 245 245 / 0.55);
|
||||
--glass-border: rgb(209 209 209 / 0.7);
|
||||
--dock-bg: rgb(245 245 245 / 0.7);
|
||||
--dock-border: rgb(209 209 209 / 0.8);
|
||||
--dock-tooltip-bg: #ececec;
|
||||
--header-bg: rgb(245 245 245 / 0.8);
|
||||
--header-border: rgb(209 209 209 / 0.9);
|
||||
--header-fg: #212121;
|
||||
--header-blur: 12px;
|
||||
--pixel-grid-color: rgb(117 117 117 / 0.07);
|
||||
--card-grid-color: rgb(117 117 117 / 0.05);
|
||||
--panel-grid-color: rgb(117 117 117 / 0.06);
|
||||
--scrollbar-thumb: rgb(158 158 158 / 0.6);
|
||||
--scrollbar-thumb-hover: rgb(158 158 158 / 0.85);
|
||||
--scrollbar-thin-thumb: rgb(158 158 158 / 0.45);
|
||||
--scrollbar-thin-thumb-hover: rgb(158 158 158 / 0.7);
|
||||
--brand: #3264eb;
|
||||
--brand-foreground: #f2f2f2;
|
||||
--brand-primary: #3264eb;
|
||||
--brand-accent: #0c67de;
|
||||
--brand-warm: #026fde;
|
||||
--brand-deep: #ececec;
|
||||
--brand-muted: #9e9e9e;
|
||||
--ink: #212121;
|
||||
--surface-warm: #f5f5f5;
|
||||
--naturegreen: #4a2fd0;
|
||||
--naturegreen-foreground: #dedede;
|
||||
--duck-dark: #212121;
|
||||
--duck-teal: #0c67de;
|
||||
--duck-yellow: #026fde;
|
||||
--duck-orange: #026fde;
|
||||
--duck-forest: #4a2fd0;
|
||||
--duck-beige: #e0e0e0;
|
||||
--logo-src: '/officer-logo.svg';
|
||||
}
|
||||
@@ -1,50 +1,94 @@
|
||||
/*
|
||||
MATTE BLACK — ported from the published palette, unchanged.
|
||||
Matte Black — generated from Omarchy's palette by scripts/generate-themes.ts.
|
||||
|
||||
A PALETTE theme: it supplies the standard tokens and nothing else. Panels, the header, the dock, glass,
|
||||
grid lines and scrollbars are all derived from these by `base.css`, so this file never mentions them.
|
||||
DO NOT EDIT BY HAND. Change the mapping in scripts/themes/map.ts and re-run, so every theme moves
|
||||
together — the previous port drifted precisely because each file was edited on its own.
|
||||
|
||||
That is the contract working as intended — a theme anyone has already written, dropped in whole. Compare
|
||||
`duck-*.css`, which additionally declares a texture.
|
||||
Source: basecamp/omarchy themes/matte-black/colors.toml (mode: dark)
|
||||
*/
|
||||
|
||||
[data-theme='matte-black'] {
|
||||
/* The mark. Declared by every theme rather than inherited from a default: a theme that ships a
|
||||
brand should say so, and a white-labelled build replaces this line rather than hunting for the
|
||||
default that was quietly supplying it. */
|
||||
--logo-src: '/officer-logo.svg';
|
||||
|
||||
--radius: 0.625rem;
|
||||
--background: #0a0a0a;
|
||||
--foreground: #e0e0e0;
|
||||
--background: #090909;
|
||||
--foreground: #bebebe;
|
||||
--card: #121212;
|
||||
--card-foreground: #e0e0e0;
|
||||
--card-foreground: #bebebe;
|
||||
--popover: #121212;
|
||||
--popover-foreground: #e0e0e0;
|
||||
--primary: #ffffff;
|
||||
--primary-foreground: #0a0a0a;
|
||||
--secondary: #2a2a2a;
|
||||
--secondary-foreground: #e0e0e0;
|
||||
--muted: #1a1a1a;
|
||||
--muted-foreground: #9a9a9a;
|
||||
--accent: #d0d0d0;
|
||||
--accent-foreground: #0a0a0a;
|
||||
--destructive: #ff4444;
|
||||
--destructive-foreground: #e0e0e0;
|
||||
--border: #2a2a2a;
|
||||
--input: #2a2a2a;
|
||||
--ring: #ffffff;
|
||||
--chart-1: #ffffff;
|
||||
--chart-2: #cccccc;
|
||||
--chart-3: #999999;
|
||||
--chart-4: #666666;
|
||||
--chart-5: #444444;
|
||||
--sidebar: #121212;
|
||||
--sidebar-foreground: #9a9a9a;
|
||||
--sidebar-primary: #ffffff;
|
||||
--sidebar-primary-foreground: #0a0a0a;
|
||||
--sidebar-accent: #1a1a1a;
|
||||
--sidebar-accent-foreground: #e0e0e0;
|
||||
--sidebar-border: #2a2a2a;
|
||||
--sidebar-ring: #ffffff;
|
||||
--popover-foreground: #bebebe;
|
||||
--muted: #1e1e1e;
|
||||
--muted-foreground: #8a8a8d;
|
||||
--accent: #1e1e1e;
|
||||
--accent-foreground: #bebebe;
|
||||
--primary: #e68e0d;
|
||||
--primary-foreground: #090909;
|
||||
--secondary: #1e1e1e;
|
||||
--secondary-foreground: #bebebe;
|
||||
--cta: #e68e0d;
|
||||
--cta-foreground: #090909;
|
||||
--ctahover: #e99c2a;
|
||||
--success: #FFC107;
|
||||
--success-foreground: #090909;
|
||||
--warning: #b91c1c;
|
||||
--warning-foreground: #d8d8d8;
|
||||
--destructive: #D35F5F;
|
||||
--destructive-foreground: #090909;
|
||||
--info: #e68e0d;
|
||||
--info-foreground: #090909;
|
||||
--busy: #c63d3d;
|
||||
--busy-foreground: #f3f3f3;
|
||||
--busy-ink: #cc5050;
|
||||
--border: #343434;
|
||||
--input: #343434;
|
||||
--ring: #e68e0d;
|
||||
--radius: 0.625rem;
|
||||
--chart-primary: #e68e0d;
|
||||
--chart-secondary: #D35F5F;
|
||||
--status-success: #FFC107;
|
||||
--status-warning: #b91c1c;
|
||||
--status-in-progress: #e68e0d;
|
||||
--page-bg: #090909;
|
||||
--page-bg-src: '';
|
||||
--panel-bg: rgb(18 18 18 / 0.72);
|
||||
--panel-border: rgb(52 52 52 / 0.9);
|
||||
--panel-border-bare: rgb(52 52 52 / 0.55);
|
||||
--panel-raised-bg: rgb(18 18 18 / 0.95);
|
||||
--panel-raised-border: rgb(52 52 52 / 1);
|
||||
--panel-accent: #e68e0d;
|
||||
--panel-header-bg: rgb(30 30 30 / 0.6);
|
||||
--panel-header-fg: #bebebe;
|
||||
--panel-radius: 0.75rem;
|
||||
--panel-blur: 12px;
|
||||
--card-bg: #121212;
|
||||
--glass-bg: rgb(18 18 18 / 0.55);
|
||||
--glass-border: rgb(52 52 52 / 0.7);
|
||||
--dock-bg: rgb(18 18 18 / 0.7);
|
||||
--dock-border: rgb(52 52 52 / 0.8);
|
||||
--dock-tooltip-bg: #1e1e1e;
|
||||
--header-bg: rgb(18 18 18 / 0.8);
|
||||
--header-border: rgb(52 52 52 / 0.9);
|
||||
--header-fg: #bebebe;
|
||||
--header-blur: 12px;
|
||||
--pixel-grid-color: rgb(98 98 98 / 0.07);
|
||||
--card-grid-color: rgb(98 98 98 / 0.05);
|
||||
--panel-grid-color: rgb(98 98 98 / 0.06);
|
||||
--scrollbar-thumb: rgb(51 51 51 / 0.6);
|
||||
--scrollbar-thumb-hover: rgb(51 51 51 / 0.85);
|
||||
--scrollbar-thin-thumb: rgb(51 51 51 / 0.45);
|
||||
--scrollbar-thin-thumb-hover: rgb(51 51 51 / 0.7);
|
||||
--brand: #e68e0d;
|
||||
--brand-foreground: #090909;
|
||||
--brand-primary: #e68e0d;
|
||||
--brand-accent: #bebebe;
|
||||
--brand-warm: #c63d3d;
|
||||
--brand-deep: #090909;
|
||||
--brand-muted: #333333;
|
||||
--ink: #bebebe;
|
||||
--surface-warm: #121212;
|
||||
--naturegreen: #FFC107;
|
||||
--naturegreen-foreground: #090909;
|
||||
--duck-dark: #bebebe;
|
||||
--duck-teal: #bebebe;
|
||||
--duck-yellow: #b91c1c;
|
||||
--duck-orange: #c63d3d;
|
||||
--duck-forest: #FFC107;
|
||||
--duck-beige: #232323;
|
||||
--logo-src: '/officer-logo.svg';
|
||||
}
|
||||
|
||||
@@ -0,0 +1,94 @@
|
||||
/*
|
||||
Miasma — generated from Omarchy's palette by scripts/generate-themes.ts.
|
||||
|
||||
DO NOT EDIT BY HAND. Change the mapping in scripts/themes/map.ts and re-run, so every theme moves
|
||||
together — the previous port drifted precisely because each file was edited on its own.
|
||||
|
||||
Source: basecamp/omarchy themes/miasma/colors.toml (mode: dark)
|
||||
*/
|
||||
[data-theme='miasma'] {
|
||||
--background: #121212;
|
||||
--foreground: #c2c2b0;
|
||||
--card: #222222;
|
||||
--card-foreground: #c2c2b0;
|
||||
--popover: #222222;
|
||||
--popover-foreground: #c2c2b0;
|
||||
--muted: #2c2c2c;
|
||||
--muted-foreground: #939388;
|
||||
--accent: #2c2c2c;
|
||||
--accent-foreground: #c2c2b0;
|
||||
--primary: #78824b;
|
||||
--primary-foreground: #121212;
|
||||
--secondary: #2c2c2c;
|
||||
--secondary-foreground: #c2c2b0;
|
||||
--cta: #78824b;
|
||||
--cta-foreground: #121212;
|
||||
--ctahover: #889161;
|
||||
--success: #5f875f;
|
||||
--success-foreground: #121212;
|
||||
--warning: #b36d43;
|
||||
--warning-foreground: #121212;
|
||||
--destructive: #685742;
|
||||
--destructive-foreground: #d3d3c6;
|
||||
--info: #78824b;
|
||||
--info-foreground: #121212;
|
||||
--busy: #8d6242;
|
||||
--busy-foreground: #ededed;
|
||||
--busy-ink: #9b765a;
|
||||
--border: #3f3f3c;
|
||||
--input: #3f3f3c;
|
||||
--ring: #78824b;
|
||||
--radius: 0.625rem;
|
||||
--chart-primary: #78824b;
|
||||
--chart-secondary: #bb7744;
|
||||
--status-success: #5f875f;
|
||||
--status-warning: #b36d43;
|
||||
--status-in-progress: #78824b;
|
||||
--page-bg: #121212;
|
||||
--page-bg-src: '';
|
||||
--panel-bg: rgb(34 34 34 / 0.72);
|
||||
--panel-border: rgb(63 63 60 / 0.9);
|
||||
--panel-border-bare: rgb(63 63 60 / 0.55);
|
||||
--panel-raised-bg: rgb(34 34 34 / 0.95);
|
||||
--panel-raised-border: rgb(63 63 60 / 1);
|
||||
--panel-accent: #78824b;
|
||||
--panel-header-bg: rgb(44 44 44 / 0.6);
|
||||
--panel-header-fg: #c2c2b0;
|
||||
--panel-radius: 0.75rem;
|
||||
--panel-blur: 12px;
|
||||
--card-bg: #222222;
|
||||
--glass-bg: rgb(34 34 34 / 0.55);
|
||||
--glass-border: rgb(63 63 60 / 0.7);
|
||||
--dock-bg: rgb(34 34 34 / 0.7);
|
||||
--dock-border: rgb(63 63 60 / 0.8);
|
||||
--dock-tooltip-bg: #2c2c2c;
|
||||
--header-bg: rgb(34 34 34 / 0.8);
|
||||
--header-border: rgb(63 63 60 / 0.9);
|
||||
--header-fg: #c2c2b0;
|
||||
--header-blur: 12px;
|
||||
--pixel-grid-color: rgb(111 111 111 / 0.07);
|
||||
--card-grid-color: rgb(111 111 111 / 0.05);
|
||||
--panel-grid-color: rgb(111 111 111 / 0.06);
|
||||
--scrollbar-thumb: rgb(102 102 102 / 0.6);
|
||||
--scrollbar-thumb-hover: rgb(102 102 102 / 0.85);
|
||||
--scrollbar-thin-thumb: rgb(102 102 102 / 0.45);
|
||||
--scrollbar-thin-thumb-hover: rgb(102 102 102 / 0.7);
|
||||
--brand: #78824b;
|
||||
--brand-foreground: #121212;
|
||||
--brand-primary: #78824b;
|
||||
--brand-accent: #c9a554;
|
||||
--brand-warm: #8d6242;
|
||||
--brand-deep: #121212;
|
||||
--brand-muted: #666666;
|
||||
--ink: #c2c2b0;
|
||||
--surface-warm: #222222;
|
||||
--naturegreen: #5f875f;
|
||||
--naturegreen-foreground: #121212;
|
||||
--duck-dark: #c2c2b0;
|
||||
--duck-teal: #c9a554;
|
||||
--duck-yellow: #b36d43;
|
||||
--duck-orange: #8d6242;
|
||||
--duck-forest: #5f875f;
|
||||
--duck-beige: #323230;
|
||||
--logo-src: '/officer-logo.svg';
|
||||
}
|
||||
@@ -1,50 +1,94 @@
|
||||
/*
|
||||
NORD — ported from the published palette, unchanged.
|
||||
Nord — generated from Omarchy's palette by scripts/generate-themes.ts.
|
||||
|
||||
A PALETTE theme: it supplies the standard tokens and nothing else. Panels, the header, the dock, glass,
|
||||
grid lines and scrollbars are all derived from these by `base.css`, so this file never mentions them.
|
||||
DO NOT EDIT BY HAND. Change the mapping in scripts/themes/map.ts and re-run, so every theme moves
|
||||
together — the previous port drifted precisely because each file was edited on its own.
|
||||
|
||||
That is the contract working as intended — a theme anyone has already written, dropped in whole. Compare
|
||||
`duck-*.css`, which additionally declares a texture.
|
||||
Source: basecamp/omarchy themes/nord/colors.toml (mode: dark)
|
||||
*/
|
||||
|
||||
[data-theme='nord'] {
|
||||
/* The mark. Declared by every theme rather than inherited from a default: a theme that ships a
|
||||
brand should say so, and a white-labelled build replaces this line rather than hunting for the
|
||||
default that was quietly supplying it. */
|
||||
--logo-src: '/officer-logo.svg';
|
||||
|
||||
--radius: 0.625rem;
|
||||
--background: #2e3440;
|
||||
--foreground: #eceff4;
|
||||
--card: #3b4252;
|
||||
--card-foreground: #eceff4;
|
||||
--popover: #3b4252;
|
||||
--popover-foreground: #eceff4;
|
||||
--primary: #88c0d0;
|
||||
--primary-foreground: #2e3440;
|
||||
--secondary: #434c5e;
|
||||
--secondary-foreground: #eceff4;
|
||||
--background: #191c23;
|
||||
--foreground: #d8dee9;
|
||||
--card: #2e3440;
|
||||
--card-foreground: #d8dee9;
|
||||
--popover: #2e3440;
|
||||
--popover-foreground: #d8dee9;
|
||||
--muted: #3b4252;
|
||||
--muted-foreground: #d8dee9;
|
||||
--accent: #8fbcbb;
|
||||
--accent-foreground: #2e3440;
|
||||
--muted-foreground: #adb5c4;
|
||||
--accent: #3b4252;
|
||||
--accent-foreground: #d8dee9;
|
||||
--primary: #81a1c1;
|
||||
--primary-foreground: #191c23;
|
||||
--secondary: #3b4252;
|
||||
--secondary-foreground: #d8dee9;
|
||||
--cta: #81a1c1;
|
||||
--cta-foreground: #191c23;
|
||||
--ctahover: #90acc8;
|
||||
--success: #a3be8c;
|
||||
--success-foreground: #191c23;
|
||||
--warning: #ebcb8b;
|
||||
--warning-foreground: #191c23;
|
||||
--destructive: #bf616a;
|
||||
--destructive-foreground: #eceff4;
|
||||
--border: #434c5e;
|
||||
--input: #434c5e;
|
||||
--ring: #88c0d0;
|
||||
--chart-1: #88c0d0;
|
||||
--chart-2: #ebcb8b;
|
||||
--chart-3: #a3be8c;
|
||||
--chart-4: #8fbcbb;
|
||||
--chart-5: #b48ead;
|
||||
--sidebar: #3b4252;
|
||||
--sidebar-foreground: #d8dee9;
|
||||
--sidebar-primary: #88c0d0;
|
||||
--sidebar-primary-foreground: #2e3440;
|
||||
--sidebar-accent: #434c5e;
|
||||
--sidebar-accent-foreground: #eceff4;
|
||||
--sidebar-border: #4c566a;
|
||||
--sidebar-ring: #88c0d0;
|
||||
--destructive-foreground: #121419;
|
||||
--info: #81a1c1;
|
||||
--info-foreground: #191c23;
|
||||
--busy: #d5967a;
|
||||
--busy-foreground: #191c23;
|
||||
--busy-ink: #d5967a;
|
||||
--border: #525865;
|
||||
--input: #525865;
|
||||
--ring: #81a1c1;
|
||||
--radius: 0.625rem;
|
||||
--chart-primary: #81a1c1;
|
||||
--chart-secondary: #b48ead;
|
||||
--status-success: #a3be8c;
|
||||
--status-warning: #ebcb8b;
|
||||
--status-in-progress: #81a1c1;
|
||||
--page-bg: #191c23;
|
||||
--page-bg-src: '';
|
||||
--panel-bg: rgb(46 52 64 / 0.72);
|
||||
--panel-border: rgb(82 88 101 / 0.9);
|
||||
--panel-border-bare: rgb(82 88 101 / 0.55);
|
||||
--panel-raised-bg: rgb(46 52 64 / 0.95);
|
||||
--panel-raised-border: rgb(82 88 101 / 1);
|
||||
--panel-accent: #81a1c1;
|
||||
--panel-header-bg: rgb(59 66 82 / 0.6);
|
||||
--panel-header-fg: #d8dee9;
|
||||
--panel-radius: 0.75rem;
|
||||
--panel-blur: 12px;
|
||||
--card-bg: #2e3440;
|
||||
--glass-bg: rgb(46 52 64 / 0.55);
|
||||
--glass-border: rgb(82 88 101 / 0.7);
|
||||
--dock-bg: rgb(46 52 64 / 0.7);
|
||||
--dock-border: rgb(82 88 101 / 0.8);
|
||||
--dock-tooltip-bg: #3b4252;
|
||||
--header-bg: rgb(46 52 64 / 0.8);
|
||||
--header-border: rgb(82 88 101 / 0.9);
|
||||
--header-fg: #d8dee9;
|
||||
--header-blur: 12px;
|
||||
--pixel-grid-color: rgb(117 126 141 / 0.07);
|
||||
--card-grid-color: rgb(117 126 141 / 0.05);
|
||||
--panel-grid-color: rgb(117 126 141 / 0.06);
|
||||
--scrollbar-thumb: rgb(76 86 106 / 0.6);
|
||||
--scrollbar-thumb-hover: rgb(76 86 106 / 0.85);
|
||||
--scrollbar-thin-thumb: rgb(76 86 106 / 0.45);
|
||||
--scrollbar-thin-thumb-hover: rgb(76 86 106 / 0.7);
|
||||
--brand: #81a1c1;
|
||||
--brand-foreground: #191c23;
|
||||
--brand-primary: #81a1c1;
|
||||
--brand-accent: #88c0d0;
|
||||
--brand-warm: #d5967a;
|
||||
--brand-deep: #191c23;
|
||||
--brand-muted: #4c566a;
|
||||
--ink: #d8dee9;
|
||||
--surface-warm: #2e3440;
|
||||
--naturegreen: #a3be8c;
|
||||
--naturegreen-foreground: #191c23;
|
||||
--duck-dark: #d8dee9;
|
||||
--duck-teal: #88c0d0;
|
||||
--duck-yellow: #ebcb8b;
|
||||
--duck-orange: #d5967a;
|
||||
--duck-forest: #a3be8c;
|
||||
--duck-beige: #3f4551;
|
||||
--logo-src: '/officer-logo.svg';
|
||||
}
|
||||
|
||||
@@ -1,50 +1,94 @@
|
||||
/*
|
||||
OSAKA JADE — ported from the published palette, unchanged.
|
||||
Osaka Jade — generated from Omarchy's palette by scripts/generate-themes.ts.
|
||||
|
||||
A PALETTE theme: it supplies the standard tokens and nothing else. Panels, the header, the dock, glass,
|
||||
grid lines and scrollbars are all derived from these by `base.css`, so this file never mentions them.
|
||||
DO NOT EDIT BY HAND. Change the mapping in scripts/themes/map.ts and re-run, so every theme moves
|
||||
together — the previous port drifted precisely because each file was edited on its own.
|
||||
|
||||
That is the contract working as intended — a theme anyone has already written, dropped in whole. Compare
|
||||
`duck-*.css`, which additionally declares a texture.
|
||||
Source: basecamp/omarchy themes/osaka-jade/colors.toml (mode: dark)
|
||||
*/
|
||||
|
||||
[data-theme='osaka-jade'] {
|
||||
/* The mark. Declared by every theme rather than inherited from a default: a theme that ships a
|
||||
brand should say so, and a white-labelled build replaces this line rather than hunting for the
|
||||
default that was quietly supplying it. */
|
||||
--logo-src: '/officer-logo.svg';
|
||||
|
||||
--background: #090f0d;
|
||||
--foreground: #C1C497;
|
||||
--card: #111c18;
|
||||
--card-foreground: #C1C497;
|
||||
--popover: #111c18;
|
||||
--popover-foreground: #C1C497;
|
||||
--muted: #23372B;
|
||||
--muted-foreground: #D6D5BC;
|
||||
--accent: #23372B;
|
||||
--accent-foreground: #C1C497;
|
||||
--primary: #509475;
|
||||
--primary-foreground: #090f0d;
|
||||
--secondary: #23372B;
|
||||
--secondary-foreground: #C1C497;
|
||||
--cta: #509475;
|
||||
--cta-foreground: #090f0d;
|
||||
--ctahover: #65a186;
|
||||
--success: #549e6a;
|
||||
--success-foreground: #090f0d;
|
||||
--warning: #459451;
|
||||
--warning-foreground: #090f0d;
|
||||
--destructive: #FF5345;
|
||||
--destructive-foreground: #090f0d;
|
||||
--info: #509475;
|
||||
--info-foreground: #090f0d;
|
||||
--busy: #a2734b;
|
||||
--busy-foreground: #090f0d;
|
||||
--busy-ink: #a2734b;
|
||||
--border: #485046;
|
||||
--input: #485046;
|
||||
--ring: #509475;
|
||||
--radius: 0.625rem;
|
||||
--background: #1a1b26;
|
||||
--foreground: #c5cdd9;
|
||||
--card: #16161e;
|
||||
--card-foreground: #c5cdd9;
|
||||
--popover: #16161e;
|
||||
--popover-foreground: #c5cdd9;
|
||||
--primary: #2ac3de;
|
||||
--primary-foreground: #1a1b26;
|
||||
--secondary: #292e42;
|
||||
--secondary-foreground: #c5cdd9;
|
||||
--muted: #1f2335;
|
||||
--muted-foreground: #565f89;
|
||||
--accent: #0db9d7;
|
||||
--accent-foreground: #1a1b26;
|
||||
--destructive: #f7768e;
|
||||
--destructive-foreground: #c5cdd9;
|
||||
--border: #292e42;
|
||||
--input: #292e42;
|
||||
--ring: #2ac3de;
|
||||
--chart-1: #2ac3de;
|
||||
--chart-2: #e0af68;
|
||||
--chart-3: #9ece6a;
|
||||
--chart-4: #1abc9c;
|
||||
--chart-5: #bb9af7;
|
||||
--sidebar: #16161e;
|
||||
--sidebar-foreground: #565f89;
|
||||
--sidebar-primary: #2ac3de;
|
||||
--sidebar-primary-foreground: #1a1b26;
|
||||
--sidebar-accent: #1f2335;
|
||||
--sidebar-accent-foreground: #c5cdd9;
|
||||
--sidebar-border: #292e42;
|
||||
--sidebar-ring: #2ac3de;
|
||||
--chart-primary: #509475;
|
||||
--chart-secondary: #D2689C;
|
||||
--status-success: #549e6a;
|
||||
--status-warning: #459451;
|
||||
--status-in-progress: #509475;
|
||||
--page-bg: #090f0d;
|
||||
--page-bg-src: '';
|
||||
--panel-bg: rgb(17 28 24 / 0.72);
|
||||
--panel-border: rgb(72 80 70 / 0.9);
|
||||
--panel-border-bare: rgb(72 80 70 / 0.55);
|
||||
--panel-raised-bg: rgb(17 28 24 / 0.95);
|
||||
--panel-raised-border: rgb(72 80 70 / 1);
|
||||
--panel-accent: #509475;
|
||||
--panel-header-bg: rgb(35 55 43 / 0.6);
|
||||
--panel-header-fg: #C1C497;
|
||||
--panel-radius: 0.75rem;
|
||||
--panel-blur: 12px;
|
||||
--card-bg: #111c18;
|
||||
--glass-bg: rgb(17 28 24 / 0.55);
|
||||
--glass-border: rgb(72 80 70 / 0.7);
|
||||
--dock-bg: rgb(17 28 24 / 0.7);
|
||||
--dock-border: rgb(72 80 70 / 0.8);
|
||||
--dock-tooltip-bg: #23372B;
|
||||
--header-bg: rgb(17 28 24 / 0.8);
|
||||
--header-border: rgb(72 80 70 / 0.9);
|
||||
--header-fg: #C1C497;
|
||||
--header-blur: 12px;
|
||||
--pixel-grid-color: rgb(129 184 168 / 0.07);
|
||||
--card-grid-color: rgb(129 184 168 / 0.05);
|
||||
--panel-grid-color: rgb(129 184 168 / 0.06);
|
||||
--scrollbar-thumb: rgb(83 104 91 / 0.6);
|
||||
--scrollbar-thumb-hover: rgb(83 104 91 / 0.85);
|
||||
--scrollbar-thin-thumb: rgb(83 104 91 / 0.45);
|
||||
--scrollbar-thin-thumb-hover: rgb(83 104 91 / 0.7);
|
||||
--brand: #509475;
|
||||
--brand-foreground: #090f0d;
|
||||
--brand-primary: #509475;
|
||||
--brand-accent: #2DD5B7;
|
||||
--brand-warm: #a2734b;
|
||||
--brand-deep: #090f0d;
|
||||
--brand-muted: #53685B;
|
||||
--ink: #C1C497;
|
||||
--surface-warm: #111c18;
|
||||
--naturegreen: #549e6a;
|
||||
--naturegreen-foreground: #090f0d;
|
||||
--duck-dark: #C1C497;
|
||||
--duck-teal: #2DD5B7;
|
||||
--duck-yellow: #459451;
|
||||
--duck-orange: #a2734b;
|
||||
--duck-forest: #549e6a;
|
||||
--duck-beige: #232d25;
|
||||
--logo-src: '/officer-logo.svg';
|
||||
}
|
||||
|
||||
@@ -0,0 +1,94 @@
|
||||
/*
|
||||
Retro 82 — generated from Omarchy's palette by scripts/generate-themes.ts.
|
||||
|
||||
DO NOT EDIT BY HAND. Change the mapping in scripts/themes/map.ts and re-run, so every theme moves
|
||||
together — the previous port drifted precisely because each file was edited on its own.
|
||||
|
||||
Source: basecamp/omarchy themes/retro-82/colors.toml (mode: dark)
|
||||
*/
|
||||
[data-theme='retro-82'] {
|
||||
--background: #020c17;
|
||||
--foreground: #f6dcac;
|
||||
--card: #05182e;
|
||||
--card-foreground: #f6dcac;
|
||||
--popover: #05182e;
|
||||
--popover-foreground: #f6dcac;
|
||||
--muted: #0a2540;
|
||||
--muted-foreground: #a7c9c6;
|
||||
--accent: #0a2540;
|
||||
--accent-foreground: #f6dcac;
|
||||
--primary: #faa968;
|
||||
--primary-foreground: #020c17;
|
||||
--secondary: #0a2540;
|
||||
--secondary-foreground: #f6dcac;
|
||||
--cta: #faa968;
|
||||
--cta-foreground: #020c17;
|
||||
--ctahover: #fbb37a;
|
||||
--success: #028391;
|
||||
--success-foreground: #01060c;
|
||||
--warning: #e97b3c;
|
||||
--warning-foreground: #020c17;
|
||||
--destructive: #f85525;
|
||||
--destructive-foreground: #020c17;
|
||||
--info: #3f8f8a;
|
||||
--info-foreground: #020c17;
|
||||
--busy: #faa968;
|
||||
--busy-foreground: #020c17;
|
||||
--busy-ink: #faa968;
|
||||
--border: #324a59;
|
||||
--input: #324a59;
|
||||
--ring: #faa968;
|
||||
--radius: 0.625rem;
|
||||
--chart-primary: #faa968;
|
||||
--chart-secondary: #3f8f8a;
|
||||
--status-success: #028391;
|
||||
--status-warning: #e97b3c;
|
||||
--status-in-progress: #3f8f8a;
|
||||
--page-bg: #020c17;
|
||||
--page-bg-src: '';
|
||||
--panel-bg: rgb(5 24 46 / 0.72);
|
||||
--panel-border: rgb(50 74 89 / 0.9);
|
||||
--panel-border-bare: rgb(50 74 89 / 0.55);
|
||||
--panel-raised-bg: rgb(5 24 46 / 0.95);
|
||||
--panel-raised-border: rgb(50 74 89 / 1);
|
||||
--panel-accent: #faa968;
|
||||
--panel-header-bg: rgb(10 37 64 / 0.6);
|
||||
--panel-header-fg: #f6dcac;
|
||||
--panel-radius: 0.75rem;
|
||||
--panel-blur: 12px;
|
||||
--card-bg: #05182e;
|
||||
--glass-bg: rgb(5 24 46 / 0.55);
|
||||
--glass-border: rgb(50 74 89 / 0.7);
|
||||
--dock-bg: rgb(5 24 46 / 0.7);
|
||||
--dock-border: rgb(50 74 89 / 0.8);
|
||||
--dock-tooltip-bg: #0a2540;
|
||||
--header-bg: rgb(5 24 46 / 0.8);
|
||||
--header-border: rgb(50 74 89 / 0.9);
|
||||
--header-fg: #f6dcac;
|
||||
--header-blur: 12px;
|
||||
--pixel-grid-color: rgb(63 143 138 / 0.07);
|
||||
--card-grid-color: rgb(63 143 138 / 0.05);
|
||||
--panel-grid-color: rgb(63 143 138 / 0.06);
|
||||
--scrollbar-thumb: rgb(42 107 120 / 0.6);
|
||||
--scrollbar-thumb-hover: rgb(42 107 120 / 0.85);
|
||||
--scrollbar-thin-thumb: rgb(42 107 120 / 0.45);
|
||||
--scrollbar-thin-thumb-hover: rgb(42 107 120 / 0.7);
|
||||
--brand: #faa968;
|
||||
--brand-foreground: #020c17;
|
||||
--brand-primary: #faa968;
|
||||
--brand-accent: #8cbfb8;
|
||||
--brand-warm: #faa968;
|
||||
--brand-deep: #020c17;
|
||||
--brand-muted: #2a6b78;
|
||||
--ink: #f6dcac;
|
||||
--surface-warm: #05182e;
|
||||
--naturegreen: #028391;
|
||||
--naturegreen-foreground: #01060c;
|
||||
--duck-dark: #f6dcac;
|
||||
--duck-teal: #8cbfb8;
|
||||
--duck-yellow: #e97b3c;
|
||||
--duck-orange: #faa968;
|
||||
--duck-forest: #028391;
|
||||
--duck-beige: #1d2c3b;
|
||||
--logo-src: '/officer-logo.svg';
|
||||
}
|
||||
@@ -1,50 +1,94 @@
|
||||
/*
|
||||
RISTRETTO — ported from the published palette, unchanged.
|
||||
Ristretto — generated from Omarchy's palette by scripts/generate-themes.ts.
|
||||
|
||||
A PALETTE theme: it supplies the standard tokens and nothing else. Panels, the header, the dock, glass,
|
||||
grid lines and scrollbars are all derived from these by `base.css`, so this file never mentions them.
|
||||
DO NOT EDIT BY HAND. Change the mapping in scripts/themes/map.ts and re-run, so every theme moves
|
||||
together — the previous port drifted precisely because each file was edited on its own.
|
||||
|
||||
That is the contract working as intended — a theme anyone has already written, dropped in whole. Compare
|
||||
`duck-*.css`, which additionally declares a texture.
|
||||
Source: basecamp/omarchy themes/ristretto/colors.toml (mode: dark)
|
||||
*/
|
||||
|
||||
[data-theme='ristretto'] {
|
||||
/* The mark. Declared by every theme rather than inherited from a default: a theme that ships a
|
||||
brand should say so, and a white-labelled build replaces this line rather than hunting for the
|
||||
default that was quietly supplying it. */
|
||||
--logo-src: '/officer-logo.svg';
|
||||
|
||||
--background: #181414;
|
||||
--foreground: #e6d9db;
|
||||
--card: #2c2525;
|
||||
--card-foreground: #e6d9db;
|
||||
--popover: #2c2525;
|
||||
--popover-foreground: #e6d9db;
|
||||
--muted: #3d2f2a;
|
||||
--muted-foreground: #c3b7b8;
|
||||
--accent: #3d2f2a;
|
||||
--accent-foreground: #e6d9db;
|
||||
--primary: #f38d70;
|
||||
--primary-foreground: #181414;
|
||||
--secondary: #3d2f2a;
|
||||
--secondary-foreground: #e6d9db;
|
||||
--cta: #f38d70;
|
||||
--cta-foreground: #181414;
|
||||
--ctahover: #f49b81;
|
||||
--success: #adda78;
|
||||
--success-foreground: #181414;
|
||||
--warning: #f9cc6c;
|
||||
--warning-foreground: #181414;
|
||||
--destructive: #fd6883;
|
||||
--destructive-foreground: #181414;
|
||||
--info: #f38d70;
|
||||
--info-foreground: #181414;
|
||||
--busy: #fb9a77;
|
||||
--busy-foreground: #181414;
|
||||
--busy-ink: #fb9a77;
|
||||
--border: #564e4e;
|
||||
--input: #564e4e;
|
||||
--ring: #f38d70;
|
||||
--radius: 0.625rem;
|
||||
--background: #403d39;
|
||||
--foreground: #ebe5df;
|
||||
--card: #352f2a;
|
||||
--card-foreground: #ebe5df;
|
||||
--popover: #352f2a;
|
||||
--popover-foreground: #ebe5df;
|
||||
--primary: #fc9867;
|
||||
--primary-foreground: #403d39;
|
||||
--secondary: #5f574f;
|
||||
--secondary-foreground: #ebe5df;
|
||||
--muted: #4d4743;
|
||||
--muted-foreground: #ada49d;
|
||||
--accent: #fbb360;
|
||||
--accent-foreground: #403d39;
|
||||
--destructive: #d76c6c;
|
||||
--destructive-foreground: #ebe5df;
|
||||
--border: #5f574f;
|
||||
--input: #5f574f;
|
||||
--ring: #fc9867;
|
||||
--chart-1: #fc9867;
|
||||
--chart-2: #fbb360;
|
||||
--chart-3: #8ca589;
|
||||
--chart-4: #86a3a3;
|
||||
--chart-5: #a38dac;
|
||||
--sidebar: #352f2a;
|
||||
--sidebar-foreground: #ada49d;
|
||||
--sidebar-primary: #fc9867;
|
||||
--sidebar-primary-foreground: #403d39;
|
||||
--sidebar-accent: #4d4743;
|
||||
--sidebar-accent-foreground: #ebe5df;
|
||||
--sidebar-border: #5f574f;
|
||||
--sidebar-ring: #fc9867;
|
||||
--chart-primary: #f38d70;
|
||||
--chart-secondary: #a8a9eb;
|
||||
--status-success: #adda78;
|
||||
--status-warning: #f9cc6c;
|
||||
--status-in-progress: #f38d70;
|
||||
--page-bg: #181414;
|
||||
--page-bg-src: '';
|
||||
--panel-bg: rgb(44 37 37 / 0.72);
|
||||
--panel-border: rgb(86 78 78 / 0.9);
|
||||
--panel-border-bare: rgb(86 78 78 / 0.55);
|
||||
--panel-raised-bg: rgb(44 37 37 / 0.95);
|
||||
--panel-raised-border: rgb(86 78 78 / 1);
|
||||
--panel-accent: #f38d70;
|
||||
--panel-header-bg: rgb(61 47 42 / 0.6);
|
||||
--panel-header-fg: #e6d9db;
|
||||
--panel-radius: 0.75rem;
|
||||
--panel-blur: 12px;
|
||||
--card-bg: #2c2525;
|
||||
--glass-bg: rgb(44 37 37 / 0.55);
|
||||
--glass-border: rgb(86 78 78 / 0.7);
|
||||
--dock-bg: rgb(44 37 37 / 0.7);
|
||||
--dock-border: rgb(86 78 78 / 0.8);
|
||||
--dock-tooltip-bg: #3d2f2a;
|
||||
--header-bg: rgb(44 37 37 / 0.8);
|
||||
--header-border: rgb(86 78 78 / 0.9);
|
||||
--header-fg: #e6d9db;
|
||||
--header-blur: 12px;
|
||||
--pixel-grid-color: rgb(121 113 113 / 0.07);
|
||||
--card-grid-color: rgb(121 113 113 / 0.05);
|
||||
--panel-grid-color: rgb(121 113 113 / 0.06);
|
||||
--scrollbar-thumb: rgb(114 105 106 / 0.6);
|
||||
--scrollbar-thumb-hover: rgb(114 105 106 / 0.85);
|
||||
--scrollbar-thin-thumb: rgb(114 105 106 / 0.45);
|
||||
--scrollbar-thin-thumb-hover: rgb(114 105 106 / 0.7);
|
||||
--brand: #f38d70;
|
||||
--brand-foreground: #181414;
|
||||
--brand-primary: #f38d70;
|
||||
--brand-accent: #85dacc;
|
||||
--brand-warm: #fb9a77;
|
||||
--brand-deep: #181414;
|
||||
--brand-muted: #72696a;
|
||||
--ink: #e6d9db;
|
||||
--surface-warm: #2c2525;
|
||||
--naturegreen: #adda78;
|
||||
--naturegreen-foreground: #181414;
|
||||
--duck-dark: #e6d9db;
|
||||
--duck-teal: #85dacc;
|
||||
--duck-yellow: #f9cc6c;
|
||||
--duck-orange: #fb9a77;
|
||||
--duck-forest: #adda78;
|
||||
--duck-beige: #3f3737;
|
||||
--logo-src: '/officer-logo.svg';
|
||||
}
|
||||
|
||||
@@ -1,50 +1,94 @@
|
||||
/*
|
||||
ROSÉ PINE — ported from the published palette, unchanged.
|
||||
Rose Pine — generated from Omarchy's palette by scripts/generate-themes.ts.
|
||||
|
||||
A PALETTE theme: it supplies the standard tokens and nothing else. Panels, the header, the dock, glass,
|
||||
grid lines and scrollbars are all derived from these by `base.css`, so this file never mentions them.
|
||||
DO NOT EDIT BY HAND. Change the mapping in scripts/themes/map.ts and re-run, so every theme moves
|
||||
together — the previous port drifted precisely because each file was edited on its own.
|
||||
|
||||
That is the contract working as intended — a theme anyone has already written, dropped in whole. Compare
|
||||
`duck-*.css`, which additionally declares a texture.
|
||||
Source: basecamp/omarchy themes/rose-pine/colors.toml (mode: light)
|
||||
*/
|
||||
|
||||
[data-theme='rose-pine'] {
|
||||
/* The mark. Declared by every theme rather than inherited from a default: a theme that ships a
|
||||
brand should say so, and a white-labelled build replaces this line rather than hunting for the
|
||||
default that was quietly supplying it. */
|
||||
--logo-src: '/officer-logo.svg';
|
||||
|
||||
--background: #faf4ed;
|
||||
--foreground: #575279;
|
||||
--card: #f2e9e1;
|
||||
--card-foreground: #575279;
|
||||
--popover: #f2e9e1;
|
||||
--popover-foreground: #575279;
|
||||
--muted: #ede7e1;
|
||||
--muted-foreground: #69657f;
|
||||
--accent: #ede7e1;
|
||||
--accent-foreground: #575279;
|
||||
--primary: #56949f;
|
||||
--primary-foreground: #222120;
|
||||
--secondary: #ede7e1;
|
||||
--secondary-foreground: #575279;
|
||||
--cta: #56949f;
|
||||
--cta-foreground: #222120;
|
||||
--ctahover: #4c828c;
|
||||
--success: #286983;
|
||||
--success-foreground: #e3ddd7;
|
||||
--warning: #ea9d34;
|
||||
--warning-foreground: #413e5b;
|
||||
--destructive: #b4637a;
|
||||
--destructive-foreground: #111010;
|
||||
--info: #56949f;
|
||||
--info-foreground: #222120;
|
||||
--busy: #cf8057;
|
||||
--busy-foreground: #2c293d;
|
||||
--busy-ink: #9b6041;
|
||||
--border: #d9d1d0;
|
||||
--input: #d9d1d0;
|
||||
--ring: #56949f;
|
||||
--radius: 0.625rem;
|
||||
--background: #191724;
|
||||
--foreground: #e0def4;
|
||||
--card: #1f1d2e;
|
||||
--card-foreground: #e0def4;
|
||||
--popover: #1f1d2e;
|
||||
--popover-foreground: #e0def4;
|
||||
--primary: #c4a7e7;
|
||||
--primary-foreground: #191724;
|
||||
--secondary: #26233a;
|
||||
--secondary-foreground: #e0def4;
|
||||
--muted: #26233a;
|
||||
--muted-foreground: #908caa;
|
||||
--accent: #ebbcba;
|
||||
--accent-foreground: #191724;
|
||||
--destructive: #eb6f92;
|
||||
--destructive-foreground: #e0def4;
|
||||
--border: #26233a;
|
||||
--input: #26233a;
|
||||
--ring: #c4a7e7;
|
||||
--chart-1: #c4a7e7;
|
||||
--chart-2: #f6c177;
|
||||
--chart-3: #9ccfd8;
|
||||
--chart-4: #31748f;
|
||||
--chart-5: #eb6f92;
|
||||
--sidebar: #1f1d2e;
|
||||
--sidebar-foreground: #908caa;
|
||||
--sidebar-primary: #c4a7e7;
|
||||
--sidebar-primary-foreground: #191724;
|
||||
--sidebar-accent: #26233a;
|
||||
--sidebar-accent-foreground: #e0def4;
|
||||
--sidebar-border: #403d52;
|
||||
--sidebar-ring: #c4a7e7;
|
||||
--chart-primary: #56949f;
|
||||
--chart-secondary: #907aa9;
|
||||
--status-success: #286983;
|
||||
--status-warning: #ea9d34;
|
||||
--status-in-progress: #56949f;
|
||||
--page-bg: #faf4ed;
|
||||
--page-bg-src: '';
|
||||
--panel-bg: rgb(242 233 225 / 0.72);
|
||||
--panel-border: rgb(217 209 208 / 0.9);
|
||||
--panel-border-bare: rgb(217 209 208 / 0.55);
|
||||
--panel-raised-bg: rgb(242 233 225 / 0.95);
|
||||
--panel-raised-border: rgb(217 209 208 / 1);
|
||||
--panel-accent: #56949f;
|
||||
--panel-header-bg: rgb(237 231 225 / 0.6);
|
||||
--panel-header-fg: #575279;
|
||||
--panel-radius: 0.75rem;
|
||||
--panel-blur: 12px;
|
||||
--card-bg: #f2e9e1;
|
||||
--glass-bg: rgb(242 233 225 / 0.55);
|
||||
--glass-border: rgb(217 209 208 / 0.7);
|
||||
--dock-bg: rgb(242 233 225 / 0.7);
|
||||
--dock-border: rgb(217 209 208 / 0.8);
|
||||
--dock-tooltip-bg: #ede7e1;
|
||||
--header-bg: rgb(242 233 225 / 0.8);
|
||||
--header-border: rgb(217 209 208 / 0.9);
|
||||
--header-fg: #575279;
|
||||
--header-blur: 12px;
|
||||
--pixel-grid-color: rgb(137 132 149 / 0.07);
|
||||
--card-grid-color: rgb(137 132 149 / 0.05);
|
||||
--panel-grid-color: rgb(137 132 149 / 0.06);
|
||||
--scrollbar-thumb: rgb(206 202 205 / 0.6);
|
||||
--scrollbar-thumb-hover: rgb(206 202 205 / 0.85);
|
||||
--scrollbar-thin-thumb: rgb(206 202 205 / 0.45);
|
||||
--scrollbar-thin-thumb-hover: rgb(206 202 205 / 0.7);
|
||||
--brand: #56949f;
|
||||
--brand-foreground: #222120;
|
||||
--brand-primary: #56949f;
|
||||
--brand-accent: #d7827e;
|
||||
--brand-warm: #cf8057;
|
||||
--brand-deep: #ede7e1;
|
||||
--brand-muted: #cecacd;
|
||||
--ink: #575279;
|
||||
--surface-warm: #f2e9e1;
|
||||
--naturegreen: #286983;
|
||||
--naturegreen-foreground: #e3ddd7;
|
||||
--duck-dark: #575279;
|
||||
--duck-teal: #d7827e;
|
||||
--duck-yellow: #ea9d34;
|
||||
--duck-orange: #cf8057;
|
||||
--duck-forest: #286983;
|
||||
--duck-beige: #e3dad7;
|
||||
--logo-src: '/officer-logo.svg';
|
||||
}
|
||||
|
||||
@@ -0,0 +1,94 @@
|
||||
/*
|
||||
Solitude — generated from Omarchy's palette by scripts/generate-themes.ts.
|
||||
|
||||
DO NOT EDIT BY HAND. Change the mapping in scripts/themes/map.ts and re-run, so every theme moves
|
||||
together — the previous port drifted precisely because each file was edited on its own.
|
||||
|
||||
Source: basecamp/omarchy themes/solitude/colors.toml (mode: dark)
|
||||
*/
|
||||
[data-theme='solitude'] {
|
||||
--background: #080a0b;
|
||||
--foreground: #cacccc;
|
||||
--card: #101315;
|
||||
--card-foreground: #cacccc;
|
||||
--popover: #101315;
|
||||
--popover-foreground: #cacccc;
|
||||
--muted: #101315;
|
||||
--muted-foreground: #cbc2be;
|
||||
--accent: #101315;
|
||||
--accent-foreground: #cacccc;
|
||||
--primary: #798186;
|
||||
--primary-foreground: #080a0b;
|
||||
--secondary: #101315;
|
||||
--secondary-foreground: #cacccc;
|
||||
--cta: #798186;
|
||||
--cta-foreground: #080a0b;
|
||||
--ctahover: #899095;
|
||||
--success: #9fa5a9;
|
||||
--success-foreground: #080a0b;
|
||||
--warning: #d9dbdc;
|
||||
--warning-foreground: #080a0b;
|
||||
--destructive: #565d60;
|
||||
--destructive-foreground: #d0d4d8;
|
||||
--info: #798186;
|
||||
--info-foreground: #080a0b;
|
||||
--busy: #d9dbdc;
|
||||
--busy-foreground: #080a0b;
|
||||
--busy-ink: #d9dbdc;
|
||||
--border: #444444;
|
||||
--input: #444444;
|
||||
--ring: #798186;
|
||||
--radius: 0.625rem;
|
||||
--chart-primary: #798186;
|
||||
--chart-secondary: #aeaeae;
|
||||
--status-success: #9fa5a9;
|
||||
--status-warning: #d9dbdc;
|
||||
--status-in-progress: #798186;
|
||||
--page-bg: #080a0b;
|
||||
--page-bg-src: '';
|
||||
--panel-bg: rgb(16 19 21 / 0.72);
|
||||
--panel-border: rgb(68 68 68 / 0.9);
|
||||
--panel-border-bare: rgb(68 68 68 / 0.55);
|
||||
--panel-raised-bg: rgb(16 19 21 / 0.95);
|
||||
--panel-raised-border: rgb(68 68 68 / 1);
|
||||
--panel-accent: #798186;
|
||||
--panel-header-bg: rgb(16 19 21 / 0.6);
|
||||
--panel-header-fg: #cacccc;
|
||||
--panel-radius: 0.75rem;
|
||||
--panel-blur: 12px;
|
||||
--card-bg: #101315;
|
||||
--glass-bg: rgb(16 19 21 / 0.55);
|
||||
--glass-border: rgb(68 68 68 / 0.7);
|
||||
--dock-bg: rgb(16 19 21 / 0.7);
|
||||
--dock-border: rgb(68 68 68 / 0.8);
|
||||
--dock-tooltip-bg: #101315;
|
||||
--header-bg: rgb(16 19 21 / 0.8);
|
||||
--header-border: rgb(68 68 68 / 0.9);
|
||||
--header-fg: #cacccc;
|
||||
--header-blur: 12px;
|
||||
--pixel-grid-color: rgb(98 100 106 / 0.07);
|
||||
--card-grid-color: rgb(98 100 106 / 0.05);
|
||||
--panel-grid-color: rgb(98 100 106 / 0.06);
|
||||
--scrollbar-thumb: rgb(75 78 85 / 0.6);
|
||||
--scrollbar-thumb-hover: rgb(75 78 85 / 0.85);
|
||||
--scrollbar-thin-thumb: rgb(75 78 85 / 0.45);
|
||||
--scrollbar-thin-thumb-hover: rgb(75 78 85 / 0.7);
|
||||
--brand: #798186;
|
||||
--brand-foreground: #080a0b;
|
||||
--brand-primary: #798186;
|
||||
--brand-accent: #707070;
|
||||
--brand-warm: #d9dbdc;
|
||||
--brand-deep: #080a0b;
|
||||
--brand-muted: #4b4e55;
|
||||
--ink: #cacccc;
|
||||
--surface-warm: #101315;
|
||||
--naturegreen: #9fa5a9;
|
||||
--naturegreen-foreground: #080a0b;
|
||||
--duck-dark: #cacccc;
|
||||
--duck-teal: #707070;
|
||||
--duck-yellow: #d9dbdc;
|
||||
--duck-orange: #d9dbdc;
|
||||
--duck-forest: #9fa5a9;
|
||||
--duck-beige: #232627;
|
||||
--logo-src: '/officer-logo.svg';
|
||||
}
|
||||
@@ -1,50 +1,94 @@
|
||||
/*
|
||||
TOKYO NIGHT — ported from the published palette, unchanged.
|
||||
Tokyo Night — generated from Omarchy's palette by scripts/generate-themes.ts.
|
||||
|
||||
A PALETTE theme: it supplies the standard tokens and nothing else. Panels, the header, the dock, glass,
|
||||
grid lines and scrollbars are all derived from these by `base.css`, so this file never mentions them.
|
||||
DO NOT EDIT BY HAND. Change the mapping in scripts/themes/map.ts and re-run, so every theme moves
|
||||
together — the previous port drifted precisely because each file was edited on its own.
|
||||
|
||||
That is the contract working as intended — a theme anyone has already written, dropped in whole. Compare
|
||||
`duck-*.css`, which additionally declares a texture.
|
||||
Source: basecamp/omarchy themes/tokyo-night/colors.toml (mode: dark)
|
||||
*/
|
||||
|
||||
[data-theme='tokyo-night'] {
|
||||
/* The mark. Declared by every theme rather than inherited from a default: a theme that ships a
|
||||
brand should say so, and a white-labelled build replaces this line rather than hunting for the
|
||||
default that was quietly supplying it. */
|
||||
--logo-src: '/officer-logo.svg';
|
||||
|
||||
--background: #0e0e14;
|
||||
--foreground: #a9b1d6;
|
||||
--card: #1a1b26;
|
||||
--card-foreground: #a9b1d6;
|
||||
--popover: #1a1b26;
|
||||
--popover-foreground: #a9b1d6;
|
||||
--muted: #24283b;
|
||||
--muted-foreground: #b4bee6;
|
||||
--accent: #24283b;
|
||||
--accent-foreground: #a9b1d6;
|
||||
--primary: #7aa2f7;
|
||||
--primary-foreground: #0e0e14;
|
||||
--secondary: #24283b;
|
||||
--secondary-foreground: #a9b1d6;
|
||||
--cta: #7aa2f7;
|
||||
--cta-foreground: #0e0e14;
|
||||
--ctahover: #8aadf8;
|
||||
--success: #9ece6a;
|
||||
--success-foreground: #0e0e14;
|
||||
--warning: #e0af68;
|
||||
--warning-foreground: #0e0e14;
|
||||
--destructive: #f7768e;
|
||||
--destructive-foreground: #0e0e14;
|
||||
--info: #7aa2f7;
|
||||
--info-foreground: #0e0e14;
|
||||
--busy: #eb927b;
|
||||
--busy-foreground: #0e0e14;
|
||||
--busy-ink: #eb927b;
|
||||
--border: #45495c;
|
||||
--input: #45495c;
|
||||
--ring: #7aa2f7;
|
||||
--radius: 0.625rem;
|
||||
--background: #222436;
|
||||
--foreground: #c8d3f5;
|
||||
--card: #1e2030;
|
||||
--card-foreground: #c8d3f5;
|
||||
--popover: #1e2030;
|
||||
--popover-foreground: #c8d3f5;
|
||||
--primary: #82aaff;
|
||||
--primary-foreground: #1b1d2b;
|
||||
--secondary: #3b4261;
|
||||
--secondary-foreground: #c8d3f5;
|
||||
--muted: #2f334d;
|
||||
--muted-foreground: #828bb8;
|
||||
--accent: #86e1fc;
|
||||
--accent-foreground: #1b1d2b;
|
||||
--destructive: #c53b53;
|
||||
--destructive-foreground: #c8d3f5;
|
||||
--border: #3b4261;
|
||||
--input: #3b4261;
|
||||
--ring: #82aaff;
|
||||
--chart-1: #82aaff;
|
||||
--chart-2: #ffc777;
|
||||
--chart-3: #c3e88d;
|
||||
--chart-4: #4fd6be;
|
||||
--chart-5: #c099ff;
|
||||
--sidebar: #1e2030;
|
||||
--sidebar-foreground: #828bb8;
|
||||
--sidebar-primary: #82aaff;
|
||||
--sidebar-primary-foreground: #1b1d2b;
|
||||
--sidebar-accent: #2f334d;
|
||||
--sidebar-accent-foreground: #c8d3f5;
|
||||
--sidebar-border: #3b4261;
|
||||
--sidebar-ring: #82aaff;
|
||||
--chart-primary: #7aa2f7;
|
||||
--chart-secondary: #ad8ee6;
|
||||
--status-success: #9ece6a;
|
||||
--status-warning: #e0af68;
|
||||
--status-in-progress: #7aa2f7;
|
||||
--page-bg: #0e0e14;
|
||||
--page-bg-src: '';
|
||||
--panel-bg: rgb(26 27 38 / 0.72);
|
||||
--panel-border: rgb(69 73 92 / 0.9);
|
||||
--panel-border-bare: rgb(69 73 92 / 0.55);
|
||||
--panel-raised-bg: rgb(26 27 38 / 0.95);
|
||||
--panel-raised-border: rgb(69 73 92 / 1);
|
||||
--panel-accent: #7aa2f7;
|
||||
--panel-header-bg: rgb(36 40 59 / 0.6);
|
||||
--panel-header-fg: #a9b1d6;
|
||||
--panel-radius: 0.75rem;
|
||||
--panel-blur: 12px;
|
||||
--card-bg: #1a1b26;
|
||||
--glass-bg: rgb(26 27 38 / 0.55);
|
||||
--glass-border: rgb(69 73 92 / 0.7);
|
||||
--dock-bg: rgb(26 27 38 / 0.7);
|
||||
--dock-border: rgb(69 73 92 / 0.8);
|
||||
--dock-tooltip-bg: #24283b;
|
||||
--header-bg: rgb(26 27 38 / 0.8);
|
||||
--header-border: rgb(69 73 92 / 0.9);
|
||||
--header-fg: #a9b1d6;
|
||||
--header-blur: 12px;
|
||||
--pixel-grid-color: rgb(94 103 143 / 0.07);
|
||||
--card-grid-color: rgb(94 103 143 / 0.05);
|
||||
--panel-grid-color: rgb(94 103 143 / 0.06);
|
||||
--scrollbar-thumb: rgb(65 72 104 / 0.6);
|
||||
--scrollbar-thumb-hover: rgb(65 72 104 / 0.85);
|
||||
--scrollbar-thin-thumb: rgb(65 72 104 / 0.45);
|
||||
--scrollbar-thin-thumb-hover: rgb(65 72 104 / 0.7);
|
||||
--brand: #7aa2f7;
|
||||
--brand-foreground: #0e0e14;
|
||||
--brand-primary: #7aa2f7;
|
||||
--brand-accent: #449dab;
|
||||
--brand-warm: #eb927b;
|
||||
--brand-deep: #0e0e14;
|
||||
--brand-muted: #414868;
|
||||
--ink: #a9b1d6;
|
||||
--surface-warm: #1a1b26;
|
||||
--naturegreen: #9ece6a;
|
||||
--naturegreen-foreground: #0e0e14;
|
||||
--duck-dark: #a9b1d6;
|
||||
--duck-teal: #449dab;
|
||||
--duck-yellow: #e0af68;
|
||||
--duck-orange: #eb927b;
|
||||
--duck-forest: #9ece6a;
|
||||
--duck-beige: #282a38;
|
||||
--logo-src: '/officer-logo.svg';
|
||||
}
|
||||
|
||||
@@ -0,0 +1,94 @@
|
||||
/*
|
||||
Vantablack — generated from Omarchy's palette by scripts/generate-themes.ts.
|
||||
|
||||
DO NOT EDIT BY HAND. Change the mapping in scripts/themes/map.ts and re-run, so every theme moves
|
||||
together — the previous port drifted precisely because each file was edited on its own.
|
||||
|
||||
Source: basecamp/omarchy themes/vantablack/colors.toml (mode: dark)
|
||||
*/
|
||||
[data-theme='vantablack'] {
|
||||
--background: #070707;
|
||||
--foreground: #ffffff;
|
||||
--card: #000000;
|
||||
--card-foreground: #ffffff;
|
||||
--popover: #000000;
|
||||
--popover-foreground: #ffffff;
|
||||
--muted: #1a1a1a;
|
||||
--muted-foreground: #ececec;
|
||||
--accent: #1a1a1a;
|
||||
--accent-foreground: #ffffff;
|
||||
--primary: #8d8d8d;
|
||||
--primary-foreground: #070707;
|
||||
--secondary: #1a1a1a;
|
||||
--secondary-foreground: #ffffff;
|
||||
--cta: #8d8d8d;
|
||||
--cta-foreground: #070707;
|
||||
--ctahover: #9b9b9b;
|
||||
--success: #b6b6b6;
|
||||
--success-foreground: #070707;
|
||||
--warning: #cecece;
|
||||
--warning-foreground: #070707;
|
||||
--destructive: #a4a4a4;
|
||||
--destructive-foreground: #070707;
|
||||
--info: #8d8d8d;
|
||||
--info-foreground: #070707;
|
||||
--busy: #b9b9b9;
|
||||
--busy-foreground: #070707;
|
||||
--busy-ink: #b9b9b9;
|
||||
--border: #424242;
|
||||
--input: #424242;
|
||||
--ring: #8d8d8d;
|
||||
--radius: 0.625rem;
|
||||
--chart-primary: #8d8d8d;
|
||||
--chart-secondary: #9b9b9b;
|
||||
--status-success: #b6b6b6;
|
||||
--status-warning: #cecece;
|
||||
--status-in-progress: #8d8d8d;
|
||||
--page-bg: #070707;
|
||||
--page-bg-src: '';
|
||||
--panel-bg: rgb(0 0 0 / 0.72);
|
||||
--panel-border: rgb(66 66 66 / 0.9);
|
||||
--panel-border-bare: rgb(66 66 66 / 0.55);
|
||||
--panel-raised-bg: rgb(0 0 0 / 0.95);
|
||||
--panel-raised-border: rgb(66 66 66 / 1);
|
||||
--panel-accent: #8d8d8d;
|
||||
--panel-header-bg: rgb(26 26 26 / 0.6);
|
||||
--panel-header-fg: #ffffff;
|
||||
--panel-radius: 0.75rem;
|
||||
--panel-blur: 12px;
|
||||
--card-bg: #000000;
|
||||
--glass-bg: rgb(0 0 0 / 0.55);
|
||||
--glass-border: rgb(66 66 66 / 0.7);
|
||||
--dock-bg: rgb(0 0 0 / 0.7);
|
||||
--dock-border: rgb(66 66 66 / 0.8);
|
||||
--dock-tooltip-bg: #1a1a1a;
|
||||
--header-bg: rgb(0 0 0 / 0.8);
|
||||
--header-border: rgb(66 66 66 / 0.9);
|
||||
--header-fg: #ffffff;
|
||||
--header-blur: 12px;
|
||||
--pixel-grid-color: rgb(93 93 93 / 0.07);
|
||||
--card-grid-color: rgb(93 93 93 / 0.05);
|
||||
--panel-grid-color: rgb(93 93 93 / 0.06);
|
||||
--scrollbar-thumb: rgb(122 122 122 / 0.6);
|
||||
--scrollbar-thumb-hover: rgb(122 122 122 / 0.85);
|
||||
--scrollbar-thin-thumb: rgb(122 122 122 / 0.45);
|
||||
--scrollbar-thin-thumb-hover: rgb(122 122 122 / 0.7);
|
||||
--brand: #8d8d8d;
|
||||
--brand-foreground: #070707;
|
||||
--brand-primary: #8d8d8d;
|
||||
--brand-accent: #b0b0b0;
|
||||
--brand-warm: #b9b9b9;
|
||||
--brand-deep: #070707;
|
||||
--brand-muted: #7a7a7a;
|
||||
--ink: #ffffff;
|
||||
--surface-warm: #000000;
|
||||
--naturegreen: #b6b6b6;
|
||||
--naturegreen-foreground: #070707;
|
||||
--duck-dark: #ffffff;
|
||||
--duck-teal: #b0b0b0;
|
||||
--duck-yellow: #cecece;
|
||||
--duck-orange: #b9b9b9;
|
||||
--duck-forest: #b6b6b6;
|
||||
--duck-beige: #1a1a1a;
|
||||
--logo-src: '/officer-logo.svg';
|
||||
}
|
||||
@@ -0,0 +1,94 @@
|
||||
/*
|
||||
White — generated from Omarchy's palette by scripts/generate-themes.ts.
|
||||
|
||||
DO NOT EDIT BY HAND. Change the mapping in scripts/themes/map.ts and re-run, so every theme moves
|
||||
together — the previous port drifted precisely because each file was edited on its own.
|
||||
|
||||
Source: basecamp/omarchy themes/white/colors.toml (mode: light)
|
||||
*/
|
||||
[data-theme='white'] {
|
||||
--background: #ffffff;
|
||||
--foreground: #000000;
|
||||
--card: #c0c0c0;
|
||||
--card-foreground: #000000;
|
||||
--popover: #c0c0c0;
|
||||
--popover-foreground: #000000;
|
||||
--muted: #f5f5f5;
|
||||
--muted-foreground: #000000;
|
||||
--accent: #f5f5f5;
|
||||
--accent-foreground: #000000;
|
||||
--primary: #6e6e6e;
|
||||
--primary-foreground: #f1f1f1;
|
||||
--secondary: #f5f5f5;
|
||||
--secondary-foreground: #000000;
|
||||
--cta: #6e6e6e;
|
||||
--cta-foreground: #f1f1f1;
|
||||
--ctahover: #616161;
|
||||
--success: #3a3a3a;
|
||||
--success-foreground: #e8e8e8;
|
||||
--warning: #4a4a4a;
|
||||
--warning-foreground: #e8e8e8;
|
||||
--destructive: #2a2a2a;
|
||||
--destructive-foreground: #e8e8e8;
|
||||
--info: #1a1a1a;
|
||||
--info-foreground: #e8e8e8;
|
||||
--busy: #4a4a4a;
|
||||
--busy-foreground: #e8e8e8;
|
||||
--busy-ink: #4a4a4a;
|
||||
--border: #c0c0c0;
|
||||
--input: #c0c0c0;
|
||||
--ring: #6e6e6e;
|
||||
--radius: 0.625rem;
|
||||
--chart-primary: #6e6e6e;
|
||||
--chart-secondary: #2e2e2e;
|
||||
--status-success: #3a3a3a;
|
||||
--status-warning: #4a4a4a;
|
||||
--status-in-progress: #1a1a1a;
|
||||
--page-bg: #ffffff;
|
||||
--page-bg-src: '';
|
||||
--panel-bg: rgb(192 192 192 / 0.72);
|
||||
--panel-border: rgb(192 192 192 / 0.9);
|
||||
--panel-border-bare: rgb(192 192 192 / 0.55);
|
||||
--panel-raised-bg: rgb(192 192 192 / 0.95);
|
||||
--panel-raised-border: rgb(192 192 192 / 1);
|
||||
--panel-accent: #6e6e6e;
|
||||
--panel-header-bg: rgb(245 245 245 / 0.6);
|
||||
--panel-header-fg: #000000;
|
||||
--panel-radius: 0.75rem;
|
||||
--panel-blur: 12px;
|
||||
--card-bg: #c0c0c0;
|
||||
--glass-bg: rgb(192 192 192 / 0.55);
|
||||
--glass-border: rgb(192 192 192 / 0.7);
|
||||
--dock-bg: rgb(192 192 192 / 0.7);
|
||||
--dock-border: rgb(192 192 192 / 0.8);
|
||||
--dock-tooltip-bg: #f5f5f5;
|
||||
--header-bg: rgb(192 192 192 / 0.8);
|
||||
--header-border: rgb(192 192 192 / 0.9);
|
||||
--header-fg: #000000;
|
||||
--header-blur: 12px;
|
||||
--pixel-grid-color: rgb(101 101 101 / 0.07);
|
||||
--card-grid-color: rgb(101 101 101 / 0.05);
|
||||
--panel-grid-color: rgb(101 101 101 / 0.06);
|
||||
--scrollbar-thumb: rgb(128 128 128 / 0.6);
|
||||
--scrollbar-thumb-hover: rgb(128 128 128 / 0.85);
|
||||
--scrollbar-thin-thumb: rgb(128 128 128 / 0.45);
|
||||
--scrollbar-thin-thumb-hover: rgb(128 128 128 / 0.7);
|
||||
--brand: #6e6e6e;
|
||||
--brand-foreground: #f1f1f1;
|
||||
--brand-primary: #6e6e6e;
|
||||
--brand-accent: #3e3e3e;
|
||||
--brand-warm: #4a4a4a;
|
||||
--brand-deep: #f5f5f5;
|
||||
--brand-muted: #808080;
|
||||
--ink: #000000;
|
||||
--surface-warm: #c0c0c0;
|
||||
--naturegreen: #3a3a3a;
|
||||
--naturegreen-foreground: #e8e8e8;
|
||||
--duck-dark: #000000;
|
||||
--duck-teal: #3e3e3e;
|
||||
--duck-yellow: #4a4a4a;
|
||||
--duck-orange: #4a4a4a;
|
||||
--duck-forest: #3a3a3a;
|
||||
--duck-beige: #adadad;
|
||||
--logo-src: '/officer-logo.svg';
|
||||
}
|
||||
@@ -38,23 +38,40 @@ export const THEMES: readonly Theme[] = [
|
||||
},
|
||||
|
||||
/*
|
||||
Palette themes, ported unchanged from published colour schemes. Each supplies only the standard tokens;
|
||||
`base.css` derives panels, header, dock, glass, grid and scrollbars from them.
|
||||
Palette themes, generated from Omarchy by `scripts/generate-themes.ts`.
|
||||
|
||||
`applyDarkClass` is set for the dark ones so the 396 `dark:` utilities still written into components
|
||||
resolve. It says nothing about the theme beyond "treat this as a dark ground".
|
||||
Everything between the markers is rewritten by that script, from the same list that writes the
|
||||
stylesheet imports. Both halves from one source on purpose: the previous port maintained them by
|
||||
hand and drifted — `catppuccin-mocha` sat in this list after its stylesheet was gone.
|
||||
|
||||
`applyDarkClass` comes from the palette's own `mode`, so it is a fact about the theme rather than a
|
||||
judgement about it. It says nothing beyond "treat this as a dark ground", which is what the 396
|
||||
remaining `dark:` utilities need.
|
||||
*/
|
||||
{ id: 'tokyo-night', name: 'Tokyo Night', family: 'Tokyo Night', applyDarkClass: true },
|
||||
{ id: 'catppuccin-mocha', name: 'Catppuccin Mocha', family: 'Catppuccin', applyDarkClass: true },
|
||||
/* GENERATED THEMES — start */
|
||||
{ id: 'catppuccin', name: 'Catppuccin Mocha', family: 'Catppuccin', applyDarkClass: true },
|
||||
{ id: 'catppuccin-latte', name: 'Catppuccin Latte', family: 'Catppuccin', applyDarkClass: false },
|
||||
{ id: 'ethereal', name: 'Ethereal', family: 'Ethereal', applyDarkClass: true },
|
||||
{ id: 'everforest', name: 'Everforest', family: 'Everforest', applyDarkClass: true },
|
||||
{ id: 'flexoki-light', name: 'Flexoki Light', family: 'Flexoki Light', applyDarkClass: false },
|
||||
{ id: 'gruvbox', name: 'Gruvbox', family: 'Gruvbox', applyDarkClass: true },
|
||||
{ id: 'hackerman', name: 'Hackerman', family: 'Hackerman', applyDarkClass: true },
|
||||
{ id: 'kanagawa', name: 'Kanagawa', family: 'Kanagawa', applyDarkClass: true },
|
||||
{ id: 'last-horizon', name: 'Last Horizon', family: 'Last Horizon', applyDarkClass: true },
|
||||
{ id: 'lumon', name: 'Lumon', family: 'Lumon', applyDarkClass: true },
|
||||
{ id: 'lupine', name: 'Lupine', family: 'Lupine', applyDarkClass: false },
|
||||
{ id: 'matte-black', name: 'Matte Black', family: 'Matte Black', applyDarkClass: true },
|
||||
{ id: 'miasma', name: 'Miasma', family: 'Miasma', applyDarkClass: true },
|
||||
{ id: 'nord', name: 'Nord', family: 'Nord', applyDarkClass: true },
|
||||
{ id: 'osaka-jade', name: 'Osaka Jade', family: 'Osaka Jade', applyDarkClass: true },
|
||||
{ id: 'retro-82', name: 'Retro 82', family: 'Retro 82', applyDarkClass: true },
|
||||
{ id: 'ristretto', name: 'Ristretto', family: 'Ristretto', applyDarkClass: true },
|
||||
{ id: 'rose-pine', name: 'Rosé Pine', family: 'Rosé Pine', applyDarkClass: true },
|
||||
{ id: 'rose-pine', name: 'Rosé Pine', family: 'Rosé Pine', applyDarkClass: false },
|
||||
{ id: 'solitude', name: 'Solitude', family: 'Solitude', applyDarkClass: true },
|
||||
{ id: 'tokyo-night', name: 'Tokyo Night', family: 'Tokyo Night', applyDarkClass: true },
|
||||
{ id: 'vantablack', name: 'Vantablack', family: 'Vantablack', applyDarkClass: true },
|
||||
{ id: 'white', name: 'White', family: 'White', applyDarkClass: false },
|
||||
/* GENERATED THEMES — end */
|
||||
] as const;
|
||||
|
||||
/** What the app wears when nobody has chosen — its appearance before this refactor. */
|
||||
|
||||
Reference in New Issue
Block a user