Login and dashboard added
This commit is contained in:
73
components/dashboard/sidebar.tsx
Normal file
73
components/dashboard/sidebar.tsx
Normal file
@@ -0,0 +1,73 @@
|
||||
import { SIDEBAR_ITEMS } from "@/constants/constant";
|
||||
import SidebarItem from "./sideBarItem";
|
||||
import {
|
||||
|
||||
ShieldCheck,
|
||||
|
||||
Activity,
|
||||
ChevronDown,
|
||||
ChevronsLeft,
|
||||
|
||||
|
||||
} from "lucide-react";
|
||||
|
||||
export default function Sidebar() {
|
||||
return (
|
||||
<aside className="w-80 bg-[#071321] text-white h-screen overflow-y-auto">
|
||||
<div className="flex items-center gap-2.5 px-4 pt-4 pb-3">
|
||||
<div className="flex h-9 w-9 items-center justify-center rounded-lg bg-[#3de0c4] font-bold text-[#05111d] text-lg">
|
||||
K
|
||||
</div>
|
||||
<span className="text-xl font-bold tracking-tight text-white">
|
||||
KA<span className="text-[#3de0c4]">FM</span>
|
||||
</span>
|
||||
</div>
|
||||
<div className="mx-3 my-2 flex rounded-xl bg-[#091624] p-1 border border-[#142538]">
|
||||
<button className="flex flex-1 items-center justify-center gap-1.5 rounded-lg bg-[#3de0c4] py-1.5 text-xs text-black font-semibold shadow-sm">
|
||||
<Activity size={14} />
|
||||
Operations
|
||||
</button>
|
||||
<button className="flex flex-1 items-center justify-center gap-1.5 rounded-lg py-1.5 text-xs text-slate-400 font-medium hover:text-white transition-colors">
|
||||
<ShieldCheck size={14} />
|
||||
Admin
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<p className="px-4 pt-2 pb-1 text-xs font-semibold uppercase tracking-wider text-slate-500">
|
||||
Tenant runtime
|
||||
</p>
|
||||
<div className="py-4">
|
||||
{SIDEBAR_ITEMS.map((item) => (
|
||||
<SidebarItem
|
||||
key={item.title}
|
||||
item={item}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
<div className="px-3 pb-2 pt-1 border-t border-[#0f1f30]">
|
||||
<button className="flex w-full items-center gap-2 rounded-xl py-2 px-3 text-xs text-slate-400 hover:bg-[#091624] hover:text-white transition-colors">
|
||||
<ChevronsLeft size={16} />
|
||||
Minimise menu
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{/* Profile Card Section */}
|
||||
<div className="m-3 mt-0 rounded-xl border border-[#142538] bg-[#071321] p-2.5">
|
||||
<div className="flex items-center justify-between">
|
||||
<div className="flex gap-2.5 items-center">
|
||||
<div className="flex h-9 w-9 shrink-0 items-center justify-center rounded-lg border border-cyan-600/50 bg-[#0d2430] text-cyan-400 text-xs font-bold">
|
||||
DT
|
||||
</div>
|
||||
<div className="min-w-0 leading-tight">
|
||||
<h4 className="font-semibold text-xs text-white truncate">Dhananjay T</h4>
|
||||
<p className="text-[11px] text-slate-500 truncate">
|
||||
dhananjay@kafm.io
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<ChevronDown className="-rotate-90 text-slate-500 shrink-0" size={14} />
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user