RomanNum3ral
/
OpenCut
mirror of https://github.com/OpenCut-app/OpenCut.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

add waitlist count back

This commit is contained in:
Maze Winther 2025-07-16 15:30:19 +02:00
parent 1e01364740
commit 9530058b97
1 changed files with 40 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

47
apps/web/src/components/landing/hero.tsx
View File

@ -84,7 +84,9 @@ export function Hero() {
});
} else {
toast.error("Oops!", {
description: (data as { error: string }).error || "Something went wrong. Please try again.",
description:
(data as { error: string }).error ||
"Something went wrong. Please try again.",
});
}
} catch (error) {
@ -98,7 +100,13 @@ export function Hero() {
return (
<div className="min-h-[calc(100vh-4.5rem)] supports-[height:100dvh]:min-h-[calc(100dvh-4.5rem)] flex flex-col justify-between items-center text-center px-4">
<Image className="absolute top-0 left-0 -z-50 size-full object-cover" src="/landing-page-bg.png" height={1903.5} width={1269} alt="landing-page.bg" />
<Image
className="absolute top-0 left-0 -z-50 size-full object-cover"
src="/landing-page-bg.png"
height={1903.5}
width={1269}
alt="landing-page.bg"
/>
<motion.div
initial={{ opacity: 0 }}
animate={{ opacity: 1 }}
@ -121,11 +129,20 @@ export function Hero() {
animate={{ opacity: 1 }}
transition={{ delay: 0.4, duration: 0.8 }}
>
A simple but powerful video editor that gets the job done. Works on any platform.
A simple but powerful video editor that gets the job done. Works on
any platform.
</motion.p>
<motion.div className="mt-12 flex gap-8 justify-center" initial={{ opacity: 0 }} animate={{ opacity: 1 }} transition={{ delay: 0.6, duration: 0.8 }}>
<form onSubmit={handleSubmit} className="flex gap-3 w-full max-w-lg flex-col sm:flex-row">
<motion.div
className="mt-12 flex gap-8 justify-center"
initial={{ opacity: 0 }}
animate={{ opacity: 1 }}
transition={{ delay: 0.6, duration: 0.8 }}
>
<form
onSubmit={handleSubmit}
className="flex gap-3 w-full max-w-lg flex-col sm:flex-row"
>
<div className="relative w-full">
<Input
type="email"
@ -137,12 +154,28 @@ export function Hero() {
required
/>
</div>
<Button type="submit" size="lg" className="px-6 h-11 text-base !bg-foreground" disabled={isSubmitting || !csrfToken}>
<span className="relative z-10">{isSubmitting ? "Joining..." : "Join waitlist"}</span>
<Button
type="submit"
size="lg"
className="px-6 h-11 text-base !bg-foreground"
disabled={isSubmitting || !csrfToken}
>
<span className="relative z-10">
{isSubmitting ? "Joining..." : "Join waitlist"}
</span>
<ArrowRight className="relative z-10 ml-0.5 h-4 w-4 inline-block" />
</Button>
</form>
</motion.div>
<motion.div
initial={{ opacity: 0, y: 10 }}
animate={{ opacity: 1, y: 0 }}
transition={{ delay: 0.8, duration: 0.6 }}
className="mt-8 inline-flex items-center gap-2 text-sm text-muted-foreground justify-center"
>
<div className="w-2 h-2 bg-green-500 rounded-full animate-pulse" />
<span>50k+ people already joined</span>
</motion.div>
</motion.div>
</div>
);