franpcode/create-better-t-stack
1
0
Fork 0
mirror of https://github.com/FranP-code/create-better-t-stack.git synced 2025-10-12 23:52:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

center the navbar links

Browse Source
This commit is contained in:
fgrreloaded
2025-03-02 13:16:53 +05:30
parent b3ae7e280b
commit 0d1a5c6a53
1 changed files with 73 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
apps/web/src/app/(home)/_components/Navbar.tsx
View File

@@ -41,7 +41,7 @@ const Navbar = () => {
return ( return (
<nav <nav
className={`fixed top-0 right-0 z-[100] w-screen px-8 py-5 flex items-center sm:justify-between justify-center transition-all duration-300 ${ className={`fixed top-0 right-0 z-[100] w-screen px-8 py-5 grid grid-cols-1 md:grid-cols-3 items-center transition-all duration-300 ${
scrolled scrolled
? "bg-transparent border-transparent" ? "bg-transparent border-transparent"
: "sm:bg-black/40 sm:backdrop-blur-xl sm:border-b border-blue-500/20" : "sm:bg-black/40 sm:backdrop-blur-xl sm:border-b border-blue-500/20"
@@ -62,6 +62,7 @@ const Navbar = () => {
</span> </span>
</div> </div>
<div className="flex justify-center">
<div <div
className={`flex items-center backdrop-blur-md bg-black/40 rounded-md border border-blue-500/30 py-1 px-1.5 text-sm relative transition-all duration-500 ease-out ${ className={`flex items-center backdrop-blur-md bg-black/40 rounded-md border border-blue-500/30 py-1 px-1.5 text-sm relative transition-all duration-500 ease-out ${
scrolled ? "w-[420px]" : "sm:w-[280px] w-[350px]" scrolled ? "w-[420px]" : "sm:w-[280px] w-[350px]"
@@ -135,9 +136,10 @@ const Navbar = () => {
documentation documentation
</Link> </Link>
</div> </div>
</div>
<div <div
className={`transition-opacity duration-300 ${ className={`flex justify-end transition-opacity duration-300 ${
scrolled ? "opacity-0 pointer-events-none" : "opacity-100" scrolled ? "opacity-0 pointer-events-none" : "opacity-100"
}`} }`}
> >