new colors

app/layouts/dashboard.vue

@@ -8,19 +8,44 @@ const nav : NavigationMenuItem[][] = [[
   to: "/dashboard"
 }, {
   label: 'Notifications',
-  icon: 'i-lucide-inbox',
+  icon: 'solar:chat-round-unread-outline',
   badge: '4',
   to: "/events"
 }, {
   label: 'Settings',
   icon: 'i-lucide-settings',
-  to: '/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"
+  }
+})
 </script>
 <template>
   <UDashboardGroup>
@@ -28,7 +53,7 @@ const nav : NavigationMenuItem[][] = [[
     
     <UDashboardSidebarCollapse />
 
-    <UContainer class="overflow-auto">
+    <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"/>-->