turn isotipo into a button for nav

frontend/src/components/common/Navigation/HomeBtn.vue

@@ -1,17 +1,9 @@
 <script setup lang="ts">
 import RIsotipo from "@/components/common/RIsotipo.vue";
-import storeNavigation from "@/stores/navigation";
 import { ROUTES } from "@/plugins/router";
-
-const navigationStore = storeNavigation();
 </script>
 <template>
-  <r-isotipo
-    :to="{ name: ROUTES.HOME }"
-    @click="navigationStore.goHome"
-    class="cursor-pointer"
-    :size="40"
-  />
+  <r-isotipo :to="{ name: ROUTES.HOME }" class="cursor-pointer" :size="40" />
 </template>
 
 <style scoped>

frontend/src/components/common/RIsotipo.vue

@@ -1,7 +1,10 @@
 <script setup lang="ts">
 import { ref } from "vue";
+import type { RouteLocationRaw } from "vue-router";
 
-withDefaults(defineProps<{ size?: number }>(), { size: 40 });
+withDefaults(defineProps<{ size?: number; to?: RouteLocationRaw }>(), {
+  size: 40,
+});
 
 const logos = {
   xbox: { path: "romm_logo_xbox_one_circle.svg", weight: 0.945 },
@@ -26,7 +29,17 @@ const randomLogo = ref<string>(getRandomLogo());
 </script>
 
 <template>
-  <v-avatar :size="size">
-    <img :src="`/assets/logos/${randomLogo}`" alt="Romm Logo" :width="size" />
-  </v-avatar>
+  <v-btn
+    :to="to"
+    icon
+    variant="flat"
+    color="background"
+    class="rounded-50"
+    :height="size"
+    :width="size"
+  >
+    <v-avatar :size="size">
+      <img :src="`/assets/logos/${randomLogo}`" alt="Romm Logo" :width="size" />
+    </v-avatar>
+  </v-btn>
 </template>