design: two-color palette — rename all tokens to --cream / --blue
Replace ochre-clay, carbon-black, burnt-oxide, slate-indigo with clean two-color system: --cream (#f4f0e8) and --blue (#041cf3). Update every component, utility class, and test assertion.
This commit is contained in:
@@ -37,7 +37,7 @@ export function SidebarNav({ items }: Props) {
|
||||
}
|
||||
|
||||
return (
|
||||
<nav className="fixed top-0 left-0 h-screen w-full lg:w-1/3 bg-ochre-clay brutal-border-right hidden lg:block overflow-y-auto z-50">
|
||||
<nav className="fixed top-0 left-0 h-screen w-full lg:w-1/3 bg-cream brutal-border-right hidden lg:block overflow-y-auto z-50">
|
||||
<div className="px-8 py-12 space-y-2">
|
||||
<div className="mb-12">
|
||||
<h2>Index</h2>
|
||||
@@ -51,9 +51,9 @@ export function SidebarNav({ items }: Props) {
|
||||
key={item.id}
|
||||
href={`/${item.id}`}
|
||||
className={cn(
|
||||
'block w-full text-left brutal-border bg-ochre-clay px-6 py-4 transition-all duration-300',
|
||||
'block w-full text-left brutal-border bg-cream px-6 py-4 transition-all duration-300',
|
||||
isActive(item)
|
||||
? 'shadow-[12px_12px_0_var(--carbon-black)] opacity-100 translate-x-0'
|
||||
? 'shadow-[12px_12px_0_var(--blue)] opacity-100 translate-x-0'
|
||||
: 'opacity-40 shadow-none hover:opacity-60',
|
||||
)}
|
||||
>
|
||||
|
||||
Reference in New Issue
Block a user