From 22e1f3beec8e55e50d0073026a6a930756f54ff6 Mon Sep 17 00:00:00 2001
From: Raphael Odini <raphodn@users.noreply.github.com>
Date: Sat, 16 Mar 2024 12:36:00 +0100
Subject: [PATCH] Header: show username text on larger screens

---
 src/components/Header.vue | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/components/Header.vue b/src/components/Header.vue
index 6dc665662e..13d67baa5a 100644
--- a/src/components/Header.vue
+++ b/src/components/Header.vue
@@ -12,11 +12,12 @@
     <template v-else v-slot:append>
       <v-menu>
         <template v-slot:activator="{ props }">
-          <v-btn v-bind="props" icon="mdi-account-circle"></v-btn>
-        </template>
+          <v-btn class="d-sm-none" v-bind="props" icon="mdi-account-circle"></v-btn>
+          <v-btn class="d-none d-sm-flex text-none" v-bind="props" prepend-icon="mdi-account-circle">{{ username }}</v-btn>
+        </template> 
         <v-list>
-          <v-list-item class="" :slim="true" prepend-icon="mdi-account" disabled>{{ username }}</v-list-item>
-          <v-divider></v-divider>
+          <v-list-item class="d-sm-none" :slim="true" prepend-icon="mdi-account" disabled>{{ username }}</v-list-item>
+          <v-divider class="d-sm-none"></v-divider>
           <v-list-item :slim="true" prepend-icon="mdi-view-dashboard-outline" to="/dashboard" :aria-label="$t('Header.Dashboard')">{{ $t('Header.Dashboard') }}</v-list-item>
           <v-list-item :slim="true" prepend-icon="mdi-cog-outline" to="/settings" :aria-label="$t('Header.Settings')">{{ $t('Header.Settings') }}</v-list-item>
           <v-list-item :slim="true" prepend-icon="mdi-logout" @click="signOut" :aria-label="$t('Header.SignOut')">{{ $t('Header.SignOut') }}</v-list-item>