Fix bug: images not being displayed correctly

components/ImageCarousel.vue

@@ -1,13 +1,14 @@
 <template>
-  <v-dialog v-model="show" class="d-flex align-center justify-center">
+  <v-dialog v-model="show">
     <v-carousel
       :model-value="index"
       :show-arrows="images.length > 1"
       hide-delimiters
+      class="ma-auto"
+      :height="carouselHeight"
     >
       <v-carousel-item v-for="image of images" :key="image"
         :src="image"
-        class="ma-auto"
       ></v-carousel-item>
     </v-carousel>
   </v-dialog>
@@ -20,6 +21,11 @@ export default {
     show: false,
     images: [],
     index: 0
-  })
+  }),
+  computed: {
+    carouselHeight () {
+      return window.innerHeight * 0.9
+    }
+  }
 }
 </script>