Skip to content

Commit f9516da

Browse files
committed
add roles
1 parent 035dc6b commit f9516da

File tree

4 files changed

+99
-84
lines changed

4 files changed

+99
-84
lines changed

frontend/src/components/home/HeroSlider.jsx

Lines changed: 17 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -6,33 +6,33 @@ const HeroSlider = () => {
66
() => [
77
{
88
id: 1,
9-
brand: "DARVEYS",
10-
title: "GLOBAL FAVOURITES",
9+
brand: "SAAS LAUNCH",
10+
title: "DASHBOARD READY",
1111
subtitle:
12-
"Shop Hugo Boss, Prada, Gucci, Balenciaga, Balmain, Moncler & more",
13-
cta: "DISCOVER",
12+
"Build smarter products with modular UI, real-time insights, and polished flows.",
13+
cta: "VIEW PLATFORM",
1414
image:
15-
"https://images.unsplash.com/photo-1524504388940-b1c1722653e1?q=80&w=1974&auto=format&fit=crop&ixlib=rb-4.0.3",
15+
"https://source.unsplash.com/2000x1200/?saas,dashboard,ui,webapp",
1616
},
1717
{
1818
id: 2,
19-
brand: "LUXE EDIT",
20-
title: "TAILORED ICONS",
19+
brand: "DESIGN STUDIO",
20+
title: "WEB EXPERIENCES",
2121
subtitle:
22-
"Statement silhouettes and signature details, curated for modern style.",
23-
cta: "SHOP NOW",
22+
"Craft immersive sites with expressive layouts, bold typography, and crisp UX.",
23+
cta: "SEE PORTFOLIO",
2424
image:
25-
"https://images.unsplash.com/photo-1514996937319-344454492b37?q=80&w=1974&auto=format&fit=crop&ixlib=rb-4.0.3",
25+
"https://source.unsplash.com/2000x1200/?web,design,studio,ux",
2626
},
2727
{
2828
id: 3,
29-
brand: "ÉLITE",
30-
title: "SEASON HIGHLIGHTS",
29+
brand: "ECOMMERCE LAB",
30+
title: "CONVERTING STORES",
3131
subtitle:
32-
"Discover the edit of the season with premium essentials and rare drops.",
33-
cta: "EXPLORE",
32+
"Launch conversion-first storefronts with storytelling, speed, and clarity.",
33+
cta: "START SELLING",
3434
image:
35-
"https://images.unsplash.com/photo-1483985988355-763728e1935b?q=80&w=1974&auto=format&fit=crop&ixlib=rb-4.0.3",
35+
"https://source.unsplash.com/2000x1200/?ecommerce,website,landing,commerce",
3636
},
3737
],
3838
[]
@@ -61,9 +61,9 @@ const HeroSlider = () => {
6161
<section className="bg-stone-950 py-6 sm:py-8">
6262
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
6363
<div className="relative overflow-hidden rounded-3xl bg-stone-900 shadow-2xl">
64-
<div className="absolute inset-0 z-10 bg-gradient-to-r from-black/65 via-black/35 to-transparent"></div>
64+
<div className="absolute inset-0 z-10 bg-linear-to-r from-black/65 via-black/35 to-transparent"></div>
6565

66-
<div className="relative h-[360px] sm:h-[440px] lg:h-[520px]">
66+
<div className="relative h-90 sm:h-110 lg:h-130">
6767
{slides.map((slide, index) => (
6868
<div
6969
key={slide.id}

frontend/src/pages/user/Signin.jsx

Lines changed: 34 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ const Signin = () => {
1414
register,
1515
handleSubmit,
1616
formState: { errors, isSubmitting, isValid },
17-
} = useForm({ mode: "onChange" });
17+
} = useForm({ mode: "onChange", defaultValues: { role: "client" } });
1818

1919
useEffect(() => {
2020
if (user) {
@@ -27,46 +27,32 @@ const Signin = () => {
2727
};
2828

2929
return (
30-
<div className="min-h-screen w-full flex items-center justify-center bg-[url(https://images.unsplash.com/photo-1644394969490-a0722932071a?q=80&w=1986&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D)] bg-center bg-cover relative overflow-hidden">
31-
<div className="absolute inset-0 bg-black/60"></div>
32-
<div className="relative z-10 w-full max-w-5xl mx-auto px-4">
33-
<div className="flex w-full bg-black/35 backdrop-blur-xl rounded-2xl shadow-2xl overflow-hidden border border-white/10">
30+
<div className="min-h-screen w-full flex items-center justify-center bg-[#0b0b0b] relative overflow-hidden">
31+
<div className="w-full max-w-5xl mx-auto px-4">
32+
<div className="flex w-full bg-slate-900/70 rounded-3xl shadow-[0_24px_60px_-24px_rgba(0,0,0,0.7)] overflow-hidden border border-white/10">
3433
{/* Left Side - Brand */}
35-
<div className="hidden lg:flex lg:w-1/2 p-12 flex-col justify-between relative text-white">
34+
<div className="hidden lg:flex lg:w-1/2 p-12 flex-col justify-between relative text-slate-100 border-r border-white/10">
3635
<div>
3736
<div className="flex items-center mb-8">
38-
<div className="w-8 h-8 bg-white/30 rounded transform rotate-45 mr-3"></div>
39-
<h1 className="text-3xl font-bold tracking-wide">ÉLITE</h1>
37+
<div className="w-8 h-8 bg-teal-400/20 rounded-lg mr-3"></div>
38+
<h1 className="text-3xl font-semibold tracking-wide">ÉLITE</h1>
4039
</div>
4140

4241
<div>
4342
<h2 className="text-5xl font-bold mb-4 leading-tight">
44-
<br />COLLECTION
43+
DIGITAL <br /> WORKSPACE
4544
</h2>
46-
<p className="text-white/80 text-lg leading-relaxed">
47-
Sign in to access all the features of our service.
48-
<br />
49-
Manage your lifestyle in one place.
45+
<p className="text-slate-300 text-lg leading-relaxed">
46+
Sign in to manage projects, track milestones, and collaborate in real time.
5047
</p>
5148
</div>
5249
</div>
53-
54-
<div className="absolute bottom-12 right-10 w-64 h-64 opacity-30">
55-
<svg viewBox="0 0 200 200" className="w-full h-full">
56-
<path
57-
d="M100 20 C120 30, 140 50, 140 80 L140 120 C140 140, 130 160, 100 180 C70 160, 60 140, 60 120 L60 80 C60 50, 80 30, 100 20 Z"
58-
fill="white"
59-
opacity="0.6"
60-
/>
61-
<circle cx="100" cy="40" r="15" fill="white" opacity="0.8" />
62-
</svg>
63-
</div>
6450
</div>
6551

6652
{/* Right Side - Signin Form */}
6753
<div className="w-full lg:w-1/2 p-8 lg:p-12 bg-white/5">
6854
<div className="max-w-md mx-auto">
69-
<h2 className="text-white text-4xl font-bold">Welcome back</h2>
55+
<h2 className="text-white text-4xl font-semibold">Welcome back</h2>
7056
<p className="text-white/70 mt-2 mb-8">
7157
Please enter your details to continue.
7258
</p>
@@ -88,7 +74,7 @@ const Signin = () => {
8874
},
8975
})}
9076
aria-invalid={errors.email ? "true" : "false"}
91-
className="w-full text-white placeholder-white/60 bg-white/10 border border-white/10 rounded-lg px-4 py-3 focus:outline-none focus:ring-2 focus:ring-white/60 focus:border-transparent transition-all"
77+
className="w-full text-white placeholder-white/60 bg-slate-800/60 border border-white/10 rounded-lg px-4 py-3 focus:outline-none focus:ring-2 focus:ring-teal-400/60 focus:border-transparent transition-all"
9278
placeholder="john@doe.example"
9379
/>
9480
{errors.email && (
@@ -110,7 +96,7 @@ const Signin = () => {
11096
minLength: { value: 8, message: "Minimum 8 characters" },
11197
})}
11298
aria-invalid={errors.password ? "true" : "false"}
113-
className="w-full text-white placeholder-white/60 bg-white/10 border border-white/10 rounded-lg px-4 py-3 pr-16 focus:outline-none focus:ring-2 focus:ring-white/60 focus:border-transparent transition-all"
99+
className="w-full text-white placeholder-white/60 bg-slate-800/60 border border-white/10 rounded-lg px-4 py-3 pr-16 focus:outline-none focus:ring-2 focus:ring-teal-400/60 focus:border-transparent transition-all"
114100
placeholder="••••••••"
115101
/>
116102
<button
@@ -126,13 +112,31 @@ const Signin = () => {
126112
)}
127113
</div>
128114

115+
<div className="space-y-2">
116+
<label htmlFor="signin-role" className="text-white/80 text-sm font-medium">
117+
Account type
118+
</label>
119+
<select
120+
id="signin-role"
121+
{...register("role")}
122+
className="w-full text-white bg-slate-800/60 border border-white/10 rounded-lg px-4 py-3 focus:outline-none focus:ring-2 focus:ring-teal-400/60 focus:border-transparent transition-all"
123+
>
124+
<option value="client" className="text-gray-900">
125+
Client
126+
</option>
127+
<option value="developer" className="text-gray-900">
128+
Developer
129+
</option>
130+
</select>
131+
</div>
132+
129133
<div className="flex items-center justify-between">
130134
<label className="flex items-center gap-2 text-sm text-white/80">
131135
<input
132136
type="checkbox"
133137
{...register("rememberMe")}
134-
className="w-4 h-4 bg-white/10 border-white/20 rounded focus:ring-white/60 focus:ring-2"
135-
/>
138+
className="w-4 h-4 bg-slate-800/60 border-white/20 rounded focus:ring-teal-400/60 focus:ring-2"
139+
/>
136140
Remember me
137141
</label>
138142
<Link
@@ -146,7 +150,7 @@ const Signin = () => {
146150
<button
147151
type="submit"
148152
disabled={isSubmitting || !isValid}
149-
className="w-full rounded-tr-2xl bg-white text-gray-900 font-semibold py-3 px-6 border-2 border-white/70 hover:border-white hover:bg-white/90 transition-all duration-300 text-base uppercase tracking-wide disabled:opacity-50 disabled:cursor-not-allowed"
153+
className="w-full rounded-xl bg-teal-400 text-slate-900 font-semibold py-3 px-6 hover:bg-teal-300 transition-all duration-300 text-base uppercase tracking-wide disabled:opacity-50 disabled:cursor-not-allowed"
150154
>
151155
{isSubmitting ? "Signing in..." : "Sign in"}
152156
</button>

0 commit comments

Comments
 (0)