From e8a3f7cae8e65597f137499f80a12684c898df45 Mon Sep 17 00:00:00 2001 From: nitin mohan Date: Mon, 29 Jun 2026 02:33:47 +0530 Subject: [PATCH 1/2] feat: improve hero layout, light theme styling, and visual polish --- app/globals.css | 2 +- app/layout.tsx | 6 +- components/footer.tsx | 12 ++ components/navbar.tsx | 43 ++--- features/landing/hero.tsx | 301 ++++++++++++++++++------------ features/landing/universities.tsx | 23 ++- 6 files changed, 235 insertions(+), 152 deletions(-) diff --git a/app/globals.css b/app/globals.css index c9ceb44..526371d 100644 --- a/app/globals.css +++ b/app/globals.css @@ -1,5 +1,5 @@ @import "tailwindcss"; -@custom-variant dark (&:is(.dark *)); +@custom-variant dark (&:where(.dark, .dark *)); @layer base { :root { diff --git a/app/layout.tsx b/app/layout.tsx index fb52ddd..4ecf05a 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -107,12 +107,12 @@ export default function RootLayout({ children: React.ReactNode; }) { return ( - + + {/* Light Mode Premium Dot Matrix Background */} +
+ + {/* Light Mode Bottom Radial Glow */} +
+ {/* Premium ambient light effect at the top */}
diff --git a/components/navbar.tsx b/components/navbar.tsx index 6a3ff2f..4ff3fc9 100644 --- a/components/navbar.tsx +++ b/components/navbar.tsx @@ -30,8 +30,9 @@ const navLinks = [ export default function Navbar() { const [isOpen, setIsOpen] = useState(false); const [scrolled, setScrolled] = useState(false); - const { theme, setTheme } = useTheme(); + const { theme, resolvedTheme, setTheme } = useTheme(); const [mounted, setMounted] = useState(false); + const currentTheme = mounted ? resolvedTheme : theme; const router = useRouter(); const pathname = usePathname(); const [activeSection, setActiveSection] = useState("/#Home"); @@ -119,7 +120,7 @@ export default function Navbar() { return (
-
+
Hyper Learning Official Logo
- + Hyper Learning -

+

AI-Powered Learning Platform

@@ -169,14 +170,14 @@ export default function Navbar() { onClick={(e) => handleNavClick(e, link.href)} className={`group relative px-4 py-2 text-[14.5px] tracking-[0.01em] transition-colors duration-200 rounded-full focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500/50 ${ isActive - ? "text-foreground font-semibold dark:text-white" - : "text-muted-foreground font-medium hover:text-foreground dark:text-slate-300 dark:hover:text-white" + ? "text-white font-semibold" + : "text-slate-300 font-medium hover:text-white" }`} > {isActive && ( {mounted && ( @@ -232,7 +233,7 @@ export default function Navbar() { Sign In @@ -251,7 +252,7 @@ export default function Navbar() { aria-expanded={isOpen} aria-controls="mobile-menu" aria-label={isOpen ? "Close menu" : "Open menu"} - className="rounded-xl p-2 text-foreground dark:text-white transition-colors hover:bg-black/5 dark:hover:bg-white/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[#1D4ED8]/50 dark:focus-visible:ring-white/50 md:hidden" + className="rounded-xl p-2 text-white transition-colors hover:bg-white/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[#1D4ED8]/50 dark:focus-visible:ring-white/50 md:hidden" > {isOpen ? : } @@ -300,7 +301,7 @@ export default function Navbar() {
- - + +
Topic-wise PYQs @@ -204,13 +221,13 @@ export default function Hero() { {/* Divider */} - - - {/* Stats row */} + className="mt-2 h-[1px] w-full bg-[linear-gradient(90deg,transparent,rgba(0,0,0,0.03)_20%,rgba(0,0,0,0.03)_80%,transparent)] dark:bg-[linear-gradient(90deg,transparent,rgba(255,255,255,0.06)_20%,rgba(255,255,255,0.06)_80%,transparent)]" + /> + + {/* Stats row */} +
@@ -256,7 +273,10 @@ export default function Hero() { {/* Chat Header */}
- +
@@ -284,7 +304,10 @@ export default function Hero() {
- +
Hyper AI @@ -322,24 +345,39 @@ export default function Hero() {
- - Dec 2025 — Q1(b) + + + Dec 2025 — Q1(b) +
- - Jun 2025 — Q3(a) + + + Jun 2025 — Q3(a) +
- - Dec 2024 — Q2 + + + Dec 2024 — Q2 +
diff --git a/features/landing/universities.tsx b/features/landing/universities.tsx index 9c7a2aa..ef5d367 100644 --- a/features/landing/universities.tsx +++ b/features/landing/universities.tsx @@ -56,16 +56,16 @@ export default function Universities() { {/* Background Layers */}
{/* Light Mode Wavy Refraction Background (Inverted) */} -