Improved hero
This commit is contained in:
@@ -7,12 +7,13 @@ const Navbar = () => {
|
||||
<div className="container mx-auto px-6">
|
||||
<div className="flex h-16 items-center justify-between">
|
||||
{/* Logo */}
|
||||
<Link
|
||||
href="/"
|
||||
className="flex items-center gap-2 group"
|
||||
>
|
||||
<Link href="/" className="flex items-center gap-2 group">
|
||||
<div className="relative">
|
||||
<img alt="Logo" src="/dev-run.svg" className="h-8 w-8 text-primary transition-transform duration-300 group-hover:scale-110" />
|
||||
<img
|
||||
alt="Logo"
|
||||
src="/dev-run.svg"
|
||||
className="h-8 w-8 text-primary transition-transform duration-300 group-hover:scale-110"
|
||||
/>
|
||||
<div className="absolute inset-0 bg-primary/30 blur-xl opacity-0 group-hover:opacity-100 transition-opacity duration-300" />
|
||||
</div>
|
||||
<span className="text-xl font-bold text-foreground">
|
||||
@@ -22,19 +23,31 @@ const Navbar = () => {
|
||||
|
||||
{/* Navigation Links */}
|
||||
<div className="hidden md:flex items-center gap-1">
|
||||
<Link href="/problems" className="flex items-center gap-2 px-4 py-2 rounded-lg text-sm font-medium transition-all duration-300 text-muted-foreground hover:text-foreground hover:bg-secondary">
|
||||
<Link
|
||||
href="/problems"
|
||||
className="flex items-center gap-2 px-4 py-2 rounded-lg text-sm font-medium transition-all duration-300 text-muted-foreground hover:text-foreground hover:bg-secondary"
|
||||
>
|
||||
<Zap className="h-4 w-4" />
|
||||
Problems
|
||||
</Link>
|
||||
<Link href="/run" className="flex items-center gap-2 px-4 py-2 rounded-lg text-sm font-medium transition-all duration-300 text-muted-foreground hover:text-foreground hover:bg-secondary">
|
||||
<Link
|
||||
href="/run"
|
||||
className="flex items-center gap-2 px-4 py-2 rounded-lg text-sm font-medium transition-all duration-300 text-muted-foreground hover:text-foreground hover:bg-secondary"
|
||||
>
|
||||
<Timer className="h-4 w-4" />
|
||||
Run
|
||||
</Link>
|
||||
<Link href="/leaderboards" className="flex items-center gap-2 px-4 py-2 rounded-lg text-sm font-medium transition-all duration-300 text-muted-foreground hover:text-foreground hover:bg-secondary">
|
||||
<Link
|
||||
href="/leaderboards"
|
||||
className="flex items-center gap-2 px-4 py-2 rounded-lg text-sm font-medium transition-all duration-300 text-muted-foreground hover:text-foreground hover:bg-secondary"
|
||||
>
|
||||
<Trophy className="h-4 w-4" />
|
||||
Leaderboards
|
||||
</Link>
|
||||
<Link href="/profile" className="flex items-center gap-2 px-4 py-2 rounded-lg text-sm font-medium transition-all duration-300 text-muted-foreground hover:text-foreground hover:bg-secondary">
|
||||
<Link
|
||||
href="/profile"
|
||||
className="flex items-center gap-2 px-4 py-2 rounded-lg text-sm font-medium transition-all duration-300 text-muted-foreground hover:text-foreground hover:bg-secondary"
|
||||
>
|
||||
<User className="h-4 w-4" />
|
||||
Profile
|
||||
</Link>
|
||||
@@ -48,8 +61,18 @@ const Navbar = () => {
|
||||
|
||||
{/* Mobile menu button */}
|
||||
<button className="md:hidden p-2 text-muted-foreground hover:text-foreground">
|
||||
<svg className="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M4 6h16M4 12h16M4 18h16" />
|
||||
<svg
|
||||
className="h-6 w-6"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor"
|
||||
>
|
||||
<path
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth={2}
|
||||
d="M4 6h16M4 12h16M4 18h16"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user