design: update login page grid, remove terms and conditions, generalize description, and fix typescript errors

This commit is contained in:
2026-06-25 05:44:30 +05:30
parent 010f7f6f5b
commit 14fb43aa4e
3 changed files with 69 additions and 36 deletions

View File

@@ -1649,15 +1649,16 @@ export const EventProposalForm: React.FC<EventProposalFormProps> = ({ initialDat
(async () => { (async () => {
setIsSubmitting(true); setIsSubmitting(true);
const groupRequestId = crypto.randomUUID(); const groupRequestId = crypto.randomUUID();
const { earliestStart, latestEnd } = calculateEventDateTimes(); const earliestStart = new Date(formData.startDate);
const latestEnd = new Date(formData.endDate);
const payload = { const payload = {
...formData, ...formData,
startDate: earliestStart ? earliestStart.toISOString() : formData.startDate, startDate: earliestStart.toISOString(),
endDate: latestEnd ? latestEnd.toISOString() : formData.endDate, endDate: latestEnd.toISOString(),
deptLimits, deptLimits,
deptSectionLimits, deptSectionLimits,
maxParticipants: formData.maxParticipants === '' ? null : Number(formData.maxParticipants), maxParticipants: formData.maxParticipants === '' ? null : Number(formData.maxParticipants),
durationDays: Number(formData.durationDays), durationDays: 1,
refreshment_expense: Number(formData.refreshment_expense) || 0, refreshment_expense: Number(formData.refreshment_expense) || 0,
transportation_expense: Number(formData.transportation_expense) || 0, transportation_expense: Number(formData.transportation_expense) || 0,
session_coverage_fee: Number(formData.session_coverage_fee) || 0, session_coverage_fee: Number(formData.session_coverage_fee) || 0,

View File

@@ -339,21 +339,15 @@ const EventCard: React.FC<EventCardProps> = ({ event, isBooked, onToggle, onTrac
<button disabled className="w-full py-5 rounded-[2rem] bg-rose-50 border border-rose-100 text-rose-400 font-black uppercase tracking-[0.3em] text-xs cursor-not-allowed"> <button disabled className="w-full py-5 rounded-[2rem] bg-rose-50 border border-rose-100 text-rose-400 font-black uppercase tracking-[0.3em] text-xs cursor-not-allowed">
{admissionStatus === 'EVENT_ENDED' {admissionStatus === 'EVENT_ENDED'
? 'EVENT ENDED' ? 'EVENT ENDED'
: admissionStatus === 'DEPT_FULL' : admissionStatus === 'DEADLINE_PASSED'
? 'THE SEATS ARE FULL' ? 'Deadline Over'
: admissionStatus === 'DEADLINE_PASSED' : admissionStatus === 'DEPT_RESTRICTED'
? 'Deadline Over' ? 'DEPT RESTRICTED'
: admissionStatus === 'SECTION_FULL' : admissionStatus === 'YEAR_RESTRICTED'
? 'SEC SEATS FULL' ? 'YEAR RESTRICTED'
: admissionStatus === 'SECTION_NOT_ALLOWED' : admissionStatus === 'SECTION_RESTRICTED'
? 'SEC RESTRICTED' ? 'SEC RESTRICTED'
: admissionStatus === 'DEPT_RESTRICTED' : 'Event Full'}
? 'DEPT RESTRICTED'
: admissionStatus === 'YEAR_RESTRICTED'
? 'YEAR RESTRICTED'
: admissionStatus === 'SECTION_RESTRICTED'
? 'SEC RESTRICTED'
: 'Event Full'}
</button> </button>
)} )}
</div> </div>

View File

@@ -260,29 +260,60 @@ export const LoginPage: React.FC = () => {
</div> </div>
{/* Top: Brand Header */} {/* Top: Brand Header */}
<div className="flex items-center z-10"> <motion.div
<img src={ritLogo} alt="RIT Logo" className="h-20 w-auto object-contain bg-white/95 p-3 rounded-2xl shadow-sm" /> initial={{ opacity: 0, y: -20 }}
</div> animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.8, ease: "easeOut" }}
className="flex items-center z-10"
>
<img src={ritLogo} alt="RIT Logo" className="h-20 w-auto object-contain bg-white/95 p-3 rounded-2xl shadow-sm hover:scale-105 transition-transform duration-300 cursor-pointer" />
</motion.div>
{/* Middle: Feature list / value proposition */} {/* Middle: Feature list / value proposition */}
<div className="space-y-8 z-10 my-auto"> <motion.div
<div className="space-y-4"> initial="hidden"
animate="visible"
variants={{
hidden: { opacity: 0 },
visible: {
opacity: 1,
transition: {
staggerChildren: 0.15,
delayChildren: 0.2
}
}
}}
className="space-y-8 z-10 my-auto"
>
<motion.div
variants={{
hidden: { opacity: 0, x: -30 },
visible: { opacity: 1, x: 0, transition: { type: "spring", stiffness: 100 } }
}}
className="space-y-4"
>
<span className="px-3 py-1 bg-white/10 rounded-full text-[9px] font-black uppercase tracking-widest text-slate-200">Centralized Portal</span> <span className="px-3 py-1 bg-white/10 rounded-full text-[9px] font-black uppercase tracking-widest text-slate-200">Centralized Portal</span>
<h1 className="text-5xl font-black tracking-tight leading-tight uppercase"> <h1 className="text-5xl font-black tracking-tight leading-tight uppercase">
RIT EVENT HUB RIT EVENT HUB
</h1> </h1>
<p className="text-sm font-medium text-slate-200/80 max-w-lg leading-relaxed"> <p className="text-sm font-medium text-slate-200/80 max-w-lg leading-relaxed">
Schedule, approve, and track academic, placement, and cultural events across Rajalakshmi Institute of Technology with an automated conflict engine. Your central hub to discover, register, and track all institutional activities, workshops, seminars, and campus events at Rajalakshmi Institute of Technology.
</p> </p>
</div> </motion.div>
<div className="space-y-4 pt-6 border-t border-white/10 max-w-md"> <motion.div
variants={{
hidden: { opacity: 0, y: 20 },
visible: { opacity: 1, y: 0, transition: { duration: 0.5 } }
}}
className="space-y-4 pt-6 border-t border-white/10 max-w-md"
>
{[ {[
{ title: "Smart Scheduling", desc: "Conflict audit for auditoriums, seminar halls, and computer centers in real-time." }, { title: "Campus Calendar", desc: "Discover upcoming workshops, technical symposiums, and cultural events easily." },
{ title: "Multi-tier Approvals", desc: "Digital verification chain routing proposals through departments, HoDs, and the Principal." }, { title: "Student Passports", desc: "Access your registrations, entry passes, and event certificates in one place." },
{ title: "Student Passports", desc: "Secure digital passes, attendance tracking, and automated OD verification." } { title: "Stay Connected", desc: "Get real-time announcements on departmental activities and club schedules." }
].map((f, i) => ( ].map((f, i) => (
<div key={i} className="flex gap-4 items-start"> <div key={i} className="flex gap-4 items-start hover:translate-x-1 transition-transform duration-200">
<div className="w-6 h-6 rounded-lg bg-white/10 flex items-center justify-center text-xs font-black text-white shrink-0 mt-0.5"></div> <div className="w-6 h-6 rounded-lg bg-white/10 flex items-center justify-center text-xs font-black text-white shrink-0 mt-0.5"></div>
<div> <div>
<h4 className="text-xs font-black uppercase tracking-wider text-white">{f.title}</h4> <h4 className="text-xs font-black uppercase tracking-wider text-white">{f.title}</h4>
@@ -290,18 +321,25 @@ export const LoginPage: React.FC = () => {
</div> </div>
</div> </div>
))} ))}
</div> </motion.div>
</div> </motion.div>
{/* Bottom: Institutional footer */} {/* Bottom: Institutional footer (Terms & Conditions removed) */}
<div className="z-10 flex items-center justify-between text-[10px] font-bold text-slate-400 uppercase tracking-widest"> <motion.div
initial={{ opacity: 0 }}
animate={{ opacity: 1 }}
transition={{ delay: 0.8, duration: 0.5 }}
className="z-10 flex items-center text-[10px] font-bold text-slate-400 uppercase tracking-widest"
>
<span>RIT Event Hub © {new Date().getFullYear()}</span> <span>RIT Event Hub © {new Date().getFullYear()}</span>
<span>Terms & Conditions</span> </motion.div>
</div>
</div> </div>
{/* Right Column: Form (100% on mobile, 45% on desktop) */} {/* Right Column: Form (100% on mobile, 45% on desktop) */}
<div className="w-full lg:w-[45%] flex items-center justify-center p-8 md:p-16 bg-white relative"> <div className="w-full lg:w-[45%] flex items-center justify-center p-8 md:p-16 bg-white relative">
{/* Light overlay grid pattern */}
<div className="absolute inset-0 pointer-events-none opacity-[0.04]" style={{ backgroundImage: 'linear-gradient(to right, #004a99 1px, transparent 1px), linear-gradient(to bottom, #004a99 1px, transparent 1px)', backgroundSize: '48px 48px' }} />
{/* Decorative radial accents on the white side to retain look */} {/* Decorative radial accents on the white side to retain look */}
<div className="absolute top-[10%] right-[10%] w-[300px] h-[300px] bg-brand-glow rounded-full blur-[100px] opacity-30 pointer-events-none" /> <div className="absolute top-[10%] right-[10%] w-[300px] h-[300px] bg-brand-glow rounded-full blur-[100px] opacity-30 pointer-events-none" />
<div className="absolute bottom-[10%] left-[10%] w-[300px] h-[300px] bg-indigo-50 rounded-full blur-[100px] opacity-30 pointer-events-none" /> <div className="absolute bottom-[10%] left-[10%] w-[300px] h-[300px] bg-indigo-50 rounded-full blur-[100px] opacity-30 pointer-events-none" />