fix: align Button and Header with design guideline

- Secondary button hover: full espresso fill with white text
- Tertiary button: font-medium (500) and subtle hover background
- Primary button hover: exact 1px translateY
- Header: backdrop-blur 10px (was 4px) and z-index 100 (was 50)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
CCS Admin 2026-02-15 18:08:32 +00:00
parent f92601a1d4
commit 64a9efee61
2 changed files with 5 additions and 5 deletions

View file

@ -16,7 +16,7 @@ export function Header({ navigation, settings }: HeaderProps) {
const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false) const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false)
return ( return (
<header className="sticky top-0 z-50 bg-ivory/95 backdrop-blur-sm border-b border-warm-gray"> <header className="sticky top-0 z-[100] bg-ivory/95 backdrop-blur-[10px] border-b border-warm-gray">
<div className="container"> <div className="container">
<div className="flex items-center justify-between py-4"> <div className="flex items-center justify-between py-4">
{/* Logo */} {/* Logo */}

View file

@ -27,16 +27,16 @@ type ButtonProps = ButtonAsButton | ButtonAsLink
const variantStyles: Record<ButtonVariant, string> = { const variantStyles: Record<ButtonVariant, string> = {
primary: ` primary: `
bg-brass text-soft-white bg-brass text-soft-white
hover:bg-brass-hover hover:-translate-y-0.5 hover:shadow-md hover:bg-brass-hover hover:-translate-y-px hover:shadow-md
active:translate-y-0 active:translate-y-0
`, `,
secondary: ` secondary: `
bg-transparent text-espresso border-[1.5px] border-espresso bg-transparent text-espresso border-[1.5px] border-espresso
hover:bg-espresso/10 hover:border-espresso hover:bg-espresso hover:text-soft-white
`, `,
tertiary: ` tertiary: `
bg-transparent text-espresso bg-transparent text-espresso font-medium
hover:text-brass hover:bg-espresso/5 hover:text-brass
`, `,
} }