298135459a15
light theme v3 — warm toasted linen palette (bg-base #C9A882, hsl 29 28% 77%); update all surface, text, border, btn tokens in vars.css and popup.css glass + override blocks; ghost-opacity 0.11; all three builds clean
- time
- 2026-05-18 05:55 UTC · 5 months ago
- machine
- koh2
- parent
- d012f0061108
↓ peach-browser-29813545.tar.gzatlas at this save
files changed2 files
src/popup/styles/popup.css+13 −13src/popup/styles/vars.css+16 −15src/popup/styles/popup.css+13 −13
@@ -3519,7 +3519,7 @@35193519 35203520 .light .peach-glass,35213521 [data-theme="light"] .peach-glass {3522- background: rgba(205, 191, 164, 0.70);3522+ background: rgba(201, 168, 130, 0.70);35233523 border: 1px solid rgba(26, 18, 8, 0.10);35243524 backdrop-filter: blur(12px) saturate(1.2);35253525 -webkit-backdrop-filter: blur(12px) saturate(1.2);@@ -3528,7 +3528,7 @@35283528 @supports not (backdrop-filter: blur(1px)) {35293529 .light .peach-glass,35303530 [data-theme="light"] .peach-glass {3531- background: rgba(205, 191, 164, 0.95);3531+ background: rgba(201, 168, 130, 0.95);35323532 border: 1px solid rgba(26, 18, 8, 0.12);35333533 }35343534 }@@ -3545,7 +3545,7 @@35453545 35463546 .light .peach-lock-panel.peach-glass,35473547 [data-theme="light"] .peach-lock-panel.peach-glass {3548- background: rgba(200, 185, 154, 0.78);3548+ background: rgba(188, 155, 114, 0.78);35493549 border: 1px solid rgba(26, 18, 8, 0.12);35503550 box-shadow:35513551 inset 0 1px 0 rgba(255, 255, 255, 0.4),@@ -3561,7 +3561,7 @@35613561 }35623562 .light .peach-lock-panel.peach-glass,35633563 [data-theme="light"] .peach-lock-panel.peach-glass {3564- background: rgba(200, 185, 154, 0.97);3564+ background: rgba(188, 155, 114, 0.97);35653565 }35663566 }35673567 @@ -8672,14 +8672,14 @@86728672 Tokens that cannot be expressed as variable substitutions — hardcoded86738673 context-specific values that need separate light-mode rules. */86748674 8675-/* Settings section headers: use text-label (#5C4C38) for more presence8675+/* Settings section headers: use text-label (#5C4228) for more presence86768676 than --t2 alone — gives ENTRIES / MAINTENANCE / DATA / VAULT HISTORY86778677 the dark anchor they need against the warmer background. */86788678 .light .peach-settings-sub-label,86798679 [data-theme="light"] .peach-settings-sub-label,86808680 .light .peach-settings-nav-label,86818681 [data-theme="light"] .peach-settings-nav-label {8682- color: #5C4C38;8682+ color: #5C4228;86838683 }86848684 86858685 /* Secondary action buttons (ghost / subtle): filled with the sunken surface@@ -8687,27 +8687,27 @@86878687 rather than floating. Values track --s3 (bg-sunken) and border-default. */86888688 .light .peach-btn--ghost,86898689 [data-theme="light"] .peach-btn--ghost {8690- background: #DED8CE;8691- border-color: #B4A898;8690+ background: #BC9B72;8691+ border-color: #96724C;86928692 color: #1A1208;86938693 }86948694 .light .peach-btn--subtle,86958695 [data-theme="light"] .peach-btn--subtle {8696- background: #DED8CE;8697- border-color: #B4A898;8696+ background: #BC9B72;8697+ border-color: #96724C;86988698 }86998699 87008700 /* Wide secondary action button on the lock screen — override the87018701 hardcoded dark-mode rgba values with warm-surface equivalents. */87028702 .light .peach-lock-secondary,87038703 [data-theme="light"] .peach-lock-secondary {8704- background: #DED8CE;8705- border-color: #B4A898;8704+ background: #BC9B72;8705+ border-color: #96724C;87068706 color: #1A1208;87078707 }87088708 .light .peach-lock-secondary:hover,87098709 [data-theme="light"] .peach-lock-secondary:hover {8710- background: #E4DED5;8710+ background: #C3A27A;87118711 }87128712 87138713 /* Entry row hover: replace the near-invisible light-on-light rgba value. */src/popup/styles/vars.css+16 −15
@@ -162,30 +162,31 @@162162 }163163 164164 .light {165- /* v2: cool linen surfaces — hsl(30°, 10–12%, 84–92%)166- Lower saturation than v1; neutral enough for peach accent to read warm by contrast. */167- --bg: #E8E2D9;168- --s1: #EDE8E0;169- --s2: #F0EBE4;170- --s3: #DED8CE;165+ /* v3: warm toasted linen — hsl(29°, 26–28%, 72–84%)166+ User-selected base: hsl(29, 28%, 77%). Elevated surfaces step +4–7%,167+ sunken surfaces step −5%. Peach accent reads vibrant against this base. */168+ --bg: #C9A882;169+ --s1: #D2B48C;170+ --s2: #D9BF98;171+ --s3: #BC9B72;171172 --bg-1: var(--s1);172173 --bg-2: var(--s2);173174 --bg-3: var(--s3);174175 --t0: #1A1208;175- --t1: #3D2E18;176- --t2: #6B5A42;177- --t3: #C8C0B4;176+ --t1: #2E2010;177+ --t2: #6B4E30;178+ --t3: rgba(168, 132, 94, 0.4);178179 --t4: rgba(26, 18, 8, 0.06);179180 --surface-card: rgba(26, 18, 8, 0.03);180- --surface-elevated: rgba(237, 232, 224, 0.97);181- --shell-top-solid: rgba(232, 226, 217, 0.98);182- --shell-top-fade: rgba(237, 232, 224, 0.96);181+ --surface-elevated: rgba(210, 180, 140, 0.97);182+ --shell-top-solid: rgba(201, 168, 130, 0.98);183+ --shell-top-fade: rgba(210, 180, 140, 0.96);183184 --shell-accent-a: color-mix(in srgb, var(--peach-accent) 6%, transparent);184185 --shell-accent-b: color-mix(in srgb, var(--peach-accent) 3%, transparent);185- --copy-shadow: 0 2px 8px rgba(80, 56, 32, 0.12), 0 14px 48px rgba(80, 56, 32, 0.12), 0 0 0 1px rgba(26, 18, 8, 0.06);186+ --copy-shadow: 0 2px 8px rgba(80, 56, 32, 0.15), 0 14px 48px rgba(80, 56, 32, 0.15), 0 0 0 1px rgba(26, 18, 8, 0.06);186187 --peach-rune-idle: rgba(26, 18, 8, 0.16);187- /* lighter surfaces make the watermark more visible at the same opacity — step down slightly */188- --peach-ghost-opacity: 0.13;188+ /* darker base: watermark stays subtle at slightly lower opacity than v2 */189+ --peach-ghost-opacity: 0.11;189190 }190191 191192 /* ─── Text size scaling ────────────────────────────────────────────────