Skip to content

refactor: refine footer, creators, and universities UI #19

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
nitinmohan18 merged 1 commit into from
Jun 27, 2026
Merged

refactor: refine footer, creators, and universities UI #19

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 6 additions & 6 deletions app/(public)/creators/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,8 @@
Users,
Code2,
Palette,
BrainCircuit,

Check warning on line 12 in app/(public)/creators/page.tsx

View workflow job for this annotation

GitHub Actions / Format · Lint · Typecheck · Build 

'BrainCircuit' is defined but never used
Award,

Check warning on line 13 in app/(public)/creators/page.tsx

View workflow job for this annotation

GitHub Actions / Format · Lint · Typecheck · Build 

'Award' is defined but never used
GraduationCap,
} from "lucide-react";
import { FaGithub, FaLinkedin, FaTwitter, FaInstagram } from "react-icons/fa";
Expand Down Expand Up @@ -138,7 +138,7 @@
className="grid gap-6 md:grid-cols-2 lg:grid-cols-3"
>
{teamMembers.map((member) => {
const Icon = member.icon;

Check warning on line 141 in app/(public)/creators/page.tsx

View workflow job for this annotation

GitHub Actions / Format · Lint · Typecheck · Build 

'Icon' is assigned a value but never used

return (
<motion.div
Expand Down Expand Up @@ -196,7 +196,7 @@
href={member.socials.github}
target="_blank"
rel="noopener noreferrer"
className="rounded-lg p-2 text-muted-foreground transition-all duration-300 ease-out hover:-translate-y-2 hover:bg-white/10 hover:text-white hover:shadow-lg"
className="rounded-lg p-2 text-muted-foreground transition-all duration-300 ease-out hover:-translate-y-[3px] hover:bg-white/10 hover:text-white hover:shadow-md hover:shadow-white/5"
aria-label="GitHub"
>
<FaGithub size={20} />
Expand All @@ -208,7 +208,7 @@
href={member.socials.linkedin}
target="_blank"
rel="noopener noreferrer"
className="rounded-lg p-2 text-muted-foreground transition-all duration-300 ease-out hover:-translate-y-2 hover:bg-[#0A66C2] hover:text-white hover:shadow-lg hover:shadow-[#0A66C2]/30"
className="rounded-lg p-2 text-muted-foreground transition-all duration-300 ease-out hover:-translate-y-[3px] hover:bg-[#0A66C2]/15 hover:text-[#0A66C2] hover:shadow-md hover:shadow-[#0A66C2]/15"
aria-label="LinkedIn"
>
<FaLinkedin size={20} />
Expand All @@ -220,7 +220,7 @@
href={member.socials.twitter}
target="_blank"
rel="noopener noreferrer"
className="rounded-lg p-2 text-muted-foreground transition-all duration-300 ease-out hover:-translate-y-2 hover:bg-black hover:text-white hover:shadow-lg hover:shadow-white/10"
className="rounded-lg p-2 text-muted-foreground transition-all duration-300 ease-out hover:-translate-y-[3px] hover:bg-white/10 hover:text-white hover:shadow-md hover:shadow-white/5"
aria-label="X (Twitter)"
>
<FaTwitter size={20} />
Expand All @@ -232,7 +232,7 @@
href={member.socials.instagram}
target="_blank"
rel="noopener noreferrer"
className="rounded-lg p-2 text-muted-foreground transition-all duration-300 ease-out hover:-translate-y-2 hover:bg-gradient-to-tr hover:from-[#f09433] hover:via-[#dc2743] hover:to-[#bc1888] hover:text-white hover:shadow-lg hover:shadow-[#E1306C]/30"
className="rounded-lg p-2 text-muted-foreground transition-all duration-300 ease-out hover:-translate-y-[3px] hover:bg-[#E1306C]/15 hover:text-[#E1306C] hover:shadow-md hover:shadow-[#E1306C]/15"
aria-label="Instagram"
>
<FaInstagram size={20} />
Expand All @@ -244,7 +244,7 @@
href={member.socials.portfolio}
target="_blank"
rel="noopener noreferrer"
className="rounded-lg p-2 text-muted-foreground transition-all duration-300 ease-out hover:-translate-y-2 hover:bg-[#10B981] hover:text-white hover:shadow-lg hover:shadow-[#10B981]/30"
className="rounded-lg p-2 text-muted-foreground transition-all duration-300 ease-out hover:-translate-y-[3px] hover:bg-[#10B981]/15 hover:text-[#10B981] hover:shadow-md hover:shadow-[#10B981]/15"
aria-label="Portfolio"
>
<Globe className="h-4 w-4" />
Expand All @@ -254,7 +254,7 @@
{member.socials.email && (
<a
href={member.socials.email}
className="rounded-lg p-2 text-muted-foreground transition-all duration-300 ease-out hover:-translate-y-2 hover:bg-[#EA4335] hover:text-white hover:shadow-lg hover:shadow-[#EA4335]/30"
className="rounded-lg p-2 text-muted-foreground transition-all duration-300 ease-out hover:-translate-y-[3px] hover:bg-[#EA4335]/15 hover:text-[#EA4335] hover:shadow-md hover:shadow-[#EA4335]/15"
aria-label="Email"
>
<Mail className="h-4 w-4" />
Expand Down
44 changes: 18 additions & 26 deletions components/footer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import Link from "next/link";
import { Mail, BookOpen, GraduationCap } from "lucide-react";

Check warning on line 2 in components/footer.tsx

View workflow job for this annotation

GitHub Actions / Format · Lint · Typecheck · Build 

'GraduationCap' is defined but never used

Check warning on line 2 in components/footer.tsx

View workflow job for this annotation

GitHub Actions / Format · Lint · Typecheck · Build 

'BookOpen' is defined but never used
import Image from "next/image";

export default function Footer() {
Expand Down Expand Up @@ -41,7 +41,7 @@
<div className="mt-6 flex items-center gap-3">
<a
href="mailto:contact@hyperlearning.tech"
className="group flex h-9 w-9 items-center justify-center rounded-full border border-white/10 bg-white/5 text-white/60 transition-all duration-300 hover:border-[#EA4335] hover:bg-[#EA4335] hover:text-white hover:shadow-[0_0_15px_rgba(234,67,53,0.4)]"
className="group flex h-9 w-9 items-center justify-center rounded-full border border-white/10 bg-white/5 text-white/60 transition-all duration-300 hover:border-[#EA4335]/50 hover:bg-[#EA4335]/10 hover:text-[#EA4335] hover:shadow-[0_0_12px_rgba(234,67,53,0.15)]"
>
<Mail className="h-4 w-4 transition-transform group-hover:scale-110" />
</a>
Expand Down Expand Up @@ -72,10 +72,10 @@

{/* Platform */}
<div>
<h3 className="mb-4 text-xs font-bold uppercase tracking-widest text-white/90">
<h3 className="mb-6 text-[13px] font-bold uppercase tracking-[0.2em] text-white/80">
Platform
</h3>
<ul className="space-y-3">
<ul className="space-y-4">
{["Subjects", "Universities", "Dashboard", "Student Login"].map(
(item, i) => (
<li key={i}>
Expand All @@ -87,10 +87,10 @@
? "/sign-in"
: `/${item.toLowerCase()}`
}
className="group flex w-fit items-center text-[15px] font-medium text-slate-300 transition-all duration-300 hover:text-blue-400 hover:drop-shadow-[0_0_12px_rgba(96,165,250,0.4)]"
className="group relative flex w-fit items-center text-[15px] font-medium text-slate-400 transition-all duration-300 hover:text-white"
>
<span className="relative mr-3 flex h-1.5 w-1.5 items-center justify-center">
<span className="absolute inline-flex h-full w-full rounded-full bg-blue-400 opacity-0 transition-all duration-500 group-hover:animate-ping group-hover:opacity-100" />
<span className="relative mr-3 flex h-1.5 w-1.5 shrink-0 items-center justify-center">
<span className="absolute inline-flex h-full w-full rounded-full bg-blue-400 opacity-0 transition-all duration-500 group-hover:scale-[2.5] group-hover:opacity-20" />
<span className="relative inline-flex h-1.5 w-1.5 rounded-full bg-white/30 transition-colors duration-300 group-hover:bg-blue-400" />
</span>
<span className="transition-transform duration-300 group-hover:translate-x-1">
Expand All @@ -105,30 +105,22 @@

{/* Learning */}
<div>
<h3 className="mb-4 text-xs font-bold uppercase tracking-widest text-white/90">
<h3 className="mb-6 text-[13px] font-bold uppercase tracking-[0.2em] text-white/80">
Learning
</h3>
<ul className="space-y-3">
{[
{ name: "AI Notes", icon: BookOpen },
{ name: "PYQs", icon: GraduationCap },
{ name: "AI Tutor" },
{ name: "Syllabus" },
].map((item, i) => (
<ul className="space-y-4">
{["AI Notes", "PYQs", "AI Tutor", "Syllabus"].map((item, i) => (
<li key={i}>
<Link
href="/rgpv"
className="group flex w-fit items-center text-[15px] font-medium text-slate-300 transition-all duration-300 hover:text-blue-400 hover:drop-shadow-[0_0_12px_rgba(96,165,250,0.4)]"
className="group relative flex w-fit items-center text-[15px] font-medium text-slate-400 transition-all duration-300 hover:text-white"
>
<span className="relative mr-3 flex h-1.5 w-1.5 items-center justify-center">
<span className="absolute inline-flex h-full w-full rounded-full bg-blue-400 opacity-0 transition-all duration-500 group-hover:animate-ping group-hover:opacity-100" />
<span className="relative mr-3 flex h-1.5 w-1.5 shrink-0 items-center justify-center">
<span className="absolute inline-flex h-full w-full rounded-full bg-blue-400 opacity-0 transition-all duration-500 group-hover:scale-[2.5] group-hover:opacity-20" />
<span className="relative inline-flex h-1.5 w-1.5 rounded-full bg-white/30 transition-colors duration-300 group-hover:bg-blue-400" />
</span>
{item.icon && (
<item.icon className="mr-2 h-4 w-4 transition-transform duration-300 group-hover:-translate-y-0.5" />
)}
<span className="transition-transform duration-300 group-hover:translate-x-1">
{item.name}
{item}
</span>
</Link>
</li>
Expand All @@ -138,18 +130,18 @@

{/* Company */}
<div>
<h3 className="mb-4 text-xs font-bold uppercase tracking-widest text-white/90">
<h3 className="mb-6 text-[13px] font-bold uppercase tracking-[0.2em] text-white/80">
Company
</h3>
<ul className="space-y-3">
<ul className="space-y-4">
{["About", "Contact", "Creators", "Privacy"].map((item, i) => (
<li key={i}>
<Link
href={item === "Privacy" ? "/" : `/${item.toLowerCase()}`}
className="group flex w-fit items-center text-[15px] font-medium text-slate-300 transition-all duration-300 hover:text-blue-400 hover:drop-shadow-[0_0_12px_rgba(96,165,250,0.4)]"
className="group relative flex w-fit items-center text-[15px] font-medium text-slate-400 transition-all duration-300 hover:text-white"
>
<span className="relative mr-3 flex h-1.5 w-1.5 items-center justify-center">
<span className="absolute inline-flex h-full w-full rounded-full bg-blue-400 opacity-0 transition-all duration-500 group-hover:animate-ping group-hover:opacity-100" />
<span className="relative mr-3 flex h-1.5 w-1.5 shrink-0 items-center justify-center">
<span className="absolute inline-flex h-full w-full rounded-full bg-blue-400 opacity-0 transition-all duration-500 group-hover:scale-[2.5] group-hover:opacity-20" />
<span className="relative inline-flex h-1.5 w-1.5 rounded-full bg-white/30 transition-colors duration-300 group-hover:bg-blue-400" />
</span>
<span className="transition-transform duration-300 group-hover:translate-x-1">
Expand Down
16 changes: 7 additions & 9 deletions features/landing/universities.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
"use client";

import Link from "next/link";

Check warning on line 3 in features/landing/universities.tsx

View workflow job for this annotation

GitHub Actions / Format · Lint · Typecheck · Build 

'Link' is defined but never used
import { useState } from "react";
import { motion, AnimatePresence } from "framer-motion";
import {
Expand All @@ -8,9 +8,9 @@
ArrowRight,
Sparkles,
Search,
Building2,

Check warning on line 11 in features/landing/universities.tsx

View workflow job for this annotation

GitHub Actions / Format · Lint · Typecheck · Build 

'Building2' is defined but never used
BookOpen,

Check warning on line 12 in features/landing/universities.tsx

View workflow job for this annotation

GitHub Actions / Format · Lint · Typecheck · Build 

'BookOpen' is defined but never used
Clock,

Check warning on line 13 in features/landing/universities.tsx

View workflow job for this annotation

GitHub Actions / Format · Lint · Typecheck · Build 

'Clock' is defined but never used
} from "lucide-react";

const universities = [
Expand Down Expand Up @@ -62,8 +62,7 @@

return (
<section className="relative flex min-h-[115vh] flex-col justify-center overflow-hidden border-none bg-background pt-16 pb-32">
{/* Background Glows & Patterns */}
<div className="absolute inset-0 -z-10 bg-[linear-gradient(to_right,#80808012_1px,transparent_1px),linear-gradient(to_bottom,#80808012_1px,transparent_1px)] bg-[size:24px_24px] [mask-image:radial-gradient(ellipse_60%_50%_at_50%_0%,#000_70%,transparent_100%)]" />
{/* Background Glows */}
<div className="absolute inset-0 -z-10">
<div className="absolute left-[-10%] top-20 h-[500px] w-[500px] rounded-full bg-blue-500/10 blur-[120px]" />
<div className="absolute right-[-10%] bottom-0 h-[500px] w-[500px] rounded-full bg-indigo-500/10 blur-[120px]" />
Expand Down Expand Up @@ -122,10 +121,9 @@
placeholder="Search universities by name, branch, or location..."
className="w-full bg-transparent px-6 py-3 text-base text-foreground placeholder:text-muted-foreground/50 focus:outline-none"
/>
<div className="group/lens relative mr-1 flex h-11 w-11 shrink-0 items-center justify-center rounded-full border border-white/5 bg-white/[0.02] text-white/50 backdrop-blur-2xl transition-all duration-500 hover:scale-110 hover:border-white/20 hover:bg-white/10 hover:text-white hover:shadow-[0_0_30px_rgba(255,255,255,0.15)] cursor-pointer active:scale-95 overflow-hidden">
<div className="group/lens relative mr-1 flex h-11 w-11 shrink-0 items-center justify-center rounded-full border border-white/5 bg-white/[0.02] text-white/50 backdrop-blur-2xl transition-all duration-500 hover:scale-[1.03] hover:border-white/20 hover:bg-white/10 hover:text-white hover:shadow-[0_0_10px_rgba(255,255,255,0.05)] cursor-pointer active:scale-95 overflow-hidden">
<div className="absolute inset-0 rounded-full shadow-[inset_0_1px_1px_rgba(255,255,255,0.4)] pointer-events-none" />
<div className="absolute inset-0 -translate-x-[150%] bg-gradient-to-r from-transparent via-white/20 to-transparent transition-transform duration-700 ease-out group-hover/lens:translate-x-[150%]" />
<Search className="relative z-10 h-[18px] w-[18px] drop-shadow-md transition-transform duration-300 group-hover/lens:scale-110" />
<Search className="relative z-10 h-[18px] w-[18px] drop-shadow-md transition-transform duration-300 group-hover/lens:scale-[1.05]" />
</div>
</div>
</motion.div>
Expand All @@ -147,14 +145,14 @@
animate={{ opacity: 1, scale: 1 }}
exit={{ opacity: 0, scale: 0.9 }}
transition={{ duration: 0.3 }}
className={`group relative flex flex-col overflow-hidden rounded-3xl border border-white/10 bg-gradient-to-b from-white/5 to-transparent p-5 shadow-2xl backdrop-blur-xl transition-all duration-500 hover:-translate-y-2 hover:border-blue-500/30 hover:shadow-blue-500/20 dark:from-white/5 dark:to-transparent ${
className={`group relative flex flex-col overflow-hidden rounded-3xl border border-white/10 bg-gradient-to-b from-white/5 to-transparent p-5 shadow-2xl backdrop-blur-xl transition-all duration-500 hover:-translate-y-[5.5px] hover:border-blue-500/20 hover:shadow-[0_10px_40px_-10px_rgba(59,130,246,0.15)] dark:from-white/5 dark:to-transparent ${
university.status === "Available" ? "cursor-pointer" : ""
}`}
>
<div className="absolute inset-0 rounded-3xl border border-white/5 transition-colors pointer-events-none group-hover:border-blue-500/20" />
<div className="absolute inset-0 rounded-3xl border border-white/5 transition-colors pointer-events-none group-hover:border-blue-500/15" />
{/* Hover Glow */}
<div className="absolute inset-0 opacity-0 transition-opacity duration-500 group-hover:opacity-100">
<div className="absolute -right-10 -top-10 h-40 w-40 rounded-full bg-blue-500/20 blur-3xl dark:bg-blue-500/20" />
<div className="absolute -right-10 -top-10 h-40 w-40 rounded-full bg-blue-500/15 blur-3xl dark:bg-blue-500/15" />
</div>

{/* Badge */}
Expand Down Expand Up @@ -205,7 +203,7 @@

<div className="mt-auto pt-6">
{university.status === "Available" ? (
<div className="group/btn relative flex w-full items-center justify-center gap-2 rounded-xl border border-blue-400/30 bg-gradient-to-r from-blue-600 via-indigo-600 to-blue-700 px-4 py-3.5 text-sm font-bold text-white shadow-[0_0_30px_rgba(37,99,235,0.3)] transition-all duration-500 hover:-translate-y-1 hover:border-blue-400/50 hover:from-blue-500 hover:via-indigo-500 hover:to-blue-600 hover:shadow-[0_0_40px_rgba(37,99,235,0.5)] active:translate-y-0 active:shadow-[0_0_36px_rgba(37,99,235,0.45)] overflow-hidden">
<div className="group/btn relative flex w-full items-center justify-center gap-2 rounded-xl border border-blue-400/30 bg-gradient-to-r from-blue-600 via-indigo-600 to-blue-700 px-4 py-3.5 text-sm font-bold text-white shadow-[0_0_15px_rgba(37,99,235,0.15)] transition-all duration-500 hover:-translate-y-1 hover:border-blue-400/50 hover:from-blue-500 hover:via-indigo-500 hover:to-blue-600 hover:shadow-[0_0_20px_rgba(37,99,235,0.25)] active:translate-y-0 active:shadow-[0_0_15px_rgba(37,99,235,0.2)] overflow-hidden">
<div className="absolute inset-0 rounded-xl shadow-[inset_0_1px_1px_rgba(255,255,255,0.3)] pointer-events-none" />
<span className="relative z-10 flex items-center gap-2">
Explore University
Expand Down
Loading