[web] Make hover style of buttons identical everywhere

web-src/src/components/NavbarBottom.vue

@@ -103,7 +103,7 @@
       </div>
     </div>
     <div class="navbar-brand is-flex-grow-1">
-      <navbar-item-link :to="{ name: 'queue' }" exact class="mr-auto">
+      <navbar-item-link :to="{ name: 'queue' }" class="mr-auto">
         <mdicon class="icon" name="playlist-play" size="24" />
       </navbar-item-link>
       <navbar-item-link

web-src/src/components/NavbarItemLink.vue

@@ -1,10 +1,5 @@
 <template>
-  <a
+  <a class="navbar-item" :href="href" @click.stop.prevent="open">
-    class="navbar-item"
-    :class="{ 'is-active': is_active }"
-    :href="full_path()"
-    @click.stop.prevent="open_link()"
-  >
     <slot />
   </a>
 </template>
@@ -15,47 +10,21 @@ import * as types from '@/store/mutation_types'
 export default {
   name: 'NavbarItemLink',
   props: {
-    exact: Boolean,
     to: { required: true, type: Object }
   },
 
   computed: {
-    is_active() {
+    href() {
-      if (this.exact) {
+      return this.$router.resolve(this.to).href
-        return this.$route.path === this.to
-      }
-      return this.$route.path.startsWith(this.to)
-    },
-
-    show_burger_menu: {
-      get() {
-        return this.$store.state.show_burger_menu
-      },
-      set(value) {
-        this.$store.commit(types.SHOW_BURGER_MENU, value)
-      }
-    },
-
-    show_player_menu: {
-      get() {
-        return this.$store.state.show_player_menu
-      },
-      set(value) {
-        this.$store.commit(types.SHOW_PLAYER_MENU, value)
-      }
     }
   },
 
   methods: {
-    full_path() {
+    open() {
-      const resolved = this.$router.resolve(this.to)
+      if (this.$store.state.show_burger_menu) {
-      return resolved.href
-    },
-    open_link() {
-      if (this.show_burger_menu) {
         this.$store.commit(types.SHOW_BURGER_MENU, false)
       }
-      if (this.show_player_menu) {
+      if (this.$store.state.show_player_menu) {
         this.$store.commit(types.SHOW_PLAYER_MENU, false)
       }
       this.$router.push(this.to)

web-src/src/components/NavbarTop.vue

@@ -54,7 +54,7 @@
               <mdicon class="icon" name="music-box-multiple" size="16" />
               <b v-text="$t('navigation.playlists')" />
             </navbar-item-link>
-            <navbar-item-link :to="{ name: 'music' }" exact>
+            <navbar-item-link :to="{ name: 'music' }">
               <mdicon class="icon" name="music" size="16" />
               <b v-text="$t('navigation.music')" />
             </navbar-item-link>