Fix modal to always be 16:9 aspect ratio

components/ImageViewer.vue

@@ -1,14 +1,11 @@
 <template>
-  <div class="flex flex-col h-full">
+  <div class="flex flex-col h-full w-full">
     <div class="flex-1 flex items-center justify-center min-h-0">
-      <div class="w-full max-w-[80vw] aspect-video" style="height: 50vh;">
-        <!-- Image -->
-        <NuxtImg 
-          v-if="gallery[currentIndex]"
-          :src="'/' + bucket + '/' + gallery[currentIndex].image" 
-          class="w-full h-full object-contain"
-        />
-      </div>
+      <NuxtImg 
+        v-if="gallery[currentIndex]"
+        :src="'/' + bucket + '/' + gallery[currentIndex].image" 
+        class="w-full h-full object-contain"
+      />
     </div>
 
     <!-- Dots indicator -->

components/SimpleModal.vue

@@ -7,7 +7,7 @@
       <!-- Modal Panel -->
       <div class="fixed inset-0 flex items-center justify-center pointer-events-none">
         <div 
-          class="bg-white rounded-lg shadow-xl max-w-[80vw] max-h-[85vh] overflow-hidden relative pointer-events-auto"
+          class="bg-white rounded-lg shadow-xl w-[80vw] aspect-video max-h-[85vh] overflow-hidden relative pointer-events-auto"
           :style="{ maxHeight }"
         >
           <!-- Content -->

layouts/default.vue

@@ -87,21 +87,19 @@
             <iframe :src="modalStore.soundcloudUrl" class="w-64" height="20px" scrolling="no" frameborder="no" allow="autoplay"></iframe>
           </ClientOnly>
         </div>
-        <div v-if="modalStore.type === 'video'" class="flex-1 flex items-center justify-center min-h-0">
-          <div class="w-full max-w-[80vw] aspect-video" style="height: 50vh;">
-            <ClientOnly>
-              <iframe 
-                :src="'https://player.vimeo.com/video/' + modalStore.vimeo_trackid" 
-                width="100%" 
-                height="100%" 
-                frameborder="0" 
-                webkitallowfullscreen 
-                mozallowfullscreen 
-                allowfullscreen 
-                class="w-full h-full block"
-              ></iframe>
-            </ClientOnly>
-          </div>
+        <div v-if="modalStore.type === 'video'" class="w-full h-full flex items-center justify-center">
+          <ClientOnly>
+            <iframe 
+              :src="'https://player.vimeo.com/video/' + modalStore.vimeo_trackid" 
+              width="100%" 
+              height="100%" 
+              frameborder="0" 
+              webkitallowfullscreen 
+              mozallowfullscreen 
+              allowfullscreen 
+              class="w-full h-full block"
+            ></iframe>
+          </ClientOnly>
         </div>
         <div v-if="modalStore.type === 'document'" class="w-full flex flex-col h-[70vh]">
           <ClientOnly>