68 lines
1.3 KiB
Vue
68 lines
1.3 KiB
Vue
<script setup lang="ts">
|
|
import type { NavigationMenuItem } from '@nuxt/ui'
|
|
|
|
const nav : NavigationMenuItem[][] = [[
|
|
{
|
|
label: 'Home',
|
|
icon: 'i-lucide-house',
|
|
to: "/dashboard"
|
|
}, {
|
|
label: 'Notifications',
|
|
icon: 'solar:chat-round-unread-outline',
|
|
badge: '4',
|
|
to: "/events"
|
|
}, {
|
|
label: 'Settings',
|
|
icon: 'i-lucide-settings',
|
|
//to: '/settings',
|
|
children: [
|
|
{
|
|
label: "General",
|
|
icon: "solar:settings-minimalistic-broken",
|
|
to: "/settings",
|
|
},
|
|
{
|
|
label: "Profile",
|
|
icon: "solar:user-broken",
|
|
to: "/settings/profile"
|
|
},
|
|
{
|
|
label: "Theme",
|
|
icon: "solar:pallete-2-broken",
|
|
to: "/settings/theme"
|
|
},
|
|
],
|
|
}]
|
|
];
|
|
/*[
|
|
{
|
|
label: "Feedback"
|
|
}
|
|
]];*/
|
|
|
|
// set color
|
|
/*useHead({
|
|
bodyAttrs: {
|
|
class: "ui-blue"
|
|
}
|
|
})*/
|
|
onMounted(() => {
|
|
ui_color_cookie();
|
|
})
|
|
|
|
</script>
|
|
<template>
|
|
<UDashboardGroup>
|
|
<DashboardSidebar collapsible resizable :items="nav"/>
|
|
|
|
<UDashboardSidebarCollapse />
|
|
|
|
<UContainer class="max-w-full overflow-auto">
|
|
<!-- in my case I want the button to be the same everywhere.
|
|
if you wanna customize it per page, place it per page inside UContainer -->
|
|
<!--<UDashboardSidebarToggle variant="subtle" class="absolute z-20 top-3 left-2.5"/>-->
|
|
<slot />
|
|
</UContainer>
|
|
</UDashboardGroup>
|
|
</template>
|