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:
2026-09-20 12:19:23 +05:30
parent 0fab60b710
commit c17785e38a
57 changed files with 491 additions and 473 deletions

View File

@@ -1,4 +1,4 @@
"use client"
"use client"
import { Button } from "@/components/ui/button"
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
@@ -41,7 +41,7 @@ export default function ForgotPasswordPage() {
}
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="/login" 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 Login
</Link>
@@ -52,22 +52,22 @@ export default function ForgotPasswordPage() {
</div>
{isSubmitted ? (
<Card className="border-border bg-secondary/10 backdrop-blur-xl shadow-2xl shadow-[#00F0FF]/5 rounded-[2rem] overflow-hidden text-center py-8">
<Card className="border-border bg-secondary/10 backdrop-blur-xl shadow-2xl shadow-[var(--cyan-ai-10)] rounded-[2rem] overflow-hidden text-center py-8">
<CardContent className="space-y-6 pt-4 flex flex-col items-center">
<CheckCircle2 size={64} className="text-[#00F0FF] mb-4" />
<CheckCircle2 size={64} className="text-[var(--cyan-ai)] mb-4" />
<h2 className="text-3xl font-black tracking-tight text-foreground">Check your email</h2>
<p className="text-muted-foreground text-sm font-medium px-4 leading-relaxed">
We've sent password reset instructions to <strong>{email}</strong>.
</p>
<Link href="/login" className="w-full mt-4">
<Button 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 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)]">
Return to Login
</Button>
</Link>
</CardContent>
</Card>
) : (
<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">Reset Password</CardTitle>
<CardDescription className="text-muted-foreground">Enter your email and we'll send you instructions.</CardDescription>
@@ -84,7 +84,7 @@ export default function ForgotPasswordPage() {
placeholder="student@example.com"
required
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>
@@ -95,7 +95,7 @@ export default function ForgotPasswordPage() {
</div>
)}
<Button type="submit" disabled={loading || !email} 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" disabled={loading || !email} 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)]">
{loading ? "Sending..." : "Send Reset Link"}
</Button>
</form>