lfg2025/kaiser-natron
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: crimson CTA accents, white surfaces, Zeitung font, diagonal dividers

Browse Source 
- Add --color-accent-fill (#cc0230) / -hover / -ink tokens; repoint all
  solid yellow "button" surfaces (Button accent, IconButton accent,
  language-selector active pill, Navbar cart CTA, Kaiserhacks chip,
  accent Badge) to crimson fill + white ink. Yellow --color-accent kept
  for functional text accents.
- Secondary button: transparent fill, white border, white text/icons,
  translucent-white hover (no longer mimics the primary default).
- Surfaces to pure white: --color-cream and --color-surface -> #ffffff
  (cream-toned logo follows via text-cream); theme-color -> #ffffff.
- Self-host Zeitung (Regular/Bold woff2, mirrored from production);
  point --font-sans/--font-serif at Zeitung; drop Google Fonts CDN.
- Remove yellow highlighting on hero/title emphasis and hero eyebrows
  (text-accent-soft -> text-cream, eyebrows -> text-cream/75).
- WaveDivider + homepage section dividers: straight diagonal (low-left,
  high-right) at double height for ~2x the right-to-left difference.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Dorian
2026-06-22 09:47:06 +01:00
parent 47ebd1ce6c
commit ab0f7da50d
82 changed files with 148 additions and 127 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
dist/assets/HomePage-B0-wRjmb.css vendored Normal file
View File

@@ -0,0 +1 @@
@property --hero-feather{syntax:"<percentage>";inherits:false;initial-value:12%}.brand-hero__svg--bg[data-v-6953d538]{--hero-feather:12%;-webkit-mask-image:linear-gradient(to right, transparent 0%, #000 var(--hero-feather), #000 calc(100% - var(--hero-feather)), transparent 100%);-webkit-mask-image:linear-gradient(to right, transparent 0%, #000 var(--hero-feather), #000 calc(100% - var(--hero-feather)), transparent 100%);mask-image:linear-gradient(to right, transparent 0%, #000 var(--hero-feather), #000 calc(100% - var(--hero-feather)), transparent 100%);transition:--hero-feather .7s 1.15s;display:block}.brand-hero.go .brand-hero__svg--bg[data-v-6953d538]{--hero-feather:0%}.brand-hero__svg--portrait[data-v-6953d538]{width:100%;height:auto;max-height:56svh;margin:0 auto;display:block}.left-m[data-v-6953d538],.right-m[data-v-6953d538]{fill:#b5d8b6}.mound-m[data-v-6953d538]{fill:#fff}.mound-finger[data-v-6953d538]{fill:#b5d8b6}.layer.left-m[data-v-6953d538],.layer.mound-finger[data-v-6953d538]{opacity:0;transition:transform .8s cubic-bezier(.22,.61,.36,1) .15s,opacity .6s .15s;transform:translate(-14%)}.layer.right-m[data-v-6953d538]{opacity:0;transition:transform .8s cubic-bezier(.22,.61,.36,1) .15s,opacity .6s .15s;transform:translate(14%)}.layer.mound-m[data-v-6953d538]{opacity:0;transition:opacity .55s .7s}.brand-hero__copy[data-v-6953d538]{opacity:0;transition:opacity .7s 1.15s}.brand-hero.go .layer.left-m[data-v-6953d538],.brand-hero.go .layer.right-m[data-v-6953d538],.brand-hero.go .layer.mound-finger[data-v-6953d538]{opacity:1;transform:none}.brand-hero.go .layer.mound-m[data-v-6953d538],.brand-hero.go .brand-hero__copy[data-v-6953d538]{opacity:1}@media (prefers-reduced-motion:reduce){.layer.left-m[data-v-6953d538],.layer.right-m[data-v-6953d538],.layer.mound-m[data-v-6953d538],.layer.mound-finger[data-v-6953d538],.brand-hero__copy[data-v-6953d538]{opacity:1!important;transition:none!important;transform:none!important}}