target blank because firefox breaks back button

src/App.vue

@@ -5,19 +5,22 @@
   </div> -->
   <nav>
     <router-link to="/" class="gractwoRoot">
-      <img alt="Vue logo" src="./assets/gractwo-smol.png" style="height: 50px">
+      <img
+        alt="Vue logo"
+        src="./assets/gractwo-smol.png"
+        style="height: 50px"
+      />
       <h1>Gractwo</h1>
     </router-link>
     <div>
       <!-- <router-link to="/">główna</router-link> -->
       <!-- <router-link to="/o-nas">o nas</router-link> -->
-      <router-link to="/discord">discord</router-link>
-      <router-link to="/facebook">facebook</router-link>
+      <router-link to="/discord" target="_blank">discord</router-link>
+      <router-link to="/facebook" target="_blank">facebook</router-link>
     </div>
   </nav>
-  <main>
-  </main>
-  <router-view/>
+  <main></main>
+  <router-view />
 </template>
 
 <style lang="sass">

src/components/card.vue

@@ -1,25 +1,25 @@
 <template>
-  <router-link :to="link" class="card">
-    <img  alt="" :src="require(`../assets/spis/${photo}`)">
+  <router-link :to="link" class="card" target="_blank">
+    <img alt="" :src="require(`../assets/spis/${photo}`)" />
     <div class="card-inner">
-      <p class="name"> {{name}} </p>
-      <p class="desc"> {{desc}} </p>
+      <p class="name">{{ name }}</p>
+      <p class="desc">{{ desc }}</p>
     </div>
   </router-link>
 </template>
 
 <script lang="ts">
-import { defineComponent } from 'vue';
+  import { defineComponent } from 'vue';
 
-export default defineComponent({
-  name: 'card',
-  props: {
-    name: String,
-    photo: String,
-    desc: String,
-    link: String
-  }
-});
+  export default defineComponent({
+    name: 'card',
+    props: {
+      name: String,
+      photo: String,
+      desc: String,
+      link: String,
+    },
+  });
 </script>
 
 <style lang="sass" scoped>