Skip to content

Commit 1071f1d

Browse files
izadoesdevizadoesdev
committed
cleanup: auth pages, colors, empty state on main page
1 parent 598e10b commit 1071f1d

File tree

10 files changed

+162
-193
lines changed

10 files changed

+162
-193
lines changed

‎apps/dashboard/app/(auth)/login/forgot/page.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,7 @@ export default function ForgotPasswordPage() {
6565
value={email}
6666
/>
6767
</div>
68-
<div className="rounded-lg border border-blue-100 bg-blue-50 p-3 text-blue-800 text-sm">
68+
<div className="rounded-lg border border-info/20 bg-info/5 p-3 text-info-foreground text-sm">
6969
Enter your email address and we'll send you a link to reset your
7070
password.
7171
</div>

‎apps/dashboard/app/(auth)/login/magic-sent/page.tsx‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -42,28 +42,28 @@ export default function MagicSentPage() {
4242
return (
4343
<div className="relative mx-auto mt-12 w-full max-w-md overflow-hidden rounded-xl border border-border bg-card p-6 shadow">
4444
<div className="mb-8 text-center">
45-
<div className="relative mb-5 inline-flex h-16 w-16 items-center justify-center rounded-full bg-blue-100 p-3">
46-
<div className="absolute inset-0 animate-pulse rounded-full bg-blue-50" />
47-
<div className="-inset-1 absolute rounded-full bg-gradient-to-tr from-blue-200 to-blue-100 opacity-70 blur-md" />
48-
<div className="relative rounded-full bg-gradient-to-tr from-blue-500 to-blue-400 p-2.5">
49-
<MailCheck className="h-8 w-8 text-white" />
45+
<div className="relative mb-5 inline-flex h-16 w-16 items-center justify-center rounded-full bg-info/10 p-3">
46+
<div className="absolute inset-0 animate-pulse rounded-full bg-info/5" />
47+
<div className="-inset-1 absolute rounded-full bg-gradient-to-tr from-info/20 to-info/10 opacity-70 blur-md" />
48+
<div className="relative rounded-full bg-gradient-to-tr from-info to-info/80 p-2.5">
49+
<MailCheck className="h-8 w-8 text-info-foreground" />
5050
</div>
5151
</div>
5252
<h1 className="font-bold text-2xl text-foreground">Check your email</h1>
5353
<p className="mt-2 text-muted-foreground">
5454
Magic link sent to{' '}
55-
<strong className="font-medium text-blue-600">{email}</strong>
55+
<strong className="font-medium text-info">{email}</strong>
5656
</p>
5757
</div>
5858
<div className="space-y-5 py-4">
59-
<div className="rounded-lg border border-blue-200 bg-blue-50 p-4 text-blue-800">
59+
<div className="rounded-lg border border-info/20 bg-info/5 p-4 text-info-foreground">
6060
<p className="text-sm">
6161
We've sent a magic link to <strong>{email}</strong>. Please check
6262
your inbox and click the link to sign in instantly.
6363
</p>
6464
</div>
6565
<Button
66-
className="w-full bg-blue-500 text-white hover:bg-blue-600"
66+
className="w-full bg-info text-info-foreground hover:bg-info/90"
6767
disabled={isLoading}
6868
onClick={handleResend}
6969
type="button"
@@ -79,7 +79,7 @@ export default function MagicSentPage() {
7979
</Button>
8080
<Link href="/login">
8181
<Button
82-
className="w-full border-blue-200 hover:bg-blue-50"
82+
className="w-full border-info/20 hover:bg-info/5"
8383
type="button"
8484
variant="outline"
8585
>

‎apps/dashboard/app/(auth)/login/magic/page.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -75,15 +75,15 @@ export default function MagicLinkPage() {
7575
value={email}
7676
/>
7777
</div>
78-
<div className="flex items-center gap-3 p-3 text-blue-800 text-sm">
78+
<div className="flex items-center gap-3 p-3 text-info-foreground text-sm">
7979
<Sparkles className="h-5 w-5 flex-shrink-0 text-foreground" />
8080
<p className="text-muted-foreground">
8181
We'll send a secure link to your email that will sign you in
8282
instantly — no password needed.
8383
</p>
8484
</div>
8585
<Button
86-
className="h-11 w-full bg-blue-500 text-white hover:bg-blue-600"
86+
className="h-11 w-full bg-info text-info-foreground hover:bg-info/90"
8787
disabled={isLoading}
8888
type="submit"
8989
>
@@ -101,7 +101,7 @@ export default function MagicLinkPage() {
101101
</Button>
102102
<Link className="block" href="/login">
103103
<Button
104-
className="h-11 w-full border-blue-200 hover:cursor-pointer hover:bg-blue-50"
104+
className="h-11 w-full border-info/20 hover:cursor-pointer hover:bg-info/5"
105105
type="button"
106106
variant="outline"
107107
>

‎apps/dashboard/app/(auth)/login/page.tsx‎

Lines changed: 28 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -27,34 +27,43 @@ function LoginPage() {
2727
const [showPassword, setShowPassword] = useState(false);
2828
const [lastUsed, setLastUsed] = useState<string | null>(null);
2929

30-
const defaultCallbackUrl = searchParams.get('callback') || '/websites';
30+
const callbackUrl = searchParams.get('callback') || '/websites';
3131

3232
useEffect(() => {
3333
setLastUsed(localStorage.getItem('lastUsedLogin'));
3434
}, []);
3535

36-
const handleSocialLogin = (provider: 'github' | 'google') => {
36+
const handleGoogleLogin = () => {
3737
setIsLoading(true);
38+
signIn.social({
39+
provider: 'google',
40+
callbackURL: callbackUrl,
41+
newUserCallbackURL: '/onboarding',
42+
fetchOptions: {
43+
onSuccess: () => {
44+
localStorage.setItem('lastUsedLogin', 'google');
45+
},
46+
onError: () => {
47+
setIsLoading(false);
48+
toast.error('Google login failed. Please try again.');
49+
},
50+
},
51+
});
52+
};
3853

39-
const callbackUrl = searchParams.get('callback');
40-
const finalCallbackUrl = callbackUrl || defaultCallbackUrl;
41-
54+
const handleGithubLogin = () => {
55+
setIsLoading(true);
4256
signIn.social({
43-
provider,
44-
callbackURL: finalCallbackUrl,
57+
provider: 'github',
58+
callbackURL: callbackUrl,
4559
newUserCallbackURL: '/onboarding',
4660
fetchOptions: {
4761
onSuccess: () => {
48-
localStorage.setItem('lastUsedLogin', provider);
49-
if (callbackUrl) {
50-
router.push(callbackUrl);
51-
}
62+
localStorage.setItem('lastUsedLogin', 'github');
5263
},
5364
onError: () => {
5465
setIsLoading(false);
55-
toast.error(
56-
`${provider === 'github' ? 'GitHub' : 'Google'} login failed. Please try again.`
57-
);
66+
toast.error('GitHub login failed. Please try again.');
5867
},
5968
},
6069
});
@@ -72,14 +81,10 @@ function LoginPage() {
7281
await signIn.email({
7382
email,
7483
password,
75-
callbackURL: defaultCallbackUrl,
84+
callbackURL: callbackUrl,
7685
fetchOptions: {
7786
onSuccess: () => {
7887
localStorage.setItem('lastUsedLogin', 'email');
79-
const callbackUrl = searchParams.get('callback');
80-
if (callbackUrl) {
81-
router.push(callbackUrl);
82-
}
8388
},
8489
onError: (error) => {
8590
setIsLoading(false);
@@ -120,7 +125,7 @@ function LoginPage() {
120125
<Button
121126
className="relative flex h-11 w-full cursor-pointer items-center justify-center transition-all duration-200 hover:bg-primary/5"
122127
disabled={isLoading}
123-
onClick={() => handleSocialLogin('github')}
128+
onClick={handleGithubLogin}
124129
type="button"
125130
variant="outline"
126131
>
@@ -135,7 +140,7 @@ function LoginPage() {
135140
<Button
136141
className="relative flex h-11 w-full cursor-pointer items-center justify-center transition-all duration-200 hover:bg-primary/5"
137142
disabled={isLoading}
138-
onClick={() => handleSocialLogin('google')}
143+
onClick={handleGoogleLogin}
139144
type="button"
140145
variant="outline"
141146
>
@@ -161,7 +166,7 @@ function LoginPage() {
161166
<form className="space-y-4" onSubmit={handleEmailPasswordLogin}>
162167
<div className="space-y-2">
163168
<Label className="font-medium text-foreground" htmlFor="email">
164-
Email<span className="text-blue-700">*</span>
169+
Email<span className="text-primary">*</span>
165170
</Label>
166171
<div className="relative">
167172
<Input
@@ -189,7 +194,7 @@ function LoginPage() {
189194
className="font-medium text-foreground"
190195
htmlFor="password"
191196
>
192-
Password<span className="text-blue-700">*</span>
197+
Password<span className="text-primary">*</span>
193198
</Label>
194199
<Link
195200
className="h-auto cursor-pointer p-0 text-primary text-xs sm:text-sm"

‎apps/dashboard/app/(auth)/login/verification-needed/page.tsx‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -39,30 +39,30 @@ export default function VerificationNeededPage() {
3939
return (
4040
<div className="relative mx-auto mt-12 w-full max-w-md overflow-hidden rounded-xl border border-border bg-card p-6 shadow">
4141
<div className="mb-8 text-center">
42-
<div className="relative mb-5 inline-flex h-16 w-16 items-center justify-center rounded-full bg-amber-100 p-3">
43-
<div className="absolute inset-0 animate-pulse rounded-full bg-amber-50" />
44-
<div className="-inset-1 absolute rounded-full bg-gradient-to-tr from-amber-200 to-amber-100 opacity-70 blur-md" />
45-
<div className="relative rounded-full bg-gradient-to-tr from-amber-500 to-amber-400 p-2.5">
46-
<AlertCircle className="h-8 w-8 text-white" />
42+
<div className="relative mb-5 inline-flex h-16 w-16 items-center justify-center rounded-full bg-warning/10 p-3">
43+
<div className="absolute inset-0 animate-pulse rounded-full bg-warning/5" />
44+
<div className="-inset-1 absolute rounded-full bg-gradient-to-tr from-warning/20 to-warning/10 opacity-70 blur-md" />
45+
<div className="relative rounded-full bg-gradient-to-tr from-warning to-warning/80 p-2.5">
46+
<AlertCircle className="h-8 w-8 text-warning-foreground" />
4747
</div>
4848
</div>
4949
<h1 className="font-bold text-2xl text-foreground">
5050
Verify your email
5151
</h1>
5252
<p className="mt-2 text-muted-foreground">
5353
Verification needed for{' '}
54-
<strong className="font-medium text-amber-600">{email}</strong>
54+
<strong className="font-medium text-warning">{email}</strong>
5555
</p>
5656
</div>
5757
<div className="space-y-5 py-4">
58-
<div className="rounded-lg border border-amber-200 bg-amber-50 p-4 text-amber-800">
58+
<div className="rounded-lg border border-warning/20 bg-warning/5 p-4 text-warning-foreground">
5959
<p className="text-sm">
6060
Your email <strong>{email}</strong> needs to be verified before you
6161
can sign in. Please check your inbox for the verification link.
6262
</p>
6363
</div>
6464
<Button
65-
className="w-full bg-amber-500 text-white hover:bg-amber-600"
65+
className="w-full bg-warning text-warning-foreground hover:bg-warning/90"
6666
disabled={isLoading}
6767
onClick={sendVerificationEmail}
6868
>
@@ -77,7 +77,7 @@ export default function VerificationNeededPage() {
7777
</Button>
7878
<Link href="/login">
7979
<Button
80-
className="w-full border-amber-200 text-amber-700 hover:bg-amber-50"
80+
className="w-full border-warning/20 text-warning hover:bg-warning/5"
8181
type="button"
8282
variant="outline"
8383
>

0 commit comments

Comments
 (0)