x
This commit is contained in:
1 parent
c7c08d7d64
commit
a39f5b8102
2 files changed
+26
-21
No files matched your search
@@ -109,8 +109,8 @@ function HeroSection({ payload, lang }: { payload: Record<string, unknown>, lang
|
||||
const focalPoint = typeof payload.focalPoint === 'object' && payload.focalPoint ? (payload.focalPoint as { x: string, y: string }) : undefined
|
||||
|
||||
return (
|
||||
<section className="relative w-full flex flex-col md:block md:h-[90vh] md:aspect-[21/9] bg-surface-page overflow-hidden">
|
||||
<div className="relative w-full h-[50vh] min-h-[400px] md:absolute md:inset-0 md:h-full">
|
||||
<section className="relative w-full min-h-[85vh] sm:min-h-[90vh] md:h-[90vh] md:aspect-[21/9] flex items-center justify-center bg-night-950 overflow-hidden">
|
||||
<div className="absolute inset-0 w-full h-full z-0">
|
||||
<Image
|
||||
src={imageUrl}
|
||||
alt={title || ''}
|
||||
@@ -119,34 +119,35 @@ function HeroSection({ payload, lang }: { payload: Record<string, unknown>, lang
|
||||
className="object-cover md:scale-[1.02]"
|
||||
style={{ objectPosition: focalPoint ? `${focalPoint.x} ${focalPoint.y}` : undefined }}
|
||||
/>
|
||||
<div className="absolute inset-0 bg-gradient-to-t from-black/85 via-black/45 to-black/30 md:bg-black/35" />
|
||||
</div>
|
||||
<div className="relative z-10 mx-auto py-12 w-full max-w-4xl space-y-6 px-8 text-center md:py-0 md:h-full md:flex md:flex-col md:justify-center md:items-center">
|
||||
<div className="relative z-10 mx-auto py-16 px-6 sm:px-8 w-full max-w-4xl space-y-6 text-center flex flex-col justify-center items-center">
|
||||
<div className="space-y-6">
|
||||
{tagline && (
|
||||
<p className="text-xs font-semibold uppercase tracking-[0.3em] text-[#EAEFEA] drop-shadow-md md:text-sm">
|
||||
{tagline}
|
||||
</p>
|
||||
)}
|
||||
<h1 className="ui-hero-title">
|
||||
<h1 className="ui-hero-title !text-white drop-shadow-lg">
|
||||
{renderAccentTitle(title || '', 'ui-accent-text font-medium')}
|
||||
</h1>
|
||||
{description && (
|
||||
<p className="ui-hero-copy">
|
||||
<p className="ui-hero-copy !text-white/90 drop-shadow-md">
|
||||
{description}
|
||||
</p>
|
||||
)}
|
||||
<div className="flex flex-col items-center justify-center gap-6 sm:flex-row">
|
||||
<div className="flex flex-col items-center justify-center gap-4 sm:gap-6 sm:flex-row pt-2">
|
||||
<Link
|
||||
href={buttonLink}
|
||||
className="ui-hero-button"
|
||||
className="ui-hero-button shadow-lg shadow-black/30"
|
||||
>
|
||||
{buttonText || 'Explore Collection'}
|
||||
</Link>
|
||||
<a
|
||||
href="#categories"
|
||||
className="ui-hero-link group"
|
||||
className="ui-hero-link group !text-white flex items-center gap-1.5 drop-shadow-md"
|
||||
>
|
||||
{t('dynamic.heroLearnMore', { lng: resolvedLang })}
|
||||
<span>{t('dynamic.heroLearnMore', { lng: resolvedLang })}</span>
|
||||
<span className="transition-transform group-hover:translate-x-1">→</span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
Reference in new issue
Block a user