Initial bug fixes (#127)

* Initial bug fixes

* fix compile error on non-mac

* Fix even more bugs

* Fix more

* fix more

* fix build

* fix build

* address review comments

theseus_gui/src/components/ui/AccountsCard.vue

@@ -10,7 +10,7 @@
       <div class="text no-select">
         {{ selectedAccount ? selectedAccount.username : 'Offline' }}
       </div>
-      <p class="no-select">
+      <p class="accounts-text no-select">
         <UsersIcon />
         Accounts
       </p>
@@ -24,13 +24,13 @@
           <h4>{{ selectedAccount.username }}</h4>
           <p>Selected</p>
         </div>
-        <Button icon-only color="raised" @click="logout(selectedAccount.id)">
+        <Button v-tooltip="'Log out'" icon-only color="raised" @click="logout(selectedAccount.id)">
           <XIcon />
         </Button>
       </div>
       <div v-else class="logged-out account">
         <h4>Not signed in</h4>
-        <Button icon-only color="primary" @click="login()">
+        <Button v-tooltip="'Log in'" icon-only color="primary" @click="login()">
           <LogInIcon />
         </Button>
       </div>
@@ -40,7 +40,7 @@
             <Avatar :src="account.profile_picture" class="icon" />
             <p>{{ account.username }}</p>
           </Button>
-          <Button icon-only @click="logout(account.id)">
+          <Button v-tooltip="'Log out'" icon-only @click="logout(account.id)">
             <XIcon />
           </Button>
         </div>
@@ -79,7 +79,7 @@ const appendProfiles = (accounts) => {
   return accounts.map((account) => {
     return {
       ...account,
-      profile_picture: `https://crafthead.net/helm/${account.id.replace(/-/g, '')}/128`,
+      profile_picture: `https://mc-heads.net/avatar/${account.id}/128`,
     }
   })
 }
@@ -187,6 +187,11 @@ onBeforeUnmount(() => {
   align-items: center;
   text-align: left;
   padding: 0.5rem 1rem;
+
+  h4,
+  p {
+    margin: 0;
+  }
 }
 
 .account-card {
@@ -287,4 +292,11 @@ onBeforeUnmount(() => {
   overflow: hidden;
   text-overflow: ellipsis;
 }
+
+.accounts-text {
+  display: flex;
+  align-items: center;
+  gap: 0.25rem;
+  margin: 0;
+}
 </style>