Skip to content

Commit 4c9c829

Browse files
committed
Improved layout
1 parent 14ba919 commit 4c9c829

2 files changed

Lines changed: 38 additions & 53 deletions

File tree

apps/webapp/app/routes/promo.tsx

Lines changed: 8 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import { LoginPageLayout } from "~/components/LoginPageLayout";
88
import { Button, LinkButton } from "~/components/primitives/Buttons";
99
import { Callout } from "~/components/primitives/Callout";
1010
import { Fieldset } from "~/components/primitives/Fieldset";
11-
import { Header1, Header2, Header3 } from "~/components/primitives/Headers";
11+
import { Header2 } from "~/components/primitives/Headers";
1212
import { Paragraph } from "~/components/primitives/Paragraph";
1313
import { TextLink } from "~/components/primitives/TextLink";
1414
import { isGithubAuthSupported, isGoogleAuthSupported } from "~/services/auth.server";
@@ -131,40 +131,11 @@ function SignInForm({
131131
);
132132
}
133133

134-
function PromoPanel({
135-
amountInCents,
136-
expiresAt,
137-
}: {
138-
amountInCents: number;
139-
expiresAt: string | null;
140-
}) {
141-
const expiry = formatExpiry(expiresAt);
142-
return (
143-
<div className="flex h-full flex-col items-center justify-center px-16">
144-
<Paragraph variant="small" className="uppercase tracking-wide text-text-dimmed">
145-
Promo applied
146-
</Paragraph>
147-
<Header3 className="mt-3 text-center text-5xl font-semibold text-text-bright">
148-
{formatDollars(amountInCents)} in free credits
149-
</Header3>
150-
<Paragraph className="mt-4 text-center text-text-dimmed">
151-
Added to your new Trigger.dev account when you sign up
152-
{expiry ? `, valid until ${expiry}` : ""}.
153-
</Paragraph>
154-
</div>
155-
);
156-
}
157-
158134
export default function PromoPage() {
159135
const data = useTypedLoaderData<typeof loader>();
160136

161-
const rightContent =
162-
data.view === "valid" ? (
163-
<PromoPanel amountInCents={data.amountInCents} expiresAt={data.expiresAt} />
164-
) : undefined;
165-
166137
return (
167-
<LoginPageLayout rightContent={rightContent}>
138+
<LoginPageLayout>
168139
<div className="flex w-full flex-col">
169140
{data.view === "signed_in" ? (
170141
<>
@@ -181,14 +152,15 @@ export default function PromoPage() {
181152
) : (
182153
<>
183154
<Header2 className="sm:text-2xl md:text-3xl lg:text-4xl" spacing>
184-
{data.view === "valid" ? "Claim your credits" : "Create your account"}
155+
{data.view === "valid" ? `Claim ${formatDollars(data.amountInCents)} credits` : "Create your account"}
185156
</Header2>
186-
<Paragraph variant="base" spacing>
187-
Create an account or login
157+
{data.view === "valid" ? (
158+
<Paragraph variant="base" spacing>
159+
These are only available for new accounts. The credits expire on {formatExpiry(data.expiresAt)}.
188160
</Paragraph>
189-
{data.view === "invalid" && (
161+
) : (
190162
<Callout variant="warning" className="mb-6 w-full">
191-
That promo code isn't valid. You can still sign up below credits just won't be
163+
That promo code isn't valid. You can still sign up below but credits won't be
192164
added.
193165
</Callout>
194166
)}

pnpm-lock.yaml

Lines changed: 30 additions & 17 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)