diff --git a/public/logo.png b/public/logo.png new file mode 100644 index 0000000..40bcff7 Binary files /dev/null and b/public/logo.png differ diff --git a/public/video/RIT Video.mp4 b/public/video/RIT Video.mp4 new file mode 100644 index 0000000..fdd0fde Binary files /dev/null and b/public/video/RIT Video.mp4 differ diff --git a/src/assets/campus.mp4 b/src/assets/campus.mp4 new file mode 100644 index 0000000..e69de29 diff --git a/src/components/Navbar/Navbar.tsx b/src/components/Navbar/Navbar.tsx index 839273f..ebfa4a1 100644 --- a/src/components/Navbar/Navbar.tsx +++ b/src/components/Navbar/Navbar.tsx @@ -1,7 +1,7 @@ import { useState, useEffect } from 'react'; import { Link, useLocation } from 'react-router-dom'; import { motion, AnimatePresence } from 'framer-motion'; -import { Menu, X, GraduationCap, Bell } from 'lucide-react'; +import { Menu, X } from 'lucide-react'; import { NAV_LINKS } from '@/constants'; export default function Navbar() { @@ -25,54 +25,38 @@ export default function Navbar() { initial={{ y: -100, opacity: 0 }} animate={{ y: 0, opacity: 1 }} transition={{ duration: 0.6, ease: 'easeOut' }} - className={`fixed top-4 left-1/2 -translate-x-1/2 z-50 w-[95%] max-w-6xl transition-all duration-300 ${ - isScrolled - ? 'shadow-[0_8px_32px_rgba(0,0,0,0.12)] bg-white/90' - : 'bg-white/80' - }`} + className="fixed top-4 left-1/2 -translate-x-1/2 z-50 w-[95%] max-w-6xl transition-all duration-300 shadow-[0_8px_32px_rgba(0,0,0,0.25)]" style={{ + background: 'linear-gradient(to right, rgba(15, 23, 42, 0.45) 0%, rgba(30, 41, 59, 0.35) 50%, rgba(15, 23, 42, 0.45) 100%)', backdropFilter: 'blur(16px)', WebkitBackdropFilter: 'blur(16px)', borderRadius: '20px', - border: '1px solid rgba(229,231,235,0.8)', + border: '1px solid rgba(255, 255, 255, 0.1)', }} >
{/* Logo - RIT Event Hub Style */} - - {/* Blue Circular Tree Icon */} - + {/* Logo Image */} + - - {/* Minimalist Tree Branch Representation */} - - - - - - - - - - - - + src="/logo.png" + alt="RIT Logo" + className="w-10 h-10 object-contain rounded-full shrink-0" + />
- + rit -
-
+
+
RAJALAKSHMI INSTITUTE OF TECHNOLOGY
- + {/* Desktop Nav */}
@@ -85,14 +69,14 @@ export default function Navbar() { className="relative px-4 py-2 rounded-xl text-xs font-semibold uppercase tracking-wider transition-all duration-200" style={{ fontFamily: 'Poppins, sans-serif', - color: isActive ? '#F97316' : '#475569', + color: isActive ? '#FFFFFF' : '#CBD5E1', }} > {isActive && ( )} @@ -104,35 +88,11 @@ export default function Navbar() { {/* Right Side */}
- - - - - {/* Profile styled as an orange LOG OUT pill button from Reference Image */} - - - Profile - - - {/* Mobile Toggle */} setIsMobileOpen(!isMobileOpen)} - className="md:hidden w-9 h-9 rounded-xl flex items-center justify-center text-[#475569] hover:bg-gray-100 transition-all" + className="md:hidden w-9 h-9 rounded-xl flex items-center justify-center text-slate-300 hover:text-white hover:bg-white/10 transition-all" aria-label="Toggle menu" > {isMobileOpen ? : } @@ -150,7 +110,7 @@ export default function Navbar() { transition={{ duration: 0.25 }} className="overflow-hidden md:hidden" > -
+
{NAV_LINKS.map((link) => { const isActive = location.pathname === link.path; return ( @@ -160,8 +120,8 @@ export default function Navbar() { className="px-4 py-3 rounded-xl text-sm font-medium transition-all" style={{ fontFamily: 'Inter, sans-serif', - color: isActive ? '#F97316' : '#475569', - backgroundColor: isActive ? '#FFF7ED' : 'transparent', + color: isActive ? '#FFFFFF' : '#CBD5E1', + backgroundColor: isActive ? '#F97316' : 'transparent', }} > {link.label} diff --git a/src/pages/Home/Home.tsx b/src/pages/Home/Home.tsx index 32b41d8..b35b048 100644 --- a/src/pages/Home/Home.tsx +++ b/src/pages/Home/Home.tsx @@ -1,184 +1,215 @@ -import { motion } from 'framer-motion'; +import { motion, useScroll, useTransform } from 'framer-motion'; import { Link } from 'react-router-dom'; import { ArrowRight, Sparkles, BookOpen, Bot, GraduationCap, - CheckCircle, Zap, Shield, Brain + CheckCircle, Zap, Shield, Brain, Trophy, Award, Cpu, Users } from 'lucide-react'; import SectionTitle from '@/components/SectionTitle/SectionTitle'; -import StatsCard from '@/components/StatsCard/StatsCard'; import FeatureCard from '@/components/FeatureCard/FeatureCard'; import FloatingCard from '@/components/FloatingCard/FloatingCard'; import ChatPreview from '@/components/ChatPreview/ChatPreview'; import { StaggerContainer, StaggerItem } from '@/components/AnimatedContainer/AnimatedContainer'; import AnimatedContainer from '@/components/AnimatedContainer/AnimatedContainer'; -import { STATS, FEATURES, CAMPUS_LOCATIONS } from '@/constants'; +import { FEATURES, CAMPUS_LOCATIONS } from '@/constants'; import * as LucideIcons from 'lucide-react'; export default function Home() { + const { scrollY } = useScroll(); + const heroOpacity = useTransform(scrollY, [0, 450], [1, 0]); + const heroY = useTransform(scrollY, [0, 450], [0, -80]); + return ( -
+
+ {/* Sticky Background Video */} +
+ + {/* Dark Overlay (40-50%) */} +
+
+ {/* ─── Hero Section ─────────────────────────────────────────────────────── */} -
- {/* Background Decoration */} -
-
+
+ {/* Center Content */} + + + + OUR LEGACY & FUTURE + + -
-
- {/* Left – Visual Section (RIT Events Hub Style) */} -
- + Welcome to + + + + RIT Freshers Hub + + + + The RIT Freshers Hub is your centralized gateway to campus life, academic resources, AI assistance, clubs, events, bus routes, notes, and student services. + + + {/* Buttons */} + + + - {/* Main campus image/graphic card with soft blurry drop shadow */} -
- Rajalakshmi Institute of Technology Campus - - {/* Subtle dark gradient overlay to ensure text contrast */} -
- - {/* Text on top of the image (RIT Events Hub Style) */} -
-

- Rajalakshmi Institute -

-

- of Technology, Chennai -

-
- - Est. 2008 • NBA & NAAC A+ -
-
-
- -
+ + Explore Hub + + + - {/* Right – Text Content */} -
- + - - OUR LEGACY & FUTURE - - + + Ask AI Assistant + + + - - Welcome to
- - RIT Freshers Hub - - - - - The RIT Freshers Hub is your centralized gateway to campus life, designed to simplify how you discover and participate in academic and extracurricular activities. With seamless access to notes, PYQs, AI assistant, and bus routes, we ensure you have everything needed to succeed. - - - - - - - Explore Hub - - - - - - - - Ask AI Assistant - - - - - {/* Badges positioned cleanly below buttons with more breathing room */} - - {[ - { icon: CheckCircle, text: 'Official Portal' }, - { icon: Zap, text: 'Instant AI Support' }, - { icon: Shield, text: 'Student Verified' }, - ].map((badge, i) => ( -
- - {badge.text} -
- ))} - -
-
-
+ {/* Badges */} + + {[ + { icon: CheckCircle, text: 'Official Portal' }, + { icon: Zap, text: 'Instant AI Support' }, + { icon: Shield, text: 'Student Verified' }, + ].map((badge, i) => ( +
+ + {badge.text} +
+ ))} + +
- {/* ─── Stats Section ────────────────────────────────────────────────────── */} -
-
- - {STATS.map((stat, i) => ( - - - - ))} - + {/* Floating Glassmorphic Stats Section */} +
+
+ + + +
+ {[ + { value: '20+', label: 'SPORTS', icon: Trophy }, + { value: '100+', label: 'FACULTY', icon: GraduationCap }, + { value: '18', label: 'CLUBS', icon: Award }, + { value: '24/7', label: 'AI ASSISTANT', icon: Cpu }, + { value: '5000+', label: 'STUDENTS', icon: Users }, + ].map((stat, i) => ( +
+ {/* Icon */} +
+ +
+ {/* Value */} +
+ {stat.value} +
+ {/* Label */} +
+ {stat.label} +
+
+ ))} +
+
{/* ─── Features Section ─────────────────────────────────────────────────── */} -
+
{/* ─── AI Section ───────────────────────────────────────────────────────── */} -
+
{/* Left – Text */} @@ -269,7 +300,7 @@ export default function Home() {
{/* ─── Campus Quick Nav ─────────────────────────────────────────────────── */} -
+
{/* ─── Community Teaser ─────────────────────────────────────────────────── */} -
+
{/* Q&A teaser */}