fix(theme): fix mobile home button alignment (#475)

Author: youanden

packages/theme/components/BottomNavigation.vue

@@ -1,15 +1,13 @@
 <template>
   <!-- TODO: create logic with isActive prop for BottomNavigationItems -->
   <SfBottomNavigation class="navigation-bottom smartphone-only">
-    <nuxt-link to="localePath('/')">
-      <SfBottomNavigationItem
-        :class="$route.path == '/' ? 'sf-bottom-navigation__item--active' : ''"
-        icon="home"
-        size="20px"
-        label="Home"
-        @click="isMobileMenuOpen ? toggleMobileMenu() : false"
-      />
-    </nuxt-link>
+    <SfBottomNavigationItem
+      :class="$route.path == '/' ? 'sf-bottom-navigation__item--active' : ''"
+      icon="home"
+      size="20px"
+      label="Home"
+      @click="$router.push(app.localePath('/')) && (isMobileMenuOpen ? toggleMobileMenu() : false)"
+    />
     <SfBottomNavigationItem
       icon="menu"
       size="20px"
@@ -86,6 +84,7 @@ export default defineComponent({
       toggleCartSidebar,
       toggleMobileMenu,
       handleAccountClick,
+      app,
     };
   },
 });