design: cyan -> rgb(12,96,96) in light theme, #00F0FF stays in dark theme
- globals.css: add --cyan-ai CSS variable (rgb(12,96,96) light / #00F0FF dark) + opacity variants --cyan-ai-10/20/30/40/50/80 - Bulk replace all #00F0FF hardcoded Tailwind arbitrary values with var(--cyan-ai) / var(--cyan-ai-10) / etc across 55+ TSX/TS files - Shadow glow colours also updated (suppressed by box-shadow:none in light mode) - TypeScript: 0 errors
This commit is contained in:
@@ -1,4 +1,4 @@
|
||||
"use client"
|
||||
"use client"
|
||||
|
||||
import { Button } from "@/components/ui/button"
|
||||
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
|
||||
@@ -66,7 +66,7 @@ export default function LoginPage() {
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-background flex flex-col items-center justify-center p-6 selection:bg-[#00F0FF]/20">
|
||||
<div className="min-h-screen bg-background flex flex-col items-center justify-center p-6 selection:bg-[var(--cyan-ai-20)]">
|
||||
<Link href="/" className="absolute top-8 left-8 text-muted-foreground hover:text-foreground flex items-center gap-2 transition-colors font-medium">
|
||||
<ArrowLeft size={16} /> Back to Home
|
||||
</Link>
|
||||
@@ -76,7 +76,7 @@ export default function LoginPage() {
|
||||
<Logo href="/" className="w-72" imageClassName="object-contain" height={80} />
|
||||
</div>
|
||||
|
||||
<Card className="border-border bg-secondary/10 backdrop-blur-xl shadow-2xl shadow-[#00F0FF]/5 rounded-[2rem] overflow-hidden">
|
||||
<Card className="border-border bg-secondary/10 backdrop-blur-xl shadow-2xl shadow-[var(--cyan-ai-10)] rounded-[2rem] overflow-hidden">
|
||||
<CardHeader className="text-center pb-2">
|
||||
<CardTitle className="text-2xl font-bold tracking-tight">Welcome back</CardTitle>
|
||||
<CardDescription className="text-muted-foreground">Enter your credentials to access your dashboard.</CardDescription>
|
||||
@@ -92,7 +92,7 @@ export default function LoginPage() {
|
||||
onChange={(e) => setEmail(e.target.value)}
|
||||
placeholder="student@example.com"
|
||||
suppressHydrationWarning
|
||||
className="w-full bg-background border border-border rounded-xl px-4 py-3 text-sm focus:outline-none focus:ring-2 focus:ring-[#00F0FF] focus:border-transparent transition-all"
|
||||
className="w-full bg-background border border-border rounded-xl px-4 py-3 text-sm focus:outline-none focus:ring-2 focus:ring-[var(--cyan-ai)] focus:border-transparent transition-all"
|
||||
/>
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
@@ -100,7 +100,7 @@ export default function LoginPage() {
|
||||
<label className="text-sm font-bold text-foreground">
|
||||
Password
|
||||
</label>
|
||||
<Link href="/forgot-password" className="text-xs font-bold text-[#00F0FF] hover:text-[#00F0FF]/80 transition-colors">Forgot password?</Link>
|
||||
<Link href="/forgot-password" className="text-xs font-bold text-[var(--cyan-ai)] hover:text-[var(--cyan-ai-80)] transition-colors">Forgot password?</Link>
|
||||
</div>
|
||||
<div className="relative">
|
||||
<input
|
||||
@@ -109,7 +109,7 @@ export default function LoginPage() {
|
||||
onChange={(e) => setPassword(e.target.value)}
|
||||
placeholder="••••••••"
|
||||
suppressHydrationWarning
|
||||
className="w-full bg-background border border-border rounded-xl px-4 py-3 text-sm focus:outline-none focus:ring-2 focus:ring-[#00F0FF] focus:border-transparent transition-all pr-10"
|
||||
className="w-full bg-background border border-border rounded-xl px-4 py-3 text-sm focus:outline-none focus:ring-2 focus:ring-[var(--cyan-ai)] focus:border-transparent transition-all pr-10"
|
||||
/>
|
||||
<button
|
||||
type="button"
|
||||
@@ -128,7 +128,7 @@ export default function LoginPage() {
|
||||
</div>
|
||||
)}
|
||||
|
||||
<Button type="submit" className="w-full rounded-xl h-12 font-bold text-base bg-foreground text-background hover:bg-foreground/90 transition-all shadow-[0_0_15px_-5px_#00F0FF]">
|
||||
<Button type="submit" className="w-full rounded-xl h-12 font-bold text-base bg-foreground text-background hover:bg-foreground/90 transition-all shadow-[0_0_15px_-5px_var(--cyan-ai)]">
|
||||
Sign In
|
||||
</Button>
|
||||
</form>
|
||||
|
||||
Reference in New Issue
Block a user