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

feat(home/hero): gradient tagline, brighter photo, tighter mobile spacing

Browse source 
- Gold left-to-right gradient on the tagline (clip-to-text), kept to one
  line; smaller with tighter tracking on mobile, full size on desktop.
- Remove the dark gradient wash over the hero landscape so the photo
  reads brighter.
- Mobile hero is content-height with top/bottom padding (no forced full
  screen) so there's no dead band below the stag; desktop stays a
  centered full-screen hero with breathing room under the navbar.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Padreug 2026-06-14 18:19:11 +02:00
commit 43b83d28dc
1 changed files with 3 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

9
src/views/HomeView.vue
View file

@ -59,16 +59,13 @@ const featuredEvents = [
<!-- Hero: full-viewport, transparent over the pinned backdrop. Content is <!-- Hero: full-viewport, transparent over the pinned backdrop. Content is
anchored near the top on mobile (avoids a tall dead band under the anchored near the top on mobile (avoids a tall dead band under the
header) and vertically centered from lg up. --> header) and vertically centered from lg up. -->
<section class="relative isolate flex min-h-screen flex-col items-center justify-start overflow-hidden pt-12 sm:pt-16 lg:justify-center lg:pt-0"> <section class="relative isolate flex flex-col items-center justify-start overflow-hidden pt-12 pb-16 sm:pt-16 lg:min-h-screen lg:justify-center lg:pb-0 lg:pt-20">
<div
class="pointer-events-none absolute inset-0 -z-10 bg-gradient-to-b from-background/55 to-transparent"
></div>
<div <div
class="relative mx-auto flex max-w-7xl flex-col items-center px-4 text-center lg:px-6" class="relative mx-auto flex max-w-7xl flex-col items-center px-4 text-center lg:px-6"
> >
<p <p
class="font-display text-xl uppercase tracking-[0.25em] text-accent drop-shadow-[0_1px_4px_rgba(0,0,0,0.85)] md:text-3xl lg:text-4xl" class="whitespace-nowrap bg-clip-text font-display text-[clamp(0.62rem,2.4vw,1.875rem)] uppercase tracking-[0.12em] text-transparent drop-shadow-[0_1px_4px_rgba(0,0,0,0.85)] sm:tracking-[0.2em]"
style="background-image: linear-gradient(to right, #b99f2c, #855c16)"
> >
{{ t('common.tagline') }} {{ t('common.tagline') }}
</p> </p>