Fascinated/scoresaber-reloadedv3
Archived
1
1
Fork 0
Code Issues 1 Pull Requests 2 Actions Packages Activity

fix navbar buttons
Some checks failed
Deploy / deploy (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Lee 2024-09-27 19:49:08 +01:00
parent ddfbe7e67b
commit ed61d8c8e6
2 changed files with 13 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/components/navbar/navbar.tsx
View File

@ -33,6 +33,8 @@ const renderNavbarItem = (item: NavbarItem) => (
);
export default function Navbar() {
const rightItem = items[items.length - 1];
return (
<div className="w-full sticky top-0 z-[999]">
<div className="h-10 items-center flex justify-between bg-secondary/95">
@ -41,18 +43,16 @@ export default function Navbar() {
<ProfileButton />
{items.slice(0, -1).map((item, index) => (
<NavbarButton key={index}>
<Link href={item.link}>{renderNavbarItem(item)}</Link>
</NavbarButton>
<Link href={item.link} key={index} className="h-full">
<NavbarButton key={index}>{renderNavbarItem(item)}</NavbarButton>
</Link>
))}
</div>
{/* Right-aligned item */}
<NavbarButton>
<Link href={items[items.length - 1].link}>
{renderNavbarItem(items[items.length - 1])}
</Link>
</NavbarButton>
<Link href={rightItem.link} className="h-full">
<NavbarButton>{renderNavbarItem(rightItem)}</NavbarButton>
</Link>
</div>
</div>
);

16
src/components/navbar/profile-button.tsx
View File

@ -19,19 +19,13 @@ export default function ProfileButton() {
}
return (
<NavbarButton>
<Link
href={`/player/${settings.playerId}`}
className="flex items-center gap-2"
>
<Link href={`/player/${settings.playerId}`} className="flex items-center gap-2 h-full">
<NavbarButton>
<Avatar className="w-6 h-6">
<AvatarImage
alt="Profile Picture"
src={`https://cdn.scoresaber.com/avatars/${settings.playerId}.jpg`}
/>
<AvatarImage alt="Profile Picture" src={`https://cdn.scoresaber.com/avatars/${settings.playerId}.jpg`} />
</Avatar>
<p>You</p>
</Link>
</NavbarButton>
</NavbarButton>
</Link>
);
}