dylan/gander
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

UPDATE: Lucide React Icon and Animation for Theme

Browse Source
This commit is contained in:
EvanLin3141
2025-02-05 14:45:24 +00:00
parent 1740b5d921
commit 2c65606efe
4 changed files with 54 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
frontend/src/components/Layout/Navbar.tsx
View File

@@ -73,17 +73,22 @@ const Navbar: React.FC<NavbarProps> = ({
{isLoggedIn && (
<>
<Button onClick={() => handleSideBar()}
extraClasses={`absolute ${
showSideBar ? `fixed top-[20px] left-[20px] p-2 text-[1.5rem] text-white hover:text-white
<Button onClick={() => handleSideBar()}
extraClasses={`absolute ${showSideBar ? `fixed top-[20px] left-[20px] p-2 text-[1.5rem] text-white hover:text-white
bg-black/30 hover:bg-purple-500/80 rounded-md border border-gray-300 hover:border-white h
over:border-b-4 hover:border-l-4 active:border-b-2 active:border-l-2 transition-all ` :
"top-[75px] left-[20px]"
} transition-all duration-300 z-[99]`}
>
over:border-b-4 hover:border-l-4 active:border-b-2 active:border-l-2 transition-all ` :
"top-[75px] left-[20px]"
} transition-all duration-300 z-[99]`}
>
<SidebarIcon className="h-15 w-15 mr-1 z-[90]" />
</Button>
{showSideBar && <Sidebar scrollActiveSideBar={showSideBar} />}
<div
className={`fixed top-0 left-0 w-[250px] h-screen bg-[var(--sideBar-LightBG)] text-[var(--sideBar-LightText)] z-[90] overflow-y-auto scrollbar-hide
transition-transform transition-opacity duration-500 ease-in-out ${showSideBar ? "translate-x-0 opacity-100" : "-translate-x-full opacity-0"
}`}
>
<Sidebar />
</div>
</>
)}