Rework color palette to sun yellow, forest green, nut brown
Client requested a sunflower-themed palette: forest green stays for links/nav, nut brown for the secondary reorder button, and a new sun yellow becomes the primary CTA color (with dark ink text for contrast). Neutrals and status pills retuned to match, with a darker companion palette for prefers-color-scheme: dark. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
+32
-28
@@ -1,35 +1,39 @@
|
||||
:root {
|
||||
--paper: #EDE7DA;
|
||||
--paper-raised: #F5F0E5;
|
||||
--ink: #2A241D;
|
||||
--ink-soft: #5C5647;
|
||||
--sage: #4E5C40;
|
||||
--sage-soft: #6D7A5C;
|
||||
--clay: #9C5A3C;
|
||||
--line: #D6CCB8;
|
||||
--ok: #4C7A52;
|
||||
--ok-bg: #E3ECDE;
|
||||
--low: #A97423;
|
||||
--low-bg: #F1E6CD;
|
||||
--out: #A24A3E;
|
||||
--out-bg: #F0DFD8;
|
||||
--paper: #F1EAD9;
|
||||
--paper-raised: #F8F2E5;
|
||||
--ink: #2B2015;
|
||||
--ink-soft: #5E5040;
|
||||
--sage: #2F5D34;
|
||||
--sage-soft: #4F7A46;
|
||||
--clay: #7A4A28;
|
||||
--sun: #E7A62E;
|
||||
--sun-ink: #2E2008;
|
||||
--line: #DDCFB0;
|
||||
--ok: #2F5D34;
|
||||
--ok-bg: #E0EAD9;
|
||||
--low: #B4790C;
|
||||
--low-bg: #F6E8C4;
|
||||
--out: #9C4530;
|
||||
--out-bg: #F0DED2;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--paper: #1D1B16;
|
||||
--paper-raised: #26241D;
|
||||
--ink: #ECE5D6;
|
||||
--ink-soft: #B7AF9C;
|
||||
--sage: #93AC7E;
|
||||
--sage-soft: #7C9169;
|
||||
--clay: #D08F65;
|
||||
--line: #3B3728;
|
||||
--paper: #1B160E;
|
||||
--paper-raised: #241E14;
|
||||
--ink: #ECE2CB;
|
||||
--ink-soft: #B7A88A;
|
||||
--sage: #7EAE6C;
|
||||
--sage-soft: #669157;
|
||||
--clay: #A8672E;
|
||||
--sun: #D9A73A;
|
||||
--sun-ink: #241905;
|
||||
--line: #3A2E1B;
|
||||
--ok: #8FBB8C;
|
||||
--ok-bg: #263626;
|
||||
--low: #D9A94B;
|
||||
--ok-bg: #253524;
|
||||
--low: #E0B23E;
|
||||
--low-bg: #3A3020;
|
||||
--out: #D98C7E;
|
||||
--out: #D98567;
|
||||
--out-bg: #3A2620;
|
||||
}
|
||||
}
|
||||
@@ -116,8 +120,8 @@ main {
|
||||
|
||||
.hero .cta {
|
||||
display: inline-block;
|
||||
background: var(--sage);
|
||||
color: #fff;
|
||||
background: var(--sun);
|
||||
color: var(--sun-ink);
|
||||
padding: 0.7rem 1.4rem;
|
||||
border-radius: 4px;
|
||||
text-decoration: none;
|
||||
@@ -177,7 +181,7 @@ main {
|
||||
font-size: 0.9rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
.buy-btn.enabled { background: var(--sage); color: #fff; }
|
||||
.buy-btn.enabled { background: var(--sun); color: var(--sun-ink); }
|
||||
.buy-btn.disabled { background: transparent; border: 1px solid var(--line); color: var(--ink-soft); cursor: default; pointer-events: none; }
|
||||
|
||||
.low-note { font-size: 0.8rem; color: var(--low); margin: 0; }
|
||||
|
||||
Reference in New Issue
Block a user