Skip to content

Commit 71b82f0

Browse files
quiteboringquiteboring
authored
Merge pull request #3 from Kobe0103/master
2 parents be0743b + 550a686 commit 71b82f0

2 files changed

Lines changed: 74 additions & 14 deletions

File tree

‎app/page.tsx‎

Lines changed: 17 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -28,12 +28,23 @@ export default function Home() {
2828
</div>
2929
</div>
3030

31-
<Button variant="outline" size={"sm"} asChild>
32-
<Link href="/faq">
33-
Learn More<ChevronRight/>
34-
</Link>
35-
</Button>
31+
<div className="flex gap-2 pt-2">
32+
<Button variant="outline" size="sm" asChild>
33+
<Link href="/faq">
34+
Learn More <ChevronRight />
35+
</Link>
36+
</Button>
37+
<Button variant="outline" size="sm" asChild>
38+
<Link
39+
href="https://github.com/CobaltScripts/Cobalt/releases"
40+
target="_blank"
41+
rel="noopener noreferrer"
42+
>
43+
Download now <ChevronRight />
44+
</Link>
45+
</Button>
46+
</div>
3647
</div>
3748
</main>
3849
);
39-
}
50+
}

‎components/Navbar.tsx‎

Lines changed: 57 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
'use client';
22

33
import Link from 'next/link';
4+
import { usePathname } from 'next/navigation';
45
import { FaDiscord, FaGithub } from 'react-icons/fa';
56
import { Menu } from 'lucide-react';
67
import { Button } from '@/components/ui/button';
@@ -11,6 +12,11 @@ import {
1112
} from '@/components/ui/sheet';
1213

1314
export default function Navbar() {
15+
const pathname = usePathname();
16+
17+
const isActive = (href: string) =>
18+
pathname === href || pathname.startsWith(`${href}/`);
19+
1420
return (
1521
<nav className="sticky top-0 z-50 w-full border-b border-white/10 bg-[var(--background)]/80 backdrop-blur-md select-none">
1622
<div className="mx-auto flex h-16 max-w-7xl items-center justify-between px-6">
@@ -19,38 +25,57 @@ export default function Navbar() {
1925
cobalt.
2026
</Link>
2127

28+
{/* Desktop Nav */}
2229
<div className="hidden md:flex items-center gap-6">
2330
<Link
2431
href="/"
25-
className="text-xs font-semibold transition-colors hover:text-[#347BB2]"
32+
className={`text-xs font-semibold transition-colors ${
33+
isActive('/')
34+
? 'text-[#347BB2]'
35+
: 'hover:text-[#347BB2]'
36+
}`}
2637
>
2738
Home
2839
</Link>
2940
<Link
3041
href="/faq"
31-
className="text-xs font-semibold transition-colors hover:text-[#347BB2]"
42+
className={`text-xs font-semibold transition-colors ${
43+
isActive('/faq')
44+
? 'text-[#347BB2]'
45+
: 'hover:text-[#347BB2]'
46+
}`}
3247
>
3348
FAQ
3449
</Link>
3550
<Link
3651
href="/about"
37-
className="text-xs font-semibold transition-colors hover:text-[#347BB2]"
52+
className={`text-xs font-semibold transition-colors ${
53+
isActive('/about')
54+
? 'text-[#347BB2]'
55+
: 'hover:text-[#347BB2]'
56+
}`}
3857
>
3958
About
4059
</Link>
4160
<Link
4261
href="/verify"
43-
className="text-xs font-semibold transition-colors hover:text-[#347BB2]"
62+
className={`text-xs font-semibold transition-colors ${
63+
isActive('/verify')
64+
? 'text-[#347BB2]'
65+
: 'hover:text-[#347BB2]'
66+
}`}
4467
>
4568
Verify
4669
</Link>
4770
</div>
4871
</div>
4972

73+
{/* Desktop Socials */}
5074
<div className="hidden md:flex items-center gap-4">
5175
<Link
5276
href="https://discord.gg/GAhS8UfDyy"
5377
target="_blank"
78+
rel="noopener noreferrer"
5479
className="text-[#B4B4B4] transition-colors hover:text-[#F8F9FA]"
5580
>
5681
<FaDiscord size={20} />
@@ -59,63 +84,87 @@ export default function Navbar() {
5984
<Link
6085
href="https://github.com/CobaltScripts"
6186
target="_blank"
87+
rel="noopener noreferrer"
6288
className="text-[#B4B4B4] transition-colors hover:text-[#F8F9FA]"
6389
>
6490
<FaGithub size={20} />
6591
</Link>
6692
</div>
6793

94+
{/* Mobile Menu */}
6895
<Sheet>
6996
<SheetTrigger asChild className="md:hidden">
7097
<Button variant="ghost" size="icon">
7198
<Menu className="h-5 w-5" />
7299
</Button>
73100
</SheetTrigger>
101+
74102
<SheetContent side="right" className="w-64">
75103
<div className="flex flex-col gap-8 p-4">
76104
<div className="flex flex-col gap-3">
77105
<span className="text-xs font-medium text-muted-foreground uppercase tracking-wider">
78106
Main
79107
</span>
108+
80109
<Link
81110
href="/"
82-
className="text-sm font-semibold transition-colors hover:text-[#347BB2]"
111+
className={`text-sm font-semibold transition-colors ${
112+
isActive('/')
113+
? 'text-[#347BB2]'
114+
: 'hover:text-[#347BB2]'
115+
}`}
83116
>
84117
Home
85118
</Link>
86119
<Link
87120
href="/faq"
88-
className="text-sm font-semibold transition-colors hover:text-[#347BB2]"
121+
className={`text-sm font-semibold transition-colors ${
122+
isActive('/faq')
123+
? 'text-[#347BB2]'
124+
: 'hover:text-[#347BB2]'
125+
}`}
89126
>
90127
FAQ
91128
</Link>
92129
<Link
93130
href="/about"
94-
className="text-sm font-semibold transition-colors hover:text-[#347BB2]"
131+
className={`text-sm font-semibold transition-colors ${
132+
isActive('/about')
133+
? 'text-[#347BB2]'
134+
: 'hover:text-[#347BB2]'
135+
}`}
95136
>
96137
About
97138
</Link>
98139
<Link
99140
href="/verify"
100-
className="text-sm font-semibold transition-colors hover:text-[#347BB2]"
141+
className={`text-sm font-semibold transition-colors ${
142+
isActive('/verify')
143+
? 'text-[#347BB2]'
144+
: 'hover:text-[#347BB2]'
145+
}`}
101146
>
102147
Verify
103148
</Link>
104149
</div>
150+
105151
<div className="flex flex-col gap-3">
106152
<span className="text-xs font-medium text-muted-foreground uppercase tracking-wider">
107153
Socials
108154
</span>
155+
109156
<Link
110157
href="https://discord.gg/GAhS8UfDyy"
111158
target="_blank"
159+
rel="noopener noreferrer"
112160
className="text-sm font-semibold transition-colors hover:text-[#347BB2]"
113161
>
114162
Discord
115163
</Link>
116164
<Link
117165
href="https://github.com/CobaltScripts"
118166
target="_blank"
167+
rel="noopener noreferrer"
119168
className="text-sm font-semibold transition-colors hover:text-[#347BB2]"
120169
>
121170
GitHub

0 commit comments

Comments
 (0)