From 42813ef9e0432d025c0e7dff99bbb41b4b91345d Mon Sep 17 00:00:00 2001 From: ectasy663 Date: Fri, 23 Oct 2026 14:35:20 +0530 Subject: [PATCH] feat: uniform staggered page-load animations across all dashboard pages --- src/app/dashboard/ai-coach/cbt-dpp/page.tsx | 4 +-- .../ai-coach/college-predictor/page.tsx | 4 +-- src/app/dashboard/ai-coach/heatmap/page.tsx | 8 +++--- src/app/dashboard/ai-coach/page.tsx | 10 ++++---- src/app/dashboard/ai-coach/readiness/page.tsx | 18 ++++++------- src/app/dashboard/ai-coach/strategy/page.tsx | 22 ++++++++-------- .../dashboard/ai-coach/study-plan/page.tsx | 12 ++++----- .../ai-coach/time-optimization/page.tsx | 6 ++--- .../ai-coach/weekly-progress/page.tsx | 6 ++--- src/app/dashboard/analytics/page.tsx | 4 +-- src/app/dashboard/cbt/page.tsx | 6 ++--- src/app/dashboard/community/page.tsx | 6 ++--- src/app/dashboard/dpp/page.tsx | 6 ++--- src/app/dashboard/leaderboard/page.tsx | 4 +-- src/app/dashboard/materials/page.tsx | 8 +++--- src/app/dashboard/page.tsx | 10 ++++---- src/app/dashboard/progress/page.tsx | 6 ++--- src/app/dashboard/settings/page.tsx | 4 +-- src/app/dashboard/streaks/page.tsx | 8 +++--- src/app/globals.css | 25 +++++++++++++++++++ 20 files changed, 101 insertions(+), 76 deletions(-) diff --git a/src/app/dashboard/ai-coach/cbt-dpp/page.tsx b/src/app/dashboard/ai-coach/cbt-dpp/page.tsx index 3a774ca..f5f25fb 100644 --- a/src/app/dashboard/ai-coach/cbt-dpp/page.tsx +++ b/src/app/dashboard/ai-coach/cbt-dpp/page.tsx @@ -132,7 +132,7 @@ export default function DPPPage() { const cleanTitle = (title: string) => title.replace(/\s*\(ExamEnum\.[^)]+\)/, ''); return ( -
+

@@ -175,7 +175,7 @@ export default function DPPPage() {

-
+
{loading ? (
Loading AI-generated DPPs...
) : filteredDpps.length === 0 ? ( diff --git a/src/app/dashboard/ai-coach/college-predictor/page.tsx b/src/app/dashboard/ai-coach/college-predictor/page.tsx index 136f0c6..3eedce4 100644 --- a/src/app/dashboard/ai-coach/college-predictor/page.tsx +++ b/src/app/dashboard/ai-coach/college-predictor/page.tsx @@ -91,7 +91,7 @@ export default function CollegePredictorPage() { return (
{/* Page Header */} -
+

@@ -110,7 +110,7 @@ export default function CollegePredictorPage() {

-
+
{/* Left Box: Graph */} diff --git a/src/app/dashboard/ai-coach/heatmap/page.tsx b/src/app/dashboard/ai-coach/heatmap/page.tsx index 835c897..316d18e 100644 --- a/src/app/dashboard/ai-coach/heatmap/page.tsx +++ b/src/app/dashboard/ai-coach/heatmap/page.tsx @@ -37,7 +37,7 @@ export default function HeatmapPage() { return (
{/* Page Header */} -
+

@@ -57,7 +57,7 @@ export default function HeatmapPage() {

{/* KPI Strip */} -
+
{summaryStats.map((kpi) => ( @@ -70,7 +70,7 @@ export default function HeatmapPage() {
{/* Legend / Guidance Row */} -
+
{[ { 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" }, @@ -90,7 +90,7 @@ export default function HeatmapPage() {
{/* Main 2-col layout */} -
+
{/* Heatmap — takes 2/3 */}
diff --git a/src/app/dashboard/ai-coach/page.tsx b/src/app/dashboard/ai-coach/page.tsx index 54775b1..dc5f7e2 100644 --- a/src/app/dashboard/ai-coach/page.tsx +++ b/src/app/dashboard/ai-coach/page.tsx @@ -92,7 +92,7 @@ export default function AICoachDashboard() {
{/* ── METRICS BAR ── */} -
+
{user?.streak_count || 1}-Day Streak @@ -108,10 +108,10 @@ export default function AICoachDashboard() {
{/* ── DAILY CHALLENGE BANNER ── */} - +
{/* ── QUICK STATS ── */} -
+
{[ { label: "Questions Solved", value: questionsSolved, color: "text-[var(--cyan-ai)]", bg: "bg-[var(--cyan-ai-10)]", border: "border-[var(--cyan-ai-20)]", icon: }, { label: "Overall Accuracy", value: overallAccuracy, color: "text-amber-500", bg: "bg-amber-500/5", border: "border-amber-500/20", icon: }, @@ -130,7 +130,7 @@ export default function AICoachDashboard() {
{/* ── PREDICTIVE INTELLIGENCE ROW ── */} -
+
@@ -152,7 +152,7 @@ export default function AICoachDashboard() { {/* ── HEATMAP / STUDY PLAN / WEEKLY REPORT ── */} -
+
diff --git a/src/app/dashboard/ai-coach/readiness/page.tsx b/src/app/dashboard/ai-coach/readiness/page.tsx index d08aa22..08ff6e2 100644 --- a/src/app/dashboard/ai-coach/readiness/page.tsx +++ b/src/app/dashboard/ai-coach/readiness/page.tsx @@ -1,4 +1,4 @@ -"use client" +"use client" import { ReadinessGauge } from "@/components/AI/ReadinessGauge" import { Card, CardContent } from "@/components/ui/card" @@ -34,7 +34,7 @@ export default function ReadinessPage() { return (
{/* Page Header */} -
+

@@ -44,7 +44,7 @@ export default function ReadinessPage() { Exam Readiness Analytics

- Real-time algorithmic prediction of your exam readiness — based on speed, accuracy, syllabus coverage, and test history. + Real-time algorithmic prediction of your exam readiness — based on speed, accuracy, syllabus coverage, and test history.

@@ -54,11 +54,11 @@ export default function ReadinessPage() {
{/* KPI Strip */} -
+
{[ { label: "Overall Score", value: isDemo ? "72 / 100" : "0 / 100", trend: isDemo ? "+5 this week" : "Baseline", trendUp: true, icon: }, { label: "Accuracy Rate", value: isDemo ? "88%" : "0%", trend: isDemo ? "+3% vs last week" : "0 attempts", trendUp: isDemo, icon: }, - { label: "Avg Speed / Q", value: isDemo ? "45 sec" : "-- sec", trend: isDemo ? "↓ Needs work" : "Not tested", trendUp: false, icon: }, + { label: "Avg Speed / Q", value: isDemo ? "45 sec" : "-- sec", trend: isDemo ? "? Needs work" : "Not tested", trendUp: false, icon: }, { label: "Syllabus Covered", value: isDemo ? "64%" : "0%", trend: isDemo ? "+8% this month" : "Day 1", trendUp: true, icon: }, ].map((kpi) => ( @@ -76,7 +76,7 @@ export default function ReadinessPage() { ))}
-
+
{/* Readiness Score Card */} @@ -105,7 +105,7 @@ export default function ReadinessPage() {
{sub.subject} - {sub.score}% · {sub.status} + {sub.score}% · {sub.status}
@@ -159,7 +159,7 @@ export default function ReadinessPage() {
  • - Maintain daily streak — consistency adds directly to your readiness algorithm. + Maintain daily streak — consistency adds directly to your readiness algorithm.
  • @@ -182,7 +182,7 @@ export default function ReadinessPage() { {a.label} - → + ? ))}
    • diff --git a/src/app/dashboard/ai-coach/strategy/page.tsx b/src/app/dashboard/ai-coach/strategy/page.tsx index 70d65aa..2882125 100644 --- a/src/app/dashboard/ai-coach/strategy/page.tsx +++ b/src/app/dashboard/ai-coach/strategy/page.tsx @@ -1,4 +1,4 @@ -"use client" +"use client" import { ExamStrategyCard } from "@/components/AI/ExamStrategyCard" import { StudyTimeOptimizationCard } from "@/components/AI/StudyTimeOptimizationCard" @@ -26,7 +26,7 @@ export default function StrategyPage() { return (
    {/* Page Header */} -
    +

    @@ -46,10 +46,10 @@ export default function StrategyPage() {

    {/* KPI Strip */} -
    +
    {[ { label: "Time Per Question", value: isDemo ? "45 sec" : "-- sec", note: isDemo ? "Target: 38 sec" : "Not calibrated", icon: , 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: , 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: , color: "border-amber-400/20 bg-amber-400/5" }, { label: "Attempted Questions", value: isDemo ? "93 / 120" : "0 / 120", note: isDemo ? "+7 vs last test" : "0 attempted", icon: , color: "border-[var(--cyan-ai-20)] bg-[var(--cyan-ai-10)]" }, { label: "Score Yield", value: isDemo ? "214" : "0", note: isDemo ? "Predicted score" : "Baseline", icon: , color: "border-green-400/20 bg-green-400/5" }, ].map((kpi) => ( @@ -65,7 +65,7 @@ export default function StrategyPage() {
    {/* Main Cards Row */} -
    +
    @@ -89,7 +89,7 @@ export default function StrategyPage() {

    Negative Marking Analysis

    - {isDemo ? "Last Mock Test · Aug 1" : "Day 1 Initializing"} + {isDemo ? "Last Mock Test · Aug 1" : "Day 1 Initializing"}
    @@ -101,7 +101,7 @@ export default function StrategyPage() {
    Attempted
    -
    {row.negMarks === 0 ? "0" : `−${row.negMarks}`}
    +
    {row.negMarks === 0 ? "0" : `-${row.negMarks}`}
    Neg. Marks
    @@ -123,7 +123,7 @@ export default function StrategyPage() {

    Insight: {isDemo ? ( - <>You're losing ~29 marks to wrong answers. Switching to "skip and revisit" for uncertain Physics questions could recover 15–20 marks. + <>You're losing ~29 marks to wrong answers. Switching to "skip and revisit" for uncertain Physics questions could recover 15–20 marks. ) : ( <>Complete your first mock test or timed DPP to calculate your negative marking profile and fine-tune your subject pacing. )} @@ -136,11 +136,11 @@ export default function StrategyPage() {

    AI Strategy Recommendations

    -
    +
    {[ { 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: "Reserve 10–15 minutes at the end to revisit starred questions. Your review accuracy is historically 20% higher than first-attempt.", color: "text-[var(--cyan-ai)]", label: "Review Window" }, + { 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: "Reserve 10–15 minutes at the end to revisit starred questions. Your review accuracy is historically 20% higher than first-attempt.", color: "text-[var(--cyan-ai)]", label: "Review Window" }, ].map((s) => (
    {s.label}
    diff --git a/src/app/dashboard/ai-coach/study-plan/page.tsx b/src/app/dashboard/ai-coach/study-plan/page.tsx index 4fe03e5..b2d0155 100644 --- a/src/app/dashboard/ai-coach/study-plan/page.tsx +++ b/src/app/dashboard/ai-coach/study-plan/page.tsx @@ -1,4 +1,4 @@ -"use client" +"use client" import { StudyPlanCard } from "@/components/AI/StudyPlanCard" import { WeeklyProgressReport } from "@/components/AI/WeeklyProgressReport" @@ -14,7 +14,7 @@ export default function StudyPlanPage() { return (
    {/* Page Header */} -
    +

    @@ -34,7 +34,7 @@ export default function StudyPlanPage() {

    {/* KPI Strip */} -
    +
    {[ { label: "Tasks Today", value: isDemo ? "5" : "3", sub: isDemo ? "2 completed" : "0 completed", icon: , 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: , color: "border-[var(--cyan-ai-20)] bg-[var(--cyan-ai-10)]" }, @@ -52,7 +52,7 @@ export default function StudyPlanPage() { ))}
    -
    +
    {/* Today's Schedule */}
    @@ -139,9 +139,9 @@ export default function StudyPlanPage() {

    Upcoming This Week

    {[ - { day: "Tue, Aug 5", task: "Full-Length Mock — JEE Mains Pattern", type: "Test", color: "text-purple-400 bg-purple-400/10" }, + { day: "Tue, Aug 5", task: "Full-Length Mock — JEE Mains Pattern", type: "Test", color: "text-purple-400 bg-purple-400/10" }, { day: "Wed, Aug 6", task: "Rotational Dynamics Intensive Drill", type: "Practice", color: "text-[var(--cyan-ai)] bg-[var(--cyan-ai-10)]" }, - { day: "Thu, Aug 7", task: "Chemistry Organic — Mistake Review", type: "Review", color: "text-red-400 bg-red-400/10" }, + { day: "Thu, Aug 7", task: "Chemistry Organic — Mistake Review", type: "Review", color: "text-red-400 bg-red-400/10" }, { day: "Fri, Aug 8", task: "Optics + Wave Optics Revision", type: "Revision", color: "text-yellow-400 bg-yellow-400/10" }, ].map((item) => (
    diff --git a/src/app/dashboard/ai-coach/time-optimization/page.tsx b/src/app/dashboard/ai-coach/time-optimization/page.tsx index d16f79b..e0d0894 100644 --- a/src/app/dashboard/ai-coach/time-optimization/page.tsx +++ b/src/app/dashboard/ai-coach/time-optimization/page.tsx @@ -71,7 +71,7 @@ export default function TimeOptimizationPage() { return (
    {/* Page Header */} -
    +

    @@ -91,7 +91,7 @@ export default function TimeOptimizationPage() {

    {/* KPI Strip */} -
    +
    {[ { label: "Peak Efficiency", value: isDemo ? "95%" : "--", sub: isDemo ? "2–5 PM window" : "Calibrating", color: "border-yellow-400/20 bg-yellow-400/5", icon: }, { 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: }, @@ -109,7 +109,7 @@ export default function TimeOptimizationPage() { ))}
    -
    +
    {/* Chart — 2/3 */}
    diff --git a/src/app/dashboard/ai-coach/weekly-progress/page.tsx b/src/app/dashboard/ai-coach/weekly-progress/page.tsx index 8ed9f63..5b79940 100644 --- a/src/app/dashboard/ai-coach/weekly-progress/page.tsx +++ b/src/app/dashboard/ai-coach/weekly-progress/page.tsx @@ -43,7 +43,7 @@ export default function WeeklyProgressPage() { return (
    {/* Page Header */} -
    +

    @@ -65,7 +65,7 @@ export default function WeeklyProgressPage() {

    {/* KPI Stats Row */} -
    +
    {stats.map((stat) => ( @@ -80,7 +80,7 @@ export default function WeeklyProgressPage() {
    {/* Main Content Grid */} -
    +
    {/* Weekly Bar Chart */}
    diff --git a/src/app/dashboard/analytics/page.tsx b/src/app/dashboard/analytics/page.tsx index 308e4f9..8c7bdee 100644 --- a/src/app/dashboard/analytics/page.tsx +++ b/src/app/dashboard/analytics/page.tsx @@ -59,7 +59,7 @@ export default function AnalyticsPage() { return (
    -
    +

    @@ -73,7 +73,7 @@ export default function AnalyticsPage() {

    -
    +
    Projected Score Trajectory diff --git a/src/app/dashboard/cbt/page.tsx b/src/app/dashboard/cbt/page.tsx index 081a712..93bfd9c 100644 --- a/src/app/dashboard/cbt/page.tsx +++ b/src/app/dashboard/cbt/page.tsx @@ -164,7 +164,7 @@ export default function CBTPage() { return ( <>
    -
    +

    @@ -198,7 +198,7 @@ export default function CBTPage() { -
    +

    Upcoming & Active Exams

    @@ -334,7 +334,7 @@ export default function CBTPage() { })()}
    -
    +

    Past Attempts

    diff --git a/src/app/dashboard/community/page.tsx b/src/app/dashboard/community/page.tsx index 160e980..16ce70a 100644 --- a/src/app/dashboard/community/page.tsx +++ b/src/app/dashboard/community/page.tsx @@ -116,7 +116,7 @@ export default function CommunityPage() { return (
    -
    +

    @@ -136,7 +136,7 @@ export default function CommunityPage() {

    -
    +
    @@ -158,7 +158,7 @@ export default function CommunityPage() {
    -
    +
    {filteredDoubts.map((doubt) => ( diff --git a/src/app/dashboard/dpp/page.tsx b/src/app/dashboard/dpp/page.tsx index 0b6e82b..c45364c 100644 --- a/src/app/dashboard/dpp/page.tsx +++ b/src/app/dashboard/dpp/page.tsx @@ -136,7 +136,7 @@ export default function AIDailyPracticePage() { return (
    {/* Page Header */} -
    +

    @@ -152,7 +152,7 @@ export default function AIDailyPracticePage() {

    {/* Calendar Filter & Controller Bar */} -
    +
    -
    +
    {loading ? (
    Loading AI-generated DPPs...
    ) : filteredDpps.length === 0 ? ( diff --git a/src/app/dashboard/leaderboard/page.tsx b/src/app/dashboard/leaderboard/page.tsx index 1de126f..b1603c1 100644 --- a/src/app/dashboard/leaderboard/page.tsx +++ b/src/app/dashboard/leaderboard/page.tsx @@ -47,7 +47,7 @@ export default function LeaderboardPage() { return (
    -
    +

    @@ -82,7 +82,7 @@ export default function LeaderboardPage() {

    -
    +
    RANK diff --git a/src/app/dashboard/materials/page.tsx b/src/app/dashboard/materials/page.tsx index c31c4b7..a58bb24 100644 --- a/src/app/dashboard/materials/page.tsx +++ b/src/app/dashboard/materials/page.tsx @@ -1,4 +1,4 @@ -"use client" +"use client" import { useState } from "react" import { Card, CardContent } from "@/components/ui/card" @@ -33,7 +33,7 @@ export default function MaterialsPage() { return (
    -
    +

    @@ -47,7 +47,7 @@ export default function MaterialsPage() {

    -
    +
    {folders.map((folder, i) => ( @@ -59,7 +59,7 @@ export default function MaterialsPage() { ))}
    -
    +

    Recently Accessed Study Notes Click any PDF to launch fullscreen reader diff --git a/src/app/dashboard/page.tsx b/src/app/dashboard/page.tsx index 67dfe58..742c47f 100644 --- a/src/app/dashboard/page.tsx +++ b/src/app/dashboard/page.tsx @@ -124,7 +124,7 @@ export default function DashboardPage() {
    {/* Basic Performance Dashboard (F-05) */} -
    +

    @@ -228,7 +228,7 @@ export default function DashboardPage() {
    {/* Dynamic DPP Modules */} -
    +

    Today's DPPs @@ -264,7 +264,7 @@ export default function DashboardPage() {

    {/* Upcoming CBTs */} -
    +

    Upcoming CBTs @@ -301,10 +301,10 @@ export default function DashboardPage() {

    -
    +
    -
    +
    diff --git a/src/app/dashboard/progress/page.tsx b/src/app/dashboard/progress/page.tsx index 9e0ad44..693a32b 100644 --- a/src/app/dashboard/progress/page.tsx +++ b/src/app/dashboard/progress/page.tsx @@ -262,7 +262,7 @@ export default function ProgressTrackerPage() { return (
    -
    +

    @@ -276,7 +276,7 @@ export default function ProgressTrackerPage() {

    -
    = 4 ? 'lg:grid-cols-4' : 'md:grid-cols-3'} gap-6 mb-8`}> +
    = 4 ? 'lg:grid-cols-4' : 'md:grid-cols-3'} gap-6 mb-8 animate-section animate-section-2`}> {subjects.map((sub, i) => ( @@ -290,7 +290,7 @@ export default function ProgressTrackerPage() { ))}
    -
    +
    {subjects.map((subject, subIndex) => ( diff --git a/src/app/dashboard/settings/page.tsx b/src/app/dashboard/settings/page.tsx index 8fd874c..77a1d0b 100644 --- a/src/app/dashboard/settings/page.tsx +++ b/src/app/dashboard/settings/page.tsx @@ -108,7 +108,7 @@ export default function SettingsPage() { return (
    -
    +

    @@ -122,7 +122,7 @@ export default function SettingsPage() {

    -
    +
    {/* Profile photo upload tile */} diff --git a/src/app/dashboard/streaks/page.tsx b/src/app/dashboard/streaks/page.tsx index f0dc50c..1f576a7 100644 --- a/src/app/dashboard/streaks/page.tsx +++ b/src/app/dashboard/streaks/page.tsx @@ -1,4 +1,4 @@ -"use client" +"use client" import { fetchWithAuth } from "@/lib/apiClient"; import { useState, useEffect } from "react" @@ -47,7 +47,7 @@ export default function StreaksPage() { return (
    -
    +

    @@ -61,7 +61,7 @@ export default function StreaksPage() {

    -
    +
    @@ -106,7 +106,7 @@ export default function StreaksPage() {
    -
    +

    Streak Rewards

    {rewards.map((reward, i) => ( diff --git a/src/app/globals.css b/src/app/globals.css index ce75702..069c1d4 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -120,6 +120,20 @@ body { .text-balance { text-wrap: balance; } + + /* ─── Uniform staggered section entry animations ─── */ + /* Usage: add animate-section to each section/card group */ + .animate-section { + animation: sectionFadeUp 0.45s cubic-bezier(0.16, 1, 0.3, 1) both; + } + .animate-section-1 { animation-delay: 0ms; } + .animate-section-2 { animation-delay: 80ms; } + .animate-section-3 { animation-delay: 160ms; } + .animate-section-4 { animation-delay: 240ms; } + .animate-section-5 { animation-delay: 320ms; } + .animate-section-6 { animation-delay: 400ms; } + + .bg-grid { background-size: 40px 40px; @@ -173,3 +187,14 @@ body { ::-webkit-scrollbar-thumb:hover { background: var(--muted-foreground); } + +@keyframes sectionFadeUp { + from { + opacity: 0; + transform: translateY(18px); + } + to { + opacity: 1; + transform: translateY(0); + } +}