Skip to content

Commit 7c265e3

Browse files
alifarooq9alifarooq9
committed
feat(www): Updated early access form
1 parent b76a671 commit 7c265e3

File tree

6 files changed

+129
-56
lines changed

6 files changed

+129
-56
lines changed

‎apps/www/src/components/early-access-form.tsx renamed to ‎apps/www/src/app/(app)/_components/early-access-form.tsx

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ import { z } from "zod";
1313
import { zodResolver } from "@hookform/resolvers/zod";
1414
import { useForm } from "react-hook-form";
1515
import { useMutation } from "@tanstack/react-query";
16-
import { joinEarlyAccessAction } from "@/server/actions";
16+
import { joinEarlyAccessAction } from "@/server/actions/early-access";
1717
import { Icons } from "@/components/icons";
1818
import { toast } from "sonner";
1919

@@ -62,7 +62,7 @@ export function EarlyAccessForm() {
6262
<Form {...form}>
6363
<form
6464
onSubmit={form.handleSubmit(onSubmit)}
65-
className="w-full max-w-sm space-y-2"
65+
className="w-full space-y-2"
6666
>
6767
<FormField
6868
control={form.control}
@@ -72,7 +72,7 @@ export function EarlyAccessForm() {
7272
<FormControl>
7373
<Input
7474
placeholder="Name"
75-
className="bg-background"
75+
className="h-12 bg-background"
7676
{...field}
7777
/>
7878
</FormControl>
@@ -88,7 +88,7 @@ export function EarlyAccessForm() {
8888
<FormControl>
8989
<Input
9090
placeholder="Email"
91-
className="bg-background"
91+
className="h-12 bg-background"
9292
{...field}
9393
/>
9494
</FormControl>
@@ -100,7 +100,8 @@ export function EarlyAccessForm() {
100100
<Button
101101
disabled={isPending}
102102
type="submit"
103-
className="w-full gap-2"
103+
className="h-12 w-full gap-2"
104+
size="lg"
104105
>
105106
{isPending ? (
106107
<Icons.loader className="h-4 w-4" />

‎apps/www/src/app/(app)/_components/mobile-nav.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@ export function MobileNav() {
2323
className="flex sm:hidden"
2424
>
2525
<Icons.hamburger className="h-4 w-4" />
26+
<span className="sr-only">menu</span>
2627
</Button>
2728
</SheetTrigger>
2829
<SheetContent side="left" className="pr-0">

‎apps/www/src/app/(app)/page.tsx

Lines changed: 73 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -5,68 +5,92 @@ import { siteUrls } from "@/config/urls";
55
import { buttonVariants } from "@/components/ui/button";
66
import { Icons } from "@/components/icons";
77
import { HighlightTabs } from "@/app/(app)/_components/highlight-tabs";
8+
import { EarlyAccessForm } from "@/app/(app)/_components/early-access-form";
9+
import Balancer from "react-wrap-balancer";
10+
import { Background } from "@/components/background";
811

912
export default async function HomePage() {
1013
const repoStars = await getRepoStars();
1114

1215
return (
13-
<div className="container flex flex-col items-center justify-center gap-4 py-20">
14-
<Link
15-
href={siteUrls.twitter}
16-
className="flex items-center space-x-2 rounded-md bg-secondary px-3 py-2 text-sm hover:bg-secondary/80"
17-
>
18-
<span>🎉</span>
19-
<span className="font-medium">
20-
RapidLaunch is in development. Follow our progress on 𝕏
21-
(formally Twitter)
22-
</span>
23-
<ExternalLinkIcon className="h-4 w-4 flex-shrink-0" />
24-
</Link>
25-
<Balance
26-
as="h1"
27-
className="text-center font-heading text-3xl font-bold sm:text-4xl sm:leading-tight md:text-5xl md:leading-tight"
28-
>
29-
Rapidly launch your MVP with Beautiful Starterkits, Blocks, and
30-
more.
31-
</Balance>
32-
<Balance
33-
as="p"
34-
className="text-center text-muted-foreground sm:text-xl"
35-
>
36-
Elevate your development game with Rapidlaunch! Launch your apps
37-
faster with our SaaS starterkits, components, building guides,
38-
and more. Customizable. Open Source.
39-
</Balance>
40-
<div className="flex items-center gap-4">
41-
<Link
42-
href={siteUrls.docs}
43-
className={buttonVariants({
44-
className: "flex items-center gap-2",
45-
})}
46-
>
47-
Early Access
48-
</Link>
16+
<>
17+
<section className="container flex flex-col items-center justify-center gap-4 py-20">
4918
<Link
50-
href={siteUrls.github}
51-
className={buttonVariants({
52-
className: "flex items-center",
53-
variant: "outline",
54-
})}
19+
href={siteUrls.twitter}
20+
className="flex items-center space-x-2 rounded-md bg-secondary px-3 py-2 text-sm hover:bg-secondary/80"
5521
>
56-
<Icons.gitHub className="mr-2 h-4 w-4" />
57-
Github -
58-
<span className="ml-1 flex items-center font-normal text-muted-foreground">
59-
{repoStars}
22+
<span>🎉</span>
23+
<span className="font-medium">
24+
RapidLaunch is in development. Follow our progress on 𝕏
25+
(formally Twitter)
6026
</span>
27+
<ExternalLinkIcon className="h-4 w-4 flex-shrink-0" />
6128
</Link>
62-
</div>
29+
<Balance
30+
as="h1"
31+
className="text-center font-heading text-3xl font-bold sm:text-4xl sm:leading-tight md:text-5xl md:leading-tight"
32+
>
33+
Rapidly launch your MVP with Beautiful Starterkits, Blocks,
34+
and more.
35+
</Balance>
36+
<Balance
37+
as="p"
38+
className="text-center text-muted-foreground sm:text-xl"
39+
>
40+
Elevate your development game with Rapidlaunch! Launch your
41+
apps faster with our SaaS starterkits, components, building
42+
guides, and more. Customizable. Open Source.
43+
</Balance>
44+
<div className="flex items-center gap-4">
45+
<Link
46+
href={siteUrls.earlyAccess}
47+
className={buttonVariants({
48+
className: "flex items-center gap-2",
49+
})}
50+
>
51+
Early Access
52+
</Link>
53+
<Link
54+
href={siteUrls.github}
55+
className={buttonVariants({
56+
className: "flex items-center",
57+
variant: "outline",
58+
})}
59+
>
60+
<Icons.gitHub className="mr-2 h-4 w-4" />
61+
Github -
62+
<span className="ml-1 flex items-center font-normal text-muted-foreground">
63+
{repoStars}
64+
</span>
65+
</Link>
66+
</div>
67+
68+
<HighlightTabs className="mt-36" />
69+
</section>
6370

64-
<HighlightTabs className="mt-36" />
65-
</div>
71+
<section
72+
id="early-access"
73+
className="relative border-y border-border bg-muted/30 py-36"
74+
>
75+
<Background>
76+
<div className="container flex max-w-xl flex-col items-center space-y-8">
77+
<Balancer
78+
as="h2"
79+
className="w-full text-center font-heading text-4xl font-bold"
80+
>
81+
Join the Early Access List and get notified when we
82+
launch!
83+
</Balancer>
84+
85+
<EarlyAccessForm />
86+
</div>
87+
</Background>
88+
</section>
89+
</>
6690
);
6791
}
6892

69-
export async function getRepoStars() {
93+
async function getRepoStars() {
7094
const response = await fetch(
7195
"https://api.github.com/repos/afarooq-oss/rapidlaunch",
7296
{
@@ -82,7 +106,5 @@ export async function getRepoStars() {
82106
? Number((data as { stargazers_count?: string }).stargazers_count)
83107
: 0;
84108

85-
console.log(data);
86-
87109
return stars;
88110
}

‎apps/www/src/components/background.tsx

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
interface BackgroundProps {
2+
children: React.ReactNode;
3+
}
4+
5+
export function Background({ children }: BackgroundProps) {
6+
return (
7+
<>
8+
<div className="absolute left-0 top-0 -z-50 h-full w-full overflow-hidden">
9+
<div className="sticky left-0 top-0 h-full w-full overflow-hidden">
10+
<div className="absolute inset-0 z-[-1] bg-muted-foreground/40" />
11+
<div className="absolute left-[--x] top-[--y] z-[-1] h-56 w-56 -translate-x-1/2 -translate-y-1/2 rounded-full bg-gradient-radial from-muted-foreground/50 from-0% to-transparent to-90% blur-md" />
12+
<svg
13+
xmlns="http://www.w3.org/2000/svg"
14+
width="100%"
15+
height="100%"
16+
>
17+
<defs>
18+
<pattern
19+
id="dotted-pattern"
20+
width="16"
21+
height="16"
22+
patternUnits="userSpaceOnUse"
23+
>
24+
<circle cx="2" cy="2" r="1" fill="black" />
25+
</pattern>
26+
<mask id="dots-mask">
27+
<rect width="100%" height="100%" fill="white" />
28+
<rect
29+
width="100%"
30+
height="100%"
31+
fill="url(#dotted-pattern)"
32+
/>
33+
</mask>
34+
</defs>
35+
<rect
36+
width="100%"
37+
height="100%"
38+
fill="hsl(var(--background))"
39+
mask="url(#dots-mask)"
40+
/>
41+
</svg>
42+
</div>
43+
</div>
44+
45+
{children}
46+
</>
47+
);
48+
}

‎apps/www/src/config/urls.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,4 +6,5 @@ export const siteUrls = {
66
docs: "/docs",
77
twitter: "https://twitter.com/AliFarooqDev",
88
github: "/gh",
9+
earlyAccess: "/#early-access",
910
} as const;

‎apps/www/src/server/actions.ts renamed to ‎apps/www/src/server/actions/early-access.ts

File renamed without changes.

0 commit comments

Comments
 (0)