andika/membership-fe
3
1
Fork 1
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Frontend Revamp

Browse Source
This commit is contained in:
Koncept Kit
2025-12-08 14:46:16 +07:00
parent 79cebd205c
commit d8c1e133ac
14 changed files with 425 additions and 351 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
src/pages/Login.js
View File

@@ -54,23 +54,23 @@ const Login = () => {
};
return (
<div className="min-h-screen bg-[#FDFCF8]">
<div className="min-h-screen bg-white">
<Navbar />
<div className="max-w-md mx-auto px-6 py-12">
<div className="mb-8">
<Link to="/" className="inline-flex items-center text-[#6B708D] hover:text-[#E07A5F] transition-colors">
<Link to="/" className="inline-flex items-center text-[#664fa3] hover:text-[#ff9e77] transition-colors">
<ArrowLeft className="h-4 w-4 mr-2" />
Back to Home
</Link>
</div>
<Card className="p-8 md:p-12 bg-white rounded-2xl border border-[#EAE0D5] shadow-lg">
<Card className="p-8 md:p-12 bg-white rounded-2xl border border-[#ddd8eb] shadow-lg">
<div className="mb-8 text-center">
<h1 className="text-4xl md:text-5xl font-semibold fraunces text-[#3D405B] mb-4">
<h1 className="text-4xl md:text-5xl font-semibold text-[#422268] mb-4" style={{ fontFamily: "'Inter', sans-serif" }}>
Welcome Back
</h1>
<p className="text-lg text-[#6B708D]">
<p className="text-lg text-[#664fa3]" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
Login to access your member dashboard.
</p>
</div>
@@ -86,7 +86,7 @@ const Login = () => {
value={formData.email}
onChange={handleInputChange}
placeholder="your.email@example.com"
className="h-14 rounded-xl border-2 border-[#EAE0D5] focus:border-[#E07A5F]"
className="h-14 rounded-xl border-2 border-[#ddd8eb] focus:border-[#664fa3]"
data-testid="login-email-input"
/>
</div>
@@ -94,7 +94,7 @@ const Login = () => {
<div>
<div className="flex items-center justify-between mb-2">
<Label htmlFor="password">Password</Label>
<Link to="/forgot-password" className="text-sm text-[#E07A5F] hover:underline">
<Link to="/forgot-password" className="text-sm text-[#ff9e77] hover:underline">
Forgot password?
</Link>
</div>
@@ -105,7 +105,7 @@ const Login = () => {
value={formData.password}
onChange={handleInputChange}
placeholder="Enter your password"
className="h-14 rounded-xl border-2 border-[#EAE0D5] focus:border-[#E07A5F]"
className="h-14 rounded-xl border-2 border-[#ddd8eb] focus:border-[#664fa3]"
data-testid="login-password-input"
/>
</div>
@@ -113,16 +113,16 @@ const Login = () => {
<Button
type="submit"
disabled={loading}
className="w-full bg-[#E07A5F] text-white hover:bg-[#D0694E] rounded-full py-6 text-lg font-medium shadow-lg hover:scale-105 transition-transform disabled:opacity-50"
className="w-full bg-[#DDD8EB] text-[#422268] hover:bg-white rounded-full py-6 text-lg font-medium shadow-lg hover:scale-105 transition-transform disabled:opacity-50"
data-testid="login-submit-button"
>
{loading ? 'Logging in...' : 'Login'}
<ArrowRight className="ml-2 h-5 w-5" />
</Button>
<p className="text-center text-[#6B708D]">
<p className="text-center text-[#664fa3]" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
Don't have an account?{' '}
<Link to="/register" className="text-[#E07A5F] hover:underline font-medium">
<Link to="/register" className="text-[#ff9e77] hover:underline font-medium">
Register here
</Link>
</p>