From 2b6c3b0a5a149d8ee1e60b114a1cfd5718e1de5b Mon Sep 17 00:00:00 2001
From: Matthias <xmatthias@outlook.com>
Date: Sun, 24 Nov 2024 12:37:56 +0100
Subject: [PATCH] feat: improve mobile header style

---
 src/components/layout/NavBar.vue | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/components/layout/NavBar.vue b/src/components/layout/NavBar.vue
index 57fb50bd..49c9a530 100644
--- a/src/components/layout/NavBar.vue
+++ b/src/components/layout/NavBar.vue
@@ -161,15 +161,15 @@ watch(
             <ReloadControl class="me-3" title="Confirm Dialog deactivated." />
           </div>
           <li
-            class="d-none d-sm-flex flex-sm-wrap flex-lg-nowrap align-items-center nav-item text-secondary me-2"
+            class="d-none d-md-flex flex-md-wrap flex-lg-nowrap align-items-center nav-item text-secondary me-2"
           >
-            <BNavText class="verticalCenter small me-2">
+            <BNavText class="small me-2">
               {{
                 (botStore.activeBotorUndefined && botStore.activeBotorUndefined.botName) ||
                 'No bot selected'
               }}
             </BNavText>
-            <BNavText v-if="botStore.botCount === 1" class="verticalCenter">
+            <BNavText v-if="botStore.botCount === 1">
               {{
                 botStore.activeBotorUndefined && botStore.activeBotorUndefined.isBotOnline
                   ? 'Online'
@@ -179,7 +179,7 @@ watch(
           </li>
           <li v-if="botStore.hasBots" class="nav-item">
             <!-- Hide dropdown on xs, instead show below  -->
-            <BNavItemDropdown id="avatar-drop" right auto-close class="d-none d-sm-block">
+            <BNavItemDropdown id="avatar-drop" right auto-close class="d-none d-md-block">
               <template #button-content>
                 <BAvatar size="2em" button>FT</BAvatar>
               </template>
@@ -198,11 +198,11 @@ watch(
                 </BDropdownItem>
               </template>
             </BNavItemDropdown>
-            <div class="d-block d-sm-none">
+            <div class="d-block d-md-none">
               <!-- Visible only on XS -->
               <!-- <li class="nav-item text-secondary ms-2 d-sm-none d-flex justify-content-between">
                 <div class="d-flex">
-                  <b-nav-text class="verticalCenter small me-2">
+                  <b-nav-text class="small me-2">
                     {{
                       (botStore.activeBotorUndefined && botStore.activeBotorUndefined.botName) ||
                       'No bot selected'