Openstatus
www.openstatus.dev
fix: gap (#1122)
authored by
Maximilian Kaske
and committed by
GitHub
8fbdf0b9
c031757a
+22
-11
+1
-1
apps/web/src/app/page.tsx
+1
-1
apps/web/src/app/page.tsx
+2
-4
apps/web/src/app/play/checker/page.tsx
+2
-4
apps/web/src/app/play/checker/page.tsx
···
47
47
if (id && !data) return redirect("/play/checker");
48
48
49
49
return (
50
-
<div className="grid h-full w-full gap-12">
50
+
<div className="grid w-full gap-12">
51
51
<CheckerPlay data={data} />
52
52
<Testimonial />
53
53
<GlobalMonitoring />
54
-
<div className="mx-auto max-w-2xl lg:max-w-4xl">
55
-
<BottomCTA />
56
-
</div>
54
+
<BottomCTA className="mx-auto max-w-2xl lg:max-w-4xl" />
57
55
</div>
58
56
);
59
57
}
+1
-1
apps/web/src/components/layout/marketing-layout.tsx
+1
-1
apps/web/src/components/layout/marketing-layout.tsx
···
8
8
return (
9
9
<PlausibleProvider domain="openstatus.dev">
10
10
<SessionProvider>
11
-
<main className="flex min-h-screen w-full flex-col items-center justify-center gap-8 p-4 md:p-8">
11
+
<main className="flex min-h-screen w-full flex-col items-center justify-center gap-12 p-4 md:p-8">
12
12
<MarketingHeader className="mx-auto w-full max-w-4xl" />
13
13
<div className="mx-auto flex w-full max-w-4xl flex-1 flex-col items-start justify-center">
14
14
{children}
+1
-1
apps/web/src/components/layout/public-layout.tsx
+1
-1
apps/web/src/components/layout/public-layout.tsx
···
6
6
export function PublicLayout({ children }: { children: React.ReactNode }) {
7
7
return (
8
8
<SessionProvider>
9
-
<main className="flex min-h-screen w-full flex-col items-center justify-center gap-8 p-4 md:p-8">
9
+
<main className="flex min-h-screen w-full flex-col items-center justify-center gap-12 p-4 md:p-8">
10
10
<PublicHeader className="mx-auto w-full max-w-4xl" />
11
11
<div className="mx-auto flex w-full max-w-4xl flex-1 flex-col items-start justify-center">
12
12
{children}
+17
-4
apps/web/src/components/marketing/in-between-cta.tsx
+17
-4
apps/web/src/components/marketing/in-between-cta.tsx
···
1
1
import Link from "next/link";
2
2
3
+
import { cn } from "@/lib/utils";
3
4
import { Button } from "@openstatus/ui/src/components/button";
4
5
5
6
interface InBetweenCTAProps {
···
8
9
"primary" | "secondary",
9
10
{ label: string; href: string; target?: string }
10
11
>;
12
+
className?: string;
11
13
}
12
14
13
-
export function InBetweenCTA({ description, actions }: InBetweenCTAProps) {
15
+
export function InBetweenCTA({
16
+
description,
17
+
actions,
18
+
className,
19
+
}: InBetweenCTAProps) {
14
20
const { primary, secondary } = actions;
15
21
return (
16
-
<div className="my-8 flex flex-col items-center justify-between gap-6">
22
+
<div
23
+
className={cn(
24
+
"flex flex-col items-center justify-between gap-6",
25
+
className,
26
+
)}
27
+
>
17
28
<p className="max-w-lg text-center text-lg text-muted-foreground">
18
29
{description}
19
30
</p>
···
33
44
);
34
45
}
35
46
36
-
export function MiddleCTA() {
47
+
export function MiddleCTA(props: Pick<InBetweenCTAProps, "className">) {
37
48
return (
38
49
<InBetweenCTA
39
50
description="Sick of booking a demo to know more? Test your endpoint or check our public dashboard right away."
···
41
52
primary: { label: "Public Dashboard", href: "/public/monitors/1" },
42
53
secondary: { label: "Speed Checker", href: "/play/checker" },
43
54
}}
55
+
{...props}
44
56
/>
45
57
);
46
58
}
47
59
48
-
export function BottomCTA() {
60
+
export function BottomCTA(props: Pick<InBetweenCTAProps, "className">) {
49
61
return (
50
62
<InBetweenCTA
51
63
description="Learn how your services are performing over time, and notify your users of any issues."
···
53
65
primary: { label: "Start for Free", href: "/app/login" },
54
66
secondary: { label: "Schedule a Demo", href: "/cal", target: "_blank" },
55
67
}}
68
+
{...props}
56
69
/>
57
70
);
58
71
}