Skip to content

Commit a623fb5

Browse files
dev-bananedev-banane
authored
Merge pull request #18 from PFConnect/redesign
editorconf
2 parents 64a8d5b + 7da83a7 commit a623fb5

2 files changed

Lines changed: 109 additions & 97 deletions

File tree

‎.editorconfig‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
# EditorConfig is awesome: https://EditorConfig.org
2+
3+
# top-most EditorConfig file
4+
root = true
5+
6+
[*]
7+
indent_style = space
8+
indent_size = 2
9+
end_of_line = lf
10+
charset = utf-8
11+
trim_trailing_whitespace = false
12+
insert_final_newline = false

‎src/pages/Login.tsx‎

Lines changed: 97 additions & 97 deletions
Original file line numberDiff line numberDiff line change
@@ -7,108 +7,108 @@ import Checkbox from '../components/common/Checkbox';
77
import { useAuth } from '../hooks/auth/useAuth';
88

99
export default function Login() {
10-
const [agreed, setAgreed] = useState(false);
11-
const navigate = useNavigate();
10+
const [agreed, setAgreed] = useState(false);
11+
const navigate = useNavigate();
1212

13-
const handleLogin = () => {
14-
if (agreed) {
15-
window.location.href = getDiscordLoginUrl();
16-
}
17-
};
13+
const handleLogin = () => {
14+
if (agreed) {
15+
window.location.href = getDiscordLoginUrl();
16+
}
17+
};
1818

19-
const user = useAuth();
20-
if (user.user) {
21-
navigate('/');
22-
return null;
23-
}
19+
const user = useAuth();
20+
if (user.user) {
21+
navigate('/');
22+
return null;
23+
}
2424

25-
return (
26-
<div className="min-h-screen flex flex-col items-center justify-center bg-gradient-to-t from-black via-zinc-900 to-blue-950 px-4">
27-
<div className="absolute top-6 left-6">
28-
<button
29-
onClick={() => navigate(-1)}
30-
className="flex items-center text-blue-400 hover:text-blue-200 transition-colors font-medium"
31-
>
32-
<ArrowLeft className="w-5 h-5 mr-2" />
33-
Back
34-
</button>
35-
</div>
36-
<div className="bg-black/50 p-8 rounded-2xl shadow-2xl max-w-md w-full flex flex-col items-center animate-fade-in">
37-
<div className="w-16 h-16 flex items-center justify-center shadow-lg mb-2">
38-
<img
39-
src="/favicon.svg"
40-
alt="PFControl Logo"
41-
className="w-10 h-10"
42-
/>
43-
</div>
44-
<h1 className="text-4xl font-extrabold text-blue-400 mb-10 text-center tracking-tight">
45-
Sign In
46-
</h1>
25+
return (
26+
<div className="min-h-screen flex flex-col items-center justify-center bg-gradient-to-t from-black via-zinc-900 to-blue-950 px-4">
27+
<div className="absolute top-6 left-6">
28+
<button
29+
onClick={() => navigate(-1)}
30+
className="flex items-center text-blue-400 hover:text-blue-200 transition-colors font-medium"
31+
>
32+
<ArrowLeft className="w-5 h-5 mr-2" />
33+
Back
34+
</button>
35+
</div>
36+
<div className="bg-gradient-to-br from-zinc-800 via-zinc-900 to-zinc-950 border-2 border-zinc-800 p-8 rounded-2xl shadow-2xl max-w-md w-full flex flex-col items-center animate-fade-in">
37+
<div className="w-16 h-16 flex items-center justify-center shadow-lg mb-2">
38+
<img
39+
src="/favicon.svg"
40+
alt="PFControl Logo"
41+
className="w-12 h-12"
42+
/>
43+
</div>
44+
<h1 className="text-4xl font-extrabold text-blue-400 mb-10 text-center tracking-tight">
45+
Sign In
46+
</h1>
4747

48-
<button
49-
onClick={handleLogin}
50-
disabled={!agreed}
51-
className={`w-full py-3 rounded-full font-bold text-lg transition-all duration-200 flex items-center justify-center gap-2 shadow-lg
48+
<button
49+
onClick={handleLogin}
50+
disabled={!agreed}
51+
className={`w-full py-3 rounded-full font-bold text-lg transition-all duration-200 flex items-center justify-center gap-2 shadow-lg
5252
${
53-
agreed
54-
? 'bg-gradient-to-r from-blue-600 to-blue-700 hover:from-blue-700 hover:to-blue-800 text-white'
55-
: 'bg-gray-700 text-gray-400'
56-
}`}
57-
style={{
58-
boxShadow: agreed
59-
? '0 4px 24px 0 rgba(37, 99, 235, 0.15)'
60-
: undefined,
61-
cursor: agreed ? 'pointer' : 'not-allowed'
62-
}}
63-
>
64-
<FaDiscord className="w-6 h-6" />
65-
Sign In with Discord
66-
</button>
67-
<hr className="w-full border-zinc-700 mb-6 mt-6" />
68-
<div
69-
className={`w-full flex items-center mb-6 border-2 border-blue-600 rounded-2xl px-5 py-4 gap-3 transition-all duration-200 shadow-sm
53+
agreed
54+
? 'bg-gradient-to-r from-blue-600 to-blue-700 hover:from-blue-700 hover:to-blue-800 text-white'
55+
: 'bg-gray-700 text-gray-400'
56+
}`}
57+
style={{
58+
boxShadow: agreed
59+
? '0 4px 24px 0 rgba(37, 99, 235, 0.15)'
60+
: undefined,
61+
cursor: agreed ? 'pointer' : 'not-allowed',
62+
}}
63+
>
64+
<FaDiscord className="w-6 h-6" />
65+
Sign In with Discord
66+
</button>
67+
<hr className="w-full border-zinc-700 mb-6 mt-6" />
68+
<div
69+
className={`w-full flex items-center mb-6 border-2 border-blue-600 rounded-2xl px-5 py-4 gap-3 transition-all duration-200 shadow-sm
7070
${agreed ? 'bg-blue-600/30' : 'bg-blue-600/10'}
7171
hover:shadow-blue-700/20 focus-within:shadow-blue-700/30`}
72-
>
73-
<Checkbox
74-
checked={agreed}
75-
onChange={setAgreed}
76-
label={
77-
<span>
78-
I agree to the{' '}
79-
<Link
80-
to="/terms"
81-
className="text-blue-400 underline hover:text-blue-300 transition-colors"
82-
tabIndex={0}
83-
>
84-
Terms of Use
85-
</Link>
86-
,{' '}
87-
<Link
88-
to="/privacy"
89-
className="text-blue-400 underline hover:text-blue-300 transition-colors"
90-
tabIndex={0}
91-
>
92-
Privacy Policy
93-
</Link>
94-
, and{' '}
95-
<Link
96-
to="/cookies"
97-
className="text-blue-400 underline hover:text-blue-300 transition-colors"
98-
tabIndex={0}
99-
>
100-
Cookies Policy
101-
</Link>
102-
</span>
103-
}
104-
className="flex-1"
105-
/>
106-
</div>
107-
<p className="text-xs text-gray-500 text-center max-w-xs">
108-
PFConnect Studios is an independent service and is not in
109-
any way affiliated with Project Flight.
110-
</p>
111-
</div>
112-
</div>
113-
);
72+
>
73+
<Checkbox
74+
checked={agreed}
75+
onChange={setAgreed}
76+
label={
77+
<span>
78+
I agree to the{' '}
79+
<Link
80+
to="/terms"
81+
className="text-blue-400 underline hover:text-blue-300 transition-colors"
82+
tabIndex={0}
83+
>
84+
Terms of Use
85+
</Link>
86+
,{' '}
87+
<Link
88+
to="/privacy"
89+
className="text-blue-400 underline hover:text-blue-300 transition-colors"
90+
tabIndex={0}
91+
>
92+
Privacy Policy
93+
</Link>
94+
, and{' '}
95+
<Link
96+
to="/cookies"
97+
className="text-blue-400 underline hover:text-blue-300 transition-colors"
98+
tabIndex={0}
99+
>
100+
Cookies Policy
101+
</Link>
102+
</span>
103+
}
104+
className="flex-1"
105+
/>
106+
</div>
107+
<p className="text-xs text-gray-500 text-center max-w-xs">
108+
PFConnect Studios is an independent service and is not in
109+
any way affiliated with Project Flight.
110+
</p>
111+
</div>
112+
</div>
113+
);
114114
}

0 commit comments

Comments
 (0)