Fix mask display for firefox

d0rich · Jul 30, 2024 · bc6b532 · bc6b532
1 parent cb01c9b
commit bc6b532
Showing 1 changed file with 6 additions and 16 deletions.
diff --git a/packages/nuxt-design-system/components/d/Mask.vue b/packages/nuxt-design-system/components/d/Mask.vue
@@ -52,26 +52,16 @@ function getAsset(mask: MaskType) {
 </script>
 
 <template>
-  <div>
-    <Transition name="mask" mode="out-in">
-      <img
-        v-if="mask === 'spider'"
-        :src="getAsset('spider')"
-        alt="Spider mask"
-      />
-      <img v-else-if="mask === 'owl'" :src="getAsset('owl')" alt="Owl mask" />
-      <img
-        v-else-if="mask === 'wolf'"
-        :src="getAsset('wolf')"
-        alt="Wolf mask"
-      />
-    </Transition>
-  </div>
+  <Transition name="mask" mode="out-in">
+    <img v-if="mask === 'spider'" :src="getAsset('spider')" alt="Spider mask" />
+    <img v-else-if="mask === 'owl'" :src="getAsset('owl')" alt="Owl mask" />
+    <img v-else-if="mask === 'wolf'" :src="getAsset('wolf')" alt="Wolf mask" />
+  </Transition>
 </template>
 
 <style scoped>
 img {
-  @apply w-full h-full;
+  @apply h-full;
 }
 
 .mask-enter-active,