Unify dashboard page animations to zoom-in and slide-up
This commit is contained in:
@@ -103,7 +103,7 @@ export default function AIComCBTDPPPage() {
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="p-6 md:p-8 space-y-6 max-w-6xl mx-auto min-h-screen animate-in fade-in duration-500">
|
||||
<div className="p-6 md:p-8 space-y-6 max-w-6xl mx-auto min-h-screen animate-in fade-in zoom-in-95 slide-in-from-bottom-4 duration-500">
|
||||
{/* 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 items-center gap-4">
|
||||
|
||||
@@ -93,7 +93,7 @@ export default function AIDailyPracticePage() {
|
||||
const cleanTitle = (title: string) => title.replace(/\s*\(ExamEnum\.[^)]+\)/, '');
|
||||
|
||||
return (
|
||||
<div className="p-6 md:p-8 space-y-6 animate-in fade-in slide-in-from-bottom-4 duration-500 max-w-7xl mx-auto">
|
||||
<div className="p-6 md:p-8 space-y-6 animate-in fade-in zoom-in-95 slide-in-from-bottom-4 duration-500 max-w-7xl mx-auto">
|
||||
{/* Page Header */}
|
||||
<div className="border-b border-border/50 pb-6">
|
||||
<div className="flex items-start justify-between gap-4 flex-wrap">
|
||||
@@ -235,7 +235,7 @@ export default function AIDailyPracticePage() {
|
||||
|
||||
{/* ── PROTECTED PDF READER MODAL (FREE TIER) ── */}
|
||||
{selectedPdfDpp && (
|
||||
<div className={`fixed inset-0 z-50 bg-black/90 backdrop-blur-md flex items-center justify-center ${isFullScreen ? 'p-0' : 'p-4'} animate-in fade-in duration-300`}>
|
||||
<div className={`fixed inset-0 z-50 bg-black/90 backdrop-blur-md flex items-center justify-center ${isFullScreen ? 'p-0' : 'p-4'} animate-in fade-in zoom-in-95 slide-in-from-bottom-4 duration-500`}>
|
||||
<div className={`bg-background border border-border ${isFullScreen ? 'w-screen h-screen max-w-none max-h-none rounded-none border-0' : 'rounded-3xl w-full max-w-7xl max-h-[95vh]'} flex flex-col overflow-hidden shadow-2xl transition-all duration-300`}>
|
||||
{/* Modal Header */}
|
||||
<div className="p-4 md:p-5 border-b border-border bg-secondary/30 flex items-center justify-between">
|
||||
|
||||
@@ -36,7 +36,7 @@ export default function CollegePredictorPage() {
|
||||
const maxRank = Math.max(...CUTOFF_TRENDS.map(d => d.rank))
|
||||
|
||||
return (
|
||||
<div className="p-6 md:p-8 space-y-8 max-w-7xl mx-auto animate-in fade-in duration-500 min-h-screen">
|
||||
<div className="p-6 md:p-8 space-y-8 max-w-7xl mx-auto animate-in fade-in zoom-in-95 slide-in-from-bottom-4 duration-500 min-h-screen">
|
||||
{/* Page Header */}
|
||||
<div className="border-b border-border/50 pb-6">
|
||||
<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 animate-in fade-in duration-500 min-h-screen">
|
||||
<div className="p-6 md:p-8 max-w-7xl mx-auto space-y-8 animate-in fade-in zoom-in-95 slide-in-from-bottom-4 duration-500 min-h-screen">
|
||||
{/* Page Header */}
|
||||
<div className="border-b border-border/50 pb-6">
|
||||
<div className="flex items-start justify-between gap-4 flex-wrap">
|
||||
|
||||
@@ -60,7 +60,7 @@ export default function AICoachDashboard() {
|
||||
|
||||
if (!hasAccessTo("ai-mistake-tracking")) {
|
||||
return (
|
||||
<div className="max-w-3xl mx-auto text-center py-20 px-8 space-y-8 animate-in fade-in duration-500">
|
||||
<div className="max-w-3xl mx-auto text-center py-20 px-8 space-y-8 animate-in fade-in zoom-in-95 slide-in-from-bottom-4 duration-500">
|
||||
<div className="size-20 rounded-full bg-[var(--cyan-ai-10)] flex items-center justify-center mx-auto text-[var(--cyan-ai)] border border-[var(--cyan-ai-20)] shadow-[0_0_20px_rgba(12,96,96,0.1)]">
|
||||
<BrainCircuit size={40} />
|
||||
</div>
|
||||
@@ -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 duration-500">
|
||||
<div className="p-6 max-w-6xl mx-auto space-y-8 animate-in fade-in zoom-in-95 slide-in-from-bottom-4 duration-500">
|
||||
|
||||
{/* ── METRICS BAR ── */}
|
||||
<div className="flex flex-wrap items-center justify-end gap-2 pt-2">
|
||||
|
||||
@@ -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 max-w-7xl mx-auto animate-in fade-in duration-500 min-h-screen">
|
||||
<div className="p-6 md:p-8 space-y-8 max-w-7xl mx-auto animate-in fade-in zoom-in-95 slide-in-from-bottom-4 duration-500 min-h-screen">
|
||||
{/* Page Header */}
|
||||
<div className="border-b border-border/50 pb-6">
|
||||
<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 max-w-7xl mx-auto animate-in fade-in duration-500 min-h-screen">
|
||||
<div className="p-6 md:p-8 space-y-8 max-w-7xl mx-auto animate-in fade-in zoom-in-95 slide-in-from-bottom-4 duration-500 min-h-screen">
|
||||
{/* Page Header */}
|
||||
<div className="border-b border-border/50 pb-6">
|
||||
<div className="flex items-start justify-between gap-4 flex-wrap">
|
||||
|
||||
@@ -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 max-w-7xl mx-auto animate-in fade-in duration-500 min-h-screen">
|
||||
<div className="p-6 md:p-8 space-y-8 max-w-7xl mx-auto animate-in fade-in zoom-in-95 slide-in-from-bottom-4 duration-500 min-h-screen">
|
||||
{/* Page Header */}
|
||||
<div className="border-b border-border/50 pb-6">
|
||||
<div className="flex items-start justify-between gap-4 flex-wrap">
|
||||
|
||||
@@ -69,7 +69,7 @@ export default function TimeOptimizationPage() {
|
||||
]
|
||||
|
||||
return (
|
||||
<div className="p-6 md:p-8 max-w-7xl mx-auto space-y-8 animate-in fade-in duration-500 min-h-screen">
|
||||
<div className="p-6 md:p-8 max-w-7xl mx-auto space-y-8 animate-in fade-in zoom-in-95 slide-in-from-bottom-4 duration-500 min-h-screen">
|
||||
{/* Page Header */}
|
||||
<div className="border-b border-border/50 pb-6">
|
||||
<div className="flex items-start justify-between gap-4 flex-wrap">
|
||||
|
||||
@@ -12,7 +12,7 @@ const CAPABILITIES = [
|
||||
|
||||
export default function TutorChatPage() {
|
||||
return (
|
||||
<div className="p-6 md:p-8 space-y-6 max-w-7xl mx-auto animate-in fade-in duration-500 min-h-screen">
|
||||
<div className="p-6 md:p-8 space-y-6 max-w-7xl mx-auto animate-in fade-in zoom-in-95 slide-in-from-bottom-4 duration-500 min-h-screen">
|
||||
{/* Page Header */}
|
||||
<div className="border-b border-border/50 pb-6">
|
||||
<div className="flex items-start justify-between gap-4 flex-wrap">
|
||||
|
||||
@@ -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 animate-in fade-in duration-500 min-h-screen">
|
||||
<div className="p-6 md:p-8 max-w-7xl mx-auto space-y-8 animate-in fade-in zoom-in-95 slide-in-from-bottom-4 duration-500 min-h-screen">
|
||||
{/* Page Header */}
|
||||
<div className="border-b border-border/50 pb-6">
|
||||
<div className="flex items-start justify-between gap-4 flex-wrap">
|
||||
|
||||
Reference in New Issue
Block a user