feat: ui tweaks

app/pages/dashboard.vue

@@ -54,9 +54,9 @@ const deleteLink = async (link: Link) => {
 
 <template>
   <UDashboardGroup>
-    <UDashboardSidebar :toggle="false">
+    <UDashboardSidebar :toggle="false" :ui="{ header: 'border-b border-default' }">
       <template #header>
-        <UDashboardNavbar title="pihka.al" :toggle="false" />
+        <span class="font-semibold text-highlighted text-lg">pihka.al</span>
       </template>
 
       <UNavigationMenu
@@ -88,9 +88,7 @@ const deleteLink = async (link: Link) => {
         class="px-2"
       />
       <template #footer>
-        <UButton variant="ghost" icon="i-lucide-log-out" block @click="signOut">
-          Sign out
-        </UButton>
+        <UButton variant="link" icon="i-lucide-log-out" block @click="signOut">Sign out</UButton>
       </template>
     </UDashboardSidebar>
 
@@ -98,9 +96,7 @@ const deleteLink = async (link: Link) => {
       <template #header>
         <UDashboardNavbar :title="category === 'all' ? 'All links' : category === 'active' ? 'Active links' : 'Disabled links'">
           <template #right>
-            <UButton icon="i-lucide-plus" @click="openModal(null)">
-              New link
-            </UButton>
+            <UButton icon="i-lucide-plus" variant="subtle" @click="openModal(null)">New link</UButton>
           </template>
         </UDashboardNavbar>
       </template>