@fy-/fws-vue 2.3.25 → 2.3.27

package/components/ui/DefaultGallery.vue

@@ -129,35 +129,36 @@ const currentImage = computed(() => {
 const imageCount = computed(() => props.images.length)
 const currentIndex = computed(() => modelValue.value + 1)
 
-// Simple but effective image sizing function
+// Simple direct approach that correctly handles the info panel
 const updateImageSizes = useDebounceFn(() => {
-  // Only target main image for sizing
+  // Get the main image
   const mainImage = document.querySelector('.image-display img') as HTMLImageElement
   if (!mainImage) return
 
-  // Simple, direct calculation of available space
+  // Get exact measurements of all UI elements
   const topHeight = topControlsRef.value?.offsetHeight || 0
 
-  // Always account for info panel height if it's visible
+  // CRITICAL: Always include the info panel height when visible
   const infoHeight = infoPanel.value && infoPanelRef.value
     ? infoPanelRef.value.offsetHeight
     : 0
 
-  // Add a small additional padding
-  const bottomPadding = 16
+  // Standard padding
+  const padding = 24
 
-  // Calculate total available height by subtracting all elements
-  const availableHeight = windowHeight.value - topHeight - infoHeight - bottomPadding
+  // Calculate available height by subtracting ALL elements
+  const availableHeight = windowHeight.value - topHeight - infoHeight - padding
 
-  // Apply size directly to fill available space
+  // Apply the exact height constraint to the image
   mainImage.style.maxHeight = `${availableHeight}px`
   mainImage.style.width = 'auto'
 
   // Handle width constraints
   const sidebarWidth = sidePanel.value ? 256 : 0
+  const availableWidth = windowWidth.value - sidebarWidth - padding * 2
   mainImage.style.maxWidth = windowWidth.value <= 768
-    ? '85vw'
-    : `${windowWidth.value - sidebarWidth - 48}px`
+    ? '90vw'
+    : `${availableWidth}px`
 }, 50)
 
 // Modal controls

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fy-/fws-vue",
-  "version": "2.3.25",
+  "version": "2.3.27",
   "author": "Florian 'Fy' Gasquez <m@fy.to>",
   "license": "MIT",
   "homepage": "https://github.com/fy-to/FWJS#readme",