From 4cce445f5ebb7b1b4e8eeeeb00e68b49ea11b077 Mon Sep 17 00:00:00 2001
From: Kai Henseler <kai.henseler@strato.de>
Date: Wed, 23 Sep 2026 14:41:32 +0200
Subject: [PATCH] IONOS(fix): Calculate image dimensions accounting for sidebar
 position

Calculate the available width for image display based on the sidebar
position instead of waiting for CSS transitions to complete. This
ensures proper image sizing when the sidebar is toggled.

Signed-off-by: Kai Henseler <kai.henseler@strato.de>
---
 src/mixins/Mime.js   | 12 +++++++++---
 src/views/Viewer.vue |  4 +++-
 2 files changed, 12 insertions(+), 4 deletions(-)

diff --git a/src/mixins/Mime.js b/src/mixins/Mime.js
index 7e530190d..3f8034648 100644
--- a/src/mixins/Mime.js
+++ b/src/mixins/Mime.js
@@ -75,6 +75,11 @@ export default {
 			type: Boolean,
 			default: false,
 		},
+		// left-edge position of the sidebar (px), set before isSidebarShown flips
+		sidebarPosition: {
+			type: Number,
+			default: 0,
+		},
 		// are we in fullscreen mode ?
 		isFullScreen: {
 			type: Boolean,
@@ -121,8 +126,7 @@ export default {
 		},
 		// update image size on sidebar toggle
 		isSidebarShown() {
-			// wait for transition to complete (100ms)
-			setTimeout(this.updateHeightWidth, 200)
+			this.updateHeightWidth()
 		},
 	},
 
@@ -162,7 +166,9 @@ export default {
 				const modalContainer = modalWrapper.querySelector('.modal-container')
 
 				const parentHeight = modalContainer.clientHeight
-				const parentWidth = modalContainer.clientWidth
+				const parentWidth = (this.isSidebarShown && this.sidebarPosition > 0)
+					? this.sidebarPosition
+					: modalContainer.clientWidth
 
 				const heightRatio = parentHeight / this.naturalHeight
 				const widthRatio = parentWidth / this.naturalWidth
diff --git a/src/views/Viewer.vue b/src/views/Viewer.vue
index 643260384..3ed0c400a 100644
--- a/src/views/Viewer.vue
+++ b/src/views/Viewer.vue
@@ -110,6 +110,7 @@
 					:editing="false"
 					:is-full-screen="isFullscreen"
 					:is-sidebar-shown="isSidebarShown"
+					:sidebar-position="sidebarPosition"
 					:loaded.sync="comparisonFile.loaded"
 					class="viewer__file viewer__file--active"
 					@error="comparisonFailed" />
@@ -145,6 +146,7 @@
 					:file-list="fileList"
 					:is-full-screen="isFullscreen"
 					:is-sidebar-shown="isSidebarShown"
+					:sidebar-position="sidebarPosition"
 					:loaded.sync="currentFile.loaded"
 					class="viewer__file viewer__file--active"
 					@update:editing="toggleEditor"
@@ -1117,12 +1119,12 @@ export default defineComponent({
 		},
 
 		handleAppSidebarOpen() {
-			this.isSidebarShown = true
 			const sidebar = document.querySelector('aside.app-sidebar')
 			if (sidebar) {
 				this.sidebarPosition = sidebar.getBoundingClientRect().left
 				this.trapElements = [sidebar]
 			}
+			this.isSidebarShown = true
 		},
 
 		handleAppSidebarClose() {