selimaj-dev/klayrion
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ui update

Browse Source
This commit is contained in:
selimaj-dev
2025-02-17 16:06:11 +01:00
parent c58ba460d5
commit 9684a18046
3 changed files with 30 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/app.tsx
+28 -15
View File
@@ -8,6 +8,7 @@ import {
SidebarMenu,
SidebarMenuItem,
SidebarMenuButton,
SidebarFooter,
} from '@/components/ui/sidebar';
import { Calendar, LayoutDashboardIcon, Settings } from 'lucide-react';
@@ -25,6 +26,9 @@ const items = [
url: '/calendar',
icon: Calendar,
},
];
const footer = [
{
title: 'Settings',
url: '/settings',
@@ -35,9 +39,9 @@ const items = [
export default function App({ children }: { children?: any }) {
return (
<div className="flex w-full">
<div>
<div className='md:w-28'>
<SidebarProvider>
<Sidebar>
<Sidebar className="w-28">
<SidebarContent>
<SidebarGroup>
<SidebarGroupLabel>
@@ -45,25 +49,34 @@ export default function App({ children }: { children?: any }) {
</SidebarGroupLabel>
<SidebarGroupContent>
<SidebarMenu>
{items.map((item) => (
<SidebarMenuItem key={item.title}>
<SidebarMenuButton asChild>
<Link
href={item.url}
className="font-semibold"
>
<item.icon />
<span>
{item.title}
</span>
</Link>
</SidebarMenuButton>
{items.map((item, i) => (
<SidebarMenuItem
key={i}
className="w-16 mx-auto"
>
<Link href={item.url}>
<item.icon className="!size-full p-4 hover:bg-foreground hover:text-background rounded-2xl" />
</Link>
</SidebarMenuItem>
))}
</SidebarMenu>
</SidebarGroupContent>
</SidebarGroup>
</SidebarContent>
<SidebarFooter className='mb-4'>
<SidebarMenu>
{footer.map((item, i) => (
<SidebarMenuItem
key={i}
className="w-16 mx-auto"
>
<Link href={item.url}>
<item.icon className="!size-full p-4 hover:bg-foreground hover:text-background rounded-2xl" />
</Link>
</SidebarMenuItem>
))}
</SidebarMenu>
</SidebarFooter>
</Sidebar>
</SidebarProvider>
</div>