Changes in the UI
This commit is contained in:
Anbu-dev-creator
@@ -4,7 +4,7 @@ import {
|
||||
GraduationCap, Clock, MapPin, Users,
|
||||
Calendar, Building, ShieldCheck,
|
||||
Sparkles, KeyRound, ArrowRight, LogOut,
|
||||
AlertCircle, User, HelpCircle, Compass, ExternalLink
|
||||
AlertCircle, User, HelpCircle, Compass, ExternalLink, ChevronRight
|
||||
} from 'lucide-react';
|
||||
import { Link } from 'react-router-dom';
|
||||
import { useAuth } from '@/context/AuthContext';
|
||||
@@ -50,11 +50,11 @@ export default function StudentDashboard() {
|
||||
setIsLoading(true);
|
||||
setError(null);
|
||||
try {
|
||||
const result = await fetchStudentDashboard(imsSession.student.regNumber, user?.email);
|
||||
setData(result);
|
||||
const res = await fetchStudentDashboard(imsSession.student.regNumber);
|
||||
setData(res);
|
||||
} catch (err: any) {
|
||||
console.error('Error loading student dashboard:', err);
|
||||
setError(err?.message || 'Unable to fetch student records from IMS.');
|
||||
setError(err.message || 'Failed to fetch timetable and classroom location.');
|
||||
} finally {
|
||||
setIsLoading(false);
|
||||
}
|
||||
@@ -63,30 +63,21 @@ export default function StudentDashboard() {
|
||||
useEffect(() => {
|
||||
if (imsSession) {
|
||||
loadDashboard();
|
||||
} else {
|
||||
setData(null);
|
||||
}
|
||||
}, [imsSession]);
|
||||
|
||||
const handleImsLogin = async (e?: React.FormEvent) => {
|
||||
if (e) e.preventDefault();
|
||||
if (!regNumberInput.trim() || !passwordInput.trim()) {
|
||||
setLoginError('Please enter both Register Number and Password.');
|
||||
return;
|
||||
}
|
||||
const handleImsLogin = async (e: React.FormEvent) => {
|
||||
e.preventDefault();
|
||||
if (!regNumberInput.trim() || !passwordInput.trim()) return;
|
||||
|
||||
setIsLoggingIn(true);
|
||||
setLoginError(null);
|
||||
|
||||
try {
|
||||
const res = await loginWithIms(regNumberInput.trim(), passwordInput.trim());
|
||||
if (res.success && res.token && res.student) {
|
||||
setImsSession({ token: res.token, student: res.student });
|
||||
} else {
|
||||
setLoginError(res.message || 'Invalid Register Number or Password.');
|
||||
}
|
||||
const session = await loginWithIms(regNumberInput.trim(), passwordInput.trim());
|
||||
setImsSession(session);
|
||||
} catch (err: any) {
|
||||
setLoginError(err?.message || 'Failed to authenticate with IMS server.');
|
||||
setLoginError(err.message || 'Invalid credentials or Register Number not found.');
|
||||
} finally {
|
||||
setIsLoggingIn(false);
|
||||
}
|
||||
@@ -108,126 +99,151 @@ export default function StudentDashboard() {
|
||||
// ─────────────────────────────────────────────────────────────
|
||||
if (!imsSession) {
|
||||
return (
|
||||
<div className="min-h-[85vh] bg-[#0a0f1d] text-slate-100 flex items-center justify-center py-12 px-4 sm:px-6">
|
||||
<div className="w-full max-w-md space-y-6">
|
||||
|
||||
<div className="text-center space-y-2">
|
||||
<div className="w-16 h-16 rounded-2xl bg-gradient-to-br from-[#FF6B00] to-[#F97316] p-0.5 shadow-xl shadow-orange-500/20 mx-auto">
|
||||
<div className="w-full h-full bg-slate-950/60 rounded-[14px] flex items-center justify-center backdrop-blur-sm">
|
||||
<div className="min-h-screen" style={{ backgroundColor: '#FAFAFA' }}>
|
||||
{/* Header */}
|
||||
<div className="bg-white border-b border-[#E5E7EB] py-10">
|
||||
<div className="container-custom">
|
||||
<motion.div initial={{ opacity: 0, y: 20 }} animate={{ opacity: 1, y: 0 }} transition={{ duration: 0.5 }}>
|
||||
<div className="flex items-center gap-2 text-xs text-[#94A3B8] mb-3" style={{ fontFamily: 'Inter, sans-serif' }}>
|
||||
<Link to="/" className="hover:text-[#F97316]">Home</Link>
|
||||
<ChevronRight className="w-3 h-3" />
|
||||
<span className="text-[#F97316]">Student Dashboard</span>
|
||||
</div>
|
||||
<h1 className="text-3xl md:text-4xl font-extrabold text-[#1E293B] mb-2" style={{ fontFamily: 'Plus Jakarta Sans, sans-serif' }}>
|
||||
IMS Student{' '}
|
||||
<span style={{ background: 'linear-gradient(135deg, #F97316, #FB923C)', WebkitBackgroundClip: 'text', WebkitTextFillColor: 'transparent', backgroundClip: 'text' }}>
|
||||
Portal
|
||||
</span>
|
||||
</h1>
|
||||
<p className="text-[#475569]" style={{ fontFamily: 'Inter, sans-serif' }}>
|
||||
Enter your official college Register Number and Password to access your timetable and assigned classroom venue.
|
||||
</p>
|
||||
</motion.div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Login Form Container */}
|
||||
<div className="container-custom py-12 flex items-center justify-center pb-28">
|
||||
<div className="w-full max-w-md space-y-6">
|
||||
|
||||
<div className="text-center space-y-2">
|
||||
<div className="w-16 h-16 rounded-2xl bg-gradient-to-br from-[#FF6B00] to-[#F97316] flex items-center justify-center shadow-xl shadow-orange-500/30 mx-auto">
|
||||
<GraduationCap className="w-8 h-8 text-white" />
|
||||
</div>
|
||||
<h2 className="text-xl font-extrabold text-[#1E293B]" style={{ fontFamily: 'Plus Jakarta Sans, sans-serif' }}>
|
||||
Sign In to Student Portal
|
||||
</h2>
|
||||
<p className="text-xs text-[#64748B] max-w-sm mx-auto" style={{ fontFamily: 'Inter, sans-serif' }}>
|
||||
Enter your official college credentials below
|
||||
</p>
|
||||
</div>
|
||||
<h1 className="text-2xl font-extrabold text-white tracking-tight">
|
||||
IMS Student Portal Sign In
|
||||
</h1>
|
||||
<p className="text-xs text-slate-400 max-w-sm mx-auto">
|
||||
Enter your official college Register Number and Password to access your timetable and assigned classroom venue.
|
||||
</p>
|
||||
|
||||
{/* Login Form Card */}
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 15 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
className="bg-white border border-[#E5E7EB] rounded-3xl p-6 sm:p-8 shadow-xl space-y-5"
|
||||
>
|
||||
{loginError && (
|
||||
<div className="p-3.5 rounded-2xl bg-rose-50 border border-rose-200 flex items-start gap-2.5 text-xs text-rose-700 font-medium">
|
||||
<AlertCircle className="w-4 h-4 text-rose-500 shrink-0 mt-0.5" />
|
||||
<span>{loginError}</span>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<form onSubmit={handleImsLogin} className="space-y-4">
|
||||
<div>
|
||||
<label className="block text-xs font-bold text-[#1E293B] mb-1.5 flex items-center gap-1.5" style={{ fontFamily: 'Plus Jakarta Sans, sans-serif' }}>
|
||||
<User className="w-3.5 h-3.5 text-[#F97316]" />
|
||||
Register Number / Roll No
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
value={regNumberInput}
|
||||
onChange={(e) => setRegNumberInput(e.target.value)}
|
||||
placeholder="e.g. 2114251001"
|
||||
className="w-full bg-[#F8FAFC] border border-[#E5E7EB] rounded-xl px-4 py-3 text-sm text-[#1E293B] placeholder-[#94A3B8] outline-none focus:border-[#F97316] focus:bg-white transition-colors font-mono"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-xs font-bold text-[#1E293B] mb-1.5 flex items-center gap-1.5" style={{ fontFamily: 'Plus Jakarta Sans, sans-serif' }}>
|
||||
<KeyRound className="w-3.5 h-3.5 text-[#F97316]" />
|
||||
IMS Password
|
||||
</label>
|
||||
<input
|
||||
type="password"
|
||||
value={passwordInput}
|
||||
onChange={(e) => setPasswordInput(e.target.value)}
|
||||
placeholder="••••••••"
|
||||
className="w-full bg-[#F8FAFC] border border-[#E5E7EB] rounded-xl px-4 py-3 text-sm text-[#1E293B] placeholder-[#94A3B8] outline-none focus:border-[#F97316] focus:bg-white transition-colors font-mono"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<button
|
||||
type="submit"
|
||||
disabled={isLoggingIn}
|
||||
className="w-full py-3.5 px-4 rounded-xl text-white font-bold text-sm bg-gradient-to-r from-[#FF6B00] to-[#F97316] hover:opacity-95 shadow-lg shadow-orange-500/20 transition-all flex items-center justify-center gap-2 cursor-pointer"
|
||||
style={{ fontFamily: 'Plus Jakarta Sans, sans-serif' }}
|
||||
>
|
||||
{isLoggingIn ? (
|
||||
<div className="w-4 h-4 border-2 border-white border-t-transparent rounded-full animate-spin" />
|
||||
) : (
|
||||
<>
|
||||
<span>Sign In to Student Portal</span>
|
||||
<ArrowRight className="w-4 h-4" />
|
||||
</>
|
||||
)}
|
||||
</button>
|
||||
</form>
|
||||
|
||||
{/* Expandable Demo Helper */}
|
||||
<div className="pt-3 border-t border-[#E5E7EB]">
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setShowDemoBox(!showDemoBox)}
|
||||
className="w-full text-center text-xs font-bold text-[#F97316] hover:underline flex items-center justify-center gap-1 cursor-pointer"
|
||||
style={{ fontFamily: 'Plus Jakarta Sans, sans-serif' }}
|
||||
>
|
||||
<Sparkles className="w-3.5 h-3.5" />
|
||||
{showDemoBox ? 'Hide Demo Accounts' : 'Testing / Demo Accounts'}
|
||||
</button>
|
||||
|
||||
<AnimatePresence>
|
||||
{showDemoBox && (
|
||||
<motion.div
|
||||
initial={{ height: 0, opacity: 0 }}
|
||||
animate={{ height: 'auto', opacity: 1 }}
|
||||
exit={{ height: 0, opacity: 0 }}
|
||||
className="overflow-hidden mt-3 space-y-2"
|
||||
>
|
||||
<p className="text-[11px] text-[#64748B] text-center" style={{ fontFamily: 'Inter, sans-serif' }}>
|
||||
Click any sample student below to auto-fill the login form:
|
||||
</p>
|
||||
<div className="space-y-1.5">
|
||||
{mockUsers.map((mock) => (
|
||||
<button
|
||||
key={mock.regNumber}
|
||||
type="button"
|
||||
onClick={() => handleQuickFillMock(mock)}
|
||||
className="w-full flex items-center justify-between p-2.5 rounded-xl bg-[#F8FAFC] hover:bg-white border border-[#E5E7EB] text-left text-xs transition-colors cursor-pointer"
|
||||
>
|
||||
<div>
|
||||
<p className="font-bold text-[#1E293B]">{mock.studentName}</p>
|
||||
<p className="text-[10px] text-[#64748B]">Reg: {mock.regNumber} ({mock.department})</p>
|
||||
</div>
|
||||
<span className="text-[10px] text-[#F97316] font-mono font-bold">Fill Form</span>
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
</motion.div>
|
||||
)}
|
||||
</AnimatePresence>
|
||||
</div>
|
||||
</motion.div>
|
||||
</div>
|
||||
|
||||
{/* Login Form Card */}
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 15 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
className="bg-slate-900/80 backdrop-blur-xl border border-white/10 rounded-3xl p-6 shadow-2xl space-y-5"
|
||||
>
|
||||
{loginError && (
|
||||
<div className="p-3.5 rounded-2xl bg-rose-500/10 border border-rose-500/25 flex items-start gap-2.5 text-xs text-rose-300">
|
||||
<AlertCircle className="w-4 h-4 text-rose-400 shrink-0 mt-0.5" />
|
||||
<span>{loginError}</span>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<form onSubmit={handleImsLogin} className="space-y-4">
|
||||
<div>
|
||||
<label className="block text-xs font-semibold text-slate-300 mb-1.5 flex items-center gap-1.5">
|
||||
<User className="w-3.5 h-3.5 text-orange-400" />
|
||||
Register Number / Roll No
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
value={regNumberInput}
|
||||
onChange={(e) => setRegNumberInput(e.target.value)}
|
||||
placeholder="e.g. 2114251001"
|
||||
className="w-full bg-slate-950 border border-white/10 rounded-xl px-4 py-3 text-sm text-white placeholder-slate-500 outline-none focus:border-orange-500 transition-colors font-mono"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-xs font-semibold text-slate-300 mb-1.5 flex items-center gap-1.5">
|
||||
<KeyRound className="w-3.5 h-3.5 text-orange-400" />
|
||||
IMS Password
|
||||
</label>
|
||||
<input
|
||||
type="password"
|
||||
value={passwordInput}
|
||||
onChange={(e) => setPasswordInput(e.target.value)}
|
||||
placeholder="••••••••"
|
||||
className="w-full bg-slate-950 border border-white/10 rounded-xl px-4 py-3 text-sm text-white placeholder-slate-500 outline-none focus:border-orange-500 transition-colors font-mono"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<button
|
||||
type="submit"
|
||||
disabled={isLoggingIn}
|
||||
className="w-full py-3.5 px-4 rounded-xl text-white font-bold text-sm bg-gradient-to-r from-[#FF6B00] to-[#F97316] hover:opacity-95 shadow-lg shadow-orange-500/20 transition-all flex items-center justify-center gap-2 cursor-pointer"
|
||||
>
|
||||
{isLoggingIn ? (
|
||||
<div className="w-4 h-4 border-2 border-white border-t-transparent rounded-full animate-spin" />
|
||||
) : (
|
||||
<>
|
||||
<span>Sign In to Student Portal</span>
|
||||
<ArrowRight className="w-4 h-4" />
|
||||
</>
|
||||
)}
|
||||
</button>
|
||||
</form>
|
||||
|
||||
{/* Expandable Demo Helper */}
|
||||
<div className="pt-3 border-t border-white/10">
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setShowDemoBox(!showDemoBox)}
|
||||
className="w-full text-center text-xs font-semibold text-orange-400 hover:underline flex items-center justify-center gap-1 cursor-pointer"
|
||||
>
|
||||
<Sparkles className="w-3.5 h-3.5" />
|
||||
{showDemoBox ? 'Hide Demo Accounts' : 'Testing / Demo Accounts'}
|
||||
</button>
|
||||
|
||||
<AnimatePresence>
|
||||
{showDemoBox && (
|
||||
<motion.div
|
||||
initial={{ height: 0, opacity: 0 }}
|
||||
animate={{ height: 'auto', opacity: 1 }}
|
||||
exit={{ height: 0, opacity: 0 }}
|
||||
className="overflow-hidden mt-3 space-y-2"
|
||||
>
|
||||
<p className="text-[11px] text-slate-400 text-center">
|
||||
Click any sample student below to auto-fill the login form:
|
||||
</p>
|
||||
<div className="space-y-1.5">
|
||||
{mockUsers.map((mock) => (
|
||||
<button
|
||||
key={mock.regNumber}
|
||||
type="button"
|
||||
onClick={() => handleQuickFillMock(mock)}
|
||||
className="w-full flex items-center justify-between p-2.5 rounded-xl bg-slate-950/80 hover:bg-slate-950 border border-white/5 text-left text-xs transition-colors cursor-pointer"
|
||||
>
|
||||
<div>
|
||||
<p className="font-bold text-white">{mock.studentName}</p>
|
||||
<p className="text-[10px] text-slate-400">Reg: {mock.regNumber} ({mock.department})</p>
|
||||
</div>
|
||||
<span className="text-[10px] text-orange-400 font-mono">Fill Form</span>
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
</motion.div>
|
||||
)}
|
||||
</AnimatePresence>
|
||||
</div>
|
||||
</motion.div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
@@ -239,114 +255,114 @@ export default function StudentDashboard() {
|
||||
const classInchargeMember = data?.facultyList.find((f) => f.isClassIncharge);
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-[#0a0f1d] text-slate-100 pt-6 pb-24 px-4 sm:px-6 lg:px-8">
|
||||
<div className="max-w-7xl mx-auto space-y-8">
|
||||
|
||||
{/* ─── Top Banner ─── */}
|
||||
<div className="flex flex-col md:flex-row md:items-center justify-between gap-4 bg-slate-900/60 backdrop-blur-xl border border-white/10 rounded-3xl p-6 shadow-2xl relative overflow-hidden">
|
||||
<div className="absolute top-0 right-0 -mr-16 -mt-16 w-64 h-64 bg-orange-500/10 rounded-full blur-3xl pointer-events-none" />
|
||||
<div className="absolute bottom-0 left-0 -ml-16 -mb-16 w-64 h-64 bg-indigo-500/10 rounded-full blur-3xl pointer-events-none" />
|
||||
|
||||
<div className="relative z-10 flex items-start gap-4">
|
||||
<div className="w-14 h-14 rounded-2xl bg-gradient-to-br from-[#FF6B00] to-[#F97316] p-0.5 shadow-lg shadow-orange-500/20 shrink-0">
|
||||
<div className="w-full h-full bg-slate-950/40 rounded-[14px] flex items-center justify-center backdrop-blur-sm">
|
||||
<div className="min-h-screen" style={{ backgroundColor: '#FAFAFA' }}>
|
||||
{/* Header */}
|
||||
<div className="bg-white border-b border-[#E5E7EB] py-8">
|
||||
<div className="container-custom">
|
||||
<div className="flex flex-col md:flex-row md:items-center justify-between gap-4">
|
||||
<div className="flex items-start gap-4">
|
||||
<div className="w-14 h-14 rounded-2xl bg-gradient-to-br from-[#FF6B00] to-[#F97316] flex items-center justify-center shadow-lg shadow-orange-500/30 shrink-0">
|
||||
<GraduationCap className="w-7 h-7 text-white" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div className="flex flex-wrap items-center gap-2 mb-1">
|
||||
<h1 className="text-xl sm:text-2xl font-extrabold text-white tracking-tight">
|
||||
{data?.student.name || imsSession.student.name}
|
||||
</h1>
|
||||
<span className="px-2.5 py-0.5 rounded-full text-[10px] font-bold tracking-wider bg-emerald-500/20 text-emerald-400 border border-emerald-500/30 uppercase">
|
||||
Authenticated Student
|
||||
</span>
|
||||
</div>
|
||||
<div>
|
||||
<div className="flex flex-wrap items-center gap-2 mb-1">
|
||||
<h1 className="text-xl sm:text-2xl font-extrabold text-[#1E293B] tracking-tight" style={{ fontFamily: 'Plus Jakarta Sans, sans-serif' }}>
|
||||
{data?.student.name || imsSession.student.name}
|
||||
</h1>
|
||||
<span className="px-2.5 py-0.5 rounded-full text-[10px] font-bold tracking-wider bg-emerald-50 text-emerald-600 border border-emerald-200 uppercase">
|
||||
Authenticated Student
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-wrap items-center gap-x-4 gap-y-1 text-xs text-slate-400 font-medium">
|
||||
<span>Reg No: <strong className="text-white">{data?.student.regNumber || imsSession.student.regNumber}</strong></span>
|
||||
<span>•</span>
|
||||
<span>{data?.student.degree} {data?.student.department}</span>
|
||||
<span>•</span>
|
||||
<span>Year {data?.student.year}, Sem {data?.student.semester} ({data?.student.section})</span>
|
||||
<div className="flex flex-wrap items-center gap-x-4 gap-y-1 text-xs text-[#64748B] font-medium" style={{ fontFamily: 'Inter, sans-serif' }}>
|
||||
<span>Reg No: <strong className="text-[#1E293B]">{data?.student.regNumber || imsSession.student.regNumber}</strong></span>
|
||||
<span>•</span>
|
||||
<span>{data?.student.degree} {data?.student.department}</span>
|
||||
<span>•</span>
|
||||
<span>Year {data?.student.year}, Sem {data?.student.semester} ({data?.student.section})</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="relative z-10 flex items-center gap-2.5 self-start md:self-auto">
|
||||
<Link
|
||||
to={`/faculty?dept=${encodeURIComponent(data?.student.department || '')}`}
|
||||
className="flex items-center gap-1.5 px-3.5 py-2 rounded-xl bg-orange-500/15 hover:bg-orange-500/25 text-orange-400 border border-orange-500/30 text-xs font-bold transition-all cursor-pointer"
|
||||
>
|
||||
<span>Faculty Directory</span>
|
||||
<ExternalLink className="w-3.5 h-3.5" />
|
||||
</Link>
|
||||
<button
|
||||
onClick={handleLogoutIms}
|
||||
className="flex items-center gap-1.5 px-4 py-2 rounded-xl bg-slate-800 hover:bg-rose-500/15 text-slate-300 hover:text-rose-400 border border-white/10 hover:border-rose-500/30 text-xs font-semibold transition-all cursor-pointer"
|
||||
>
|
||||
<LogOut className="w-4 h-4" />
|
||||
Sign Out
|
||||
</button>
|
||||
<div className="flex items-center gap-2.5 self-start md:self-auto">
|
||||
<Link
|
||||
to={`/faculty?dept=${encodeURIComponent(data?.student.department || '')}`}
|
||||
className="flex items-center gap-1.5 px-3.5 py-2 rounded-xl bg-orange-50 hover:bg-orange-100 text-[#F97316] border border-orange-200 text-xs font-bold transition-all cursor-pointer"
|
||||
style={{ fontFamily: 'Plus Jakarta Sans, sans-serif' }}
|
||||
>
|
||||
<span>Faculty Directory</span>
|
||||
<ExternalLink className="w-3.5 h-3.5" />
|
||||
</Link>
|
||||
<button
|
||||
onClick={handleLogoutIms}
|
||||
className="flex items-center gap-1.5 px-4 py-2 rounded-xl bg-white hover:bg-rose-50 text-[#64748B] hover:text-rose-600 border border-[#E5E7EB] hover:border-rose-200 text-xs font-semibold transition-all cursor-pointer"
|
||||
style={{ fontFamily: 'Plus Jakarta Sans, sans-serif' }}
|
||||
>
|
||||
<LogOut className="w-4 h-4" />
|
||||
Sign Out
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="container-custom py-8 pb-32 space-y-8">
|
||||
{/* ─── Key Stats Quick Bar ─── */}
|
||||
{data && (
|
||||
<div className="grid grid-cols-2 lg:grid-cols-4 gap-4">
|
||||
<div className="bg-slate-900/40 border border-white/10 rounded-2xl p-4 flex items-center gap-3.5">
|
||||
<div className="w-10 h-10 rounded-xl bg-orange-500/10 border border-orange-500/20 flex items-center justify-center text-orange-400 shrink-0">
|
||||
<div className="bg-white border border-[#E5E7EB] rounded-2xl p-4 flex items-center gap-3.5 shadow-sm">
|
||||
<div className="w-10 h-10 rounded-xl bg-orange-50 border border-orange-200 flex items-center justify-center text-[#F97316] shrink-0">
|
||||
<Building className="w-5 h-5" />
|
||||
</div>
|
||||
<div className="min-w-0">
|
||||
<p className="text-[11px] font-semibold text-slate-400 uppercase tracking-wider">Assigned Room</p>
|
||||
<p className="text-sm sm:text-base font-bold text-white truncate">{data.classLocation.roomNumber}</p>
|
||||
<p className="text-[10px] text-slate-400 truncate">{data.classLocation.floor}</p>
|
||||
<p className="text-[11px] font-bold text-[#94A3B8] uppercase tracking-wider">Assigned Room</p>
|
||||
<p className="text-sm sm:text-base font-extrabold text-[#1E293B] truncate" style={{ fontFamily: 'Plus Jakarta Sans, sans-serif' }}>{data.classLocation.roomNumber}</p>
|
||||
<p className="text-[10px] text-[#64748B] truncate">{data.classLocation.floor}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bg-slate-900/40 border border-white/10 rounded-2xl p-4 flex items-center gap-3.5">
|
||||
<div className="w-10 h-10 rounded-xl bg-purple-500/10 border border-purple-500/20 flex items-center justify-center text-purple-400 shrink-0">
|
||||
<div className="bg-white border border-[#E5E7EB] rounded-2xl p-4 flex items-center gap-3.5 shadow-sm">
|
||||
<div className="w-10 h-10 rounded-xl bg-purple-50 border border-purple-200 flex items-center justify-center text-purple-600 shrink-0">
|
||||
<Users className="w-5 h-5" />
|
||||
</div>
|
||||
<div className="min-w-0">
|
||||
<p className="text-[11px] font-semibold text-slate-400 uppercase tracking-wider">Class Incharge</p>
|
||||
<p className="text-sm sm:text-base font-bold text-white truncate">
|
||||
<p className="text-[11px] font-bold text-[#94A3B8] uppercase tracking-wider">Class Incharge</p>
|
||||
<p className="text-sm sm:text-base font-extrabold text-[#1E293B] truncate" style={{ fontFamily: 'Plus Jakarta Sans, sans-serif' }}>
|
||||
{classInchargeMember?.facultyName.split(' ')[0] || 'Assigned'}
|
||||
</p>
|
||||
<p className="text-[10px] text-slate-400 truncate">
|
||||
<p className="text-[10px] text-[#64748B] truncate">
|
||||
{classInchargeMember?.officeLocation || 'Staff Cabin'}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bg-slate-900/40 border border-white/10 rounded-2xl p-4 flex items-center gap-3.5">
|
||||
<div className="w-10 h-10 rounded-xl bg-blue-500/10 border border-blue-500/20 flex items-center justify-center text-blue-400 shrink-0">
|
||||
<div className="bg-white border border-[#E5E7EB] rounded-2xl p-4 flex items-center gap-3.5 shadow-sm">
|
||||
<div className="w-10 h-10 rounded-xl bg-blue-50 border border-blue-200 flex items-center justify-center text-blue-600 shrink-0">
|
||||
<GraduationCap className="w-5 h-5" />
|
||||
</div>
|
||||
<div className="min-w-0">
|
||||
<p className="text-[11px] font-semibold text-slate-400 uppercase tracking-wider">Branch & Section</p>
|
||||
<p className="text-sm sm:text-base font-bold text-white truncate">{data.student.departmentCode} ({data.student.section})</p>
|
||||
<p className="text-[10px] text-slate-400 truncate">Semester {data.student.semester}</p>
|
||||
<p className="text-[11px] font-bold text-[#94A3B8] uppercase tracking-wider">Branch & Section</p>
|
||||
<p className="text-sm sm:text-base font-extrabold text-[#1E293B] truncate" style={{ fontFamily: 'Plus Jakarta Sans, sans-serif' }}>{data.student.departmentCode} ({data.student.section})</p>
|
||||
<p className="text-[10px] text-[#64748B] truncate">Semester {data.student.semester}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bg-slate-900/40 border border-white/10 rounded-2xl p-4 flex items-center gap-3.5">
|
||||
<div className="w-10 h-10 rounded-xl bg-emerald-500/10 border border-emerald-500/20 flex items-center justify-center text-emerald-400 shrink-0">
|
||||
<div className="bg-white border border-[#E5E7EB] rounded-2xl p-4 flex items-center gap-3.5 shadow-sm">
|
||||
<div className="w-10 h-10 rounded-xl bg-emerald-50 border border-emerald-200 flex items-center justify-center text-emerald-600 shrink-0">
|
||||
<Calendar className="w-5 h-5" />
|
||||
</div>
|
||||
<div className="min-w-0">
|
||||
<p className="text-[11px] font-semibold text-slate-400 uppercase tracking-wider">Academic Batch</p>
|
||||
<p className="text-sm sm:text-base font-bold text-white truncate">{data.student.batch}</p>
|
||||
<p className="text-[10px] text-slate-400 truncate">{data.student.regulation}</p>
|
||||
<p className="text-[11px] font-bold text-[#94A3B8] uppercase tracking-wider">Academic Batch</p>
|
||||
<p className="text-sm sm:text-base font-extrabold text-[#1E293B] truncate" style={{ fontFamily: 'Plus Jakarta Sans, sans-serif' }}>{data.student.batch}</p>
|
||||
<p className="text-[10px] text-[#64748B] truncate">{data.student.regulation}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* ─── Navigation Tabs ─── */}
|
||||
<div className="flex items-center justify-between border-b border-white/10 pb-4 overflow-x-auto gap-4">
|
||||
<div className="flex items-center justify-between border-b border-[#E5E7EB] pb-4 overflow-x-auto gap-4">
|
||||
<div className="flex items-center gap-2">
|
||||
{[
|
||||
{ id: 'timetable', label: "Today's Timetable", icon: Clock },
|
||||
@@ -361,8 +377,9 @@ export default function StudentDashboard() {
|
||||
className={`flex items-center gap-2 px-4 py-2.5 rounded-xl text-xs sm:text-sm font-bold transition-all cursor-pointer whitespace-nowrap ${
|
||||
isActive
|
||||
? 'bg-gradient-to-r from-[#FF6B00] to-[#F97316] text-white shadow-md shadow-orange-500/20'
|
||||
: 'bg-slate-900/60 hover:bg-slate-800 text-slate-300 hover:text-white border border-white/10'
|
||||
: 'bg-white hover:bg-slate-50 text-[#475569] hover:text-[#1E293B] border border-[#E5E7EB]'
|
||||
}`}
|
||||
style={{ fontFamily: 'Plus Jakarta Sans, sans-serif' }}
|
||||
>
|
||||
<Icon className="w-4 h-4" />
|
||||
{tab.label}
|
||||
@@ -374,11 +391,12 @@ export default function StudentDashboard() {
|
||||
{data && (
|
||||
<Link
|
||||
to={`/faculty?dept=${encodeURIComponent(data.student.department)}`}
|
||||
className="flex items-center gap-1.5 px-4 py-2 rounded-xl bg-slate-900 hover:bg-slate-800 border border-white/10 text-xs font-bold text-slate-200 hover:text-white transition-all cursor-pointer whitespace-nowrap shrink-0"
|
||||
className="flex items-center gap-1.5 px-4 py-2 rounded-xl bg-white hover:bg-slate-50 border border-[#E5E7EB] text-xs font-bold text-[#475569] hover:text-[#1E293B] transition-all cursor-pointer whitespace-nowrap shrink-0"
|
||||
style={{ fontFamily: 'Plus Jakarta Sans, sans-serif' }}
|
||||
>
|
||||
<Users className="w-4 h-4 text-orange-400" />
|
||||
<Users className="w-4 h-4 text-[#F97316]" />
|
||||
<span>View {data.student.departmentCode} Faculty Directory</span>
|
||||
<ArrowRight className="w-3.5 h-3.5 text-slate-400" />
|
||||
<ArrowRight className="w-3.5 h-3.5 text-[#94A3B8]" />
|
||||
</Link>
|
||||
)}
|
||||
</div>
|
||||
@@ -386,16 +404,16 @@ export default function StudentDashboard() {
|
||||
{/* ─── Main Content Tabs ─── */}
|
||||
{isLoading ? (
|
||||
<div className="flex flex-col items-center justify-center py-20 gap-3">
|
||||
<div className="w-8 h-8 border-3 border-orange-500 border-t-transparent rounded-full animate-spin" />
|
||||
<p className="text-xs text-slate-400 font-medium">Connecting to IMS services...</p>
|
||||
<div className="w-8 h-8 border-3 border-[#F97316] border-t-transparent rounded-full animate-spin" />
|
||||
<p className="text-xs text-[#64748B] font-medium">Connecting to IMS services...</p>
|
||||
</div>
|
||||
) : error ? (
|
||||
<div className="bg-rose-500/10 border border-rose-500/30 rounded-3xl p-8 text-center space-y-3">
|
||||
<p className="text-rose-400 font-bold text-base">Error connecting to IMS Gateway</p>
|
||||
<p className="text-slate-400 text-xs max-w-md mx-auto">{error}</p>
|
||||
<div className="bg-rose-50 border border-rose-200 rounded-3xl p-8 text-center space-y-3">
|
||||
<p className="text-rose-700 font-bold text-base">Error connecting to IMS Gateway</p>
|
||||
<p className="text-[#64748B] text-xs max-w-md mx-auto">{error}</p>
|
||||
<button
|
||||
onClick={() => loadDashboard()}
|
||||
className="px-4 py-2 bg-rose-500 text-white rounded-xl text-xs font-bold hover:bg-rose-600 transition-colors"
|
||||
className="px-4 py-2 bg-rose-600 text-white rounded-xl text-xs font-bold hover:bg-rose-700 transition-colors"
|
||||
>
|
||||
Retry Connection
|
||||
</button>
|
||||
@@ -405,16 +423,16 @@ export default function StudentDashboard() {
|
||||
{/* ─── 1. TIMETABLE TAB ─── */}
|
||||
{activeTab === 'timetable' && (
|
||||
<div className="space-y-6">
|
||||
<div className="flex flex-wrap items-center justify-between gap-3 bg-slate-900/40 p-4 rounded-2xl border border-white/10">
|
||||
<div className="flex flex-wrap items-center justify-between gap-3 bg-white p-4 rounded-2xl border border-[#E5E7EB] shadow-sm">
|
||||
<div className="flex items-center gap-2">
|
||||
<Calendar className="w-4 h-4 text-orange-400" />
|
||||
<span className="text-sm font-bold text-white tracking-wide">
|
||||
<Calendar className="w-4 h-4 text-[#F97316]" />
|
||||
<span className="text-sm font-bold text-[#1E293B] tracking-wide" style={{ fontFamily: 'Plus Jakarta Sans, sans-serif' }}>
|
||||
{data.todaySchedule.dayOfWeek} SCHEDULE ({data.todaySchedule.date})
|
||||
</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-3 text-xs">
|
||||
<span className="flex items-center gap-1 text-emerald-400 font-semibold">
|
||||
<span className="w-2 h-2 rounded-full bg-emerald-400 animate-pulse" />
|
||||
<span className="flex items-center gap-1 text-emerald-600 font-bold">
|
||||
<span className="w-2 h-2 rounded-full bg-emerald-500 animate-pulse" />
|
||||
Live Status Active
|
||||
</span>
|
||||
</div>
|
||||
@@ -432,20 +450,20 @@ export default function StudentDashboard() {
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
className={`relative rounded-2xl p-5 border transition-all ${
|
||||
isOngoing
|
||||
? 'bg-gradient-to-b from-orange-500/15 to-slate-900 border-orange-500/50 shadow-xl shadow-orange-500/10 ring-1 ring-orange-500/40'
|
||||
? 'bg-gradient-to-b from-orange-500/10 via-white to-white border-[#F97316] shadow-md ring-1 ring-orange-400/30'
|
||||
: isCompleted
|
||||
? 'bg-slate-950/40 border-white/5 opacity-60'
|
||||
: 'bg-slate-900/50 border-white/10 hover:border-white/20'
|
||||
? 'bg-slate-50/80 border-[#E5E7EB] opacity-60'
|
||||
: 'bg-white border-[#E5E7EB] hover:border-slate-300 shadow-sm'
|
||||
}`}
|
||||
>
|
||||
{/* Header Badge */}
|
||||
<div className="flex items-center justify-between gap-2 mb-3">
|
||||
<div className="flex items-center gap-2">
|
||||
<span className="w-6 h-6 rounded-lg bg-white/10 text-white font-bold text-xs flex items-center justify-center">
|
||||
<span className="w-6 h-6 rounded-lg bg-slate-100 text-[#1E293B] font-bold text-xs flex items-center justify-center">
|
||||
P{period.periodNumber}
|
||||
</span>
|
||||
<span className="text-xs font-semibold text-slate-300 flex items-center gap-1">
|
||||
<Clock className="w-3 h-3 text-slate-400" />
|
||||
<span className="text-xs font-semibold text-[#64748B] flex items-center gap-1">
|
||||
<Clock className="w-3 h-3 text-[#94A3B8]" />
|
||||
{period.timeSlot}
|
||||
</span>
|
||||
</div>
|
||||
@@ -453,10 +471,10 @@ export default function StudentDashboard() {
|
||||
<span
|
||||
className={`px-2.5 py-0.5 rounded-full text-[10px] font-extrabold uppercase tracking-wider ${
|
||||
isOngoing
|
||||
? 'bg-orange-500 text-white animate-pulse'
|
||||
? 'bg-[#F97316] text-white animate-pulse'
|
||||
: isCompleted
|
||||
? 'bg-slate-800 text-slate-400'
|
||||
: 'bg-blue-500/20 text-blue-400 border border-blue-500/30'
|
||||
? 'bg-slate-200 text-[#64748B]'
|
||||
: 'bg-blue-50 text-blue-600 border border-blue-200'
|
||||
}`}
|
||||
>
|
||||
{period.status}
|
||||
@@ -466,23 +484,23 @@ export default function StudentDashboard() {
|
||||
{/* Subject Details */}
|
||||
<div className="space-y-1.5 mb-4">
|
||||
<div className="flex items-center gap-2">
|
||||
<span className="text-[11px] font-mono font-bold text-orange-400">
|
||||
<span className="text-[11px] font-mono font-bold text-[#F97316]">
|
||||
{period.subjectCode}
|
||||
</span>
|
||||
<span className="px-1.5 py-0.2 rounded text-[9px] font-bold bg-white/10 text-slate-300 uppercase">
|
||||
<span className="px-1.5 py-0.2 rounded text-[9px] font-bold bg-slate-100 text-[#475569] uppercase">
|
||||
{period.type}
|
||||
</span>
|
||||
</div>
|
||||
<h3 className="text-base font-bold text-white line-clamp-1">
|
||||
<h3 className="text-base font-extrabold text-[#1E293B] line-clamp-1" style={{ fontFamily: 'Plus Jakarta Sans, sans-serif' }}>
|
||||
{period.subjectName}
|
||||
</h3>
|
||||
</div>
|
||||
|
||||
{/* Footer / Instructor & Venue */}
|
||||
<div className="pt-3 border-t border-white/10 flex items-center justify-between text-xs text-slate-300">
|
||||
<span className="truncate pr-2">{period.facultyName}</span>
|
||||
<span className="shrink-0 font-bold text-white px-2 py-0.5 rounded-lg bg-white/10 flex items-center gap-1">
|
||||
<MapPin className="w-3 h-3 text-orange-400" />
|
||||
<div className="pt-3 border-t border-[#E5E7EB] flex items-center justify-between text-xs text-[#475569]">
|
||||
<span className="truncate pr-2 font-medium">{period.facultyName}</span>
|
||||
<span className="shrink-0 font-bold text-[#1E293B] px-2 py-0.5 rounded-lg bg-slate-100 flex items-center gap-1">
|
||||
<MapPin className="w-3 h-3 text-[#F97316]" />
|
||||
{period.venue}
|
||||
</span>
|
||||
</div>
|
||||
@@ -496,78 +514,78 @@ export default function StudentDashboard() {
|
||||
{/* ─── 2. CLASS LOCATION TAB ─── */}
|
||||
{activeTab === 'location' && (
|
||||
<div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
|
||||
<div className="bg-slate-900/60 border border-white/10 rounded-3xl p-6 space-y-6">
|
||||
<div className="bg-white border border-[#E5E7EB] rounded-3xl p-6 space-y-6 shadow-sm">
|
||||
<div>
|
||||
<h3 className="text-lg font-bold text-white flex items-center gap-2 mb-1">
|
||||
<Building className="w-5 h-5 text-orange-400" />
|
||||
<h3 className="text-lg font-extrabold text-[#1E293B] flex items-center gap-2 mb-1" style={{ fontFamily: 'Plus Jakarta Sans, sans-serif' }}>
|
||||
<Building className="w-5 h-5 text-[#F97316]" />
|
||||
Classroom & Section Venue
|
||||
</h3>
|
||||
<p className="text-xs text-slate-400">
|
||||
<p className="text-xs text-[#64748B]">
|
||||
Official lecture hall allocation from Academic Registrar.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="space-y-4">
|
||||
<div className="p-4 rounded-2xl bg-white/5 border border-white/10 flex items-center justify-between">
|
||||
<div className="p-4 rounded-2xl bg-slate-50 border border-[#E5E7EB] flex items-center justify-between">
|
||||
<div>
|
||||
<p className="text-xs text-slate-400 uppercase font-semibold">Room Number</p>
|
||||
<p className="text-2xl font-black text-white">{data.classLocation.roomNumber}</p>
|
||||
<p className="text-xs text-[#64748B] uppercase font-semibold">Room Number</p>
|
||||
<p className="text-2xl font-black text-[#1E293B]" style={{ fontFamily: 'Plus Jakarta Sans, sans-serif' }}>{data.classLocation.roomNumber}</p>
|
||||
</div>
|
||||
<span className="px-3 py-1 bg-orange-500/20 text-orange-400 border border-orange-500/30 rounded-xl text-xs font-bold">
|
||||
<span className="px-3 py-1 bg-orange-50 text-[#F97316] border border-orange-200 rounded-xl text-xs font-bold">
|
||||
{data.student.section} Section
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div className="space-y-3 text-xs">
|
||||
<div className="flex justify-between py-2 border-b border-white/10">
|
||||
<span className="text-slate-400">Building Block:</span>
|
||||
<span className="font-bold text-white text-right">{data.classLocation.buildingName}</span>
|
||||
<div className="flex justify-between py-2 border-b border-[#E5E7EB]">
|
||||
<span className="text-[#64748B]">Building Block:</span>
|
||||
<span className="font-bold text-[#1E293B] text-right">{data.classLocation.buildingName}</span>
|
||||
</div>
|
||||
<div className="flex justify-between py-2 border-b border-white/10">
|
||||
<span className="text-slate-400">Floor & Wing:</span>
|
||||
<span className="font-bold text-white">{data.classLocation.floor}, {data.classLocation.wing}</span>
|
||||
<div className="flex justify-between py-2 border-b border-[#E5E7EB]">
|
||||
<span className="text-[#64748B]">Floor & Wing:</span>
|
||||
<span className="font-bold text-[#1E293B]">{data.classLocation.floor}, {data.classLocation.wing}</span>
|
||||
</div>
|
||||
<div className="flex justify-between py-2">
|
||||
<span className="text-slate-400">Landmark Directions:</span>
|
||||
<span className="font-bold text-orange-400 text-right max-w-xs">{data.classLocation.landmark}</span>
|
||||
<span className="text-[#64748B]">Landmark Directions:</span>
|
||||
<span className="font-bold text-[#F97316] text-right max-w-xs">{data.classLocation.landmark}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bg-slate-900/60 border border-white/10 rounded-3xl p-6 flex flex-col justify-between space-y-6">
|
||||
<div className="bg-white border border-[#E5E7EB] rounded-3xl p-6 flex flex-col justify-between space-y-6 shadow-sm">
|
||||
<div className="space-y-3">
|
||||
<h3 className="text-lg font-bold text-white flex items-center gap-2">
|
||||
<Compass className="w-5 h-5 text-orange-400" />
|
||||
<h3 className="text-lg font-extrabold text-[#1E293B] flex items-center gap-2" style={{ fontFamily: 'Plus Jakarta Sans, sans-serif' }}>
|
||||
<Compass className="w-5 h-5 text-[#F97316]" />
|
||||
Academic Department Details
|
||||
</h3>
|
||||
<p className="text-xs text-slate-400 leading-relaxed">
|
||||
<p className="text-xs text-[#64748B] leading-relaxed">
|
||||
Official department profile, curriculum regulation, and academic guidelines for batch {data.student.batch}.
|
||||
</p>
|
||||
|
||||
<div className="grid grid-cols-2 gap-3 pt-3">
|
||||
<div className="p-3 bg-white/5 rounded-xl border border-white/5">
|
||||
<p className="text-[10px] uppercase font-bold text-slate-400">Degree & Branch</p>
|
||||
<p className="text-xs font-bold text-white mt-0.5">{data.student.degree} {data.student.departmentCode}</p>
|
||||
<div className="p-3 bg-slate-50 rounded-xl border border-[#E5E7EB]">
|
||||
<p className="text-[10px] uppercase font-bold text-[#94A3B8]">Degree & Branch</p>
|
||||
<p className="text-xs font-bold text-[#1E293B] mt-0.5">{data.student.degree} {data.student.departmentCode}</p>
|
||||
</div>
|
||||
<div className="p-3 bg-white/5 rounded-xl border border-white/5">
|
||||
<p className="text-[10px] uppercase font-bold text-slate-400">Regulation</p>
|
||||
<p className="text-xs font-bold text-white mt-0.5">{data.student.regulation}</p>
|
||||
<div className="p-3 bg-slate-50 rounded-xl border border-[#E5E7EB]">
|
||||
<p className="text-[10px] uppercase font-bold text-[#94A3B8]">Regulation</p>
|
||||
<p className="text-xs font-bold text-[#1E293B] mt-0.5">{data.student.regulation}</p>
|
||||
</div>
|
||||
<div className="p-3 bg-white/5 rounded-xl border border-white/5">
|
||||
<p className="text-[10px] uppercase font-bold text-slate-400">Academic Year</p>
|
||||
<p className="text-xs font-bold text-white mt-0.5">Year {data.student.year} (Sem {data.student.semester})</p>
|
||||
<div className="p-3 bg-slate-50 rounded-xl border border-[#E5E7EB]">
|
||||
<p className="text-[10px] uppercase font-bold text-[#94A3B8]">Academic Year</p>
|
||||
<p className="text-xs font-bold text-[#1E293B] mt-0.5">Year {data.student.year} (Sem {data.student.semester})</p>
|
||||
</div>
|
||||
<div className="p-3 bg-white/5 rounded-xl border border-white/5">
|
||||
<p className="text-[10px] uppercase font-bold text-slate-400">Batch Cohort</p>
|
||||
<p className="text-xs font-bold text-white mt-0.5">{data.student.batch}</p>
|
||||
<div className="p-3 bg-slate-50 rounded-xl border border-[#E5E7EB]">
|
||||
<p className="text-[10px] uppercase font-bold text-[#94A3B8]">Batch Cohort</p>
|
||||
<p className="text-xs font-bold text-[#1E293B] mt-0.5">{data.student.batch}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="p-4 rounded-2xl bg-gradient-to-r from-orange-500/10 to-indigo-500/10 border border-white/10 flex items-center gap-3">
|
||||
<HelpCircle className="w-5 h-5 text-orange-400 shrink-0" />
|
||||
<p className="text-xs text-slate-300">
|
||||
<div className="p-4 rounded-2xl bg-orange-50 border border-orange-200 flex items-center gap-3">
|
||||
<HelpCircle className="w-5 h-5 text-[#F97316] shrink-0" />
|
||||
<p className="text-xs text-[#475569]">
|
||||
Need classroom adjustment? Contact your Class Incharge or Head of Department.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user