forked from 77media/video-flow
17 lines
1.1 KiB
TypeScript
17 lines
1.1 KiB
TypeScript
"use client";
|
|
|
|
import { VideoCreationForm } from '@/components/pages/create-video/CreateInput';
|
|
import { useDeviceType } from '@/hooks/useDeviceType';
|
|
export default function HomeBanner() {
|
|
const { isDesktop } = useDeviceType();
|
|
return (
|
|
<div data-alt="home-banner-wrapper" className="sticky top-0 z-50 w-full mx-auto p-0 overflow-hidden bg-gradient-to-b from-black/80 to-black/10 pt-14">
|
|
{/* Base content - always present under the banner */}
|
|
<h1 className='p-1 text-center text-2xl font-bold tracking-tight sm:text-3xl'>Your idea. A movie. In minutes.</h1>
|
|
<div className='mx-auto w-full max-w-[600px] px-3 py-4 text-center text-xs text-gray-400 sm:px-16 sm:text-sm'>Our AI turns sparks into full-blown stories — fast & free.</div>
|
|
<div data-alt="home-banner-base" className={`space-y-4 mx-auto w-full max-w-[900px] sm:px-16 relative pt-2 pb-12 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 ? 'px-24' : 'px-3'}`}>
|
|
<VideoCreationForm />
|
|
</div>
|
|
</div>
|
|
);
|
|
} |