Skip to content

Commit d6b61c4

Browse files
dackers86dackers86
committed
fix(shadn): updated screen component styling
1 parent 2771504 commit d6b61c4

File tree

7 files changed

+77
-69
lines changed

7 files changed

+77
-69
lines changed

‎examples/shadcn/components.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@
1919
"hooks": "@/hooks"
2020
},
2121
"registries": {
22-
"@dev": "http://localhost:5177/{name}.json",
22+
"@dev": "http://localhost:5178/{name}.json",
2323
"@firebase-ui": "https://ui.firebase.com/{name}.json"
2424
}
2525
}

‎packages/shadcn/src/registry/email-link-auth-screen.tsx‎

Lines changed: 20 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
11
"use client";
22

3-
import { useUI, type EmailLinkAuthScreenProps } from "@firebase-ui/react";
43
import { getTranslation } from "@firebase-ui/core";
4+
import { useUI, type EmailLinkAuthScreenProps } from "@firebase-ui/react";
55

6-
import { EmailLinkAuthForm } from "@/registry/email-link-auth-form";
7-
import { Separator } from "@/components/ui/separator";
86
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
7+
import { Separator } from "@/components/ui/separator";
8+
import { EmailLinkAuthForm } from "@/registry/email-link-auth-form";
99

1010
export type { EmailLinkAuthScreenProps };
1111

@@ -16,20 +16,22 @@ export function EmailLinkAuthScreen({ children, ...props }: EmailLinkAuthScreenP
1616
const subtitleText = getTranslation(ui, "prompts", "signInToAccount");
1717

1818
return (
19-
<Card>
20-
<CardHeader>
21-
<CardTitle>{titleText}</CardTitle>
22-
<CardDescription>{subtitleText}</CardDescription>
23-
</CardHeader>
24-
<CardContent>
25-
<EmailLinkAuthForm {...props} />
26-
{children ? (
27-
<>
28-
<Separator>{getTranslation(ui, "messages", "dividerOr")}</Separator>
29-
<div className="space-y-2">{children}</div>
30-
</>
31-
) : null}
32-
</CardContent>
33-
</Card>
19+
<div className="max-w-md mx-auto">
20+
<Card>
21+
<CardHeader>
22+
<CardTitle>{titleText}</CardTitle>
23+
<CardDescription>{subtitleText}</CardDescription>
24+
</CardHeader>
25+
<CardContent>
26+
<EmailLinkAuthForm {...props} />
27+
{children ? (
28+
<>
29+
<Separator>{getTranslation(ui, "messages", "dividerOr")}</Separator>
30+
<div className="space-y-2">{children}</div>
31+
</>
32+
) : null}
33+
</CardContent>
34+
</Card>
35+
</div>
3436
);
3537
}

‎packages/shadcn/src/registry/forgot-password-auth-screen.tsx‎

Lines changed: 13 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
"use client";
22

3-
import { useUI, type ForgotPasswordAuthScreenProps } from "@firebase-ui/react";
43
import { getTranslation } from "@firebase-ui/core";
4+
import { useUI, type ForgotPasswordAuthScreenProps } from "@firebase-ui/react";
55

6-
import { ForgotPasswordAuthForm } from "@/registry/forgot-password-auth-form";
76
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
7+
import { ForgotPasswordAuthForm } from "@/registry/forgot-password-auth-form";
88

99
export type { ForgotPasswordAuthScreenProps };
1010

@@ -15,14 +15,16 @@ export function ForgotPasswordAuthScreen(props: ForgotPasswordAuthScreenProps) {
1515
const subtitleText = getTranslation(ui, "prompts", "enterEmailToReset");
1616

1717
return (
18-
<Card>
19-
<CardHeader>
20-
<CardTitle>{titleText}</CardTitle>
21-
<CardDescription>{subtitleText}</CardDescription>
22-
</CardHeader>
23-
<CardContent>
24-
<ForgotPasswordAuthForm {...props} />
25-
</CardContent>
26-
</Card>
18+
<div className="max-w-md mx-auto">
19+
<Card>
20+
<CardHeader>
21+
<CardTitle>{titleText}</CardTitle>
22+
<CardDescription>{subtitleText}</CardDescription>
23+
</CardHeader>
24+
<CardContent>
25+
<ForgotPasswordAuthForm {...props} />
26+
</CardContent>
27+
</Card>
28+
</div>
2729
);
2830
}

‎packages/shadcn/src/registry/sign-in-auth-screen.tsx‎

Lines changed: 20 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
11
"use client";
22

