兼容H5 Banner

This commit is contained in:
北枳 2025-10-21 23:08:24 +08:00
parent a93e08cd02
commit 9bea0715f3

View File

@ -183,23 +183,23 @@ export default function HomeBanner() {
<div data-alt="background-overlay" className="absolute inset-0 bg-black/40" /> <div data-alt="background-overlay" className="absolute inset-0 bg-black/40" />
</div> </div>
) : null} ) : null}
{/* Dismiss button */}
<div className={`absolute z-10 ${isDesktop ? 'right-4 top-4' : 'right-0 top-0'}`}>
<button
data-alt="banner-dismiss"
type="button"
onClick={handleDismiss}
className="text-white hover:bg-white/20 rounded-full p-2"
aria-label="Dismiss banner"
>
<ChevronUp className="h-5 w-5" />
</button>
</div>
<div <div
data-alt="banner-content" data-alt="banner-content"
className="relative flex flex-col items-center gap-4 text-center md:items-start md:text-left" className="relative flex flex-col items-center gap-4 text-center md:items-start md:text-left"
> >
{/* Dismiss button */}
<div className="absolute right-0 top-0">
<button
data-alt="banner-dismiss"
type="button"
onClick={handleDismiss}
className="text-white hover:bg-white/20 rounded-full p-2"
aria-label="Dismiss banner"
>
<ChevronUp className="h-5 w-5" />
</button>
</div>
{eyebrow ? ( {eyebrow ? (
<span data-alt="banner-eyebrow" className="text-xs font-semibold uppercase tracking-[0.3em] text-white/70"> <span data-alt="banner-eyebrow" className="text-xs font-semibold uppercase tracking-[0.3em] text-white/70">
{eyebrow} {eyebrow}
@ -210,10 +210,10 @@ export default function HomeBanner() {
{title} {title}
</h1> </h1>
) : null} ) : null}
{subtitle ? ( {(subtitle && isDesktop) ? (
<p data-alt="banner-subtitle" className="text-lg text-white/80 md:text-xl">{subtitle}</p> <p data-alt="banner-subtitle" className="text-lg text-white/80 md:text-xl">{subtitle}</p>
) : null} ) : null}
{description ? ( {(description && isDesktop) ? (
<p data-alt="banner-description" className="max-w-2xl text-base text-white/70">{description}</p> <p data-alt="banner-description" className="max-w-2xl text-base text-white/70">{description}</p>
) : null} ) : null}
{ctaLabel ? ( {ctaLabel ? (
@ -245,7 +245,7 @@ export default function HomeBanner() {
</section> </section>
{/* Base content - always present under the banner */} {/* Base content - always present under the banner */}
<div data-alt="home-banner-base" className={`relative p-6 px-12 min-h-[300px] flex items-center justify-center bg-[radial-gradient(ellipse_at_center,rgba(106,244,249,0.28)_0%,rgba(106,244,249,0.14)_35%,transparent_70%)] ${isDesktop ? '' : '!p-0'}`}> <div data-alt="home-banner-base" className={`relative p-6 px-12 flex items-center justify-center bg-[radial-gradient(ellipse_at_center,rgba(106,244,249,0.28)_0%,rgba(106,244,249,0.14)_35%,transparent_70%)] ${isDesktop ? 'min-h-[300px]' : 'min-h-[200px] !p-0'}`}>
<VideoCreationForm /> <VideoCreationForm />
</div> </div>
</div> </div>