From 2de8a0f19ec524c3034d9ee31cc8c64786b6b284 Mon Sep 17 00:00:00 2001
From: guerler <aysam.guerler@gmail.com>
Date: Thu, 22 Dec 2022 12:50:40 -0500
Subject: [PATCH] Slightly refactor markup, remove nested brand button dom

---
 client/src/components/Masthead/Masthead.vue | 48 +++++++--------------
 1 file changed, 15 insertions(+), 33 deletions(-)

diff --git a/client/src/components/Masthead/Masthead.vue b/client/src/components/Masthead/Masthead.vue
index 8ceeb7a39b1..443fd6cdf3f 100644
--- a/client/src/components/Masthead/Masthead.vue
+++ b/client/src/components/Masthead/Masthead.vue
@@ -73,18 +73,14 @@ onMounted(() => {
 <template>
     <b-navbar id="masthead" type="dark" role="navigation" aria-label="Main" class="justify-content-between">
         <b-navbar-nav>
-            <b-navbar-brand class="ml-2 mr-1">
-                <b-button
-                    id="analysis"
-                    v-b-tooltip.hover
-                    variant="link"
-                    size="sm"
-                    title="Home"
-                    aria-label="homepage"
-                    :href="safePath(logoUrl)">
-                    <img alt="logo" :src="safePath(logoSrc)" />
-                    <img v-if="logoSrcSecondary" alt="logo" :src="safePath(logoSrcSecondary)" />
-                </b-button>
+            <b-navbar-brand
+                class="ml-2 mr-1"
+                v-b-tooltip.hover
+                title="Home"
+                aria-label="homepage"
+                :href="safePath(logoUrl)">
+                <img alt="logo" :src="safePath(logoSrc)" />
+                <img v-if="logoSrcSecondary" alt="logo" :src="safePath(logoSrcSecondary)" />
             </b-navbar-brand>
             <b-nav-item v-if="brand" class="navbar-brand-title" disabled>
                 {{ brand }}
@@ -98,9 +94,7 @@ onMounted(() => {
                 :tab="tab"
                 :active-tab="activeTab"
                 @open-url="emit('open-url', $event)" />
-
             <ThemeSelector />
-
             <masthead-item
                 v-for="(tab, idx) in extensionTabs"
                 v-show="tab.hidden !== true"
@@ -108,7 +102,6 @@ onMounted(() => {
                 :tab="tab"
                 :active-tab="activeTab"
                 @open-url="emit('open-url', $event)" />
-
             <masthead-item v-if="windowTab" :tab="windowTab" :toggle="windowToggle" @click="onWindowToggle" />
         </b-navbar-nav>
         <quota-meter />
@@ -180,26 +173,15 @@ onMounted(() => {
             }
         }
     }
-
-    &:deep(.navbar-brand) {
-        color: var(--masthead-text-active);
-
-        #analysis {
-            padding: 0;
-
-            &:focus-visible {
-                outline: 2px solid var(--masthead-text-hover);
-            }
-
-            img {
-                display: inline;
-                border: none;
-                height: 2.22rem;
-            }
+    .navbar-brand {
+        cursor: pointer;
+        img {
+            display: inline;
+            border: none;
+            height: 2.3rem;
         }
     }
-
-    &:deep(.navbar-brand-title) {
+    .navbar-brand-title {
         font-weight: bold;
         font-family: Verdana, sans-serif;
         font-size: calc($masthead-height / 3);