ShanmugaKrishnanSM/RIT-nexus
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

video playback enhanced
Some checks failed
Deploy RIT Freshers Hub to VPS / Deploy to Live VPS (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Shanmuga Krishnan S M
2026-08-13 23:23:48 +05:30
parent a6efffdefd
commit 68e8f6e002
15 changed files with 189 additions and 244 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/Auth/GoogleAuthModal.tsx
View File

@@ -75,7 +75,7 @@ export default function GoogleAuthModal({ isOpen, onClose }: GoogleAuthModalProp
> >
{/* Background Orbs */} {/* Background Orbs */}
<div className="absolute -top-20 -right-20 w-40 h-40 bg-orange-500/20 rounded-full blur-2xl pointer-events-none" /> <div className="absolute -top-20 -right-20 w-40 h-40 bg-orange-500/20 rounded-full blur-2xl pointer-events-none" />
<div className="absolute -bottom-20 -left-20 w-40 h-40 bg-blue-500/20 rounded-full blur-2xl pointer-events-none" /> <div className="absolute -bottom-20 -left-20 w-40 h-40 bg-violet-900/30 rounded-full blur-2xl pointer-events-none" />
{/* Close Button */} {/* Close Button */}
<button <button

24
src/components/FacultyCard/FacultyCard.tsx
View File

@@ -32,7 +32,7 @@ export default function FacultyCard({ faculty }: FacultyCardProps) {
const mailOptions = [ const mailOptions = [
{ name: 'Default Mail App', url: `mailto:${faculty.email}`, icon: Monitor, color: 'text-gray-700', bg: 'bg-gray-100' }, { name: 'Default Mail App', url: `mailto:${faculty.email}`, icon: Monitor, color: 'text-gray-700', bg: 'bg-gray-100' },
{ name: 'Gmail', url: `https://mail.google.com/mail/?view=cm&fs=1&to=${faculty.email}`, icon: Mail, color: 'text-red-500', bg: 'bg-red-50' }, { name: 'Gmail', url: `https://mail.google.com/mail/?view=cm&fs=1&to=${faculty.email}`, icon: Mail, color: 'text-red-500', bg: 'bg-red-50' },
{ name: 'Outlook', url: `https://outlook.office.com/mail/deeplink/compose?to=${faculty.email}`, icon: Mail, color: 'text-blue-600', bg: 'bg-blue-50' }, { name: 'Outlook', url: `https://outlook.office.com/mail/deeplink/compose?to=${faculty.email}`, icon: Mail, color: 'text-slate-800', bg: 'bg-slate-100' },
{ name: 'Yahoo Mail', url: `https://compose.mail.yahoo.com/?to=${faculty.email}`, icon: Mail, color: 'text-purple-600', bg: 'bg-purple-50' }, { name: 'Yahoo Mail', url: `https://compose.mail.yahoo.com/?to=${faculty.email}`, icon: Mail, color: 'text-purple-600', bg: 'bg-purple-50' },
]; ];
@@ -172,8 +172,8 @@ export default function FacultyCard({ faculty }: FacultyCardProps) {
className="flex items-center gap-4 p-3 rounded-xl hover:bg-white/80 transition-colors border group w-full" className="flex items-center gap-4 p-3 rounded-xl hover:bg-white/80 transition-colors border group w-full"
style={{ backgroundColor: 'rgba(255, 255, 255, 0.6)', borderColor: `${from}15` }} style={{ backgroundColor: 'rgba(255, 255, 255, 0.6)', borderColor: `${from}15` }}
> >
<div className="w-10 h-10 rounded-full bg-blue-50 flex items-center justify-center group-hover:bg-blue-500 transition-colors shrink-0"> <div className="w-10 h-10 rounded-full bg-slate-900 flex items-center justify-center group-hover:bg-[#1E1B4B] transition-colors shrink-0">
<Phone className="w-4 h-4 text-blue-500 group-hover:text-white transition-colors" /> <Phone className="w-4 h-4 text-violet-300 group-hover:text-white transition-colors" />
</div> </div>
<div className="overflow-hidden"> <div className="overflow-hidden">
<p className="text-[11px] font-semibold text-[#94A3B8] uppercase tracking-wider mb-0.5" style={{ fontFamily: 'Inter, sans-serif' }}>Phone Number</p> <p className="text-[11px] font-semibold text-[#94A3B8] uppercase tracking-wider mb-0.5" style={{ fontFamily: 'Inter, sans-serif' }}>Phone Number</p>
@@ -224,14 +224,14 @@ export default function FacultyCard({ faculty }: FacultyCardProps) {
{/* Section 2: Academic Info */} {/* Section 2: Academic Info */}
<div className="bg-white rounded-[20px] shadow-sm border border-[#E8ECF4] p-6 sm:p-8"> <div className="bg-white rounded-[20px] shadow-sm border border-[#E8ECF4] p-6 sm:p-8">
<div className="flex items-center gap-3 mb-6"> <div className="flex items-center gap-3 mb-6">
<div className="w-10 h-10 rounded-xl bg-indigo-50 flex items-center justify-center shrink-0"> <div className="w-10 h-10 rounded-xl bg-slate-900 flex items-center justify-center shrink-0">
<BookOpen className="w-5 h-5 text-indigo-500" /> <BookOpen className="w-5 h-5 text-violet-300" />
</div> </div>
<h3 className="text-lg font-bold text-[#1E293B]" style={{ fontFamily: 'Poppins, sans-serif' }}>Academic Information</h3> <h3 className="text-lg font-bold text-[#1E293B]" style={{ fontFamily: 'Poppins, sans-serif' }}>Academic Information</h3>
</div> </div>
<div className="flex flex-col gap-4"> <div className="flex flex-col gap-4">
<div className="p-5 rounded-xl bg-indigo-50/30 border border-indigo-100/50"> <div className="p-5 rounded-xl bg-slate-900/40 border border-slate-800">
<p className="text-xs font-bold text-indigo-400 uppercase tracking-wider mb-2" style={{ fontFamily: 'Inter, sans-serif' }}>Subjects Handling</p> <p className="text-xs font-bold text-violet-300 uppercase tracking-wider mb-2" style={{ fontFamily: 'Inter, sans-serif' }}>Subjects Handling</p>
<p className="text-sm font-medium text-[#1E293B]" style={{ fontFamily: 'Inter, sans-serif', lineHeight: '1.6' }}>{faculty.subjectsHandling || 'Not specified'}</p> <p className="text-sm font-medium text-[#1E293B]" style={{ fontFamily: 'Inter, sans-serif', lineHeight: '1.6' }}>{faculty.subjectsHandling || 'Not specified'}</p>
</div> </div>
<div className="p-5 rounded-xl bg-teal-50/30 border border-teal-100/50"> <div className="p-5 rounded-xl bg-teal-50/30 border border-teal-100/50">
@@ -239,8 +239,8 @@ export default function FacultyCard({ faculty }: FacultyCardProps) {
<p className="text-sm font-medium text-[#1E293B]" style={{ fontFamily: 'Inter, sans-serif', lineHeight: '1.6' }}>{faculty.researchAreas || 'Not specified'}</p> <p className="text-sm font-medium text-[#1E293B]" style={{ fontFamily: 'Inter, sans-serif', lineHeight: '1.6' }}>{faculty.researchAreas || 'Not specified'}</p>
</div> </div>
{faculty.studentsGuided && ( {faculty.studentsGuided && (
<div className="p-5 rounded-xl bg-blue-50/30 border border-blue-100/50"> <div className="p-5 rounded-xl bg-slate-900/40 border border-slate-800">
<p className="text-xs font-bold text-blue-500 uppercase tracking-wider mb-3" style={{ fontFamily: 'Inter, sans-serif' }}>Students Guided</p> <p className="text-xs font-bold text-violet-300 uppercase tracking-wider mb-3" style={{ fontFamily: 'Inter, sans-serif' }}>Students Guided</p>
<div className="flex gap-8"> <div className="flex gap-8">
<div className="flex flex-col"> <div className="flex flex-col">
<span className="text-2xl font-bold text-[#1E293B]">{faculty.studentsGuided.ug}</span> <span className="text-2xl font-bold text-[#1E293B]">{faculty.studentsGuided.ug}</span>
@@ -310,10 +310,10 @@ export default function FacultyCard({ faculty }: FacultyCardProps) {
<p className="text-sm font-medium text-[#1E293B]" style={{ fontFamily: 'Inter, sans-serif' }}>{faculty.officeHours || 'Not specified'}</p> <p className="text-sm font-medium text-[#1E293B]" style={{ fontFamily: 'Inter, sans-serif' }}>{faculty.officeHours || 'Not specified'}</p>
</div> </div>
</div> </div>
<div className="p-5 rounded-xl bg-blue-50/30 border border-blue-100/50 flex items-start gap-4"> <div className="p-5 rounded-xl bg-slate-900/40 border border-slate-800 flex items-start gap-4">
<Building2 className="w-6 h-6 text-blue-500 shrink-0 mt-0.5" /> <Building2 className="w-6 h-6 text-violet-300 shrink-0 mt-0.5" />
<div> <div>
<p className="text-xs font-bold text-blue-500 uppercase tracking-wider mb-1" style={{ fontFamily: 'Inter, sans-serif' }}>Office Location</p> <p className="text-xs font-bold text-violet-300 uppercase tracking-wider mb-1" style={{ fontFamily: 'Inter, sans-serif' }}>Office Location</p>
<p className="text-sm font-medium text-[#1E293B]" style={{ fontFamily: 'Inter, sans-serif' }}>{faculty.office || 'Not specified'}</p> <p className="text-sm font-medium text-[#1E293B]" style={{ fontFamily: 'Inter, sans-serif' }}>{faculty.office || 'Not specified'}</p>
</div> </div>
</div> </div>

95
src/components/Footer/Footer.tsx
View File

@@ -1,105 +1,50 @@
import { Link } from 'react-router-dom'; import { GraduationCap, MapPin, Phone, Mail } from 'lucide-react';
import { GraduationCap, MapPin, Phone, Mail, ArrowRight } from 'lucide-react';
const quickLinks = [
{ label: 'Home', path: '/' },
{ label: 'Notes & PYQs', path: '/notes' },
{ label: 'RIT Chatbot', path: '/ai-assistant' },
{ label: '3D Campus Map', path: '/campus' },
{ label: 'Bus Routes', path: '/bus-routes' },
{ label: 'Faculty Directory', path: '/faculty' },
{ label: 'Events', path: '/events' },
{ label: 'Community', path: '/community' },
{ label: 'Dev Hub', path: '/collab' },
];
export default function Footer() { export default function Footer() {
return ( return (
<footer className="bg-[#0F172A] text-white border-t border-slate-800"> <footer className="bg-[#0F172A] text-white border-t border-slate-800">
{/* CTA Banner - Professional Dark Slate Gray */}
<div className="bg-slate-800 border-b border-slate-700/60 py-10">
<div className="container-custom flex flex-col md:flex-row items-center justify-between gap-6 px-4">
<div>
<h3 className="text-2xl font-bold text-white" style={{ fontFamily: 'Playfair Display, serif' }}>
Ready to explore RIT?
</h3>
<p className="text-slate-300 mt-1 text-sm" style={{ fontFamily: 'Inter, sans-serif' }}>
Everything a fresher needs — all in one place.
</p>
</div>
<Link
to="/ai-assistant"
className="flex items-center gap-2 bg-slate-100 hover:bg-white text-slate-900 px-6 py-3 rounded-xl font-bold transition-all shadow-sm border border-slate-200 hover:scale-105"
style={{ fontFamily: 'Poppins, sans-serif' }}
>
<span>Ask Chatbot</span>
<ArrowRight className="w-4 h-4 text-slate-700" />
</Link>
</div>
</div>
{/* Main Footer */} {/* Main Footer */}
<div className="container-custom py-12 px-4"> <div className="container-custom py-6 sm:py-8 px-4">
<div className="grid grid-cols-1 md:grid-cols-3 gap-10"> <div className="flex flex-col md:flex-row items-start md:items-center justify-between gap-6 md:gap-12">
{/* Brand */} {/* Brand */}
<div> <div className="max-w-md">
<div className="flex items-center gap-2.5 mb-4"> <div className="flex items-center gap-2.5 mb-2.5">
<div className="w-10 h-10 rounded-xl flex items-center justify-center bg-indigo-600 border border-indigo-400/30 text-white shadow-md"> <div className="w-9 h-9 rounded-xl flex items-center justify-center bg-[#1E1B4B] border border-violet-800/40 text-white shadow-md">
<GraduationCap className="w-5 h-5" /> <GraduationCap className="w-4 h-4" />
</div> </div>
<div> <div>
<div className="font-bold text-white text-sm" style={{ fontFamily: 'Poppins, sans-serif' }}>RIT Freshers Hub</div> <div className="font-bold text-white text-sm" style={{ fontFamily: 'Poppins, sans-serif' }}>RIT Freshers Hub</div>
<div className="text-[10px] text-slate-400">Rajalakshmi Institute of Technology</div> <div className="text-[10px] text-slate-400">Rajalakshmi Institute of Technology</div>
</div> </div>
</div> </div>
<p className="text-slate-400 text-sm leading-relaxed mb-5" style={{ fontFamily: 'Inter, sans-serif' }}> <p className="text-slate-400 text-xs sm:text-sm leading-relaxed" style={{ fontFamily: 'Inter, sans-serif' }}>
Your all-in-one guide to campus life at RIT. Notes, chatbot, bus routes, 3D campus map, and developer hub — built for students. Your all-in-one guide to campus life at RIT. Notes, chatbot, bus routes, 3D campus map, and developer hub — built for students.
</p> </p>
</div> </div>
{/* Quick Links */}
<div>
<h4 className="text-white font-semibold mb-4 text-sm uppercase tracking-wider" style={{ fontFamily: 'Poppins, sans-serif' }}>
Quick Navigation
</h4>
<div className="grid grid-cols-2 gap-2">
{quickLinks.map((link) => (
<Link
key={link.path}
to={link.path}
className="text-slate-400 hover:text-indigo-400 text-sm transition-colors flex items-center gap-1.5 group py-1"
style={{ fontFamily: 'Inter, sans-serif' }}
>
<span className="w-1 h-1 rounded-full bg-indigo-500 opacity-0 group-hover:opacity-100 transition-opacity" />
{link.label}
</Link>
))}
</div>
</div>
{/* Contact */} {/* Contact */}
<div> <div className="shrink-0">
<h4 className="text-white font-semibold mb-4 text-sm uppercase tracking-wider" style={{ fontFamily: 'Poppins, sans-serif' }}> <h4 className="text-white font-semibold mb-2.5 text-xs sm:text-sm uppercase tracking-wider" style={{ fontFamily: 'Poppins, sans-serif' }}>
Campus Location & Contact Campus Location & Contact
</h4> </h4>
<ul className="space-y-3"> <ul className="space-y-2 text-xs sm:text-sm">
<li className="flex items-start gap-3 text-slate-400 text-sm" style={{ fontFamily: 'Inter, sans-serif' }}> <li className="flex items-start gap-2.5 text-slate-400" style={{ fontFamily: 'Inter, sans-serif' }}>
<MapPin className="w-4 h-4 mt-0.5 shrink-0 text-indigo-400" /> <MapPin className="w-4 h-4 mt-0.5 shrink-0 text-violet-300" />
<span>Rajalakshmi Institute of Technology,<br />Kuthambakkam, Chennai - 600 124</span> <span>Rajalakshmi Institute of Technology,<br />Kuthambakkam, Chennai - 600 124</span>
</li> </li>
<li className="flex items-center gap-3 text-slate-400 text-sm"> <li className="flex items-center gap-2.5 text-slate-400">
<Phone className="w-4 h-4 shrink-0 text-indigo-400" /> <Phone className="w-4 h-4 shrink-0 text-violet-300" />
<a href="tel:+914423422890" className="hover:text-indigo-400 transition-colors">+91 44 2342 2890</a> <a href="tel:+914423422890" className="hover:text-violet-300 transition-colors">+91 44 2342 2890</a>
</li> </li>
<li className="flex items-center gap-3 text-slate-400 text-sm"> <li className="flex items-center gap-2.5 text-slate-400">
<Mail className="w-4 h-4 shrink-0 text-indigo-400" /> <Mail className="w-4 h-4 shrink-0 text-violet-300" />
<a href="mailto:info@rit.ac.in" className="hover:text-indigo-400 transition-colors">info@rit.ac.in</a> <a href="mailto:info@rit.ac.in" className="hover:text-violet-300 transition-colors">info@rit.ac.in</a>
</li> </li>
</ul> </ul>
</div> </div>
</div> </div>
<div className="mt-10 pt-6 border-t border-slate-800 text-center text-xs text-slate-500 flex flex-col sm:flex-row items-center justify-between gap-3"> <div className="mt-6 pt-4 border-t border-slate-800/80 text-center text-xs text-slate-500 flex flex-col sm:flex-row items-center justify-between gap-2">
<span>© {new Date().getFullYear()} Rajalakshmi Institute of Technology. All rights reserved.</span> <span>© {new Date().getFullYear()} Rajalakshmi Institute of Technology. All rights reserved.</span>
<span className="text-slate-400">RIT Student Portal v2.0</span> <span className="text-slate-400">RIT Student Portal v2.0</span>
</div> </div>

68
src/components/Header/Header.tsx
View File

@@ -176,12 +176,12 @@ export default function Header({ onToggleSidebar }: HeaderProps) {
}; };
return ( return (
<header className="sticky top-0 z-30 w-full bg-white/90 backdrop-blur-md border-b border-slate-200/80 px-3 sm:px-4 lg:px-8 py-3 flex items-center justify-between shadow-xs"> <header className="sticky top-0 z-30 w-full bg-[#0F172A]/90 backdrop-blur-md border-b border-slate-800/80 px-3 sm:px-4 lg:px-8 py-3 flex items-center justify-between shadow-md text-white">
<div className="flex items-center gap-2.5 sm:gap-4 min-w-0 flex-1"> <div className="flex items-center gap-2.5 sm:gap-4 min-w-0 flex-1">
{/* Mobile Toggle */} {/* Mobile Toggle */}
<button <button
onClick={onToggleSidebar} onClick={onToggleSidebar}
className="lg:hidden p-2 rounded-xl bg-slate-100 hover:bg-slate-200 text-slate-700 transition-colors cursor-pointer shrink-0" className="lg:hidden p-2 rounded-xl bg-slate-800/80 hover:bg-slate-700/80 text-slate-200 transition-colors cursor-pointer shrink-0 border border-slate-700/60"
title="Toggle Navigation Menu" title="Toggle Navigation Menu"
> >
<Menu className="w-5 h-5" /> <Menu className="w-5 h-5" />
@@ -203,24 +203,24 @@ export default function Header({ onToggleSidebar }: HeaderProps) {
}} }}
onFocus={() => setIsSearchOpen(true)} onFocus={() => setIsSearchOpen(true)}
placeholder="Search notes, faculty, bus routes..." placeholder="Search notes, faculty, bus routes..."
className="w-full pl-9 pr-8 sm:pr-12 py-2 text-xs font-medium bg-slate-100/90 hover:bg-slate-100 focus:bg-white border border-transparent focus:border-indigo-500/40 rounded-xl text-slate-800 placeholder-slate-400 outline-none transition-all shadow-inner truncate" className="w-full pl-9 pr-8 sm:pr-12 py-2 text-xs font-medium bg-slate-900/90 hover:bg-slate-900 focus:bg-slate-950 border border-slate-800 focus:border-violet-500/50 rounded-xl text-white placeholder-slate-400 outline-none transition-all shadow-inner truncate"
style={{ fontFamily: 'Inter, sans-serif' }} style={{ fontFamily: 'Inter, sans-serif' }}
/> />
<span className="hidden sm:inline-flex absolute right-3 top-1/2 -translate-y-1/2 text-[10px] font-semibold text-slate-400 bg-white border border-slate-200 px-1.5 py-0.5 rounded-md shadow-2xs"> <span className="hidden sm:inline-flex absolute right-3 top-1/2 -translate-y-1/2 text-[10px] font-semibold text-slate-300 bg-slate-800 border border-slate-700 px-1.5 py-0.5 rounded-md shadow-2xs">
⌘K ⌘K
</span> </span>
</div> </div>
{/* Search Live Results Dropdown Overlay */} {/* Search Live Results Dropdown Overlay */}
{isSearchOpen && ( {isSearchOpen && (
<div className="absolute top-full left-0 mt-2 w-full sm:w-[420px] bg-white rounded-2xl border border-slate-200 shadow-xl overflow-hidden z-50 p-2 text-left"> <div className="absolute top-full left-0 mt-2 w-full sm:w-[420px] bg-[#0F172A] rounded-2xl border border-slate-800 shadow-2xl overflow-hidden z-50 p-2 text-left">
<div className="flex items-center justify-between px-3 py-2 border-b border-slate-100"> <div className="flex items-center justify-between px-3 py-2 border-b border-slate-800">
<span className="text-[11px] font-bold text-slate-400 uppercase tracking-wider"> <span className="text-[11px] font-bold text-slate-400 uppercase tracking-wider">
{searchQuery.trim() ? 'Search Results' : 'Quick Navigation'} {searchQuery.trim() ? 'Search Results' : 'Quick Navigation'}
</span> </span>
<button <button
onClick={() => setIsSearchOpen(false)} onClick={() => setIsSearchOpen(false)}
className="p-1 rounded-md text-slate-400 hover:text-slate-600 hover:bg-slate-100" className="p-1 rounded-md text-slate-400 hover:text-white hover:bg-slate-800"
> >
<X className="w-3.5 h-3.5" /> <X className="w-3.5 h-3.5" />
</button> </button>
@@ -234,20 +234,20 @@ export default function Header({ onToggleSidebar }: HeaderProps) {
<div <div
key={i} key={i}
onClick={() => handleSelectResult(res.path)} onClick={() => handleSelectResult(res.path)}
className="flex items-center justify-between p-2.5 rounded-xl hover:bg-indigo-50/70 cursor-pointer transition-colors group" className="flex items-center justify-between p-2.5 rounded-xl hover:bg-slate-800/80 cursor-pointer transition-colors group"
> >
<div className="flex items-center gap-3 min-w-0"> <div className="flex items-center gap-3 min-w-0">
<div className="w-8 h-8 rounded-lg bg-indigo-100 text-indigo-600 flex items-center justify-center shrink-0"> <div className="w-8 h-8 rounded-lg bg-[#1E1B4B] text-violet-300 flex items-center justify-center shrink-0 border border-violet-800/40">
<Icon className="w-4 h-4" /> <Icon className="w-4 h-4" />
</div> </div>
<div className="flex flex-col min-w-0"> <div className="flex flex-col min-w-0">
<span className="text-xs font-bold text-slate-900 group-hover:text-indigo-700 truncate" style={{ fontFamily: 'Poppins, sans-serif' }}> <span className="text-xs font-bold text-white group-hover:text-violet-300 truncate" style={{ fontFamily: 'Poppins, sans-serif' }}>
{res.title} {res.title}
</span> </span>
<span className="text-[11px] text-slate-500 truncate">{res.desc}</span> <span className="text-[11px] text-slate-400 truncate">{res.desc}</span>
</div> </div>
</div> </div>
<span className="text-[9px] font-bold px-2 py-0.5 rounded-md bg-slate-100 text-slate-600 shrink-0"> <span className="text-[9px] font-bold px-2 py-0.5 rounded-md bg-slate-800 text-slate-300 shrink-0 border border-slate-700">
{res.category} {res.category}
</span> </span>
</div> </div>
@@ -255,25 +255,25 @@ export default function Header({ onToggleSidebar }: HeaderProps) {
}) })
) : ( ) : (
<div className="p-4 text-center space-y-2"> <div className="p-4 text-center space-y-2">
<span className="text-xs text-slate-500 block"> <span className="text-xs text-slate-400 block">
{searchQuery.trim() ? `No matches found for "${searchQuery}"` : 'Type to search notes, faculty, routes & clubs'} {searchQuery.trim() ? `No matches found for "${searchQuery}"` : 'Type to search notes, faculty, routes & clubs'}
</span> </span>
<div className="flex flex-wrap justify-center gap-1.5 pt-1"> <div className="flex flex-wrap justify-center gap-1.5 pt-1">
<button <button
onClick={() => handleSelectResult('/notes')} onClick={() => handleSelectResult('/notes')}
className="text-[11px] px-2.5 py-1 rounded-lg bg-slate-100 text-slate-700 font-medium hover:bg-indigo-50 hover:text-indigo-600" className="text-[11px] px-2.5 py-1 rounded-lg bg-slate-800 text-slate-300 font-medium hover:bg-slate-700 hover:text-white border border-slate-700"
> >
Notes Notes
</button> </button>
<button <button
onClick={() => handleSelectResult('/bus-routes')} onClick={() => handleSelectResult('/bus-routes')}
className="text-[11px] px-2.5 py-1 rounded-lg bg-slate-100 text-slate-700 font-medium hover:bg-indigo-50 hover:text-indigo-600" className="text-[11px] px-2.5 py-1 rounded-lg bg-slate-800 text-slate-300 font-medium hover:bg-slate-700 hover:text-white border border-slate-700"
> >
Bus Routes Bus Routes
</button> </button>
<button <button
onClick={() => handleSelectResult('/faculty')} onClick={() => handleSelectResult('/faculty')}
className="text-[11px] px-2.5 py-1 rounded-lg bg-slate-100 text-slate-700 font-medium hover:bg-indigo-50 hover:text-indigo-600" className="text-[11px] px-2.5 py-1 rounded-lg bg-slate-800 text-slate-300 font-medium hover:bg-slate-700 hover:text-white border border-slate-700"
> >
Faculty Faculty
</button> </button>
@@ -289,8 +289,8 @@ export default function Header({ onToggleSidebar }: HeaderProps) {
{/* Right Header Status Bar */} {/* Right Header Status Bar */}
<div className="flex items-center gap-2 sm:gap-3 shrink-0"> <div className="flex items-center gap-2 sm:gap-3 shrink-0">
{/* Date Display Badge */} {/* Date Display Badge */}
<div className="hidden md:flex items-center gap-1.5 px-3 py-1.5 rounded-xl bg-slate-100 text-slate-600 text-xs font-medium border border-slate-200/60"> <div className="hidden md:flex items-center gap-1.5 px-3 py-1.5 rounded-xl bg-slate-900/90 text-slate-300 text-xs font-medium border border-slate-800">
<Calendar className="w-3.5 h-3.5 text-indigo-600" /> <Calendar className="w-3.5 h-3.5 text-violet-400" />
<span>{currentDate}</span> <span>{currentDate}</span>
</div> </div>
@@ -298,25 +298,25 @@ export default function Header({ onToggleSidebar }: HeaderProps) {
<div className="relative" ref={notifRef}> <div className="relative" ref={notifRef}>
<button <button
onClick={() => setIsNotifOpen((prev) => !prev)} onClick={() => setIsNotifOpen((prev) => !prev)}
className="relative p-2 rounded-xl bg-slate-100 hover:bg-indigo-50 text-slate-600 hover:text-indigo-600 transition-colors cursor-pointer border border-slate-200/60" className="relative p-2 rounded-xl bg-slate-900/90 hover:bg-slate-800 text-slate-300 hover:text-white transition-colors cursor-pointer border border-slate-800"
title="Notifications" title="Notifications"
> >
<Bell className="w-4 h-4" /> <Bell className="w-4 h-4" />
{unreadCount > 0 && ( {unreadCount > 0 && (
<span className="absolute top-1.5 right-1.5 w-2 h-2 rounded-full bg-indigo-600 ring-2 ring-white" /> <span className="absolute top-1.5 right-1.5 w-2 h-2 rounded-full bg-violet-400 ring-2 ring-[#0F172A]" />
)} )}
</button> </button>
{/* Notifications Panel Dropdown */} {/* Notifications Panel Dropdown */}
{isNotifOpen && ( {isNotifOpen && (
<div className="absolute right-0 top-full mt-2 w-80 sm:w-96 bg-white rounded-2xl border border-slate-200 shadow-xl overflow-hidden z-50 p-3 text-left"> <div className="absolute right-0 top-full mt-2 w-80 sm:w-96 bg-[#0F172A] rounded-2xl border border-slate-800 shadow-2xl overflow-hidden z-50 p-3 text-left">
<div className="flex items-center justify-between pb-2 border-b border-slate-100"> <div className="flex items-center justify-between pb-2 border-b border-slate-800">
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<span className="text-xs font-bold text-slate-900" style={{ fontFamily: 'Poppins, sans-serif' }}> <span className="text-xs font-bold text-white" style={{ fontFamily: 'Poppins, sans-serif' }}>
Notifications Notifications
</span> </span>
{unreadCount > 0 && ( {unreadCount > 0 && (
<span className="text-[10px] font-bold px-2 py-0.5 rounded-full bg-indigo-100 text-indigo-700"> <span className="text-[10px] font-bold px-2 py-0.5 rounded-full bg-violet-600 text-white">
{unreadCount} new {unreadCount} new
</span> </span>
)} )}
@@ -326,7 +326,7 @@ export default function Header({ onToggleSidebar }: HeaderProps) {
{unreadCount > 0 && ( {unreadCount > 0 && (
<button <button
onClick={markAllAsRead} onClick={markAllAsRead}
className="text-[11px] font-semibold text-indigo-600 hover:text-indigo-800" className="text-[11px] font-semibold text-violet-400 hover:text-violet-300"
> >
Mark all read Mark all read
</button> </button>
@@ -334,7 +334,7 @@ export default function Header({ onToggleSidebar }: HeaderProps) {
{notifications.length > 0 && ( {notifications.length > 0 && (
<button <button
onClick={clearNotifications} onClick={clearNotifications}
className="text-[11px] font-semibold text-slate-400 hover:text-slate-600" className="text-[11px] font-semibold text-slate-400 hover:text-slate-300"
> >
Clear Clear
</button> </button>
@@ -348,16 +348,16 @@ export default function Header({ onToggleSidebar }: HeaderProps) {
<div <div
key={n.id} key={n.id}
className={`p-2.5 rounded-xl border transition-colors ${ className={`p-2.5 rounded-xl border transition-colors ${
n.read ? 'bg-slate-50/60 border-slate-100' : 'bg-indigo-50/40 border-indigo-100' n.read ? 'bg-slate-900/40 border-slate-800' : 'bg-slate-900/90 border-slate-700'
}`} }`}
> >
<div className="flex items-center justify-between mb-1"> <div className="flex items-center justify-between mb-1">
<span className="text-xs font-bold text-slate-900 leading-snug" style={{ fontFamily: 'Poppins, sans-serif' }}> <span className="text-xs font-bold text-white leading-snug" style={{ fontFamily: 'Poppins, sans-serif' }}>
{n.title} {n.title}
</span> </span>
<span className="text-[10px] text-slate-400 font-medium">{n.time}</span> <span className="text-[10px] text-slate-400 font-medium">{n.time}</span>
</div> </div>
<p className="text-[11px] text-slate-600 leading-relaxed" style={{ fontFamily: 'Inter, sans-serif' }}> <p className="text-[11px] text-slate-300 leading-relaxed" style={{ fontFamily: 'Inter, sans-serif' }}>
{n.message} {n.message}
</p> </p>
</div> </div>
@@ -374,24 +374,24 @@ export default function Header({ onToggleSidebar }: HeaderProps) {
{/* User Auth Quick Badge (If Logged In) */} {/* User Auth Quick Badge (If Logged In) */}
{isAuthenticated && user && ( {isAuthenticated && user && (
<div className="flex items-center gap-2 pl-2 border-l border-slate-200"> <div className="flex items-center gap-2 pl-2 border-l border-slate-800">
{user.pictureUrl ? ( {user.pictureUrl ? (
<img <img
src={user.pictureUrl} src={user.pictureUrl}
alt={user.name} alt={user.name}
className="w-8 h-8 rounded-full border border-indigo-300 object-cover" className="w-8 h-8 rounded-full border border-slate-700 object-cover"
referrerPolicy="no-referrer" referrerPolicy="no-referrer"
/> />
) : ( ) : (
<div className="w-8 h-8 rounded-full bg-indigo-600 text-white font-bold text-xs flex items-center justify-center"> <div className="w-8 h-8 rounded-full bg-[#1E1B4B] text-white font-bold text-xs flex items-center justify-center border border-violet-800/40">
{user.name.charAt(0)} {user.name.charAt(0)}
</div> </div>
)} )}
<div className="hidden xl:flex flex-col text-left"> <div className="hidden xl:flex flex-col text-left">
<span className="text-xs font-bold text-slate-800 leading-tight" style={{ fontFamily: 'Poppins, sans-serif' }}> <span className="text-xs font-bold text-white leading-tight" style={{ fontFamily: 'Poppins, sans-serif' }}>
{user.name} {user.name}
</span> </span>
<span className="text-[10px] text-indigo-600 font-semibold"> <span className="text-[10px] text-violet-300 font-semibold">
{isVerifiedStudent ? 'Verified Student' : 'RIT Account'} {isVerifiedStudent ? 'Verified Student' : 'RIT Account'}
</span> </span>
</div> </div>

24
src/components/Sidebar/Sidebar.tsx
View File

@@ -126,7 +126,7 @@ export default function Sidebar({
<div className="p-4 sm:p-5 flex flex-col gap-5"> <div className="p-4 sm:p-5 flex flex-col gap-5">
<div className="flex items-center justify-between"> <div className="flex items-center justify-between">
<Link to="/" className="flex items-center gap-3 group min-w-0"> <Link to="/" className="flex items-center gap-3 group min-w-0">
<div className="p-2 rounded-2xl bg-indigo-950/80 border border-indigo-500/20 shadow-sm shrink-0"> <div className="p-2 rounded-2xl bg-slate-950 border border-slate-800 shadow-sm shrink-0">
<img <img
src="/logo.png" src="/logo.png"
alt="RIT Logo" alt="RIT Logo"
@@ -138,7 +138,7 @@ export default function Sidebar({
<span className="font-bold text-white text-lg tracking-tight truncate" style={{ fontFamily: 'Poppins, sans-serif' }}> <span className="font-bold text-white text-lg tracking-tight truncate" style={{ fontFamily: 'Poppins, sans-serif' }}>
RIT Portal RIT Portal
</span> </span>
<span className="text-[10px] text-indigo-300/70 font-medium tracking-wider uppercase truncate" style={{ fontFamily: 'Inter, sans-serif' }}> <span className="text-[10px] text-slate-400 font-medium tracking-wider uppercase truncate" style={{ fontFamily: 'Inter, sans-serif' }}>
Freshers Hub Freshers Hub
</span> </span>
</div> </div>
@@ -156,7 +156,7 @@ export default function Sidebar({
{/* Desktop Collapse Toggle Button */} {/* Desktop Collapse Toggle Button */}
<button <button
onClick={onToggleCollapse} onClick={onToggleCollapse}
className="hidden lg:flex p-1.5 rounded-xl bg-slate-800/80 hover:bg-indigo-900/60 text-indigo-300 hover:text-white border border-slate-700/60 transition-colors" className="hidden lg:flex p-1.5 rounded-xl bg-slate-800/80 hover:bg-slate-700 text-slate-300 hover:text-white border border-slate-700/60 transition-colors"
title={isCollapsed ? 'Expand Sidebar' : 'Collapse Sidebar'} title={isCollapsed ? 'Expand Sidebar' : 'Collapse Sidebar'}
> >
{isCollapsed ? <ChevronRight className="w-4 h-4" /> : <ChevronLeft className="w-4 h-4" />} {isCollapsed ? <ChevronRight className="w-4 h-4" /> : <ChevronLeft className="w-4 h-4" />}
@@ -167,20 +167,20 @@ export default function Sidebar({
{!isCollapsed && ( {!isCollapsed && (
<Link <Link
to="/collab" to="/collab"
className="w-full flex items-center justify-between p-3 rounded-2xl bg-indigo-600 hover:bg-indigo-500 border border-indigo-400/30 text-white group transition-all duration-200 shadow-md shadow-indigo-950/50" className="w-full flex items-center justify-between p-3 rounded-2xl bg-gradient-to-r from-[#1E1B4B] via-[#2E1065] to-[#1E1B4B] hover:from-[#2E1065] hover:to-[#3B0764] border border-violet-800/40 text-white group transition-all duration-200 shadow-md shadow-slate-950/50"
> >
<div className="flex items-center gap-2.5 min-w-0"> <div className="flex items-center gap-2.5 min-w-0">
<div className="w-7 h-7 rounded-xl bg-white/20 border border-white/30 flex items-center justify-center text-white shrink-0"> <div className="w-7 h-7 rounded-xl bg-white/10 border border-white/20 flex items-center justify-center text-white shrink-0">
<GitBranch className="w-4 h-4" /> <GitBranch className="w-4 h-4" />
</div> </div>
<div className="flex flex-col text-left min-w-0"> <div className="flex flex-col text-left min-w-0">
<span className="text-xs font-bold leading-tight truncate" style={{ fontFamily: 'Poppins, sans-serif' }}> <span className="text-xs font-bold leading-tight truncate" style={{ fontFamily: 'Poppins, sans-serif' }}>
Dev Collab Hub Dev Collab Hub
</span> </span>
<span className="text-[10px] text-indigo-100/80 truncate">Co-Developer Projects</span> <span className="text-[10px] text-violet-200/90 truncate">Co-Developer Projects</span>
</div> </div>
</div> </div>
<ChevronRight className="w-4 h-4 text-indigo-200 group-hover:translate-x-0.5 transition-transform" /> <ChevronRight className="w-4 h-4 text-violet-200 group-hover:translate-x-0.5 transition-transform" />
</Link> </Link>
)} )}
@@ -210,7 +210,7 @@ export default function Sidebar({
isCollapsed ? 'justify-center px-0 py-3' : 'justify-between px-3 py-2.5' isCollapsed ? 'justify-center px-0 py-3' : 'justify-between px-3 py-2.5'
} rounded-xl text-xs font-semibold transition-all duration-200 group ${ } rounded-xl text-xs font-semibold transition-all duration-200 group ${
isActive isActive
? 'bg-indigo-600 text-white shadow-sm border border-indigo-400/30' ? 'bg-gradient-to-r from-[#1E1B4B] to-[#2E1065] text-white shadow-sm border border-violet-800/50'
: 'text-slate-300 hover:text-white hover:bg-slate-800/60' : 'text-slate-300 hover:text-white hover:bg-slate-800/60'
}`} }`}
style={{ fontFamily: 'Poppins, sans-serif' }} style={{ fontFamily: 'Poppins, sans-serif' }}
@@ -225,7 +225,7 @@ export default function Sidebar({
</div> </div>
{!isCollapsed && item.highlight && !isActive && ( {!isCollapsed && item.highlight && !isActive && (
<span className="w-2 h-2 rounded-full bg-indigo-400 animate-pulse" /> <span className="w-2 h-2 rounded-full bg-violet-400 animate-pulse" />
)} )}
</Link> </Link>
); );
@@ -244,11 +244,11 @@ export default function Sidebar({
<img <img
src={user.pictureUrl} src={user.pictureUrl}
alt={user.name} alt={user.name}
className="w-8 h-8 rounded-xl border border-indigo-400/40 object-cover shrink-0" className="w-8 h-8 rounded-xl border border-violet-800/40 object-cover shrink-0"
referrerPolicy="no-referrer" referrerPolicy="no-referrer"
/> />
) : ( ) : (
<div className="w-8 h-8 rounded-xl bg-indigo-600 text-white font-bold text-xs flex items-center justify-center shrink-0"> <div className="w-8 h-8 rounded-xl bg-[#1E1B4B] text-white font-bold text-xs flex items-center justify-center shrink-0 border border-violet-800/40">
{user.name.charAt(0).toUpperCase()} {user.name.charAt(0).toUpperCase()}
</div> </div>
)} )}
@@ -280,7 +280,7 @@ export default function Sidebar({
title={isCollapsed ? 'Student Sign In' : undefined} title={isCollapsed ? 'Student Sign In' : undefined}
className={`w-full flex items-center justify-center gap-2 ${ className={`w-full flex items-center justify-center gap-2 ${
isCollapsed ? 'p-2.5' : 'p-2.5' isCollapsed ? 'p-2.5' : 'p-2.5'
} rounded-xl bg-indigo-600 hover:bg-indigo-500 text-white font-bold text-xs transition-all cursor-pointer`} } rounded-xl bg-gradient-to-r from-[#1E1B4B] via-[#2E1065] to-[#1E1B4B] hover:from-[#2E1065] hover:to-[#3B0764] border border-violet-800/40 text-white font-bold text-xs transition-all cursor-pointer shadow-md`}
style={{ fontFamily: 'Poppins, sans-serif' }} style={{ fontFamily: 'Poppins, sans-serif' }}
> >
<LogIn className="w-4 h-4 shrink-0" /> <LogIn className="w-4 h-4 shrink-0" />

44
src/index.css
View File

@@ -3,20 +3,20 @@
@import "tailwindcss"; @import "tailwindcss";
@theme { @theme {
--color-primary: #6366F1; --color-primary: #1E1B4B;
--color-primary-light: #818CF8; --color-primary-light: #2E1065;
--color-primary-dark: #4F46E5; --color-primary-dark: #0A0D16;
--color-primary-50: #EEF2FF; --color-primary-50: #0B0F19;
--color-primary-100: #E0E7FF; --color-primary-100: #131722;
--color-primary-200: #C7D2FE; --color-primary-200: #1E1B4B;
--color-secondary: #818CF8; --color-secondary: #2E1065;
--color-background: #FAFAFA; --color-background: #FAFAFA;
--color-surface: #FFFFFF; --color-surface: #FFFFFF;
--color-border: #E5E7EB; --color-border: #E5E7EB;
--color-heading: #1E293B; --color-heading: #1E293B;
--color-body: #475569; --color-body: #475569;
--color-muted: #94A3B8; --color-muted: #94A3B8;
--color-accent: #EEF2FF; --color-accent: #131722;
--font-heading: 'Playfair Display', Georgia, serif; --font-heading: 'Playfair Display', Georgia, serif;
--font-body: 'Inter', system-ui, sans-serif; --font-body: 'Inter', system-ui, sans-serif;
@@ -70,17 +70,17 @@ body {
background: #f1f1f1; background: #f1f1f1;
} }
::-webkit-scrollbar-thumb { ::-webkit-scrollbar-thumb {
background: #6366F1; background: #1E1B4B;
border-radius: 3px; border-radius: 3px;
} }
::-webkit-scrollbar-thumb:hover { ::-webkit-scrollbar-thumb:hover {
background: #4F46E5; background: #2E1065;
} }
/* Selection */ /* Selection */
::selection { ::selection {
background-color: rgba(99, 102, 241, 0.2); background-color: rgba(30, 27, 75, 0.4);
color: #1E293B; color: #FFFFFF;
} }
/* Typography base */ /* Typography base */
@@ -91,7 +91,7 @@ h1, h2, h3, h4, h5, h6 {
/* Focus ring */ /* Focus ring */
:focus-visible { :focus-visible {
outline: 2px solid #6366F1; outline: 2px solid #1E1B4B;
outline-offset: 2px; outline-offset: 2px;
} }
@@ -160,7 +160,7 @@ h1, h2, h3, h4, h5, h6 {
} }
.glass-dark { .glass-dark {
background: rgba(30, 41, 59, 0.8); background: rgba(15, 23, 42, 0.85);
backdrop-filter: blur(12px); backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
border: 1px solid rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.1);
@@ -182,7 +182,7 @@ h1, h2, h3, h4, h5, h6 {
/* Gradient text */ /* Gradient text */
.gradient-text { .gradient-text {
background: linear-gradient(135deg, #4F46E5, #6366F1, #8B5CF6); background: linear-gradient(135deg, #0F172A, #1E1B4B, #2E1065);
-webkit-background-clip: text; -webkit-background-clip: text;
-webkit-text-fill-color: transparent; -webkit-text-fill-color: transparent;
background-clip: text; background-clip: text;
@@ -191,16 +191,16 @@ h1, h2, h3, h4, h5, h6 {
/* Primary button */ /* Primary button */
.btn-primary { .btn-primary {
font-family: var(--font-button); font-family: var(--font-button);
background: linear-gradient(135deg, #4F46E5, #6366F1); background: linear-gradient(135deg, #0F172A, #1E1B4B, #2E1065);
color: white; color: white;
border: none; border: 1px solid rgba(255, 255, 255, 0.15);
border-radius: 12px; border-radius: 12px;
padding: 12px 28px; padding: 12px 28px;
font-weight: 600; font-weight: 600;
font-size: 15px; font-size: 15px;
cursor: pointer; cursor: pointer;
transition: all 0.3s ease; transition: all 0.3s ease;
box-shadow: 0 4px 15px rgba(79, 70, 229, 0.3); box-shadow: 0 4px 15px rgba(15, 23, 42, 0.5);
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
gap: 8px; gap: 8px;
@@ -209,8 +209,8 @@ h1, h2, h3, h4, h5, h6 {
.btn-primary:hover { .btn-primary:hover {
transform: translateY(-2px); transform: translateY(-2px);
box-shadow: 0 8px 25px rgba(79, 70, 229, 0.4); box-shadow: 0 8px 25px rgba(46, 16, 101, 0.6);
background: linear-gradient(135deg, #4338CA, #4F46E5); background: linear-gradient(135deg, #1E1B4B, #2E1065, #3B0764);
} }
.btn-primary:active { .btn-primary:active {
@@ -236,8 +236,8 @@ h1, h2, h3, h4, h5, h6 {
} }
.btn-ghost:hover { .btn-ghost:hover {
border-color: #6366F1; border-color: #2E1065;
color: #6366F1; color: #2E1065;
transform: translateY(-2px); transform: translateY(-2px);
} }

6
src/pages/Campus/Campus.tsx
View File

@@ -20,9 +20,9 @@ interface LocationSpot {
const BLUEPRINT_LEGEND = [ const BLUEPRINT_LEGEND = [
{ id: 'all', label: 'All Locations', color: '#F97316', bg: 'bg-orange-50/80', text: 'text-orange-950', border: 'border-orange-300' }, { id: 'all', label: 'All Locations', color: '#F97316', bg: 'bg-orange-50/80', text: 'text-orange-950', border: 'border-orange-300' },
{ id: 'a-block', label: 'A Block', color: '#60A5FA', bg: 'bg-blue-50/80', text: 'text-blue-900', border: 'border-blue-200' }, { id: 'a-block', label: 'A Block', color: '#1E1B4B', bg: 'bg-slate-900/80', text: 'text-violet-300', border: 'border-slate-800' },
{ id: 'b-block', label: 'B Block', color: '#93C5FD', bg: 'bg-blue-50/60', text: 'text-blue-900', border: 'border-blue-200' }, { id: 'b-block', label: 'B Block', color: '#2E1065', bg: 'bg-slate-900/60', text: 'text-violet-300', border: 'border-slate-800' },
{ id: 'c-block', label: 'C Block', color: '#BFDBFE', bg: 'bg-blue-50/40', text: 'text-blue-900', border: 'border-blue-200' }, { id: 'c-block', label: 'C Block', color: '#3B0764', bg: 'bg-slate-900/40', text: 'text-violet-300', border: 'border-slate-800' },
{ id: 'admin', label: 'Admin / Facility', color: '#FDBA74', bg: 'bg-orange-50/80', text: 'text-orange-950', border: 'border-orange-200' }, { id: 'admin', label: 'Admin / Facility', color: '#FDBA74', bg: 'bg-orange-50/80', text: 'text-orange-950', border: 'border-orange-200' },
{ id: 'hostel', label: 'Hostel / Mess', color: '#C084FC', bg: 'bg-purple-50/80', text: 'text-purple-950', border: 'border-purple-200' }, { id: 'hostel', label: 'Hostel / Mess', color: '#C084FC', bg: 'bg-purple-50/80', text: 'text-purple-950', border: 'border-purple-200' },
{ id: 'lab', label: 'Lab / Academic', color: '#FDE047', bg: 'bg-yellow-50/80', text: 'text-yellow-950', border: 'border-yellow-200' }, { id: 'lab', label: 'Lab / Academic', color: '#FDE047', bg: 'bg-yellow-50/80', text: 'text-yellow-950', border: 'border-yellow-200' },

4
src/pages/Community/Community.tsx
View File

@@ -533,8 +533,8 @@ export default function Community() {
<div className="flex-1 min-w-0"> <div className="flex-1 min-w-0">
<div className="flex items-center gap-1.5 mb-0.5 flex-wrap"> <div className="flex items-center gap-1.5 mb-0.5 flex-wrap">
<span className="text-[11.5px] font-bold text-[#1E293B]" style={{ fontFamily: 'Poppins, sans-serif' }}>{ans.author}</span> <span className="text-[11.5px] font-bold text-[#1E293B]" style={{ fontFamily: 'Poppins, sans-serif' }}>{ans.author}</span>
{/* Blue verified check icon for senior helpers */} {/* Verified check icon for senior helpers */}
<span className="inline-flex text-blue-500" title="Verified Senior Helper"> <span className="inline-flex text-violet-400" title="Verified Senior Helper">
<svg className="w-3.5 h-3.5 fill-current" viewBox="0 0 24 24"> <svg className="w-3.5 h-3.5 fill-current" viewBox="0 0 24 24">
<path d="M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10 10-4.5 10-10S17.5 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z" /> <path d="M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10 10-4.5 10-10S17.5 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z" />
</svg> </svg>

18
src/pages/DevCollab/DevCollab.tsx
View File

@@ -433,18 +433,18 @@ export default function DevCollab() {
<div className="bg-white border-b border-[#E5E7EB] py-10"> <div className="bg-white border-b border-[#E5E7EB] py-10">
<div className="container-custom"> <div className="container-custom">
<div className="flex items-center gap-2 text-xs text-[#94A3B8] mb-3"> <div className="flex items-center gap-2 text-xs text-[#94A3B8] mb-3">
<Link to="/" className="hover:text-indigo-600">Home</Link> <Link to="/" className="hover:text-violet-400">Home</Link>
<ChevronRight className="w-3 h-3" /> <ChevronRight className="w-3 h-3" />
<span className="text-indigo-600">Developer Collab Hub</span> <span className="text-violet-400">Developer Collab Hub</span>
</div> </div>
<div className="flex flex-col md:flex-row md:items-center justify-between gap-6"> <div className="flex flex-col md:flex-row md:items-center justify-between gap-6">
<div> <div>
<div className="inline-flex items-center gap-2 px-3.5 py-1.5 rounded-full bg-indigo-50 border border-indigo-200 text-indigo-600 text-xs font-semibold mb-3"> <div className="inline-flex items-center gap-2 px-3.5 py-1.5 rounded-full bg-slate-900 border border-slate-700 text-violet-300 text-xs font-semibold mb-3">
<Code2 className="w-4 h-4 text-indigo-600" /> RIT Developers Environment <Code2 className="w-4 h-4 text-violet-300" /> RIT Developers Environment
</div> </div>
<h1 className="text-3xl md:text-4xl font-bold text-[#1E293B] mb-2" style={{ fontFamily: 'Playfair Display, serif' }}> <h1 className="text-3xl md:text-4xl font-bold text-[#1E293B] mb-2" style={{ fontFamily: 'Playfair Display, serif' }}>
Find Project{' '} Find Project{' '}
<span style={{ background: 'linear-gradient(135deg, #4F46E5, #6366F1)', WebkitBackgroundClip: 'text', WebkitTextFillColor: 'transparent', backgroundClip: 'text' }}> <span style={{ background: 'linear-gradient(135deg, #0F172A, #1E1B4B, #2E1065)', WebkitBackgroundClip: 'text', WebkitTextFillColor: 'transparent', backgroundClip: 'text' }}>
Collaborators Collaborators
</span> </span>
</h1> </h1>
@@ -457,8 +457,8 @@ export default function DevCollab() {
whileHover={{ scale: 1.03 }} whileHover={{ scale: 1.03 }}
whileTap={{ scale: 0.97 }} whileTap={{ scale: 0.97 }}
onClick={() => requireVerifiedStudent(() => setShowPostModal(true))} onClick={() => requireVerifiedStudent(() => setShowPostModal(true))}
className="flex items-center gap-2.5 px-6 py-3.5 rounded-2xl text-white font-semibold text-sm shadow-lg shadow-indigo-500/25 shrink-0 cursor-pointer" className="flex items-center gap-2.5 px-6 py-3.5 rounded-2xl text-white font-semibold text-sm shadow-lg shadow-slate-900/25 shrink-0 cursor-pointer border border-violet-800/40"
style={{ background: 'linear-gradient(135deg, #4F46E5, #6366F1)', fontFamily: 'Poppins, sans-serif' }} style={{ background: 'linear-gradient(135deg, #0F172A, #1E1B4B, #2E1065)', fontFamily: 'Poppins, sans-serif' }}
> >
{isVerifiedStudent && <ShieldCheck className="w-4 h-4" />} {isVerifiedStudent && <ShieldCheck className="w-4 h-4" />}
<Plus className="w-4.5 h-4.5" /> <Plus className="w-4.5 h-4.5" />
@@ -609,7 +609,7 @@ export default function DevCollab() {
CLOSED • SPOTS FILLED CLOSED • SPOTS FILLED
</span> </span>
) : ( ) : (
<span className="px-2.5 py-1 rounded-full text-[11px] font-semibold bg-blue-50 text-blue-700 border border-blue-200"> <span className="px-2.5 py-1 rounded-full text-[11px] font-semibold bg-slate-100 text-slate-700 border border-slate-200">
{accepted} / {needed} Spots Filled {accepted} / {needed} Spots Filled
</span> </span>
)} )}
@@ -744,7 +744,7 @@ export default function DevCollab() {
<div className="pt-4 border-t border-slate-100 flex items-center justify-between gap-2"> <div className="pt-4 border-t border-slate-100 flex items-center justify-between gap-2">
<button <button
onClick={() => openManageApplicants(item)} onClick={() => openManageApplicants(item)}
className="px-4 py-2 rounded-xl bg-blue-50 hover:bg-blue-100 text-blue-700 border border-blue-200 text-xs font-bold flex items-center gap-1.5 transition-all cursor-pointer" className="px-4 py-2 rounded-xl bg-slate-100 hover:bg-slate-200 text-slate-800 border border-slate-300 text-xs font-bold flex items-center gap-1.5 transition-all cursor-pointer"
> >
<Users className="w-3.5 h-3.5" /> <Users className="w-3.5 h-3.5" />
Applicants ({item.applicationsCount || 0}) Applicants ({item.applicationsCount || 0})

74
src/pages/Events/Events.tsx
View File

@@ -216,17 +216,17 @@ export default function Events() {
{/* ─── Feature 1: "Find My Ideal Club" Banner ────────────────────────── */} {/* ─── Feature 1: "Find My Ideal Club" Banner ────────────────────────── */}
<AnimatedContainer className="mb-14"> <AnimatedContainer className="mb-14">
<div <div
className="rounded-3xl p-6 md:p-8 text-white relative overflow-hidden border border-indigo-500/30 flex flex-col md:flex-row items-center justify-between gap-6" className="rounded-3xl p-6 md:p-8 text-white relative overflow-hidden border border-slate-800 flex flex-col md:flex-row items-center justify-between gap-6"
style={{ background: 'linear-gradient(135deg, #0F172A, #1E1B4B)' }} style={{ background: 'linear-gradient(135deg, #0F172A, #1E1B4B, #2E1065)' }}
> >
{/* Background Glow */} {/* Background Glow */}
<div <div
className="absolute top-0 right-0 w-80 h-80 rounded-full opacity-20 pointer-events-none" className="absolute top-0 right-0 w-80 h-80 rounded-full opacity-20 pointer-events-none"
style={{ background: 'radial-gradient(circle, #6366F1, transparent)' }} style={{ background: 'radial-gradient(circle, #2E1065, transparent)' }}
/> />
<div className="relative z-10 max-w-xl"> <div className="relative z-10 max-w-xl">
<div className="inline-flex items-center gap-2 px-3 py-1 rounded-full bg-indigo-500/20 text-indigo-300 text-xs font-semibold mb-3 border border-indigo-500/30"> <div className="inline-flex items-center gap-2 px-3 py-1 rounded-full bg-slate-900/80 text-violet-300 text-xs font-semibold mb-3 border border-violet-900/40">
<Target className="w-3.5 h-3.5" /> <Target className="w-3.5 h-3.5" />
<span>Interactive Club Matcher</span> <span>Interactive Club Matcher</span>
</div> </div>
@@ -242,10 +242,10 @@ export default function Events() {
whileHover={{ scale: 1.05 }} whileHover={{ scale: 1.05 }}
whileTap={{ scale: 0.98 }} whileTap={{ scale: 0.98 }}
onClick={() => { resetQuiz(); setIsQuizOpen(true); }} onClick={() => { resetQuiz(); setIsQuizOpen(true); }}
className="relative z-10 px-6 py-3.5 rounded-2xl text-white font-semibold text-sm flex items-center gap-2.5 shadow-lg shrink-0 cursor-pointer" className="relative z-10 px-6 py-3.5 rounded-2xl text-white font-semibold text-sm flex items-center gap-2.5 shadow-lg shrink-0 cursor-pointer border border-violet-800/40"
style={{ background: 'linear-gradient(135deg, #4F46E5, #6366F1)', fontFamily: 'Poppins, sans-serif' }} style={{ background: 'linear-gradient(135deg, #0F172A, #1E1B4B, #2E1065)', fontFamily: 'Poppins, sans-serif' }}
> >
<Sparkles className="w-4 h-4 text-indigo-200" /> <Sparkles className="w-4 h-4 text-violet-200" />
<span>Find My Ideal Club</span> <span>Find My Ideal Club</span>
<ArrowRight className="w-4 h-4" /> <ArrowRight className="w-4 h-4" />
</motion.button> </motion.button>
@@ -262,7 +262,7 @@ export default function Events() {
const renderClubCard = (club: Club) => { const renderClubCard = (club: Club) => {
const IconComponent = (club.icon && CLUB_ICON_MAP[club.icon]) || Atom; const IconComponent = (club.icon && CLUB_ICON_MAP[club.icon]) || Atom;
const categoryColor = CLUB_CATEGORY_COLORS[club.category] || '#4F46E5'; const categoryColor = CLUB_CATEGORY_COLORS[club.category] || '#1E1B4B';
const isLiked = likedClubs.has(club.id); const isLiked = likedClubs.has(club.id);
const likesCount = likesMap[club.id] || 0; const likesCount = likesMap[club.id] || 0;
@@ -270,7 +270,7 @@ export default function Events() {
<motion.div <motion.div
whileHover={{ y: -4 }} whileHover={{ y: -4 }}
onClick={() => setSelectedClub(club)} onClick={() => setSelectedClub(club)}
className="bg-white rounded-2xl border border-[#E5E7EB] p-5 cursor-pointer hover:border-indigo-400 transition-all flex flex-col justify-between h-full group" className="bg-white rounded-2xl border border-[#E5E7EB] p-5 cursor-pointer hover:border-slate-800 transition-all flex flex-col justify-between h-full group"
style={{ boxShadow: '0 2px 15px -3px rgba(0,0,0,0.07)' }} style={{ boxShadow: '0 2px 15px -3px rgba(0,0,0,0.07)' }}
> >
<div> <div>
@@ -313,7 +313,7 @@ export default function Events() {
</div> </div>
{/* Club Title & Description */} {/* Club Title & Description */}
<h3 className="font-semibold text-[#1E293B] mb-1 group-hover:text-indigo-600 transition-colors" style={{ fontFamily: 'Poppins, sans-serif' }}> <h3 className="font-semibold text-[#1E293B] mb-1 group-hover:text-slate-900 transition-colors" style={{ fontFamily: 'Poppins, sans-serif' }}>
{club.name} {club.name}
</h3> </h3>
<p className="text-xs text-[#64748B] mb-3 line-clamp-2" style={{ fontFamily: 'Inter, sans-serif' }}>{club.description}</p> <p className="text-xs text-[#64748B] mb-3 line-clamp-2" style={{ fontFamily: 'Inter, sans-serif' }}>{club.description}</p>
@@ -327,7 +327,7 @@ export default function Events() {
</span> </span>
<motion.button <motion.button
whileHover={{ scale: 1.04 }} whileHover={{ scale: 1.04 }}
className="px-3.5 py-1.5 rounded-lg text-xs font-semibold text-white flex items-center gap-1 cursor-pointer bg-indigo-600 hover:bg-indigo-700 transition-colors" className="px-3.5 py-1.5 rounded-lg text-xs font-semibold text-white flex items-center gap-1 cursor-pointer bg-[#1E1B4B] hover:bg-[#2E1065] transition-colors"
style={{ fontFamily: 'Poppins, sans-serif' }} style={{ fontFamily: 'Poppins, sans-serif' }}
> >
View Details View Details
@@ -390,13 +390,13 @@ export default function Events() {
</div> </div>
<div className="w-full h-1.5 bg-slate-100 rounded-full mb-6 overflow-hidden"> <div className="w-full h-1.5 bg-slate-100 rounded-full mb-6 overflow-hidden">
<div <div
className="h-full bg-indigo-600 transition-all duration-300 rounded-full" className="h-full bg-[#1E1B4B] transition-all duration-300 rounded-full"
style={{ width: `${((quizStep + 1) / QUIZ_QUESTIONS.length) * 100}%` }} style={{ width: `${((quizStep + 1) / QUIZ_QUESTIONS.length) * 100}%` }}
/> />
</div> </div>
{/* Question Header */} {/* Question Header */}
<div className="flex items-center gap-2 mb-2 text-indigo-600"> <div className="flex items-center gap-2 mb-2 text-[#1E1B4B]">
<Compass className="w-5 h-5" /> <Compass className="w-5 h-5" />
<span className="text-xs font-bold uppercase tracking-wider">Club Matcher Quiz</span> <span className="text-xs font-bold uppercase tracking-wider">Club Matcher Quiz</span>
</div> </div>
@@ -410,10 +410,10 @@ export default function Events() {
<button <button
key={idx} key={idx}
onClick={() => handleSelectOption(idx)} onClick={() => handleSelectOption(idx)}
className="w-full text-left p-4 rounded-2xl border border-slate-200 hover:border-indigo-500 hover:bg-indigo-50/50 transition-all flex items-center justify-between text-sm font-medium text-slate-700 cursor-pointer group" className="w-full text-left p-4 rounded-2xl border border-slate-200 hover:border-slate-800 hover:bg-slate-50 transition-all flex items-center justify-between text-sm font-medium text-slate-700 cursor-pointer group"
> >
<span>{opt.label}</span> <span>{opt.label}</span>
<ArrowRight className="w-4 h-4 text-slate-300 group-hover:text-indigo-600 group-hover:translate-x-1 transition-all" /> <ArrowRight className="w-4 h-4 text-slate-300 group-hover:text-[#1E1B4B] group-hover:translate-x-1 transition-all" />
</button> </button>
))} ))}
</div> </div>
@@ -431,7 +431,7 @@ export default function Events() {
/* Results Screen */ /* Results Screen */
<div> <div>
<div className="text-center mb-6"> <div className="text-center mb-6">
<div className="w-14 h-14 rounded-2xl bg-indigo-100 text-indigo-600 flex items-center justify-center mx-auto mb-3"> <div className="w-14 h-14 rounded-2xl bg-slate-900 text-violet-300 flex items-center justify-center mx-auto mb-3">
<CheckCircle2 className="w-8 h-8" /> <CheckCircle2 className="w-8 h-8" />
</div> </div>
<h3 className="text-2xl font-bold text-[#1E293B]" style={{ fontFamily: 'Playfair Display, serif' }}> <h3 className="text-2xl font-bold text-[#1E293B]" style={{ fontFamily: 'Playfair Display, serif' }}>
@@ -444,7 +444,7 @@ export default function Events() {
<div className="space-y-3 mb-6"> <div className="space-y-3 mb-6">
{quizResults.map((item, i) => { {quizResults.map((item, i) => {
const IconComponent = (item.club.icon && CLUB_ICON_MAP[item.club.icon]) || Atom; const IconComponent = (item.club.icon && CLUB_ICON_MAP[item.club.icon]) || Atom;
const catColor = CLUB_CATEGORY_COLORS[item.club.category] || '#4F46E5'; const catColor = CLUB_CATEGORY_COLORS[item.club.category] || '#1E1B4B';
const matchPercent = i === 0 ? '98%' : i === 1 ? '91%' : '84%'; const matchPercent = i === 0 ? '98%' : i === 1 ? '91%' : '84%';
return ( return (
@@ -454,7 +454,7 @@ export default function Events() {
setIsQuizOpen(false); setIsQuizOpen(false);
setSelectedClub(item.club); setSelectedClub(item.club);
}} }}
className="p-4 rounded-2xl border border-slate-200 hover:border-indigo-500 bg-slate-50 hover:bg-white cursor-pointer transition-all flex items-center justify-between" className="p-4 rounded-2xl border border-slate-200 hover:border-slate-800 bg-slate-50 hover:bg-white cursor-pointer transition-all flex items-center justify-between"
> >
<div className="flex items-center gap-3"> <div className="flex items-center gap-3">
{item.club.logoUrl ? ( {item.club.logoUrl ? (
@@ -495,7 +495,7 @@ export default function Events() {
</button> </button>
<button <button
onClick={() => setIsQuizOpen(false)} onClick={() => setIsQuizOpen(false)}
className="flex-1 py-3 rounded-xl text-white font-semibold text-xs bg-indigo-600 hover:bg-indigo-700 transition-all cursor-pointer" className="flex-1 py-3 rounded-xl text-white font-semibold text-xs bg-[#1E1B4B] hover:bg-[#2E1065] transition-all cursor-pointer"
> >
Explore All Clubs Explore All Clubs
</button> </button>
@@ -529,7 +529,7 @@ export default function Events() {
{/* Modal Header */} {/* Modal Header */}
{(() => { {(() => {
const IconComponent = (selectedClub.icon && CLUB_ICON_MAP[selectedClub.icon]) || Atom; const IconComponent = (selectedClub.icon && CLUB_ICON_MAP[selectedClub.icon]) || Atom;
const categoryColor = CLUB_CATEGORY_COLORS[selectedClub.category] || '#4F46E5'; const categoryColor = CLUB_CATEGORY_COLORS[selectedClub.category] || '#1E1B4B';
const isLiked = likedClubs.has(selectedClub.id); const isLiked = likedClubs.has(selectedClub.id);
const likesCount = likesMap[selectedClub.id] || 0; const likesCount = likesMap[selectedClub.id] || 0;
@@ -580,9 +580,9 @@ export default function Events() {
})()} })()}
{/* Club Detailed Description */} {/* Club Detailed Description */}
<div className="mb-5 bg-indigo-50/60 border border-indigo-100 rounded-2xl p-4.5"> <div className="mb-5 bg-slate-900/40 border border-slate-800 rounded-2xl p-4.5">
<div className="flex items-center gap-2 text-xs font-bold text-indigo-600 uppercase tracking-wider mb-2"> <div className="flex items-center gap-2 text-xs font-bold text-violet-300 uppercase tracking-wider mb-2">
<Info className="w-4 h-4 text-indigo-600" /> <Info className="w-4 h-4 text-violet-300" />
<span>About the Club</span> <span>About the Club</span>
</div> </div>
<p className="text-slate-700 text-sm leading-relaxed" style={{ fontFamily: 'Inter, sans-serif' }}> <p className="text-slate-700 text-sm leading-relaxed" style={{ fontFamily: 'Inter, sans-serif' }}>
@@ -592,33 +592,33 @@ export default function Events() {
{/* Leadership & Contact Information */} {/* Leadership & Contact Information */}
<div className="grid grid-cols-1 sm:grid-cols-2 gap-3.5 mb-6"> <div className="grid grid-cols-1 sm:grid-cols-2 gap-3.5 mb-6">
<div className="bg-indigo-50/80 border border-indigo-100 hover:border-indigo-300 transition-colors rounded-2xl p-3.5 flex items-center gap-3"> <div className="bg-slate-900/60 border border-slate-800 hover:border-slate-700 transition-colors rounded-2xl p-3.5 flex items-center gap-3">
<div className="w-10 h-10 rounded-xl bg-gradient-to-br from-indigo-500 to-indigo-600 text-white flex items-center justify-center shadow-xs shadow-indigo-200 shrink-0"> <div className="w-10 h-10 rounded-xl bg-gradient-to-br from-[#1E1B4B] to-[#2E1065] text-white flex items-center justify-center shadow-xs shrink-0">
<UserCheck className="w-5 h-5 text-white" /> <UserCheck className="w-5 h-5 text-white" />
</div> </div>
<div> <div>
<span className="text-[11px] text-indigo-500 font-semibold block">President / Student Lead</span> <span className="text-[11px] text-violet-300 font-semibold block">President / Student Lead</span>
<span className="text-sm font-bold text-indigo-950">{selectedClub.presidentName || 'Student President'}</span> <span className="text-sm font-bold text-white">{selectedClub.presidentName || 'Student President'}</span>
</div> </div>
</div> </div>
{selectedClub.vicePresidentName && ( {selectedClub.vicePresidentName && (
<div className="bg-violet-50/80 border border-violet-100 hover:border-violet-300 transition-colors rounded-2xl p-3.5 flex items-center gap-3"> <div className="bg-slate-900/60 border border-slate-800 hover:border-slate-700 transition-colors rounded-2xl p-3.5 flex items-center gap-3">
<div className="w-10 h-10 rounded-xl bg-gradient-to-br from-violet-500 to-violet-600 text-white flex items-center justify-center shadow-xs shadow-violet-200 shrink-0"> <div className="w-10 h-10 rounded-xl bg-gradient-to-br from-[#2E1065] to-[#3B0764] text-white flex items-center justify-center shadow-xs shrink-0">
<Users className="w-5 h-5 text-white" /> <Users className="w-5 h-5 text-white" />
</div> </div>
<div> <div>
<span className="text-[11px] text-violet-500 font-semibold block">Vice President</span> <span className="text-[11px] text-violet-300 font-semibold block">Vice President</span>
<span className="text-sm font-bold text-violet-950">{selectedClub.vicePresidentName}</span> <span className="text-sm font-bold text-white">{selectedClub.vicePresidentName}</span>
</div> </div>
</div> </div>
)} )}
</div> </div>
{/* Community & Social Links */} {/* Community & Social Links */}
<div className="mb-6 bg-indigo-50/60 border border-indigo-200/80 rounded-2xl p-4"> <div className="mb-6 bg-slate-900/40 border border-slate-800 rounded-2xl p-4">
<div className="flex items-center justify-between mb-3"> <div className="flex items-center justify-between mb-3">
<div className="flex items-center gap-2 text-xs font-bold text-indigo-600 uppercase tracking-wider"> <div className="flex items-center gap-2 text-xs font-bold text-violet-300 uppercase tracking-wider">
<ExternalLink className="w-3.5 h-3.5" /> <ExternalLink className="w-3.5 h-3.5" />
<span>Community & Social Links</span> <span>Community & Social Links</span>
</div> </div>
@@ -643,9 +643,9 @@ export default function Events() {
href={selectedClub.socialLinks.website} href={selectedClub.socialLinks.website}
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
className="flex items-center gap-2 p-2.5 rounded-xl bg-white border border-slate-200 hover:border-indigo-500 hover:text-indigo-600 transition-all text-xs font-medium text-slate-700" className="flex items-center gap-2 p-2.5 rounded-xl bg-white border border-slate-200 hover:border-slate-800 hover:text-slate-900 transition-all text-xs font-medium text-slate-700"
> >
<Globe className="w-4 h-4 text-indigo-500 shrink-0" /> <Globe className="w-4 h-4 text-slate-800 shrink-0" />
<span className="truncate">Linktree Hub</span> <span className="truncate">Linktree Hub</span>
</a> </a>
)} )}
@@ -655,9 +655,9 @@ export default function Events() {
href={selectedClub.socialLinks.linkedin} href={selectedClub.socialLinks.linkedin}
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
className="flex items-center gap-2 p-2.5 rounded-xl bg-white border border-slate-200 hover:border-blue-600 hover:text-blue-600 transition-all text-xs font-medium text-slate-700" className="flex items-center gap-2 p-2.5 rounded-xl bg-white border border-slate-200 hover:border-slate-800 hover:text-slate-900 transition-all text-xs font-medium text-slate-700"
> >
<LinkedinIcon className="w-4 h-4 text-blue-600 shrink-0" /> <LinkedinIcon className="w-4 h-4 text-slate-800 shrink-0" />
<span className="truncate">LinkedIn</span> <span className="truncate">LinkedIn</span>
</a> </a>
)} )}

52
src/pages/Home/Home.tsx
View File

@@ -21,8 +21,8 @@ export default function Home() {
]; ];
return ( return (
<div className="relative overflow-hidden rounded-3xl min-h-[calc(100vh-100px)] flex flex-col justify-between p-5 sm:p-8 lg:p-10 text-white shadow-2xl border border-slate-800/80 bg-slate-950 group"> <div className="relative w-full min-h-[calc(100vh-90px)] flex flex-col justify-between p-2 sm:p-6 lg:p-8 text-white group">
{/* ─── High Clarity Background Video ───────────────────────────────────── */} {/* ─── Fixed Full-Screen Background Video (Spans Entire Laptop/Phone Frame) ─── */}
<video <video
src="/campus-video.mp4" src="/campus-video.mp4"
autoPlay autoPlay
@@ -30,55 +30,55 @@ export default function Home() {
muted muted
playsInline playsInline
preload="auto" preload="auto"
className="absolute inset-0 w-full h-full object-cover pointer-events-none transition-transform duration-1000 scale-[1.01]" className="fixed inset-0 w-full h-full object-cover pointer-events-none z-0"
style={{ style={{
filter: 'contrast(1.05) brightness(0.9) saturate(1.05)', filter: 'contrast(1.05) brightness(0.85) saturate(1.05)',
imageRendering: 'crisp-edges', imageRendering: 'crisp-edges',
}} }}
/> />
{/* Ultra-sleek Gradient Overlay for Crisp Text Contrast */} {/* Fixed High-Contrast Dark Gradient Overlay across full viewport */}
<div <div
className="absolute inset-0 pointer-events-none" className="fixed inset-0 pointer-events-none z-0"
style={{ style={{
background: 'linear-gradient(180deg, rgba(15, 23, 42, 0.45) 0%, rgba(15, 23, 42, 0.25) 45%, rgba(15, 23, 42, 0.75) 100%)', background: 'linear-gradient(180deg, rgba(15, 23, 42, 0.5) 0%, rgba(15, 23, 42, 0.3) 45%, rgba(11, 15, 25, 0.85) 100%)',
}} }}
/> />
{/* Top Branding Badge */} {/* Top Branding Badge */}
<div className="relative z-10 flex items-center justify-between"> <div className="relative z-10 flex items-center justify-between gap-2">
<div className="inline-flex items-center gap-2 px-3.5 py-1.5 rounded-full bg-slate-950/40 border border-white/20 text-[11px] font-semibold text-white backdrop-blur-md shadow-lg"> <div className="inline-flex items-center gap-1.5 sm:gap-2 px-3 py-1.5 sm:px-4 sm:py-2 rounded-full bg-slate-950/60 border border-white/20 text-[10px] sm:text-xs font-semibold text-white backdrop-blur-md shadow-xl truncate">
<span className="w-2 h-2 rounded-full bg-emerald-400 animate-pulse" /> <span className="w-2 h-2 rounded-full bg-emerald-400 animate-pulse shrink-0" />
<span>Rajalakshmi Institute of Technology</span> <span className="truncate">Rajalakshmi Institute of Technology</span>
</div> </div>
<Link <Link
to="/raise" to="/raise"
className="hidden sm:inline-flex items-center gap-1.5 px-3.5 py-1.5 rounded-full bg-gradient-to-r from-rose-500/80 to-pink-600/80 hover:from-rose-500 hover:to-pink-600 text-white text-xs font-bold border border-white/20 backdrop-blur-md transition-all shadow-md hover:scale-105" className="inline-flex items-center gap-1 sm:gap-1.5 px-3 py-1.5 sm:px-4 sm:py-2 rounded-full bg-gradient-to-r from-rose-500/90 to-pink-600/90 hover:from-rose-500 hover:to-pink-600 text-white text-[10px] sm:text-xs font-bold border border-white/25 backdrop-blur-md transition-all shadow-lg hover:scale-105 shrink-0"
style={{ fontFamily: 'Poppins, sans-serif' }} style={{ fontFamily: 'Poppins, sans-serif' }}
> >
<Sparkles className="w-3.5 h-3.5 text-amber-200" /> <Sparkles className="w-3 h-3 sm:w-3.5 sm:h-3.5 text-amber-200" />
<span>RAISE Incubator</span> <span>RAISE Incubator</span>
</Link> </Link>
</div> </div>
{/* Center Main Hero Title */} {/* Center Main Hero Title */}
<div className="relative z-10 max-w-4xl mx-auto text-center space-y-4 my-auto py-10 sm:py-16"> <div className="relative z-10 max-w-4xl mx-auto text-center space-y-3 sm:space-y-4 my-auto py-8 sm:py-16">
<h1 <h1
className="text-4xl sm:text-6xl md:text-7xl font-black tracking-tight leading-tight text-white" className="text-4xl sm:text-6xl md:text-7xl font-black tracking-tight leading-tight text-white"
style={{ style={{
fontFamily: 'Playfair Display, Georgia, serif', fontFamily: 'Playfair Display, Georgia, serif',
color: '#FFFFFF', color: '#FFFFFF',
textShadow: '0 4px 30px rgba(0,0,0,0.85), 0 2px 10px rgba(0,0,0,0.9)' textShadow: '0 4px 35px rgba(0,0,0,0.9), 0 2px 12px rgba(0,0,0,0.95)'
}} }}
> >
RIT Freshers Hub RIT Freshers Hub
</h1> </h1>
<p <p
className="text-sm sm:text-base md:text-lg text-slate-100 font-medium leading-relaxed max-w-2xl mx-auto" className="text-xs sm:text-base md:text-lg text-slate-100 font-medium leading-relaxed max-w-2xl mx-auto px-2"
style={{ style={{
fontFamily: 'Inter, sans-serif', fontFamily: 'Inter, sans-serif',
textShadow: '0 2px 12px rgba(0,0,0,0.9)' textShadow: '0 2px 14px rgba(0,0,0,0.95)'
}} }}
> >
Your unified campus portal — academic notes, AI chatbot, live bus tracking, faculty directory & student developer hub. Your unified campus portal — academic notes, AI chatbot, live bus tracking, faculty directory & student developer hub.
@@ -86,29 +86,29 @@ export default function Home() {
</div> </div>
{/* Bottom Ultra-Compact Ultra-Transparent Quick Launch Bar */} {/* Bottom Ultra-Compact Ultra-Transparent Quick Launch Bar */}
<div className="relative z-10 pt-2"> <div className="relative z-10 pt-2 sm:pt-4">
<div className="text-center mb-3"> <div className="text-center mb-2 sm:mb-3">
<span className="text-[10px] font-extrabold text-slate-200 uppercase tracking-widest bg-slate-950/50 px-3 py-1 rounded-full border border-white/15 backdrop-blur-md shadow-md inline-block"> <span className="text-[9px] sm:text-[10px] font-extrabold text-slate-200 uppercase tracking-widest bg-slate-950/70 px-3 py-1 rounded-full border border-white/20 backdrop-blur-md shadow-lg inline-block">
Quick Launch Portal Modules Quick Launch Portal Modules
</span> </span>
</div> </div>
<div className="grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-6 gap-2.5 sm:gap-3"> <div className="grid grid-cols-3 sm:grid-cols-3 lg:grid-cols-6 gap-1.5 sm:gap-3">
{quickLaunchModules.map((item) => { {quickLaunchModules.map((item) => {
const Icon = item.icon; const Icon = item.icon;
return ( return (
<Link <Link
key={item.label} key={item.label}
to={item.path} to={item.path}
className="flex flex-col items-center justify-center p-2.5 sm:p-3 rounded-2xl bg-slate-950/30 hover:bg-slate-900/60 border border-white/15 hover:border-white/35 backdrop-blur-md text-white transition-all duration-200 cursor-pointer hover:scale-[1.03] shadow-lg group text-center" className="flex flex-col items-center justify-center p-2 sm:p-3.5 rounded-xl sm:rounded-2xl bg-slate-950/50 hover:bg-slate-900/80 border border-white/20 hover:border-white/40 backdrop-blur-md text-white transition-all duration-200 cursor-pointer hover:scale-[1.04] shadow-xl group text-center"
> >
<div className="w-8 h-8 rounded-xl bg-white/15 border border-white/20 flex items-center justify-center mb-1.5 group-hover:bg-indigo-600 transition-colors shrink-0"> <div className="w-6 h-6 sm:w-8 sm:h-8 rounded-lg sm:rounded-xl bg-white/15 border border-white/25 flex items-center justify-center mb-1 sm:mb-1.5 group-hover:bg-[#1E1B4B] transition-colors shrink-0">
<Icon className="w-4 h-4 text-white" /> <Icon className="w-3.5 h-3.5 sm:w-4 sm:h-4 text-white" />
</div> </div>
<span className="text-xs font-bold truncate max-w-full leading-tight" style={{ fontFamily: 'Poppins, sans-serif' }}> <span className="text-[10px] sm:text-xs font-bold truncate max-w-full leading-tight" style={{ fontFamily: 'Poppins, sans-serif' }}>
{item.label} {item.label}
</span> </span>
<span className="text-[10px] text-slate-300/90 truncate max-w-full mt-0.5"> <span className="hidden sm:block text-[10px] text-slate-300/90 truncate max-w-full mt-0.5">
{item.desc} {item.desc}
</span> </span>
</Link> </Link>

4
src/pages/LeetcodeLeaderboard/LeetcodeLeaderboard.tsx
View File

@@ -153,7 +153,7 @@ export default function LeetcodeLeaderboard() {
RIT LeetCode Arena RIT LeetCode Arena
</div> </div>
<h1 className="text-3xl sm:text-5xl font-extrabold tracking-tight text-[#1E293B] font-poppins"> <h1 className="text-3xl sm:text-5xl font-extrabold tracking-tight text-[#1E293B] font-poppins">
Campus <span className="bg-clip-text text-transparent bg-gradient-to-r from-indigo-500 via-indigo-600 to-purple-600">LeetCode Leaderboard</span> Campus <span className="bg-clip-text text-transparent bg-gradient-to-r from-[#0F172A] via-[#1E1B4B] to-[#2E1065]">LeetCode Leaderboard</span>
</h1> </h1>
<p className="mt-2 text-slate-500 max-w-2xl text-sm sm:text-base"> <p className="mt-2 text-slate-500 max-w-2xl text-sm sm:text-base">
Track top problem solvers across departments. Automatically updated every 24 hours with rate-limited, spaced background sync. Track top problem solvers across departments. Automatically updated every 24 hours with rate-limited, spaced background sync.
@@ -205,7 +205,7 @@ export default function LeetcodeLeaderboard() {
<div className="p-4 rounded-2xl bg-[#F8FAFC] border border-[#E2E8F0]"> <div className="p-4 rounded-2xl bg-[#F8FAFC] border border-[#E2E8F0]">
<span className="text-xs font-semibold text-slate-500 flex items-center gap-1.5"> <span className="text-xs font-semibold text-slate-500 flex items-center gap-1.5">
<User className="w-4 h-4 text-indigo-500" /> Active Coders <User className="w-4 h-4 text-violet-400" /> Active Coders
</span> </span>
<p className="text-xl font-bold text-[#1E293B] mt-1"> <p className="text-xl font-bold text-[#1E293B] mt-1">
{profiles.length} {profiles.length}

2
src/pages/Notes/Notes.tsx
View File

@@ -1994,7 +1994,7 @@ export default function Notes() {
</div> </div>
<div className="p-4 rounded-2xl bg-[#F8FAFC] border border-[#E5E7EB]/70 flex flex-col gap-2"> <div className="p-4 rounded-2xl bg-[#F8FAFC] border border-[#E5E7EB]/70 flex flex-col gap-2">
<div className="w-8 h-8 rounded-xl bg-blue-500/10 border border-blue-500/20 flex items-center justify-center text-blue-600"> <div className="w-8 h-8 rounded-xl bg-slate-900 border border-slate-700 flex items-center justify-center text-violet-300">
<FileText className="w-4 h-4" /> <FileText className="w-4 h-4" />
</div> </div>
<div className="text-xs font-bold text-[#1E293B]" style={{ fontFamily: 'Poppins, sans-serif' }}> <div className="text-xs font-bold text-[#1E293B]" style={{ fontFamily: 'Poppins, sans-serif' }}>

8
src/pages/Raise/components/PortfolioShowcase.tsx
View File

@@ -56,7 +56,7 @@ export const PortfolioShowcase: React.FC = () => {
domain: "AI-based Systems", domain: "AI-based Systems",
description: "Cognitive educational platforms providing personalised student learning paths.", description: "Cognitive educational platforms providing personalised student learning paths.",
remarks: "Testing with users", remarks: "Testing with users",
color: "bg-blue-500" color: "bg-[#1E1B4B]"
}, },
{ {
name: "Innsole", name: "Innsole",
@@ -64,7 +64,7 @@ export const PortfolioShowcase: React.FC = () => {
domain: "Hardware & Health", domain: "Hardware & Health",
description: "Smart footwear soles embedded with sensor arrays to monitor athletic gait and posture.", description: "Smart footwear soles embedded with sensor arrays to monitor athletic gait and posture.",
remarks: "Testing with users", remarks: "Testing with users",
color: "bg-blue-500" color: "bg-[#1E1B4B]"
}, },
// Prototype // Prototype
@@ -207,7 +207,7 @@ export const PortfolioShowcase: React.FC = () => {
const getStageIcon = (stage: string) => { const getStageIcon = (stage: string) => {
switch(stage) { switch(stage) {
case 'commercialization': return <TrendingUp className="w-4 h-4 text-emerald-600" />; case 'commercialization': return <TrendingUp className="w-4 h-4 text-emerald-600" />;
case 'mvp': return <Box className="w-4 h-4 text-blue-600" />; case 'mvp': return <Box className="w-4 h-4 text-violet-300" />;
case 'prototype': return <Layers className="w-4 h-4 text-amber-600" />; case 'prototype': return <Layers className="w-4 h-4 text-amber-600" />;
case 'idea': return <Sparkles className="w-4 h-4 text-purple-600" />; case 'idea': return <Sparkles className="w-4 h-4 text-purple-600" />;
default: return <HelpCircle className="w-4 h-4" />; default: return <HelpCircle className="w-4 h-4" />;
@@ -277,7 +277,7 @@ export const PortfolioShowcase: React.FC = () => {
<div className="flex justify-between items-center mb-6"> <div className="flex justify-between items-center mb-6">
<span className={`inline-flex items-center gap-1.5 px-3 py-1 rounded-full text-[10px] md:text-xs font-bold uppercase tracking-wider ${ <span className={`inline-flex items-center gap-1.5 px-3 py-1 rounded-full text-[10px] md:text-xs font-bold uppercase tracking-wider ${
startup.stage === 'commercialization' ? 'bg-emerald-100 text-emerald-800' : startup.stage === 'commercialization' ? 'bg-emerald-100 text-emerald-800' :
startup.stage === 'mvp' ? 'bg-blue-100 text-blue-800' : startup.stage === 'mvp' ? 'bg-slate-900 text-violet-300' :
startup.stage === 'prototype' ? 'bg-amber-100 text-amber-800' : startup.stage === 'prototype' ? 'bg-amber-100 text-amber-800' :
'bg-purple-100 text-purple-800' 'bg-purple-100 text-purple-800'
}`}> }`}>

8
src/pages/RaiseIncubator/components/PortfolioShowcase.tsx
View File

@@ -56,7 +56,7 @@ export const PortfolioShowcase: React.FC = () => {
domain: "AI-based Systems", domain: "AI-based Systems",
description: "Cognitive educational platforms providing personalised student learning paths.", description: "Cognitive educational platforms providing personalised student learning paths.",
remarks: "Testing with users", remarks: "Testing with users",
color: "bg-blue-500" color: "bg-[#1E1B4B]"
}, },
{ {
name: "Innsole", name: "Innsole",
@@ -64,7 +64,7 @@ export const PortfolioShowcase: React.FC = () => {
domain: "Hardware & Health", domain: "Hardware & Health",
description: "Smart footwear soles embedded with sensor arrays to monitor athletic gait and posture.", description: "Smart footwear soles embedded with sensor arrays to monitor athletic gait and posture.",
remarks: "Testing with users", remarks: "Testing with users",
color: "bg-blue-500" color: "bg-[#1E1B4B]"
}, },
// Prototype // Prototype
@@ -207,7 +207,7 @@ export const PortfolioShowcase: React.FC = () => {
const getStageIcon = (stage: string) => { const getStageIcon = (stage: string) => {
switch(stage) { switch(stage) {
case 'commercialization': return <TrendingUp className="w-4 h-4 text-emerald-600" />; case 'commercialization': return <TrendingUp className="w-4 h-4 text-emerald-600" />;
case 'mvp': return <Box className="w-4 h-4 text-blue-600" />; case 'mvp': return <Box className="w-4 h-4 text-violet-300" />;
case 'prototype': return <Layers className="w-4 h-4 text-amber-600" />; case 'prototype': return <Layers className="w-4 h-4 text-amber-600" />;
case 'idea': return <Sparkles className="w-4 h-4 text-purple-600" />; case 'idea': return <Sparkles className="w-4 h-4 text-purple-600" />;
default: return <HelpCircle className="w-4 h-4" />; default: return <HelpCircle className="w-4 h-4" />;
@@ -277,7 +277,7 @@ export const PortfolioShowcase: React.FC = () => {
<div className="flex justify-between items-center mb-6"> <div className="flex justify-between items-center mb-6">
<span className={`inline-flex items-center gap-1.5 px-3 py-1 rounded-full text-[10px] md:text-xs font-bold uppercase tracking-wider ${ <span className={`inline-flex items-center gap-1.5 px-3 py-1 rounded-full text-[10px] md:text-xs font-bold uppercase tracking-wider ${
startup.stage === 'commercialization' ? 'bg-emerald-100 text-emerald-800' : startup.stage === 'commercialization' ? 'bg-emerald-100 text-emerald-800' :
startup.stage === 'mvp' ? 'bg-blue-100 text-blue-800' : startup.stage === 'mvp' ? 'bg-slate-900 text-violet-300' :
startup.stage === 'prototype' ? 'bg-amber-100 text-amber-800' : startup.stage === 'prototype' ? 'bg-amber-100 text-amber-800' :
'bg-purple-100 text-purple-800' 'bg-purple-100 text-purple-800'
}`}> }`}>