Sidebar is fixed
This commit is contained in:
@@ -14,7 +14,9 @@ export default function Sidebar() {
|
|||||||
const currentItems = mode === "operations" ? OPERATIONS_SIDEBAR_ITEMS : ADMIN_SIDEBAR_ITEMS;
|
const currentItems = mode === "operations" ? OPERATIONS_SIDEBAR_ITEMS : ADMIN_SIDEBAR_ITEMS;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<aside className="fixed bg-[#071321] text-white h-screen w-64 overflow-y-auto [scrollbar-color:#1b2a40_#071321] [scrollbar-width:thin]">
|
<aside className="fixed bg-[#071321] text-white
|
||||||
|
h-screen w-64 overflow-y-auto [scrollbar-color:#1b2a40_#071321]
|
||||||
|
[scrollbar-width:thin]">
|
||||||
{/* App Logo */}
|
{/* App Logo */}
|
||||||
<div className="flex items-center gap-2 px-4 pt-3 pb-3">
|
<div className="flex items-center gap-2 px-4 pt-3 pb-3">
|
||||||
<div className="flex h-9 w-9 items-center justify-center rounded-lg bg-[#3de0c4] font-bold text-[#05111d] text-sm">
|
<div className="flex h-9 w-9 items-center justify-center rounded-lg bg-[#3de0c4] font-bold text-[#05111d] text-sm">
|
||||||
@@ -64,9 +66,12 @@ export default function Sidebar() {
|
|||||||
<SidebarItem key={item.title} item={item} />
|
<SidebarItem key={item.title} item={item} />
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
|
<div className="mt-auto sticky top-200 bottom-5">
|
||||||
|
|
||||||
<div className="m-2 px-2 border border-[#0f1f30] rounded-xl px-4 py-2">
|
|
||||||
<button className="flex w-full items-center gap-2 text-sm text-slate-400 hover:bg-[#091624] hover:text-white transition-colors">
|
<div className="m-2 border border-[#0f1f30] rounded-xl px-4 py-2">
|
||||||
|
<button className="flex w-full items-center gap-2
|
||||||
|
text-sm text-slate-400 hover:bg-[#091624] hover:text-white transition-colors">
|
||||||
<ChevronsLeft size={16} />
|
<ChevronsLeft size={16} />
|
||||||
Minimise menu
|
Minimise menu
|
||||||
</button>
|
</button>
|
||||||
@@ -93,6 +98,8 @@ export default function Sidebar() {
|
|||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</aside>
|
</aside>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user