feat: improve hero section layout and styling

- Restructured hero component HTML to separate image and content sections for better organization
- Adjusted background image container positioning from absolute to relative for proper content flow
- Modified paper background opacity handling by removing opacity-50 class and simplifying structure
- Updated text container layout to improve visual hierarchy with the background image
This commit is contained in:
2025-10-24 04:54:08 +02:00
parent 1030e0150a
commit 0b914b916c

View File

@@ -33,11 +33,12 @@ export function Hero() {
height={200} height={200}
className="relative z-10 -mt-14 w-full h-auto" className="relative z-10 -mt-14 w-full h-auto"
/> />
</div>
<div className="relative">
<div <div
className="absolute inset-0 bg-cover bg-center opacity-50" className="bg-cover bg-center"
style={{ backgroundImage: 'url(/images/paper.jpg)' }} style={{ backgroundImage: 'url(/images/paper.jpg)' }}
/> >
<div className="relative bg-transparent">
<div className="px-6 py-24 sm:py-32 lg:px-8"> <div className="px-6 py-24 sm:py-32 lg:px-8">
<div className="mx-auto max-w-2xl text-left"> <div className="mx-auto max-w-2xl text-left">
<p className="font-script text-2xl text-love-red mb-2 font-typewriter">Mon cher,</p> <p className="font-script text-2xl text-love-red mb-2 font-typewriter">Mon cher,</p>