Update ItemIcon.vue

n1crack · Jun 30, 2024 · bc46b86 · bc46b86
1 parent 83dfba7
commit bc46b86
Showing 1 changed file with 13 additions and 3 deletions.
diff --git a/src/components/ItemIcon.vue b/src/components/ItemIcon.vue
@@ -1,10 +1,20 @@
 <template>
-  <span>
-    <FolderSVG v-if="type === 'dir'" :class="{'h-5 w-5': small, 'h-10 w-10 md:h-12 md:w-12 m-auto': !small}" />
-    <FileSVG v-else :class="{'h-5 w-5': small, 'h-10 w-10 md:h-12 md:w-12 m-auto': !small}" />
+  <span class="vuefinder__item-icon">
+    <FolderSVG v-if="type === 'dir'" :class="small ? 'vuefinder__item-icon--small' : 'vuefinder__item-icon--large'" />
+    <FileSVG v-else :class="small ? 'vuefinder__item-icon--small' : 'vuefinder__item-icon--large'" />
   </span>
 </template>
 
+<style>
+.vuefinder__item-icon--small {
+  @apply h-5 w-5;
+}
+
+.vuefinder__item-icon--large {
+  @apply h-10 w-10 md:h-12 md:w-12 m-auto;
+}
+</style>
+
 <script setup>
 import {defineProps} from "vue";
 import FileSVG from './icons/file.svg';