- 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
42 lines
2.5 KiB
TypeScript
42 lines
2.5 KiB
TypeScript
import { Card, CardContent } from "@/components/ui/card"
|
||
import { Printer } from "lucide-react"
|
||
import Link from "next/link"
|
||
|
||
export function ExamStrategyCard() {
|
||
return (
|
||
<div className="flex flex-col h-full">
|
||
<Card className="border-border bg-card shadow-[0_4px_24px_rgba(0,0,0,0.3)] flex-1 min-h-[440px] overflow-hidden group hover:border-[var(--cyan-ai-30)] transition-colors">
|
||
<CardContent className="p-5 flex flex-col h-full justify-between">
|
||
<div className="grid grid-cols-2 gap-3">
|
||
<div className="p-3.5 rounded-lg bg-white/5 border border-border text-center flex flex-col justify-center">
|
||
<div className="text-2xl mb-1.5">🧪</div>
|
||
<div className="text-sm font-black text-primary">Chemistry First</div>
|
||
<div className="text-xs font-semibold text-muted-foreground mt-1">Finish in 40 mins</div>
|
||
</div>
|
||
<div className="p-3.5 rounded-lg bg-white/5 border border-border text-center flex flex-col justify-center">
|
||
<div className="text-2xl mb-1.5">🧲</div>
|
||
<div className="text-sm font-black text-primary">Physics Next</div>
|
||
<div className="text-xs font-semibold text-muted-foreground mt-1">Target 55 mins</div>
|
||
</div>
|
||
<div className="p-3.5 rounded-lg bg-white/5 border border-border text-center flex flex-col justify-center">
|
||
<div className="text-2xl mb-1.5">📐</div>
|
||
<div className="text-sm font-black text-primary">Maths Last</div>
|
||
<div className="text-xs font-semibold text-muted-foreground mt-1">Reserve 75 mins</div>
|
||
</div>
|
||
<div className="p-3.5 rounded-lg bg-white/5 border border-border text-center flex flex-col justify-center">
|
||
<div className="text-2xl mb-1.5">⏱️</div>
|
||
<div className="text-sm font-black text-primary">Buffer Time</div>
|
||
<div className="text-xs font-semibold text-muted-foreground mt-1">10 mins for review</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div className="mt-4 flex items-center justify-center gap-2 p-3 rounded-lg bg-[var(--cyan-ai-10)] border border-dashed border-[var(--cyan-ai-20)] text-xs md:text-sm text-[var(--cyan-ai)] font-bold cursor-pointer hover:bg-[var(--cyan-ai-20)] transition-colors">
|
||
<Printer size={18} className="stroke-[var(--cyan-ai)]" />
|
||
Print Exam Day Blueprint
|
||
</div>
|
||
</CardContent>
|
||
</Card>
|
||
</div>
|
||
)
|
||
}
|