fix: remove all page-entry and opening animations for instant, rock-solid page loading
This commit is contained in:
@@ -105,7 +105,7 @@ export default function AIComCBTDPPPage() {
|
|||||||
return (
|
return (
|
||||||
<div className="p-6 md:p-8 space-y-6 max-w-6xl mx-auto min-h-screen">
|
<div className="p-6 md:p-8 space-y-6 max-w-6xl mx-auto min-h-screen">
|
||||||
{/* Top Header */}
|
{/* Top Header */}
|
||||||
<div className="flex flex-col md:flex-row md:items-center justify-between gap-4 bg-secondary/20 border border-border p-6 rounded-3xl backdrop-blur-xl animate-section animate-section-1">
|
<div className="flex flex-col md:flex-row md:items-center justify-between gap-4 bg-secondary/20 border border-border p-6 rounded-3xl backdrop-blur-xl">
|
||||||
<div className="flex items-center gap-4">
|
<div className="flex items-center gap-4">
|
||||||
<Link href="/dashboard/dpp">
|
<Link href="/dashboard/dpp">
|
||||||
<Button variant="outline" size="icon" className="rounded-xl border-border hover:bg-secondary">
|
<Button variant="outline" size="icon" className="rounded-xl border-border hover:bg-secondary">
|
||||||
@@ -166,7 +166,7 @@ export default function AIComCBTDPPPage() {
|
|||||||
)}
|
)}
|
||||||
|
|
||||||
{/* Main CBT Grid */}
|
{/* Main CBT Grid */}
|
||||||
<div className="grid grid-cols-1 lg:grid-cols-4 gap-6 animate-section animate-section-2">
|
<div className="grid grid-cols-1 lg:grid-cols-4 gap-6">
|
||||||
{/* Question Area */}
|
{/* Question Area */}
|
||||||
<div className="lg:col-span-3">
|
<div className="lg:col-span-3">
|
||||||
<Card className="border-border bg-background/80 backdrop-blur-xl p-6 rounded-3xl shadow-xl space-y-6">
|
<Card className="border-border bg-background/80 backdrop-blur-xl p-6 rounded-3xl shadow-xl space-y-6">
|
||||||
|
|||||||
@@ -175,7 +175,7 @@ export default function DPPPage() {
|
|||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-4 animate-section animate-section-2">
|
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||||
{loading ? (
|
{loading ? (
|
||||||
<div className="col-span-2 text-center py-12 text-muted-foreground">Loading AI-generated DPPs...</div>
|
<div className="col-span-2 text-center py-12 text-muted-foreground">Loading AI-generated DPPs...</div>
|
||||||
) : filteredDpps.length === 0 ? (
|
) : filteredDpps.length === 0 ? (
|
||||||
|
|||||||
@@ -91,7 +91,7 @@ export default function CollegePredictorPage() {
|
|||||||
return (
|
return (
|
||||||
<div className="p-6 md:p-8 space-y-8 max-w-7xl mx-auto min-h-screen">
|
<div className="p-6 md:p-8 space-y-8 max-w-7xl mx-auto min-h-screen">
|
||||||
{/* Page Header */}
|
{/* Page Header */}
|
||||||
<div className="border-b border-border/50 pb-6 animate-section animate-section-1">
|
<div className="border-b border-border/50 pb-6">
|
||||||
<div className="flex items-start justify-between gap-4 flex-wrap">
|
<div className="flex items-start justify-between gap-4 flex-wrap">
|
||||||
<div>
|
<div>
|
||||||
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-2">
|
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-2">
|
||||||
@@ -110,7 +110,7 @@ export default function CollegePredictorPage() {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6 animate-section animate-section-1">
|
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
|
||||||
{/* Left Box: Graph */}
|
{/* Left Box: Graph */}
|
||||||
<Card className="col-span-1 lg:col-span-2 border-border shadow-sm bg-background">
|
<Card className="col-span-1 lg:col-span-2 border-border shadow-sm bg-background">
|
||||||
<CardHeader>
|
<CardHeader>
|
||||||
|
|||||||
@@ -37,7 +37,7 @@ export default function HeatmapPage() {
|
|||||||
return (
|
return (
|
||||||
<div className="p-6 md:p-8 max-w-7xl mx-auto space-y-8 min-h-screen">
|
<div className="p-6 md:p-8 max-w-7xl mx-auto space-y-8 min-h-screen">
|
||||||
{/* Page Header */}
|
{/* Page Header */}
|
||||||
<div className="border-b border-border/50 pb-6 animate-section animate-section-1">
|
<div className="border-b border-border/50 pb-6">
|
||||||
<div className="flex items-start justify-between gap-4 flex-wrap">
|
<div className="flex items-start justify-between gap-4 flex-wrap">
|
||||||
<div>
|
<div>
|
||||||
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-2">
|
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-2">
|
||||||
@@ -57,7 +57,7 @@ export default function HeatmapPage() {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* KPI Strip */}
|
{/* KPI Strip */}
|
||||||
<div className="grid grid-cols-2 md:grid-cols-4 gap-4 animate-section animate-section-1">
|
<div className="grid grid-cols-2 md:grid-cols-4 gap-4">
|
||||||
{summaryStats.map((kpi) => (
|
{summaryStats.map((kpi) => (
|
||||||
<Card key={kpi.label} className={`rounded-2xl border ${kpi.color} hover:scale-[1.02] transition-transform`}>
|
<Card key={kpi.label} className={`rounded-2xl border ${kpi.color} hover:scale-[1.02] transition-transform`}>
|
||||||
<CardContent className="p-5 flex flex-col gap-2">
|
<CardContent className="p-5 flex flex-col gap-2">
|
||||||
@@ -70,7 +70,7 @@ export default function HeatmapPage() {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Legend / Guidance Row */}
|
{/* Legend / Guidance Row */}
|
||||||
<div className="grid grid-cols-2 lg:grid-cols-4 gap-4 animate-section animate-section-2">
|
<div className="grid grid-cols-2 lg:grid-cols-4 gap-4">
|
||||||
{[
|
{[
|
||||||
{ label: "Critical (> 50%)", color: "bg-red-500/20 border-red-500/30 text-red-400", dot: "bg-red-500", desc: "Immediate revision needed" },
|
{ label: "Critical (> 50%)", color: "bg-red-500/20 border-red-500/30 text-red-400", dot: "bg-red-500", desc: "Immediate revision needed" },
|
||||||
{ label: "Warning (30–50%)", color: "bg-amber-500/20 border-amber-500/30 text-amber-400", dot: "bg-amber-500", desc: "Focus on these next" },
|
{ label: "Warning (30–50%)", color: "bg-amber-500/20 border-amber-500/30 text-amber-400", dot: "bg-amber-500", desc: "Focus on these next" },
|
||||||
@@ -90,7 +90,7 @@ export default function HeatmapPage() {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Main 2-col layout */}
|
{/* Main 2-col layout */}
|
||||||
<div className="grid grid-cols-1 lg:grid-cols-3 gap-8 animate-section animate-section-3">
|
<div className="grid grid-cols-1 lg:grid-cols-3 gap-8">
|
||||||
{/* Heatmap — takes 2/3 */}
|
{/* Heatmap — takes 2/3 */}
|
||||||
<div className="lg:col-span-2 space-y-3">
|
<div className="lg:col-span-2 space-y-3">
|
||||||
<div className="flex items-center gap-2 text-sm font-black uppercase tracking-wider text-muted-foreground">
|
<div className="flex items-center gap-2 text-sm font-black uppercase tracking-wider text-muted-foreground">
|
||||||
|
|||||||
@@ -92,7 +92,7 @@ export default function AICoachDashboard() {
|
|||||||
<div className="p-6 max-w-6xl mx-auto space-y-8">
|
<div className="p-6 max-w-6xl mx-auto space-y-8">
|
||||||
|
|
||||||
{/* ── METRICS BAR ── */}
|
{/* ── METRICS BAR ── */}
|
||||||
<div className="flex flex-wrap items-center justify-end gap-2 pt-2 animate-section animate-section-1">
|
<div className="flex flex-wrap items-center justify-end gap-2 pt-2">
|
||||||
<div className="inline-flex items-center gap-1.5 bg-yellow-500/10 text-yellow-500 px-3 py-1.5 rounded-xl text-xs font-bold border border-yellow-500/20">
|
<div className="inline-flex items-center gap-1.5 bg-yellow-500/10 text-yellow-500 px-3 py-1.5 rounded-xl text-xs font-bold border border-yellow-500/20">
|
||||||
<Flame size={14} className="fill-yellow-500" />
|
<Flame size={14} className="fill-yellow-500" />
|
||||||
{user?.streak_count || 1}-Day Streak
|
{user?.streak_count || 1}-Day Streak
|
||||||
@@ -108,10 +108,10 @@ export default function AICoachDashboard() {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* ── DAILY CHALLENGE BANNER ── */}
|
{/* ── DAILY CHALLENGE BANNER ── */}
|
||||||
<div className="animate-section animate-section-2"><DailyChallengeBanner /></div>
|
<div className=""><DailyChallengeBanner /></div>
|
||||||
|
|
||||||
{/* ── QUICK STATS ── */}
|
{/* ── QUICK STATS ── */}
|
||||||
<section className="grid grid-cols-2 md:grid-cols-5 gap-4 animate-section animate-section-3">
|
<section className="grid grid-cols-2 md:grid-cols-5 gap-4">
|
||||||
{[
|
{[
|
||||||
{ label: "Questions Solved", value: questionsSolved, color: "text-[var(--cyan-ai)]", bg: "bg-[var(--cyan-ai-10)]", border: "border-[var(--cyan-ai-20)]", icon: <FileText size={32} /> },
|
{ label: "Questions Solved", value: questionsSolved, color: "text-[var(--cyan-ai)]", bg: "bg-[var(--cyan-ai-10)]", border: "border-[var(--cyan-ai-20)]", icon: <FileText size={32} /> },
|
||||||
{ label: "Overall Accuracy", value: overallAccuracy, color: "text-amber-500", bg: "bg-amber-500/5", border: "border-amber-500/20", icon: <Target size={32} /> },
|
{ label: "Overall Accuracy", value: overallAccuracy, color: "text-amber-500", bg: "bg-amber-500/5", border: "border-amber-500/20", icon: <Target size={32} /> },
|
||||||
@@ -130,7 +130,7 @@ export default function AICoachDashboard() {
|
|||||||
</section>
|
</section>
|
||||||
|
|
||||||
{/* ── PREDICTIVE INTELLIGENCE ROW ── */}
|
{/* ── PREDICTIVE INTELLIGENCE ROW ── */}
|
||||||
<section className="mt-10 animate-section animate-section-4">
|
<section className="mt-10">
|
||||||
<div className="flex items-center justify-between gap-3 mb-6">
|
<div className="flex items-center justify-between gap-3 mb-6">
|
||||||
<div className="flex items-center gap-2 text-base md:text-lg font-black uppercase tracking-widest text-[var(--cyan-ai)]">
|
<div className="flex items-center gap-2 text-base md:text-lg font-black uppercase tracking-widest text-[var(--cyan-ai)]">
|
||||||
<Zap size={20} />
|
<Zap size={20} />
|
||||||
@@ -152,7 +152,7 @@ export default function AICoachDashboard() {
|
|||||||
|
|
||||||
|
|
||||||
{/* ── HEATMAP / STUDY PLAN / WEEKLY REPORT ── */}
|
{/* ── HEATMAP / STUDY PLAN / WEEKLY REPORT ── */}
|
||||||
<section className="grid grid-cols-1 lg:grid-cols-2 gap-8 pt-10 border-t border-border animate-section animate-section-5">
|
<section className="grid grid-cols-1 lg:grid-cols-2 gap-8 pt-10 border-t border-border">
|
||||||
<div>
|
<div>
|
||||||
<div className="flex items-center justify-between mb-4">
|
<div className="flex items-center justify-between mb-4">
|
||||||
<div className="flex items-center gap-2 text-base font-extrabold">
|
<div className="flex items-center gap-2 text-base font-extrabold">
|
||||||
|
|||||||
@@ -34,7 +34,7 @@ export default function ReadinessPage() {
|
|||||||
return (
|
return (
|
||||||
<div className="p-6 md:p-8 space-y-8 max-w-7xl mx-auto min-h-screen">
|
<div className="p-6 md:p-8 space-y-8 max-w-7xl mx-auto min-h-screen">
|
||||||
{/* Page Header */}
|
{/* Page Header */}
|
||||||
<div className="border-b border-border/50 pb-6 animate-section animate-section-1">
|
<div className="border-b border-border/50 pb-6">
|
||||||
<div className="flex items-start justify-between gap-4 flex-wrap">
|
<div className="flex items-start justify-between gap-4 flex-wrap">
|
||||||
<div>
|
<div>
|
||||||
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-2">
|
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-2">
|
||||||
@@ -54,7 +54,7 @@ export default function ReadinessPage() {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* KPI Strip */}
|
{/* KPI Strip */}
|
||||||
<div className="grid grid-cols-2 md:grid-cols-4 gap-4 animate-section animate-section-1">
|
<div className="grid grid-cols-2 md:grid-cols-4 gap-4">
|
||||||
{[
|
{[
|
||||||
{ label: "Overall Score", value: isDemo ? "72 / 100" : "0 / 100", trend: isDemo ? "+5 this week" : "Baseline", trendUp: true, icon: <Gauge size={20} className="text-[var(--cyan-ai)]" /> },
|
{ label: "Overall Score", value: isDemo ? "72 / 100" : "0 / 100", trend: isDemo ? "+5 this week" : "Baseline", trendUp: true, icon: <Gauge size={20} className="text-[var(--cyan-ai)]" /> },
|
||||||
{ label: "Accuracy Rate", value: isDemo ? "88%" : "0%", trend: isDemo ? "+3% vs last week" : "0 attempts", trendUp: isDemo, icon: <Target size={20} className="text-amber-400" /> },
|
{ label: "Accuracy Rate", value: isDemo ? "88%" : "0%", trend: isDemo ? "+3% vs last week" : "0 attempts", trendUp: isDemo, icon: <Target size={20} className="text-amber-400" /> },
|
||||||
@@ -76,7 +76,7 @@ export default function ReadinessPage() {
|
|||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="grid grid-cols-1 lg:grid-cols-3 gap-8 animate-section animate-section-2">
|
<div className="grid grid-cols-1 lg:grid-cols-3 gap-8">
|
||||||
<div className="lg:col-span-2 space-y-8">
|
<div className="lg:col-span-2 space-y-8">
|
||||||
{/* Readiness Score Card */}
|
{/* Readiness Score Card */}
|
||||||
<Card className="p-6 bg-secondary/10 border-border/60 rounded-3xl">
|
<Card className="p-6 bg-secondary/10 border-border/60 rounded-3xl">
|
||||||
|
|||||||
@@ -26,7 +26,7 @@ export default function StrategyPage() {
|
|||||||
return (
|
return (
|
||||||
<div className="p-6 md:p-8 space-y-8 max-w-7xl mx-auto min-h-screen">
|
<div className="p-6 md:p-8 space-y-8 max-w-7xl mx-auto min-h-screen">
|
||||||
{/* Page Header */}
|
{/* Page Header */}
|
||||||
<div className="border-b border-border/50 pb-6 animate-section animate-section-1">
|
<div className="border-b border-border/50 pb-6">
|
||||||
<div className="flex items-start justify-between gap-4 flex-wrap">
|
<div className="flex items-start justify-between gap-4 flex-wrap">
|
||||||
<div>
|
<div>
|
||||||
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-2">
|
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-2">
|
||||||
@@ -46,7 +46,7 @@ export default function StrategyPage() {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* KPI Strip */}
|
{/* KPI Strip */}
|
||||||
<div className="grid grid-cols-2 md:grid-cols-4 gap-4 animate-section animate-section-1">
|
<div className="grid grid-cols-2 md:grid-cols-4 gap-4">
|
||||||
{[
|
{[
|
||||||
{ label: "Time Per Question", value: isDemo ? "45 sec" : "-- sec", note: isDemo ? "Target: 38 sec" : "Not calibrated", icon: <Clock size={18} className="text-red-400" />, color: "border-red-400/20 bg-red-400/5" },
|
{ label: "Time Per Question", value: isDemo ? "45 sec" : "-- sec", note: isDemo ? "Target: 38 sec" : "Not calibrated", icon: <Clock size={18} className="text-red-400" />, color: "border-red-400/20 bg-red-400/5" },
|
||||||
{ label: "Negative Marks Lost", value: isDemo ? "-29" : "0", note: isDemo ? "Last mock test" : "0 negative marks", icon: <AlertTriangle size={18} className="text-amber-400" />, color: "border-amber-400/20 bg-amber-400/5" },
|
{ label: "Negative Marks Lost", value: isDemo ? "-29" : "0", note: isDemo ? "Last mock test" : "0 negative marks", icon: <AlertTriangle size={18} className="text-amber-400" />, color: "border-amber-400/20 bg-amber-400/5" },
|
||||||
@@ -65,7 +65,7 @@ export default function StrategyPage() {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Main Cards Row */}
|
{/* Main Cards Row */}
|
||||||
<div className="grid grid-cols-1 lg:grid-cols-2 gap-6 animate-section animate-section-2">
|
<div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
|
||||||
<div className="space-y-3">
|
<div className="space-y-3">
|
||||||
<div className="flex items-center gap-2 text-sm font-black uppercase tracking-wider text-muted-foreground">
|
<div className="flex items-center gap-2 text-sm font-black uppercase tracking-wider text-muted-foreground">
|
||||||
<Target size={16} className="text-[var(--cyan-ai)]" />
|
<Target size={16} className="text-[var(--cyan-ai)]" />
|
||||||
@@ -136,7 +136,7 @@ export default function StrategyPage() {
|
|||||||
<Lightbulb size={20} className="text-yellow-400" />
|
<Lightbulb size={20} className="text-yellow-400" />
|
||||||
<h3 className="text-base font-black tracking-tight">AI Strategy Recommendations</h3>
|
<h3 className="text-base font-black tracking-tight">AI Strategy Recommendations</h3>
|
||||||
</div>
|
</div>
|
||||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-4 animate-section animate-section-3">
|
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
|
||||||
{[
|
{[
|
||||||
{ tip: "Start with Chemistry (highest accuracy) to build momentum and bank easy marks in the first 40 minutes.", color: "text-green-400", label: "Opening Strategy" },
|
{ tip: "Start with Chemistry (highest accuracy) to build momentum and bank easy marks in the first 40 minutes.", color: "text-green-400", label: "Opening Strategy" },
|
||||||
{ tip: "Attempt Physics only if you are 80%+ confident per question. Otherwise, mark and skip — recover in last 10 min buffer.", color: "text-red-400", label: "Physics Guard" },
|
{ tip: "Attempt Physics only if you are 80%+ confident per question. Otherwise, mark and skip — recover in last 10 min buffer.", color: "text-red-400", label: "Physics Guard" },
|
||||||
|
|||||||
@@ -14,7 +14,7 @@ export default function StudyPlanPage() {
|
|||||||
return (
|
return (
|
||||||
<div className="p-6 md:p-8 space-y-8 max-w-7xl mx-auto min-h-screen">
|
<div className="p-6 md:p-8 space-y-8 max-w-7xl mx-auto min-h-screen">
|
||||||
{/* Page Header */}
|
{/* Page Header */}
|
||||||
<div className="border-b border-border/50 pb-6 animate-section animate-section-1">
|
<div className="border-b border-border/50 pb-6">
|
||||||
<div className="flex items-start justify-between gap-4 flex-wrap">
|
<div className="flex items-start justify-between gap-4 flex-wrap">
|
||||||
<div>
|
<div>
|
||||||
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-2">
|
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-2">
|
||||||
@@ -34,7 +34,7 @@ export default function StudyPlanPage() {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* KPI Strip */}
|
{/* KPI Strip */}
|
||||||
<div className="grid grid-cols-2 md:grid-cols-4 gap-4 animate-section animate-section-2">
|
<div className="grid grid-cols-2 md:grid-cols-4 gap-4">
|
||||||
{[
|
{[
|
||||||
{ label: "Tasks Today", value: isDemo ? "5" : "3", sub: isDemo ? "2 completed" : "0 completed", icon: <CheckCircle2 size={18} className="text-green-400" />, color: "border-green-400/20 bg-green-400/5" },
|
{ label: "Tasks Today", value: isDemo ? "5" : "3", sub: isDemo ? "2 completed" : "0 completed", icon: <CheckCircle2 size={18} className="text-green-400" />, color: "border-green-400/20 bg-green-400/5" },
|
||||||
{ label: "Study Hours Today", value: isDemo ? "3.8 hrs" : "0.0 hrs", sub: "Target: 5 hrs", icon: <Clock size={18} className="text-[var(--cyan-ai)]" />, color: "border-[var(--cyan-ai-20)] bg-[var(--cyan-ai-10)]" },
|
{ label: "Study Hours Today", value: isDemo ? "3.8 hrs" : "0.0 hrs", sub: "Target: 5 hrs", icon: <Clock size={18} className="text-[var(--cyan-ai)]" />, color: "border-[var(--cyan-ai-20)] bg-[var(--cyan-ai-10)]" },
|
||||||
@@ -52,7 +52,7 @@ export default function StudyPlanPage() {
|
|||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="grid grid-cols-1 lg:grid-cols-3 gap-8 animate-section animate-section-3">
|
<div className="grid grid-cols-1 lg:grid-cols-3 gap-8">
|
||||||
<div className="lg:col-span-2 space-y-8">
|
<div className="lg:col-span-2 space-y-8">
|
||||||
{/* Today's Schedule */}
|
{/* Today's Schedule */}
|
||||||
<div className="space-y-3">
|
<div className="space-y-3">
|
||||||
|
|||||||
@@ -71,7 +71,7 @@ export default function TimeOptimizationPage() {
|
|||||||
return (
|
return (
|
||||||
<div className="p-6 md:p-8 max-w-7xl mx-auto space-y-8 min-h-screen">
|
<div className="p-6 md:p-8 max-w-7xl mx-auto space-y-8 min-h-screen">
|
||||||
{/* Page Header */}
|
{/* Page Header */}
|
||||||
<div className="border-b border-border/50 pb-6 animate-section animate-section-1">
|
<div className="border-b border-border/50 pb-6">
|
||||||
<div className="flex items-start justify-between gap-4 flex-wrap">
|
<div className="flex items-start justify-between gap-4 flex-wrap">
|
||||||
<div>
|
<div>
|
||||||
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-2">
|
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-2">
|
||||||
@@ -91,7 +91,7 @@ export default function TimeOptimizationPage() {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* KPI Strip */}
|
{/* KPI Strip */}
|
||||||
<div className="grid grid-cols-2 md:grid-cols-4 gap-4 animate-section animate-section-1">
|
<div className="grid grid-cols-2 md:grid-cols-4 gap-4">
|
||||||
{[
|
{[
|
||||||
{ label: "Peak Efficiency", value: isDemo ? "95%" : "--", sub: isDemo ? "2–5 PM window" : "Calibrating", color: "border-yellow-400/20 bg-yellow-400/5", icon: <Sun size={18} className="text-yellow-400" /> },
|
{ label: "Peak Efficiency", value: isDemo ? "95%" : "--", sub: isDemo ? "2–5 PM window" : "Calibrating", color: "border-yellow-400/20 bg-yellow-400/5", icon: <Sun size={18} className="text-yellow-400" /> },
|
||||||
{ label: "Study Hrs Today", value: isDemo ? "3.8 h" : "0.0 h", sub: "Target: 6 h", color: "border-[var(--cyan-ai-20)] bg-[var(--cyan-ai-10)]", icon: <Clock size={18} className="text-[var(--cyan-ai)]" /> },
|
{ label: "Study Hrs Today", value: isDemo ? "3.8 h" : "0.0 h", sub: "Target: 6 h", color: "border-[var(--cyan-ai-20)] bg-[var(--cyan-ai-10)]", icon: <Clock size={18} className="text-[var(--cyan-ai)]" /> },
|
||||||
@@ -109,7 +109,7 @@ export default function TimeOptimizationPage() {
|
|||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="grid grid-cols-1 lg:grid-cols-3 gap-8 animate-section animate-section-2">
|
<div className="grid grid-cols-1 lg:grid-cols-3 gap-8">
|
||||||
{/* Chart — 2/3 */}
|
{/* Chart — 2/3 */}
|
||||||
<div className="lg:col-span-2 space-y-4">
|
<div className="lg:col-span-2 space-y-4">
|
||||||
<div className="flex items-center gap-2 text-sm font-black uppercase tracking-wider text-muted-foreground">
|
<div className="flex items-center gap-2 text-sm font-black uppercase tracking-wider text-muted-foreground">
|
||||||
|
|||||||
@@ -6,7 +6,7 @@ import { BrainCircuit, Sparkles } from "lucide-react"
|
|||||||
export default function TutorChatPage() {
|
export default function TutorChatPage() {
|
||||||
return (
|
return (
|
||||||
<div className="h-[calc(100vh-100px)] w-full flex flex-col pt-4 max-w-7xl mx-auto px-4 gap-4">
|
<div className="h-[calc(100vh-100px)] w-full flex flex-col pt-4 max-w-7xl mx-auto px-4 gap-4">
|
||||||
<div className="border-b border-border/50 pb-4 animate-section animate-section-1">
|
<div className="border-b border-border/50 pb-4">
|
||||||
<div className="flex items-start justify-between gap-4 flex-wrap">
|
<div className="flex items-start justify-between gap-4 flex-wrap">
|
||||||
<div>
|
<div>
|
||||||
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
|
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
|
||||||
@@ -26,7 +26,7 @@ export default function TutorChatPage() {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="flex-1 rounded-3xl overflow-hidden border border-border/50 shadow-xl bg-background flex flex-col h-full animate-section animate-section-2">
|
<div className="flex-1 rounded-3xl overflow-hidden border border-border/50 shadow-xl bg-background flex flex-col h-full">
|
||||||
<TutorChat />
|
<TutorChat />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -43,7 +43,7 @@ export default function WeeklyProgressPage() {
|
|||||||
return (
|
return (
|
||||||
<div className="p-6 md:p-8 max-w-7xl mx-auto space-y-8 min-h-screen">
|
<div className="p-6 md:p-8 max-w-7xl mx-auto space-y-8 min-h-screen">
|
||||||
{/* Page Header */}
|
{/* Page Header */}
|
||||||
<div className="border-b border-border/50 pb-6 animate-section animate-section-1">
|
<div className="border-b border-border/50 pb-6">
|
||||||
<div className="flex items-start justify-between gap-4 flex-wrap">
|
<div className="flex items-start justify-between gap-4 flex-wrap">
|
||||||
<div>
|
<div>
|
||||||
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
|
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
|
||||||
@@ -65,7 +65,7 @@ export default function WeeklyProgressPage() {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* KPI Stats Row */}
|
{/* KPI Stats Row */}
|
||||||
<div className="grid grid-cols-2 lg:grid-cols-4 gap-4 animate-section animate-section-1">
|
<div className="grid grid-cols-2 lg:grid-cols-4 gap-4">
|
||||||
{stats.map((stat) => (
|
{stats.map((stat) => (
|
||||||
<Card key={stat.label} className="bg-secondary/20 border-border/60 rounded-2xl">
|
<Card key={stat.label} className="bg-secondary/20 border-border/60 rounded-2xl">
|
||||||
<CardContent className="p-4">
|
<CardContent className="p-4">
|
||||||
@@ -80,7 +80,7 @@ export default function WeeklyProgressPage() {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Main Content Grid */}
|
{/* Main Content Grid */}
|
||||||
<div className="grid grid-cols-1 lg:grid-cols-3 gap-8 animate-section animate-section-2">
|
<div className="grid grid-cols-1 lg:grid-cols-3 gap-8">
|
||||||
{/* Weekly Bar Chart */}
|
{/* Weekly Bar Chart */}
|
||||||
<div className="lg:col-span-2 space-y-4">
|
<div className="lg:col-span-2 space-y-4">
|
||||||
<div className="flex items-center justify-between">
|
<div className="flex items-center justify-between">
|
||||||
|
|||||||
@@ -59,7 +59,7 @@ export default function AnalyticsPage() {
|
|||||||
return (
|
return (
|
||||||
<PremiumGate featureKey="detailed-performance-analytics">
|
<PremiumGate featureKey="detailed-performance-analytics">
|
||||||
<div className="p-8 space-y-8 max-w-7xl mx-auto">
|
<div className="p-8 space-y-8 max-w-7xl mx-auto">
|
||||||
<div className="flex flex-col md:flex-row md:items-end justify-between gap-4 animate-section animate-section-1">
|
<div className="flex flex-col md:flex-row md:items-end justify-between gap-4">
|
||||||
<div>
|
<div>
|
||||||
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
|
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
|
||||||
<span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[var(--cyan-ai-10)] border border-yellow-300/60 dark:border-[var(--cyan-ai-20)]">
|
<span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[var(--cyan-ai-10)] border border-yellow-300/60 dark:border-[var(--cyan-ai-20)]">
|
||||||
@@ -73,7 +73,7 @@ export default function AnalyticsPage() {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6 animate-section animate-section-2">
|
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
|
||||||
<Card className="col-span-1 lg:col-span-2 border-border shadow-sm bg-background">
|
<Card className="col-span-1 lg:col-span-2 border-border shadow-sm bg-background">
|
||||||
<CardHeader>
|
<CardHeader>
|
||||||
<CardTitle className="flex items-center gap-2"><LineChartIcon className="text-[var(--cyan-ai)]" size={20} /> Projected Score Trajectory</CardTitle>
|
<CardTitle className="flex items-center gap-2"><LineChartIcon className="text-[var(--cyan-ai)]" size={20} /> Projected Score Trajectory</CardTitle>
|
||||||
|
|||||||
@@ -93,7 +93,7 @@ export default function AttemptHistoryPage({ params }: { params: Promise<{ attem
|
|||||||
<ArrowLeft size={16} className="mr-2" /> {test?.type === 'DPS' ? 'Back to PrepPilot AI' : 'Back to Tests'}
|
<ArrowLeft size={16} className="mr-2" /> {test?.type === 'DPS' ? 'Back to PrepPilot AI' : 'Back to Tests'}
|
||||||
</Link>
|
</Link>
|
||||||
|
|
||||||
<div className="flex flex-col md:flex-row gap-8 mb-10 animate-section animate-section-1">
|
<div className="flex flex-col md:flex-row gap-8 mb-10">
|
||||||
<div className="flex-1">
|
<div className="flex-1">
|
||||||
<h1 className="text-3xl font-bold tracking-tight mb-2">{test?.title || 'Practice Test'} Solutions</h1>
|
<h1 className="text-3xl font-bold tracking-tight mb-2">{test?.title || 'Practice Test'} Solutions</h1>
|
||||||
<p className="text-muted-foreground">Review your performance, detailed solutions, and identify your weak spots.</p>
|
<p className="text-muted-foreground">Review your performance, detailed solutions, and identify your weak spots.</p>
|
||||||
@@ -127,7 +127,7 @@ export default function AttemptHistoryPage({ params }: { params: Promise<{ attem
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="space-y-6 animate-section animate-section-2">
|
<div className="space-y-6">
|
||||||
<h2 className="text-xl font-bold border-b border-border pb-2">Answer Key & Explanations</h2>
|
<h2 className="text-xl font-bold border-b border-border pb-2">Answer Key & Explanations</h2>
|
||||||
|
|
||||||
{attempt.answers.map((ans: any, idx: number) => {
|
{attempt.answers.map((ans: any, idx: number) => {
|
||||||
|
|||||||
@@ -164,7 +164,7 @@ export default function CBTPage() {
|
|||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div className="p-8 space-y-8 max-w-7xl mx-auto">
|
<div className="p-8 space-y-8 max-w-7xl mx-auto">
|
||||||
<div className="flex flex-col md:flex-row md:items-end justify-between gap-4 animate-section animate-section-1">
|
<div className="flex flex-col md:flex-row md:items-end justify-between gap-4">
|
||||||
<div>
|
<div>
|
||||||
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
|
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
|
||||||
<span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[var(--cyan-ai-10)] border border-yellow-300/60 dark:border-[var(--cyan-ai-20)]">
|
<span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[var(--cyan-ai-10)] border border-yellow-300/60 dark:border-[var(--cyan-ai-20)]">
|
||||||
@@ -198,7 +198,7 @@ export default function CBTPage() {
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div className="space-y-6 animate-section animate-section-2">
|
<div className="space-y-6">
|
||||||
<h2 className="text-xl font-bold border-b border-border pb-2 flex items-center gap-2">
|
<h2 className="text-xl font-bold border-b border-border pb-2 flex items-center gap-2">
|
||||||
<Clock size={20} className="text-[var(--cyan-ai)]" /> Upcoming & Active Exams
|
<Clock size={20} className="text-[var(--cyan-ai)]" /> Upcoming & Active Exams
|
||||||
</h2>
|
</h2>
|
||||||
@@ -334,7 +334,7 @@ export default function CBTPage() {
|
|||||||
})()}
|
})()}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="space-y-6 pt-8 animate-section animate-section-3">
|
<div className="space-y-6 pt-8">
|
||||||
<h2 className="text-xl font-bold border-b border-border pb-2 flex items-center gap-2">
|
<h2 className="text-xl font-bold border-b border-border pb-2 flex items-center gap-2">
|
||||||
<Activity size={20} className="text-muted-foreground" /> Past Attempts
|
<Activity size={20} className="text-muted-foreground" /> Past Attempts
|
||||||
</h2>
|
</h2>
|
||||||
|
|||||||
@@ -89,7 +89,7 @@ export default function CommunityPage() {
|
|||||||
if (!hasAccessTo("doubt-resolution-community") && !isDemo) {
|
if (!hasAccessTo("doubt-resolution-community") && !isDemo) {
|
||||||
return (
|
return (
|
||||||
<div className="p-8 space-y-8 max-w-7xl mx-auto">
|
<div className="p-8 space-y-8 max-w-7xl mx-auto">
|
||||||
<div className="flex flex-col md:flex-row md:items-end justify-between gap-4 animate-section animate-section-1">
|
<div className="flex flex-col md:flex-row md:items-end justify-between gap-4">
|
||||||
<div>
|
<div>
|
||||||
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
|
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
|
||||||
<span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[var(--cyan-ai-10)] border border-yellow-300/60 dark:border-[var(--cyan-ai-20)]">
|
<span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[var(--cyan-ai-10)] border border-yellow-300/60 dark:border-[var(--cyan-ai-20)]">
|
||||||
@@ -102,7 +102,7 @@ export default function CommunityPage() {
|
|||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="p-12 text-center max-w-2xl mx-auto bg-secondary/20 border border-border rounded-3xl space-y-6 animate-section animate-section-2">
|
<div className="p-12 text-center max-w-2xl mx-auto bg-secondary/20 border border-border rounded-3xl space-y-6">
|
||||||
<div className="size-20 rounded-full bg-red-500/10 flex items-center justify-center mx-auto text-red-500">
|
<div className="size-20 rounded-full bg-red-500/10 flex items-center justify-center mx-auto text-red-500">
|
||||||
<Lock size={40} />
|
<Lock size={40} />
|
||||||
</div>
|
</div>
|
||||||
@@ -123,7 +123,7 @@ export default function CommunityPage() {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="p-8 space-y-8 max-w-7xl mx-auto">
|
<div className="p-8 space-y-8 max-w-7xl mx-auto">
|
||||||
<div className="flex flex-col md:flex-row justify-between items-start md:items-end gap-4 animate-section animate-section-1">
|
<div className="flex flex-col md:flex-row justify-between items-start md:items-end gap-4">
|
||||||
<div>
|
<div>
|
||||||
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
|
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
|
||||||
<span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[var(--cyan-ai-10)] border border-yellow-300/60 dark:border-[var(--cyan-ai-20)]">
|
<span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[var(--cyan-ai-10)] border border-yellow-300/60 dark:border-[var(--cyan-ai-20)]">
|
||||||
@@ -143,7 +143,7 @@ export default function CommunityPage() {
|
|||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="flex flex-col md:flex-row gap-4 animate-section animate-section-2">
|
<div className="flex flex-col md:flex-row gap-4">
|
||||||
<div className="relative flex-1">
|
<div className="relative flex-1">
|
||||||
<div className="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
|
<div className="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
|
||||||
<Search size={18} className="text-muted-foreground" />
|
<Search size={18} className="text-muted-foreground" />
|
||||||
@@ -165,7 +165,7 @@ export default function CommunityPage() {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="space-y-4 animate-section animate-section-3">
|
<div className="space-y-4">
|
||||||
{loading ? (
|
{loading ? (
|
||||||
<div className="text-center py-12 text-muted-foreground animate-pulse">Loading doubts...</div>
|
<div className="text-center py-12 text-muted-foreground animate-pulse">Loading doubts...</div>
|
||||||
) : (<>{filteredDoubts.map((doubt) => (
|
) : (<>{filteredDoubts.map((doubt) => (
|
||||||
|
|||||||
@@ -136,7 +136,7 @@ export default function AIDailyPracticePage() {
|
|||||||
return (
|
return (
|
||||||
<div className="p-6 md:p-8 space-y-6 max-w-7xl mx-auto">
|
<div className="p-6 md:p-8 space-y-6 max-w-7xl mx-auto">
|
||||||
{/* Page Header */}
|
{/* Page Header */}
|
||||||
<div className="border-b border-border/50 pb-6 animate-section animate-section-1">
|
<div className="border-b border-border/50 pb-6">
|
||||||
<div className="flex items-start justify-between gap-4 flex-wrap">
|
<div className="flex items-start justify-between gap-4 flex-wrap">
|
||||||
<div>
|
<div>
|
||||||
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
|
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
|
||||||
@@ -152,7 +152,7 @@ export default function AIDailyPracticePage() {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Calendar Filter & Controller Bar */}
|
{/* Calendar Filter & Controller Bar */}
|
||||||
<div className="flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4 border-b border-border pb-6 animate-section animate-section-2">
|
<div className="flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4 border-b border-border pb-6">
|
||||||
<div className="flex items-center gap-3 flex-wrap">
|
<div className="flex items-center gap-3 flex-wrap">
|
||||||
<CalendarFilter
|
<CalendarFilter
|
||||||
selectedDate={dateFilter}
|
selectedDate={dateFilter}
|
||||||
@@ -171,7 +171,7 @@ export default function AIDailyPracticePage() {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-4 animate-section animate-section-3">
|
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||||
{loading ? (
|
{loading ? (
|
||||||
<div className="col-span-2 text-center py-12 text-muted-foreground">Loading AI-generated DPPs...</div>
|
<div className="col-span-2 text-center py-12 text-muted-foreground">Loading AI-generated DPPs...</div>
|
||||||
) : filteredDpps.length === 0 ? (
|
) : filteredDpps.length === 0 ? (
|
||||||
|
|||||||
@@ -430,7 +430,7 @@ export default function DashboardLayout({ children }: { children: ReactNode }) {
|
|||||||
|
|
||||||
{/* Scrollable page body */}
|
{/* Scrollable page body */}
|
||||||
<main className="flex-1 overflow-y-auto relative bg-background/50">
|
<main className="flex-1 overflow-y-auto relative bg-background/50">
|
||||||
<div key={pathname} className="w-full h-full animate-page-enter">
|
<div className="w-full h-full">
|
||||||
{children}
|
{children}
|
||||||
</div>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
|
|||||||
@@ -47,7 +47,7 @@ export default function LeaderboardPage() {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="p-8 space-y-8 max-w-7xl mx-auto">
|
<div className="p-8 space-y-8 max-w-7xl mx-auto">
|
||||||
<div className="flex flex-col md:flex-row justify-between items-start md:items-end gap-4 animate-section animate-section-1">
|
<div className="flex flex-col md:flex-row justify-between items-start md:items-end gap-4">
|
||||||
<div>
|
<div>
|
||||||
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
|
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
|
||||||
<span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[var(--cyan-ai-10)] border border-yellow-300/60 dark:border-[var(--cyan-ai-20)]">
|
<span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[var(--cyan-ai-10)] border border-yellow-300/60 dark:border-[var(--cyan-ai-20)]">
|
||||||
@@ -82,7 +82,7 @@ export default function LeaderboardPage() {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6 animate-section animate-section-2">
|
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
|
||||||
<div className="lg:col-span-2 space-y-4">
|
<div className="lg:col-span-2 space-y-4">
|
||||||
<div className="flex justify-between items-center bg-card border border-border rounded-xl p-4 shadow-sm sticky top-0 z-10 backdrop-blur-md bg-opacity-90">
|
<div className="flex justify-between items-center bg-card border border-border rounded-xl p-4 shadow-sm sticky top-0 z-10 backdrop-blur-md bg-opacity-90">
|
||||||
<span className="text-sm font-bold text-muted-foreground w-12 text-center">RANK</span>
|
<span className="text-sm font-bold text-muted-foreground w-12 text-center">RANK</span>
|
||||||
|
|||||||
@@ -33,7 +33,7 @@ export default function MaterialsPage() {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="p-8 space-y-8 max-w-7xl mx-auto">
|
<div className="p-8 space-y-8 max-w-7xl mx-auto">
|
||||||
<div className="flex flex-col md:flex-row md:items-end justify-between gap-4 animate-section animate-section-1">
|
<div className="flex flex-col md:flex-row md:items-end justify-between gap-4">
|
||||||
<div>
|
<div>
|
||||||
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
|
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
|
||||||
<span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[var(--cyan-ai-10)] border border-yellow-300/60 dark:border-[var(--cyan-ai-20)]">
|
<span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[var(--cyan-ai-10)] border border-yellow-300/60 dark:border-[var(--cyan-ai-20)]">
|
||||||
@@ -47,7 +47,7 @@ export default function MaterialsPage() {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4 animate-section animate-section-2">
|
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4">
|
||||||
{folders.map((folder, i) => (
|
{folders.map((folder, i) => (
|
||||||
<Card key={i} className="hover:bg-secondary/50 cursor-pointer transition-colors border-border shadow-none">
|
<Card key={i} className="hover:bg-secondary/50 cursor-pointer transition-colors border-border shadow-none">
|
||||||
<CardContent className="p-6">
|
<CardContent className="p-6">
|
||||||
@@ -59,7 +59,7 @@ export default function MaterialsPage() {
|
|||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="pt-6 animate-section animate-section-3">
|
<div className="pt-6">
|
||||||
<h2 className="text-xl font-bold border-b border-border pb-2 mb-4 flex items-center justify-between">
|
<h2 className="text-xl font-bold border-b border-border pb-2 mb-4 flex items-center justify-between">
|
||||||
<span>Recently Accessed Study Notes</span>
|
<span>Recently Accessed Study Notes</span>
|
||||||
<span className="text-xs font-normal text-muted-foreground">Click any PDF to launch fullscreen reader</span>
|
<span className="text-xs font-normal text-muted-foreground">Click any PDF to launch fullscreen reader</span>
|
||||||
|
|||||||
@@ -137,7 +137,7 @@ export default function DashboardPage() {
|
|||||||
<div className="p-8 max-w-7xl mx-auto space-y-8">
|
<div className="p-8 max-w-7xl mx-auto space-y-8">
|
||||||
|
|
||||||
{/* Page Header */}
|
{/* Page Header */}
|
||||||
<div className="flex flex-col md:flex-row md:items-end justify-between gap-4 animate-section animate-section-1">
|
<div className="flex flex-col md:flex-row md:items-end justify-between gap-4">
|
||||||
<div>
|
<div>
|
||||||
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
|
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
|
||||||
<span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[var(--cyan-ai-10)] border border-yellow-300/60 dark:border-[var(--cyan-ai-20)]">
|
<span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[var(--cyan-ai-10)] border border-yellow-300/60 dark:border-[var(--cyan-ai-20)]">
|
||||||
@@ -174,7 +174,7 @@ export default function DashboardPage() {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* KPI Stat Cards */}
|
{/* KPI Stat Cards */}
|
||||||
<div ref={progressRef} className="grid grid-cols-2 md:grid-cols-4 gap-4 animate-section animate-section-2">
|
<div ref={progressRef} className="grid grid-cols-2 md:grid-cols-4 gap-4">
|
||||||
{/* Today's Score */}
|
{/* Today's Score */}
|
||||||
<Card className="border-border shadow-sm">
|
<Card className="border-border shadow-sm">
|
||||||
<CardContent className="p-5 flex flex-col items-center text-center">
|
<CardContent className="p-5 flex flex-col items-center text-center">
|
||||||
@@ -240,7 +240,7 @@ export default function DashboardPage() {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Tests & DPPs Grid */}
|
{/* Tests & DPPs Grid */}
|
||||||
<div className="grid grid-cols-1 lg:grid-cols-2 gap-8 animate-section animate-section-3">
|
<div className="grid grid-cols-1 lg:grid-cols-2 gap-8">
|
||||||
{/* Dynamic DPP Modules */}
|
{/* Dynamic DPP Modules */}
|
||||||
<section>
|
<section>
|
||||||
<div className="flex items-center justify-between mb-5">
|
<div className="flex items-center justify-between mb-5">
|
||||||
@@ -347,7 +347,7 @@ export default function DashboardPage() {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* AI Intelligence Grid */}
|
{/* AI Intelligence Grid */}
|
||||||
<div className="grid grid-cols-1 lg:grid-cols-2 gap-8 animate-section animate-section-4">
|
<div className="grid grid-cols-1 lg:grid-cols-2 gap-8">
|
||||||
<div>
|
<div>
|
||||||
<AdaptiveStudyPlan />
|
<AdaptiveStudyPlan />
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -257,7 +257,7 @@ export default function ProgressTrackerPage() {
|
|||||||
if (!hasAccessTo("chapter-wise-progress-tracking") && !isDemo) {
|
if (!hasAccessTo("chapter-wise-progress-tracking") && !isDemo) {
|
||||||
return (
|
return (
|
||||||
<div className="p-8 space-y-8 max-w-7xl mx-auto">
|
<div className="p-8 space-y-8 max-w-7xl mx-auto">
|
||||||
<div className="flex flex-col md:flex-row md:items-end justify-between gap-4 animate-section animate-section-1">
|
<div className="flex flex-col md:flex-row md:items-end justify-between gap-4">
|
||||||
<div>
|
<div>
|
||||||
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
|
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
|
||||||
<span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[var(--cyan-ai-10)] border border-yellow-300/60 dark:border-[var(--cyan-ai-20)]">
|
<span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[var(--cyan-ai-10)] border border-yellow-300/60 dark:border-[var(--cyan-ai-20)]">
|
||||||
@@ -270,7 +270,7 @@ export default function ProgressTrackerPage() {
|
|||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="p-12 text-center max-w-2xl mx-auto bg-secondary/20 border border-border rounded-3xl space-y-6 animate-section animate-section-2">
|
<div className="p-12 text-center max-w-2xl mx-auto bg-secondary/20 border border-border rounded-3xl space-y-6">
|
||||||
<div className="size-20 rounded-full bg-red-500/10 flex items-center justify-center mx-auto text-red-500">
|
<div className="size-20 rounded-full bg-red-500/10 flex items-center justify-center mx-auto text-red-500">
|
||||||
<Lock size={40} />
|
<Lock size={40} />
|
||||||
</div>
|
</div>
|
||||||
@@ -299,7 +299,7 @@ export default function ProgressTrackerPage() {
|
|||||||
return (
|
return (
|
||||||
|
|
||||||
<div className="p-8 space-y-8 max-w-7xl mx-auto">
|
<div className="p-8 space-y-8 max-w-7xl mx-auto">
|
||||||
<div className="flex flex-col md:flex-row md:items-end justify-between gap-4 animate-section animate-section-1">
|
<div className="flex flex-col md:flex-row md:items-end justify-between gap-4">
|
||||||
<div>
|
<div>
|
||||||
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
|
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
|
||||||
<span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[var(--cyan-ai-10)] border border-yellow-300/60 dark:border-[var(--cyan-ai-20)]">
|
<span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[var(--cyan-ai-10)] border border-yellow-300/60 dark:border-[var(--cyan-ai-20)]">
|
||||||
@@ -313,7 +313,7 @@ export default function ProgressTrackerPage() {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className={`grid grid-cols-1 sm:grid-cols-2 ${subjects.length >= 4 ? 'lg:grid-cols-4' : 'md:grid-cols-3'} gap-6 mb-8 animate-section animate-section-2`}>
|
<div className={`grid grid-cols-1 sm:grid-cols-2 ${subjects.length >= 4 ? 'lg:grid-cols-4' : 'md:grid-cols-3'} gap-6 mb-8`}>
|
||||||
{subjects.map((sub, i) => (
|
{subjects.map((sub, i) => (
|
||||||
<Card key={i} className="border-border shadow-sm">
|
<Card key={i} className="border-border shadow-sm">
|
||||||
<CardContent className="p-6 text-center">
|
<CardContent className="p-6 text-center">
|
||||||
@@ -327,7 +327,7 @@ export default function ProgressTrackerPage() {
|
|||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="space-y-6 animate-section animate-section-3">
|
<div className="space-y-6">
|
||||||
{subjects.map((subject, subIndex) => (
|
{subjects.map((subject, subIndex) => (
|
||||||
<Card key={subIndex} className="border-border shadow-sm overflow-hidden">
|
<Card key={subIndex} className="border-border shadow-sm overflow-hidden">
|
||||||
<CardHeader className="bg-secondary/30 pb-4 border-b border-border">
|
<CardHeader className="bg-secondary/30 pb-4 border-b border-border">
|
||||||
|
|||||||
@@ -75,7 +75,7 @@ export default function RankPredictorPage() {
|
|||||||
<div className="p-6 md:p-8 space-y-8 max-w-7xl mx-auto min-h-screen">
|
<div className="p-6 md:p-8 space-y-8 max-w-7xl mx-auto min-h-screen">
|
||||||
|
|
||||||
{/* Header */}
|
{/* Header */}
|
||||||
<div className="text-center max-w-3xl mx-auto space-y-3 animate-section animate-section-1">
|
<div className="text-center max-w-3xl mx-auto space-y-3">
|
||||||
<div className="inline-flex items-center gap-2 px-4 py-1.5 bg-[var(--cyan-ai-10)] text-[var(--cyan-ai)] rounded-full border border-[var(--cyan-ai-30)] text-xs font-black tracking-widest uppercase shadow-[0_0_15px_rgba(12,96,96,0.15)]">
|
<div className="inline-flex items-center gap-2 px-4 py-1.5 bg-[var(--cyan-ai-10)] text-[var(--cyan-ai)] rounded-full border border-[var(--cyan-ai-30)] text-xs font-black tracking-widest uppercase shadow-[0_0_15px_rgba(12,96,96,0.15)]">
|
||||||
<Sparkles size={14} /> AI Neural Prediction Engine
|
<Sparkles size={14} /> AI Neural Prediction Engine
|
||||||
</div>
|
</div>
|
||||||
@@ -133,7 +133,7 @@ export default function RankPredictorPage() {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Main Grid */}
|
{/* Main Grid */}
|
||||||
<div className="grid grid-cols-1 lg:grid-cols-3 gap-8 animate-section animate-section-2">
|
<div className="grid grid-cols-1 lg:grid-cols-3 gap-8">
|
||||||
|
|
||||||
{/* Left Interactive Simulator */}
|
{/* Left Interactive Simulator */}
|
||||||
<div className="lg:col-span-2 space-y-6">
|
<div className="lg:col-span-2 space-y-6">
|
||||||
|
|||||||
@@ -108,7 +108,7 @@ export default function SettingsPage() {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="p-8 space-y-8 max-w-7xl mx-auto">
|
<div className="p-8 space-y-8 max-w-7xl mx-auto">
|
||||||
<div className="flex flex-col md:flex-row md:items-end justify-between gap-4 animate-section animate-section-1">
|
<div className="flex flex-col md:flex-row md:items-end justify-between gap-4">
|
||||||
<div>
|
<div>
|
||||||
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
|
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
|
||||||
<span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[var(--cyan-ai-10)] border border-yellow-300/60 dark:border-[var(--cyan-ai-20)]">
|
<span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[var(--cyan-ai-10)] border border-yellow-300/60 dark:border-[var(--cyan-ai-20)]">
|
||||||
@@ -122,7 +122,7 @@ export default function SettingsPage() {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-8 animate-section animate-section-2">
|
<div className="grid grid-cols-1 md:grid-cols-3 gap-8">
|
||||||
{/* Profile photo upload tile */}
|
{/* Profile photo upload tile */}
|
||||||
<Card className="border-border bg-background shadow-sm md:col-span-1 h-fit">
|
<Card className="border-border bg-background shadow-sm md:col-span-1 h-fit">
|
||||||
<CardHeader>
|
<CardHeader>
|
||||||
|
|||||||
@@ -46,7 +46,7 @@ export default function PasswordPage() {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="p-8 space-y-8 max-w-3xl mx-auto">
|
<div className="p-8 space-y-8 max-w-3xl mx-auto">
|
||||||
<div className="flex flex-col md:flex-row md:items-end justify-between gap-4 animate-section animate-section-1">
|
<div className="flex flex-col md:flex-row md:items-end justify-between gap-4">
|
||||||
<div>
|
<div>
|
||||||
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
|
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
|
||||||
<span className="p-2.5 rounded-xl bg-purple-50 dark:bg-[var(--cyan-ai-10)] border border-purple-300/60 dark:border-[var(--cyan-ai-20)]">
|
<span className="p-2.5 rounded-xl bg-purple-50 dark:bg-[var(--cyan-ai-10)] border border-purple-300/60 dark:border-[var(--cyan-ai-20)]">
|
||||||
@@ -60,7 +60,7 @@ export default function PasswordPage() {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<Card className="border-border bg-background shadow-sm animate-section animate-section-2">
|
<Card className="border-border bg-background shadow-sm">
|
||||||
<CardHeader>
|
<CardHeader>
|
||||||
<CardTitle>Change Password</CardTitle>
|
<CardTitle>Change Password</CardTitle>
|
||||||
<CardDescription>Update your account password</CardDescription>
|
<CardDescription>Update your account password</CardDescription>
|
||||||
|
|||||||
@@ -47,7 +47,7 @@ export default function StreaksPage() {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="p-8 space-y-8 max-w-7xl mx-auto">
|
<div className="p-8 space-y-8 max-w-7xl mx-auto">
|
||||||
<div className="flex flex-col md:flex-row md:items-end justify-between gap-4 animate-section animate-section-1">
|
<div className="flex flex-col md:flex-row md:items-end justify-between gap-4">
|
||||||
<div>
|
<div>
|
||||||
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
|
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
|
||||||
<span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[var(--cyan-ai-10)] border border-yellow-300/60 dark:border-[var(--cyan-ai-20)]">
|
<span className="p-2.5 rounded-xl bg-yellow-50 dark:bg-[var(--cyan-ai-10)] border border-yellow-300/60 dark:border-[var(--cyan-ai-20)]">
|
||||||
@@ -61,7 +61,7 @@ export default function StreaksPage() {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-6 animate-section animate-section-2">
|
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||||
<Card className="bg-gradient-to-br from-orange-500/20 to-rose-500/5 border-orange-500/30">
|
<Card className="bg-gradient-to-br from-orange-500/20 to-rose-500/5 border-orange-500/30">
|
||||||
<CardContent className="p-8 flex flex-col items-center justify-center text-center h-full">
|
<CardContent className="p-8 flex flex-col items-center justify-center text-center h-full">
|
||||||
<Flame size={64} className="text-orange-500 mb-4 animate-pulse" />
|
<Flame size={64} className="text-orange-500 mb-4 animate-pulse" />
|
||||||
@@ -106,7 +106,7 @@ export default function StreaksPage() {
|
|||||||
</Card>
|
</Card>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="pt-8 animate-section animate-section-3">
|
<div className="pt-8">
|
||||||
<h2 className="text-2xl font-bold mb-6 flex items-center gap-2"><Gift className="text-[var(--cyan-ai)]" /> Streak Rewards</h2>
|
<h2 className="text-2xl font-bold mb-6 flex items-center gap-2"><Gift className="text-[var(--cyan-ai)]" /> Streak Rewards</h2>
|
||||||
<div className="space-y-4">
|
<div className="space-y-4">
|
||||||
{rewards.map((reward, i) => (
|
{rewards.map((reward, i) => (
|
||||||
|
|||||||
@@ -121,21 +121,20 @@ body {
|
|||||||
text-wrap: balance;
|
text-wrap: balance;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ─── Uniform staggered subtle page & section entry animations ─── */
|
/* ─── Intro/opening animations removed for rock-solid instant page display ─── */
|
||||||
.animate-page-enter {
|
.animate-page-enter,
|
||||||
animation: pageFadeIn 0.25s cubic-bezier(0.16, 1, 0.3, 1) both;
|
.animate-section,
|
||||||
|
.animate-section-1,
|
||||||
|
.animate-section-2,
|
||||||
|
.animate-section-3,
|
||||||
|
.animate-section-4,
|
||||||
|
.animate-section-5,
|
||||||
|
.animate-section-6 {
|
||||||
|
animation: none !important;
|
||||||
|
opacity: 1 !important;
|
||||||
|
transform: none !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.animate-section {
|
|
||||||
animation: sectionFadeUp 0.32s cubic-bezier(0.16, 1, 0.3, 1) both;
|
|
||||||
}
|
|
||||||
.animate-section-1 { animation-delay: 0ms; }
|
|
||||||
.animate-section-2 { animation-delay: 50ms; }
|
|
||||||
.animate-section-3 { animation-delay: 100ms; }
|
|
||||||
.animate-section-4 { animation-delay: 150ms; }
|
|
||||||
.animate-section-5 { animation-delay: 200ms; }
|
|
||||||
.animate-section-6 { animation-delay: 250ms; }
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
.bg-grid {
|
.bg-grid {
|
||||||
@@ -191,23 +190,3 @@ body {
|
|||||||
background: var(--muted-foreground);
|
background: var(--muted-foreground);
|
||||||
}
|
}
|
||||||
|
|
||||||
@keyframes pageFadeIn {
|
|
||||||
from {
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
to {
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes sectionFadeUp {
|
|
||||||
from {
|
|
||||||
opacity: 0;
|
|
||||||
transform: translateY(8px);
|
|
||||||
}
|
|
||||||
to {
|
|
||||||
opacity: 1;
|
|
||||||
transform: translateY(0);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|||||||
@@ -14,7 +14,7 @@ export function PremiumGate({ featureKey, children }: PremiumGateProps) {
|
|||||||
const { hasAccessTo, loading, user } = useActiveUser();
|
const { hasAccessTo, loading, user } = useActiveUser();
|
||||||
|
|
||||||
// Allow children to render immediately without a blocking center spinner
|
// Allow children to render immediately without a blocking center spinner
|
||||||
// so that page entry animations (animate-section) execute smoothly on route transition.
|
// so that pages mount instantly on route transition.
|
||||||
if (loading || !user) {
|
if (loading || !user) {
|
||||||
return <>{children}</>;
|
return <>{children}</>;
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user