fix: uniform subtle minimal animations across all Pro tier and dashboard pages
This commit is contained in:
@@ -105,7 +105,7 @@ export default function AIComCBTDPPPage() {
|
||||
return (
|
||||
<div className="p-6 md:p-8 space-y-6 max-w-6xl mx-auto min-h-screen">
|
||||
{/* 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">
|
||||
<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 items-center gap-4">
|
||||
<Link href="/dashboard/dpp">
|
||||
<Button variant="outline" size="icon" className="rounded-xl border-border hover:bg-secondary">
|
||||
@@ -166,7 +166,7 @@ export default function AIComCBTDPPPage() {
|
||||
)}
|
||||
|
||||
{/* Main CBT Grid */}
|
||||
<div className="grid grid-cols-1 lg:grid-cols-4 gap-6">
|
||||
<div className="grid grid-cols-1 lg:grid-cols-4 gap-6 animate-section animate-section-2">
|
||||
{/* Question Area */}
|
||||
<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">
|
||||
|
||||
@@ -132,7 +132,7 @@ export default function DPPPage() {
|
||||
const cleanTitle = (title: string) => title.replace(/\s*\(ExamEnum\.[^)]+\)/, '');
|
||||
|
||||
return (
|
||||
<div className="p-8 space-y-6 animate-in fade-in zoom-in-95 origin-top duration-500 max-w-7xl mx-auto">
|
||||
<div className="p-8 space-y-6 max-w-7xl mx-auto">
|
||||
<div className="flex flex-col md:flex-row md:items-center justify-between p-8 bg-gradient-to-r from-secondary/50 to-background border border-border rounded-2xl shadow-sm gap-6">
|
||||
<div>
|
||||
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-2">
|
||||
|
||||
@@ -89,7 +89,7 @@ export default function CollegePredictorPage() {
|
||||
const trendData = isDemo ? DEMO_TREND_DATA : ZERO_TREND_DATA
|
||||
|
||||
return (
|
||||
<div className="p-6 md:p-8 space-y-8 animate-in fade-in zoom-in-95 origin-top duration-500 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 */}
|
||||
<div className="border-b border-border/50 pb-6 animate-section animate-section-1">
|
||||
<div className="flex items-start justify-between gap-4 flex-wrap">
|
||||
|
||||
@@ -35,7 +35,7 @@ export default function HeatmapPage() {
|
||||
const criticalTopics = isDemo ? DEMO_CRITICAL_TOPICS : []
|
||||
|
||||
return (
|
||||
<div className="p-6 md:p-8 max-w-7xl mx-auto space-y-8 min-h-screen animate-in fade-in zoom-in-95 origin-top duration-500">
|
||||
<div className="p-6 md:p-8 max-w-7xl mx-auto space-y-8 min-h-screen">
|
||||
{/* Page Header */}
|
||||
<div className="border-b border-border/50 pb-6 animate-section animate-section-1">
|
||||
<div className="flex items-start justify-between gap-4 flex-wrap">
|
||||
|
||||
@@ -89,7 +89,7 @@ export default function AICoachDashboard() {
|
||||
const currentStreakDays = `${user?.streak_count || (isDemo ? 12 : 1)} d`
|
||||
|
||||
return (
|
||||
<div className="p-6 max-w-6xl mx-auto space-y-8 animate-in fade-in zoom-in-95 origin-top duration-500">
|
||||
<div className="p-6 max-w-6xl mx-auto space-y-8">
|
||||
|
||||
{/* ── METRICS BAR ── */}
|
||||
<div className="flex flex-wrap items-center justify-end gap-2 pt-2 animate-section animate-section-1">
|
||||
|
||||
@@ -32,7 +32,7 @@ export default function ReadinessPage() {
|
||||
const maxScore = Math.max(1, ...scoreHistory.map(d => d.score))
|
||||
|
||||
return (
|
||||
<div className="p-6 md:p-8 space-y-8 animate-in fade-in zoom-in-95 origin-top duration-500 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 */}
|
||||
<div className="border-b border-border/50 pb-6 animate-section animate-section-1">
|
||||
<div className="flex items-start justify-between gap-4 flex-wrap">
|
||||
|
||||
@@ -24,7 +24,7 @@ export default function StrategyPage() {
|
||||
const negMarkingData = isDemo ? DEMO_NEG_MARKING_DATA : ZERO_NEG_MARKING_DATA
|
||||
|
||||
return (
|
||||
<div className="p-6 md:p-8 space-y-8 animate-in fade-in zoom-in-95 origin-top duration-500 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 */}
|
||||
<div className="border-b border-border/50 pb-6 animate-section animate-section-1">
|
||||
<div className="flex items-start justify-between gap-4 flex-wrap">
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
"use client"
|
||||
"use client"
|
||||
|
||||
import { StudyPlanCard } from "@/components/AI/StudyPlanCard"
|
||||
import { WeeklyProgressReport } from "@/components/AI/WeeklyProgressReport"
|
||||
@@ -12,7 +12,7 @@ export default function StudyPlanPage() {
|
||||
const streakCount = user?.streak_count || (isDemo ? 12 : 1)
|
||||
|
||||
return (
|
||||
<div className="p-6 md:p-8 space-y-8 animate-in fade-in zoom-in-95 origin-top duration-500 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 */}
|
||||
<div className="border-b border-border/50 pb-6 animate-section animate-section-1">
|
||||
<div className="flex items-start justify-between gap-4 flex-wrap">
|
||||
@@ -34,7 +34,7 @@ export default function StudyPlanPage() {
|
||||
</div>
|
||||
|
||||
{/* 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 animate-section animate-section-2">
|
||||
{[
|
||||
{ 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)]" },
|
||||
@@ -52,7 +52,7 @@ export default function StudyPlanPage() {
|
||||
))}
|
||||
</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 animate-section animate-section-3">
|
||||
<div className="lg:col-span-2 space-y-8">
|
||||
{/* Today's Schedule */}
|
||||
<div className="space-y-3">
|
||||
|
||||
@@ -69,7 +69,7 @@ export default function TimeOptimizationPage() {
|
||||
]
|
||||
|
||||
return (
|
||||
<div className="p-6 md:p-8 max-w-7xl mx-auto space-y-8 min-h-screen animate-in fade-in zoom-in-95 origin-top duration-500">
|
||||
<div className="p-6 md:p-8 max-w-7xl mx-auto space-y-8 min-h-screen">
|
||||
{/* Page Header */}
|
||||
<div className="border-b border-border/50 pb-6 animate-section animate-section-1">
|
||||
<div className="flex items-start justify-between gap-4 flex-wrap">
|
||||
|
||||
@@ -1,12 +1,12 @@
|
||||
"use client"
|
||||
"use client"
|
||||
|
||||
import { TutorChat } from "@/components/AI/TutorChat"
|
||||
import { BrainCircuit, Sparkles } from "lucide-react"
|
||||
|
||||
export default function TutorChatPage() {
|
||||
return (
|
||||
<div className="h-[calc(100vh-100px)] w-full flex flex-col pt-4 max-w-7xl mx-auto px-4 gap-4 animate-in fade-in zoom-in-95 origin-top duration-500">
|
||||
<div className="border-b border-border/50 pb-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="flex items-start justify-between gap-4 flex-wrap">
|
||||
<div>
|
||||
<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 className="flex-1 rounded-3xl overflow-hidden border border-border/50 shadow-xl bg-background flex flex-col h-full">
|
||||
<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">
|
||||
<TutorChat />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -41,7 +41,7 @@ export default function WeeklyProgressPage() {
|
||||
const syllabusProgress = isDemo ? DEMO_SYLLABUS_PROGRESS : ZERO_SYLLABUS_PROGRESS
|
||||
|
||||
return (
|
||||
<div className="p-6 md:p-8 max-w-7xl mx-auto space-y-8 min-h-screen animate-in fade-in zoom-in-95 origin-top duration-500">
|
||||
<div className="p-6 md:p-8 max-w-7xl mx-auto space-y-8 min-h-screen">
|
||||
{/* Page Header */}
|
||||
<div className="border-b border-border/50 pb-6 animate-section animate-section-1">
|
||||
<div className="flex items-start justify-between gap-4 flex-wrap">
|
||||
|
||||
Reference in New Issue
Block a user