Fix logout button UI

src/App.vue

@@ -54,24 +54,22 @@ Dark.set(true)
 
 <template>
   <q-layout view="hHr LpR fFf">
-    <q-header elevated class="bg-primary text-white" >
+    <q-header elevated class="bg-primary text-white">
       <q-toolbar>
         <q-toolbar-title>
           <q-avatar size="50px">
             <img src="./assets/l2.svg" />
           </q-avatar>
-          <span style="font-family: 'Cinzel Decorative', cursive;">
+          <span style="font-family: 'Cinzel Decorative', cursive;">Crystal Math Worktable</span>
-            Crystal Math Worktable
-          </span>
-          <q-btn icon="fa-solid fa-arrow-up-left-from-circle" v-if="status" @click="logout()" label="Logout" />
         </q-toolbar-title>
+        <q-btn v-if="status" @click="logout()" label="Logout"></q-btn>
       </q-toolbar>
 
       <!-- <q-tabs>
           <q-route-tab to="/Scratch" label="Scratch" />
           <q-route-tab to="/Editor" label="Editor" />
           <q-tab v-if="status" @click="logout()" label="Logout" />
-        </q-tabs> -->
+      </q-tabs>-->
     </q-header>
 
     <q-page-container style="display: flex;padding-top: 0px;">
@@ -93,6 +91,4 @@ Dark.set(true)
 .titleBar {
   font-family: "Cinzel Decorative";
 }
-
-
 </style>

src/pages/Editor.vue

@@ -429,7 +429,7 @@ onMounted(() => {
           </span>
         </q-toolbar-title>
 
-        <span v-if="status" @click="logout()" label="Logout">Logout</span>
+        <q-btn v-if="status" @click="logout()" label="Logout"></q-btn>
       </q-toolbar>
     </q-header>