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 { useEffect, useState } from "react"
|
||||
import { Card, CardContent } from "@/components/ui/card"
|
||||
@@ -67,14 +67,14 @@ export function CollegePredictorCard() {
|
||||
|
||||
const TAB_COLORS: Record<string, string> = {
|
||||
Reach: "bg-purple-500/10 border-purple-500/20 text-purple-400",
|
||||
Target: "bg-[#00F0FF]/10 border-[#00F0FF]/20 text-[#00F0FF]",
|
||||
Target: "bg-[var(--cyan-ai-10)] border-[var(--cyan-ai-20)] text-[var(--cyan-ai)]",
|
||||
Safety: "bg-green-500/10 border-green-500/20 text-green-400",
|
||||
}
|
||||
|
||||
const INACTIVE = "bg-white/5 border-transparent text-muted-foreground hover:bg-white/10"
|
||||
|
||||
return (
|
||||
<Card className="border-border bg-card shadow-[0_4px_24px_rgba(0,0,0,0.3)] overflow-hidden group hover:border-[#00F0FF]/30 transition-colors">
|
||||
<Card className="border-border bg-card shadow-[0_4px_24px_rgba(0,0,0,0.3)] overflow-hidden group hover:border-[var(--cyan-ai-30)] transition-colors">
|
||||
<CardContent className="p-5 flex flex-col gap-4">
|
||||
{/* Tabs */}
|
||||
<div className="flex gap-1.5">
|
||||
@@ -100,7 +100,7 @@ export function CollegePredictorCard() {
|
||||
<div className="flex flex-col gap-2">
|
||||
{colleges.map((col) => (
|
||||
<div key={col.name} className="flex items-center gap-3 p-3 rounded-xl bg-white/5 border border-border hover:bg-white/10 transition-colors group/item">
|
||||
<div className={`w-8 h-8 rounded-full flex items-center justify-center text-xs font-black shrink-0 ${activeTab === "Reach" ? "bg-purple-500/10 text-purple-400" : activeTab === "Target" ? "bg-[#00F0FF]/10 text-[#00F0FF]" : "bg-green-500/10 text-green-400"}`}>
|
||||
<div className={`w-8 h-8 rounded-full flex items-center justify-center text-xs font-black shrink-0 ${activeTab === "Reach" ? "bg-purple-500/10 text-purple-400" : activeTab === "Target" ? "bg-[var(--cyan-ai-10)] text-[var(--cyan-ai)]" : "bg-green-500/10 text-green-400"}`}>
|
||||
#{col.rank}
|
||||
</div>
|
||||
<div className="flex-1 min-w-0">
|
||||
|
||||
Reference in New Issue
Block a user