Mod pages base

components/ModResult.vue

@@ -18,20 +18,7 @@
     </p>
     <div class="column-grow-1 columns result-infos">
       <div class="result-image columns">
-        <svg
-          width="20"
-          height="20"
-          viewBox="0 0 24 24"
-          fill="none"
-          stroke="#3cdb36"
-          stroke-width="2"
-          stroke-linecap="round"
-          stroke-linejoin="round"
-        >
-          <path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path>
-          <polyline points="7 10 12 15 17 10"></polyline>
-          <line x1="12" y1="15" x2="12" y2="3"></line>
-        </svg>
+        <DownloadIcon stroke="#3cdb36" />
         <p>{{ formatNumber(downloads) }}</p>
       </div>
       <div class="result-image columns">
@@ -133,6 +120,7 @@
 
 <script>
 import CalendarIcon from '~/assets/images/utils/calendar.svg?inline'
+import DownloadIcon from '~/assets/images/utils/download.svg?inline'
 
 import TechCategory from '~/assets/images/categories/tech.svg?inline'
 import AdventureCategory from '~/assets/images/categories/adventure.svg?inline'
@@ -168,6 +156,7 @@ export default {
     ForgeLoader,
     FabricLoader,
     CalendarIcon,
+    DownloadIcon,
   },
   props: {
     id: {
@@ -441,7 +430,7 @@ export default {
 // Larger screens
 @media screen and (min-width: 1375px) {
   .result {
-    margin: 5px 0 5px 15px;
+    margin: 5px 0;
     grid-column: 1;
     grid-template-columns: 110px auto;
   }