fix

src/components/ProjectMenu.vue

@@ -31,11 +31,11 @@ onMounted(async () => {
 </script>
 
 <template>
-  <div v-if="projects.length" class="d-flex align-center ga-2">
+  <div v-if="projects.length" class="d-flex align-center">
     <div>Project:</div>
     <v-menu>
       <template v-slot:activator="{ props }">
-        <v-btn density="comfortable" v-bind="props">
+        <v-btn density="comfortable" v-bind="props" slim>
           <label-text :label="current?.key" :text="currentProjectName" />
         </v-btn>
       </template>

src/layouts/DefaultLayout.vue

@@ -90,18 +90,17 @@ const goToSettings = () => {
       </template>
       <v-divider class="mx-1" vertical />
       <v-app-bar-title>
-        <div class="d-flex ga-2 align-center">
         <router-link class="text-decoration-none text-link font-weight-bold" to="/">
           {{ title }}
         </router-link>
-          <span>v{{ version }}</span>
-
-          <project-menu v-if="session.data" />
-        </div>
       </v-app-bar-title>
 
+      <project-menu v-if="session.data" />
+
+      <v-divider class="mx-2" vertical />
+
       <div class="d-flex ga-4 align-center" v-if="session.data">
-        <div class="mr-2">
+        <div class="">
           Hello,
           <router-link class="text-decoration-none text-link text-capitalize" to="/profile">
             {{ session?.data.user.name }}
@@ -113,11 +112,11 @@ const goToSettings = () => {
         <v-btn @click="goToSignUp">Sign Up</v-btn>
       </div>
 
-      <v-divider class="mx-1" vertical />
+      <v-divider class="mx-2" vertical />
       <v-btn icon="mdi-brightness-6" density="comfortable" @click="toggleTheme" />
+      <v-divider class="mx-2" vertical />
 
       <div v-if="session.data">
-        <v-divider class="mx-1" vertical />
         <v-menu>
           <template v-slot:activator="{ props }">
             <v-btn density="comfortable" class="mr-1" icon v-bind="props">