padreug/chateaudufaune.ariege.io
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat(header): frosted-glass nav with stronger backdrop blur

Browse source 
Drop the near-opaque background (bg-background/95) for a translucent
bg-background/65 + backdrop-blur-xl + backdrop-saturate-150 sandwich,
so the pinned hero landscape glows softly through the sticky nav.
Switch the bottom border to white/10 so the separation reads as
glass rather than a hard rule.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Padreug 2026-06-09 12:38:17 +02:00
commit b00b0b82b4
1 changed files with 1 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/components/SiteHeader.vue
View file

@ -94,7 +94,7 @@ onUnmounted(() => {
<template> <template>
<header <header
ref="headerEl" ref="headerEl"
class="sticky top-0 z-40 border-b border-border bg-background/95 backdrop-blur" class="sticky top-0 z-40 border-b border-white/10 bg-background/65 backdrop-blur-xl backdrop-saturate-150"
> >
<div class="mx-auto max-w-7xl px-4 lg:px-6"> <div class="mx-auto max-w-7xl px-4 lg:px-6">
<div class="flex h-16 items-center justify-between gap-4"> <div class="flex h-16 items-center justify-between gap-4">