fix: make header look slightly better with long names on small screens,

closes #1278
HangarMC · Dec 9, 2023 · 7b20de2 · 7b20de2
1 parent 3f3022f
commit 7b20de2
Showing 1 changed file with 3 additions and 1 deletion.
diff --git a/frontend/src/components/layout/Header.vue b/frontend/src/components/layout/Header.vue
@@ -155,7 +155,7 @@ function isRecent(date: string): boolean {
       <Announcement v-for="(announcement, idx) in useBackendData.announcements" :key="idx" :announcement="announcement" />
     </div>
 
-    <nav class="max-w-screen-xl mx-auto flex flex-wrap justify-center px-4 py-2 gap-3">
+    <nav class="max-w-screen-xl mx-auto flex flex-wrap justify-end px-4 py-2 gap-3">
       <!-- Left side items -->
       <div class="flex items-center gap-4">
         <Popover v-slot="{ close }" class="relative">
@@ -316,6 +316,8 @@ function isRecent(date: string): boolean {
             </template>
           </Popper>
         </div>
+      </div>
+      <div class="flex items-center gap-2">
         <!-- Profile dropdown -->
         <div v-if="authStore.user">
           <Popper placement="bottom-end">