3-
import { useUI, type SignInAuthScreenProps } from "@firebase-ui/react";
43
import { getTranslation } from "@firebase-ui/core";
4+
import { useUI, type SignInAuthScreenProps } from "@firebase-ui/react";
55

6-
import { SignInAuthForm } from "@/registry/sign-in-auth-form";
7-
import { Separator } from "@/components/ui/separator";
86
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
7+
import { Separator } from "@/components/ui/separator";
8+
import { SignInAuthForm } from "@/registry/sign-in-auth-form";
99

1010
export type { SignInAuthScreenProps };
1111

@@ -16,20 +16,22 @@ export function SignInAuthScreen({ children, ...props }: SignInAuthScreenProps)
1616
const subtitleText = getTranslation(ui, "prompts", "signInToAccount");
1717

1818
return (
19-
<Card>
20-
<CardHeader>
21-
<CardTitle>{titleText}</CardTitle>
22-
<CardDescription>{subtitleText}</CardDescription>
23-
</CardHeader>
24-
<CardContent>
25-
<SignInAuthForm {...props} />
26-
{children ? (
27-
<>
28-
<Separator>{getTranslation(ui, "messages", "dividerOr")}</Separator>
29-
<div className="space-y-2">{children}</div>
30-
</>
31-
) : null}
32-
</CardContent>
33-
</Card>
19+
<div className="max-w-md mx-auto">
20+
<Card>
21+
<CardHeader>
22+
<CardTitle>{titleText}</CardTitle>
23+
<CardDescription>{subtitleText}</CardDescription>
24+
</CardHeader>
25+
<CardContent>
26+
<SignInAuthForm {...props} />
27+
{children ? (
28+
<>
29+
<Separator>{getTranslation(ui, "messages", "dividerOr")}</Separator>
30+
<div className="space-y-2">{children}</div>
31+
</>
32+
) : null}
33+
</CardContent>
34+
</Card>
35+
</div>
3436
);
3537
}

‎packages/shadcn/src/registry/sign-up-auth-screen.tsx‎

Lines changed: 20 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
11
"use client";
22

3-
import { useUI, type SignUpAuthScreenProps } from "@firebase-ui/react";
43
import { getTranslation } from "@firebase-ui/core";
4+
import { useUI, type SignUpAuthScreenProps } from "@firebase-ui/react";
55

6-
import { SignUpAuthForm } from "@/registry/sign-up-auth-form";
7-
import { Separator } from "@/components/ui/separator";
86
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
7+
import { Separator } from "@/components/ui/separator";
8+
import { SignUpAuthForm } from "@/registry/sign-up-auth-form";
99

1010
export type { SignUpAuthScreenProps };
1111

@@ -16,20 +16,22 @@ export function SignUpAuthScreen({ children, ...props }: SignUpAuthScreenProps)
1616
const subtitleText = getTranslation(ui, "prompts", "enterDetailsToCreate");
1717

1818
return (
19-
<Card>
20-
<CardHeader>
21-
<CardTitle>{titleText}</CardTitle>
22-
<CardDescription>{subtitleText}</CardDescription>
23-
</CardHeader>
24-
<CardContent>
25-
<SignUpAuthForm {...props} />
26-
{children ? (
27-
<>
28-
<Separator>{getTranslation(ui, "messages", "dividerOr")}</Separator>
29-
<div className="space-y-2">{children}</div>
30-
</>
31-
) : null}
32-
</CardContent>
33-
</Card>
19+
<div className="max-w-md mx-auto">
20+
<Card>
21+
<CardHeader>
22+
<CardTitle>{titleText}</CardTitle>
23+
<CardDescription>{subtitleText}</CardDescription>
24+
</CardHeader>
25+
<CardContent>
26+
<SignUpAuthForm {...props} />
27+
{children ? (
28+
<>
29+
<Separator>{getTranslation(ui, "messages", "dividerOr")}</Separator>
30+
<div className="space-y-2">{children}</div>
31+
</>
32+
) : null}
33+
</CardContent>
34+
</Card>
35+
</div>
3436
);
3537
}

‎packages/shadcn/vite.config.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1+
import tailwindcss from "@tailwindcss/vite";
2+
import react from "@vitejs/plugin-react";
13
import path from "path";
24
import { defineConfig } from "vite";
3-
import react from "@vitejs/plugin-react";
4-
import tailwindcss from "@tailwindcss/vite";
55
import { run } from "vite-plugin-run";
66

77
// https://vite.dev/config/

‎packages/styles/dist.css‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)