fix: remove external dependency for icones (#805)

* change all icons to use iconify

* fix minor UI elements

* fix layout of table

frontend/components/global/CopyText.vue

@@ -6,17 +6,15 @@
         'swap-active': copied,
       }"
     >
-      <Icon
+      <MdiContentCopy
         class="swap-off"
-        name="mdi-content-copy"
         :style="{
           height: `${iconSize}px`,
           width: `${iconSize}px`,
         }"
       />
-      <Icon
+      <MdiClipboard
         class="swap-on"
-        name="mdi-clipboard"
         :style="{
           height: `${iconSize}px`,
           width: `${iconSize}px`,
@@ -27,6 +25,9 @@
 </template>
 
 <script setup lang="ts">
+  import MdiContentCopy from "~icons/mdi/content-copy";
+  import MdiClipboard from "~icons/mdi/clipboard";
+
   const props = defineProps({
     text: {
       type: String as () => string,
@@ -51,5 +52,3 @@
     }, 1000);
   }
 </script>
-
-<style scoped></style>

frontend/components/global/DetailsSection/DetailsSection.vue

@@ -16,7 +16,7 @@
             <template v-else-if="detail.type === 'link'">
               <div class="tooltip tooltip-primary tooltip-right" :data-tip="detail.href">
                 <a class="btn btn-primary btn-xs" :href="detail.href" target="_blank">
-                  <Icon name="mdi-open-in-new" class="mr-2 swap-on"></Icon>
+                  <MdiOpenInNew class="mr-2 swap-on" />
                   {{ detail.text }}
                 </a>
               </div>
@@ -51,6 +51,7 @@
 
 <script setup lang="ts">
   import type { AnyDetail, Detail } from "./types";
+  import MdiOpenInNew from "~icons/mdi/open-in-new";
 
   defineProps({
     details: {

frontend/components/global/PageQRCode.vue

@@ -2,7 +2,7 @@
   <div class="dropdown dropdown-left">
     <slot>
       <label tabindex="0" class="btn btn-circle btn-sm">
-        <Icon name="mdi-qrcode" />
+        <MdiQrcode />
       </label>
     </slot>
     <div tabindex="0" class="card compact dropdown-content shadow-lg bg-base-100 rounded-box w-64">
@@ -16,6 +16,7 @@
 
 <script setup lang="ts">
   import { route } from "../../lib/api/base";
+  import MdiQrcode from "~icons/mdi/qrcode";
 
   function getQRCodeUrl(): string {
     const currentURL = window.location.href;