Update FolderIndicator.vue

n1crack · Jun 30, 2024 · f1e7f8f · f1e7f8f
1 parent 9ea30c6
commit f1e7f8f
Showing 1 changed file with 22 additions and 4 deletions.
diff --git a/src/components/FolderIndicator.vue b/src/components/FolderIndicator.vue
@@ -1,12 +1,30 @@
 <template>
-  <div class="h-5 w-5 shrink-0">
-    <div class=" cursor-pointer">
-      <SquareMinusSVG class="text-gray-600" v-if="model" />
-      <SquarePlusSVG class="text-gray-400" v-if="!model" />
+  <div class="vuefinder__folder-indicator">
+    <div class="vuefinder__folder-indicator--icon">
+      <SquareMinusSVG class="vuefinder__folder-indicator--minus" v-if="model" />
+      <SquarePlusSVG class="vuefinder__folder-indicator--plus" v-if="!model" />
     </div>
   </div>
 </template>
 
+<style>
+.vuefinder__folder-indicator {
+  @apply h-5 w-5 shrink-0;
+}
+
+.vuefinder__folder-indicator--icon {
+  @apply cursor-pointer;
+}
+
+.vuefinder__folder-indicator--minus {
+  @apply text-gray-600;
+}
+
+.vuefinder__folder-indicator--plus {
+  @apply text-gray-400;
+}
+</style>
+
 
 <script setup>
 import SquarePlusSVG from "./icons/plus.svg";