feat(theme): Workshop — Dark, the Moi dark material
Moi DESIGN.md dark column: paper #12110f, surface #1c1a17, stone #26221c, warm ink #ebe6dc, pale pine #7eb89a. Same serif type and radii as the light Workshop theme. Verified rendering live via computed styles (body rgb(18,17,15), cards rgb(28,26,23), pine #7eb89a).
This commit is contained in:
parent
17fd47c081
commit
c18f59ad6c
4 changed files with 51 additions and 3 deletions
|
|
@ -1,5 +1,13 @@
|
|||
export type Theme =
|
||||
'light' | 'dark' | 'glass' | 'neon' | 'impeccable' | 'impeccable-dark' | 'cosmic' | 'workshop';
|
||||
| 'light'
|
||||
| 'dark'
|
||||
| 'glass'
|
||||
| 'neon'
|
||||
| 'impeccable'
|
||||
| 'impeccable-dark'
|
||||
| 'cosmic'
|
||||
| 'workshop'
|
||||
| 'workshop-dark';
|
||||
|
||||
/** Active signer mode. */
|
||||
export type SignerMode = 'embedded' | 'nip46_bunker' | 'nip46_client';
|
||||
|
|
|
|||
|
|
@ -110,6 +110,7 @@ export function SettingsScreen() {
|
|||
<option value="impeccable-dark">Impeccable — Dark</option>
|
||||
<option value="cosmic">Cosmic — Stardust</option>
|
||||
<option value="workshop">Workshop — Cybernetic</option>
|
||||
<option value="workshop-dark">Workshop — Dark</option>
|
||||
</select>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
|
|
|
|||
|
|
@ -605,7 +605,9 @@ html[data-theme='cosmic'] .empty-state {
|
|||
/* Workshop type: Iowan/Palatino serif for display surfaces, everything
|
||||
else stays on the local system stack (Moi ships no webfonts). */
|
||||
html[data-theme='workshop'] h1,
|
||||
html[data-theme='workshop'] h2 {
|
||||
html[data-theme='workshop-dark'] h1,
|
||||
html[data-theme='workshop'] h2,
|
||||
html[data-theme='workshop-dark'] h2 {
|
||||
font-family: 'Iowan Old Style', Palatino, Georgia, serif;
|
||||
font-weight: 500;
|
||||
letter-spacing: -0.02em;
|
||||
|
|
@ -619,10 +621,42 @@ html[data-theme='workshop'] h2 {
|
|||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* Workshop dark material (Moi DESIGN.md palette, dark column): near-black
|
||||
paper, warm light ink, pale pine accent. Same type and radii. */
|
||||
:root[data-theme='workshop-dark'] {
|
||||
--bg: #12110f;
|
||||
--surface: #1c1a17;
|
||||
--surface-2: #26221c;
|
||||
--surface-hover: #221f1a;
|
||||
--border: #3a342c;
|
||||
--border-strong: #4d463c;
|
||||
--text: #ebe6dc;
|
||||
--text-muted: #a39b8f;
|
||||
--primary: #7eb89a;
|
||||
--primary-hover: #96d0b2;
|
||||
--primary-soft: #1c322a;
|
||||
--on-primary: #12110f;
|
||||
--danger: #d98a7d;
|
||||
--danger-soft: #35211d;
|
||||
--warning: #d4a574;
|
||||
--warning-soft: #322719;
|
||||
--success: #7eb89a;
|
||||
--success-soft: #1c322a;
|
||||
--info: #92b4cc;
|
||||
--info-soft: #1d2831;
|
||||
--focus: #7eb89a;
|
||||
--shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 8px 24px rgba(0, 0, 0, 0.35);
|
||||
--shadow-modal: 0 12px 40px rgba(0, 0, 0, 0.6);
|
||||
--radius: 14px;
|
||||
--radius-sm: 9px;
|
||||
}
|
||||
|
||||
/* One accent rule: pine carries focus and active states; copper marks
|
||||
index-like mono elements instead of a second saturated hue. */
|
||||
html[data-theme='workshop'] code,
|
||||
html[data-theme='workshop'] .mono {
|
||||
html[data-theme='workshop-dark'] code,
|
||||
html[data-theme='workshop'] .mono,
|
||||
html[data-theme='workshop-dark'] .mono {
|
||||
background: var(--surface-2);
|
||||
border: 1px solid var(--border);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -31,6 +31,10 @@ pub enum Theme {
|
|||
/// "Cybernetic Workshop" — the Moi portfolio look: warm paper, near-black
|
||||
/// ink, hairline borders, one pine accent, serif headings.
|
||||
Workshop,
|
||||
/// The Workshop dark material (Moi DESIGN.md: "a second material, not a
|
||||
/// personality change") — near-black paper, warm light ink, pale pine.
|
||||
#[serde(rename = "workshop-dark")]
|
||||
WorkshopDark,
|
||||
}
|
||||
|
||||
impl Theme {
|
||||
|
|
@ -45,6 +49,7 @@ impl Theme {
|
|||
"impeccable-dark" => Some(Self::ImpeccableDark),
|
||||
"cosmic" => Some(Self::Cosmic),
|
||||
"workshop" => Some(Self::Workshop),
|
||||
"workshop-dark" => Some(Self::WorkshopDark),
|
||||
_ => None,
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue