UI, layout, and target exam logic updates
This commit is contained in:
@@ -24,8 +24,8 @@ export function MistakeHeatmap() {
|
||||
const isDemo = isDemoUser(userId);
|
||||
|
||||
const getColor = (errorRate: number) => {
|
||||
if (errorRate === 0) return 'bg-white/5 border-white/10 text-muted-foreground';
|
||||
if (errorRate >= 50) return 'bg-red-500/80 border-red-500 shadow-[0_0_10px_-2px_rgba(239,68,68,0.5)]'; // Critical
|
||||
if (errorRate === 0) return 'bg-green-600/50 border-green-600/80 text-green-100';
|
||||
if (errorRate >= 50) return 'bg-red-600/80 border-red-600 shadow-[0_0_10px_-2px_rgba(220,38,38,0.5)] text-red-100'; // Critical
|
||||
if (errorRate >= 30) return 'bg-amber-500/60 border-amber-500'; // Warning
|
||||
if (errorRate >= 10) return 'bg-yellow-500/30 border-yellow-500/50'; // Moderate
|
||||
return 'bg-green-500/20 border-green-500/30'; // Good
|
||||
@@ -41,7 +41,6 @@ export function MistakeHeatmap() {
|
||||
<Flame className="text-orange-500" /> Mastery Map
|
||||
<Badge variant="outline" className="border-[var(--cyan-ai-30)] text-[var(--cyan-ai)] bg-[var(--cyan-ai-10)] rounded-md text-[10px] uppercase font-bold ml-2 hidden sm:flex">AI Coach</Badge>
|
||||
</CardTitle>
|
||||
<Info size={16} className="text-muted-foreground" />
|
||||
</div>
|
||||
<p className="text-sm text-muted-foreground">
|
||||
{isDemo ? "Topic-wise error rate across last 5 tests." : "Topic-wise error rate across your recent test sessions."}
|
||||
@@ -95,13 +94,6 @@ export function MistakeHeatmap() {
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Legend */}
|
||||
<div className="mt-6 pt-4 border-t border-border/50 flex flex-wrap items-center justify-center gap-x-4 gap-y-2 text-xs font-bold text-muted-foreground">
|
||||
<div className="flex items-center gap-1.5"><div className="size-3 rounded-sm bg-green-500/20 border border-green-500/30"></div> {"0-10% (Optimal)"}</div>
|
||||
<div className="flex items-center gap-1.5"><div className="size-3 rounded-sm bg-yellow-500/30 border border-yellow-500/50"></div> {"10-30%"}</div>
|
||||
<div className="flex items-center gap-1.5"><div className="size-3 rounded-sm bg-amber-500/60 border border-amber-500"></div> {"30-50%"}</div>
|
||||
<div className="flex items-center gap-1.5"><div className="size-3 rounded-sm bg-red-500/80 border border-red-500"></div> {"> 50%"}</div>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
)
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
"use client"
|
||||
"use client"
|
||||
|
||||
import { Card, CardContent, CardHeader, CardTitle, CardDescription } from "@/components/ui/card"
|
||||
import { Button } from "@/components/ui/button"
|
||||
@@ -68,25 +68,41 @@ export function ProgressShare() {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="mt-auto mb-auto text-center">
|
||||
<h3 className="text-2xl font-black text-white mb-4">You crushed it this week!</h3>
|
||||
<div className="flex justify-center gap-4">
|
||||
<div className="bg-white/10 backdrop-blur-sm border border-white/20 rounded-xl p-3 w-28">
|
||||
<TrendingUp className="text-amber-400 mx-auto mb-1" size={20} />
|
||||
<div className="text-2xl font-black text-white">{streak}</div>
|
||||
<div className="mt-auto mb-auto text-center w-full pt-2">
|
||||
<h3 className="text-xl sm:text-2xl font-black text-white mb-4">You crushed it this week!</h3>
|
||||
<div className="grid grid-cols-2 gap-3 max-w-[240px] mx-auto">
|
||||
<div className="bg-white/10 backdrop-blur-sm border border-white/20 rounded-xl p-3 flex flex-col items-center justify-center">
|
||||
<TrendingUp className="text-amber-400 mb-1" size={18} />
|
||||
<div className="text-xl font-black text-white">{streak}</div>
|
||||
<div className="text-[9px] text-white/70 uppercase font-bold tracking-wider">Day Streak</div>
|
||||
</div>
|
||||
<div className="bg-white/10 backdrop-blur-sm border border-white/20 rounded-xl p-3 w-28">
|
||||
<Target className="text-green-400 mx-auto mb-1" size={20} />
|
||||
<div className="text-2xl font-black text-white">{accuracy}%</div>
|
||||
<div className="bg-white/10 backdrop-blur-sm border border-white/20 rounded-xl p-3 flex flex-col items-center justify-center">
|
||||
<Target className="text-green-400 mb-1" size={18} />
|
||||
<div className="text-xl font-black text-white">{accuracy}%</div>
|
||||
<div className="text-[9px] text-white/70 uppercase font-bold tracking-wider">Accuracy</div>
|
||||
</div>
|
||||
<div className="bg-white/10 backdrop-blur-sm border border-white/20 rounded-xl p-3 flex flex-col items-center justify-center">
|
||||
<TrendingUp className="text-cyan-400 mb-1" size={18} />
|
||||
<div className="text-xl font-black text-white">4</div>
|
||||
<div className="text-[9px] text-white/70 uppercase font-bold tracking-wider">Tests Taken</div>
|
||||
</div>
|
||||
<div className="bg-white/10 backdrop-blur-sm border border-white/20 rounded-xl p-3 flex flex-col items-center justify-center">
|
||||
<Target className="text-purple-400 mb-1" size={18} />
|
||||
<div className="text-xl font-black text-white">78%</div>
|
||||
<div className="text-[9px] text-white/70 uppercase font-bold tracking-wider">Avg Score</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="text-left mt-auto">
|
||||
<div className="text-sm font-bold text-white">{name}</div>
|
||||
<div className="text-[10px] text-white/50">JEE Aspirant</div>
|
||||
<div className="mt-auto flex justify-between items-end w-full pt-4">
|
||||
<div className="text-left">
|
||||
<div className="text-sm font-bold text-white">{name}</div>
|
||||
<div className="text-[10px] text-white/70 mt-0.5">{user?.tier === "Al_Coach" ? "AI Coach Plan" : `${user?.tier || "Free"} Plan`}</div>
|
||||
<div className="text-[10px] text-[var(--cyan-ai)]">{user?.target_exam === "NEET" ? "NEET Aspirant" : "JEE Aspirant"}</div>
|
||||
</div>
|
||||
<div className="text-right">
|
||||
<div className="text-[9px] text-white/50 tracking-wider">contact@pragativeer.com</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user