feat: uniform staggered page-load animations across all dashboard pages
This commit is contained in:
@@ -262,7 +262,7 @@ export default function ProgressTrackerPage() {
|
||||
return (
|
||||
<PremiumGate featureKey="chapter-wise-progress-tracking">
|
||||
<div className="p-8 space-y-8 animate-in fade-in zoom-in-95 origin-top duration-500 max-w-7xl mx-auto">
|
||||
<div className="flex flex-col md:flex-row md:items-end justify-between gap-4">
|
||||
<div className="flex flex-col md:flex-row md:items-end justify-between gap-4 animate-section animate-section-1">
|
||||
<div>
|
||||
<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)]">
|
||||
@@ -276,7 +276,7 @@ export default function ProgressTrackerPage() {
|
||||
</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`}>
|
||||
<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`}>
|
||||
{subjects.map((sub, i) => (
|
||||
<Card key={i} className="border-border shadow-sm">
|
||||
<CardContent className="p-6 text-center">
|
||||
@@ -290,7 +290,7 @@ export default function ProgressTrackerPage() {
|
||||
))}
|
||||
</div>
|
||||
|
||||
<div className="space-y-6">
|
||||
<div className="space-y-6 animate-section animate-section-3">
|
||||
{subjects.map((subject, subIndex) => (
|
||||
<Card key={subIndex} className="border-border shadow-sm overflow-hidden">
|
||||
<CardHeader className="bg-secondary/30 pb-4 border-b border-border">
|
||||
|
||||
Reference in New Issue
Block a user