Adopt @lvl0/ui for palette, utilities, and font
Some checks failed
tests / ci (push) Has been cancelled

This commit is contained in:
myrmidex 2026-08-23 18:32:21 +02:00
parent 272f88fcec
commit 49fe4bf72d
3 changed files with 4 additions and 85 deletions

View file

@ -18,5 +18,8 @@
"@rollup/rollup-linux-x64-gnu": "4.9.5", "@rollup/rollup-linux-x64-gnu": "4.9.5",
"@tailwindcss/oxide-linux-x64-gnu": "^4.0.1", "@tailwindcss/oxide-linux-x64-gnu": "^4.0.1",
"lightningcss-linux-x64-gnu": "^1.29.1" "lightningcss-linux-x64-gnu": "^1.29.1"
},
"devDependencies": {
"@lvl0/ui": "git+ssh://git@forge.lvl0.xyz:2222/lvl0/ui.git#v0.1.0"
} }
} }

View file

@ -1,4 +1,5 @@
@import 'tailwindcss'; @import 'tailwindcss';
@import '@lvl0/ui';
@import '../../vendor/livewire/flux/dist/flux.css'; @import '../../vendor/livewire/flux/dist/flux.css';
@source '../views'; @source '../views';
@ -8,91 +9,6 @@
@custom-variant dark (&:where(.dark, .dark *)); @custom-variant dark (&:where(.dark, .dark *));
@theme {
/* lvl0 palette. Primary is the house red shared with incr and buckets;
bordeaux is the secondary, used for dividers and recessed chrome. */
--color-primary: oklch(63.7% 0.237 25.331);
--color-bordeaux: oklch(25.8% 0.092 26.042);
}
@font-face {
font-family: '7Segment';
/* Relative so Vite resolves and fingerprints it; an absolute /fonts path
404s against the dev server, which serves assets itself. */
src: url('../fonts/7segment.woff') format('woff');
font-weight: normal;
font-style: normal;
}
.font-digital {
font-family: '7Segment', monospace;
}
.glow-red {
box-shadow: 0 0 20px color-mix(in oklab, var(--color-primary) 40%, transparent);
transition: box-shadow 300ms ease;
}
.glow-red:hover {
box-shadow: 0 0 25px color-mix(in oklab, var(--color-primary) 60%, transparent);
}
.glow-red:focus,
.glow-red:focus-within {
box-shadow: 0 0 28px color-mix(in oklab, var(--color-primary) 70%, transparent);
}
.glow-red-text {
text-shadow:
0 0 12px color-mix(in oklab, var(--color-primary) 70%, transparent),
0 0 30px color-mix(in oklab, var(--color-primary) 40%, transparent);
}
/* Bordeaux itself is too dark to bloom against black, so the halo is emitted in
primary red at low alpha dim element, brighter glow, as CRT phosphor behaves. */
.glow-bordeaux {
box-shadow: 0 0 14px color-mix(in oklab, var(--color-primary) 35%, transparent);
transition: box-shadow 300ms ease;
}
.glow-bordeaux:hover {
box-shadow: 0 0 18px color-mix(in oklab, var(--color-primary) 50%, transparent);
}
.glow-bordeaux:focus,
.glow-bordeaux:focus-within {
box-shadow: 0 0 26px color-mix(in oklab, var(--color-primary) 65%, transparent);
}
/* Same bloom for a 1-2px rule, where a spread-based shadow has no box to hug. */
.glow-bordeaux-line {
box-shadow:
0 0 6px color-mix(in oklab, var(--color-primary) 45%, transparent),
0 0 14px color-mix(in oklab, var(--color-primary) 25%, transparent);
}
.scrollbar-red {
scrollbar-width: thin;
scrollbar-color: var(--color-bordeaux) transparent;
}
.scrollbar-red::-webkit-scrollbar {
width: 10px;
}
.scrollbar-red::-webkit-scrollbar-track {
background: transparent;
}
.scrollbar-red::-webkit-scrollbar-thumb {
background: var(--color-bordeaux);
border: 2px solid #000;
}
.scrollbar-red::-webkit-scrollbar-thumb:hover {
background: var(--color-red-900);
}
@theme { @theme {
--font-sans: 'Instrument Sans', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'; --font-sans: 'Instrument Sans', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';

Binary file not shown.