UHeader added

app/pages/dashboard.vue

@@ -122,15 +122,16 @@ import { h } from 'vue'
 </script>
 
 <template>
-  <!-- overflow-auto necessary for scroll-->
-  <UContainer class="overflow-auto">
-    
-    <UDashboardSidebarToggle variant="subtle" class="absolute z-20 top-3 left-2.5"/>
-
-    <div class="mt-1 mb-3 flex flex-col w-full relative z-0">
+    <UHeader title="Dashboard" toggle-side="left" >
+      <template #toggle>
+        <UDashboardSidebarToggle />
+        <UDashboardSidebarToggle />
+      </template>
+    </UHeader>
+    <div class="mt-3 mb-3 flex flex-col w-full relative z-0">
       <ProseH2 class="text-center m-0.5 w-full">Hey there, user!</ProseH2>
       <ProseP class="text-center text-muted m-0.5">Welcome to the UI!</ProseP>
-      <UBadge variant="subtle" class="inline mx-auto">It's cool, isn't it ?</UBadge> 
+      <UBadge variant="subtle" color="success" class="inline mx-auto">It's cool, isn't it ?</UBadge>
     </div>
     
     <!--<div class="mx-auto max-w-220">-->
@@ -152,7 +153,6 @@ import { h } from 'vue'
     <UFooter>
       <p>footer</p>
     </UFooter>
-  </UContainer>
 </template>
 
 <style scoped>