From f8ee93777ddefa7f71a70d897afbf1a3a4f95a4f Mon Sep 17 00:00:00 2001
From: Iu <iu@prhub.ru>
Date: Wed, 21 Oct 2026 00:41:08 +0300
Subject: [PATCH] =?UTF-8?q?fix(web):=20=D0=B7=D1=83=D0=BC=20=D0=B2=20?=
 =?UTF-8?q?=D0=BF=D1=80=D0=BE=D1=81=D0=BC=D0=BE=D1=82=D1=80=D0=B5=20?=
 =?UTF-8?q?=E2=80=94=20=D0=BA=D0=BE=D0=BD=D1=82=D0=B5=D0=B9=D0=BD=D0=B5?=
 =?UTF-8?q?=D1=80=20=D0=BF=D1=80=D0=BE=D0=BA=D1=80=D1=83=D1=82=D0=BA=D0=B8?=
 =?UTF-8?q?=20=D0=B8=20=D1=86=D0=B5=D0=BD=D1=82=D1=80=D0=B8=D1=80=D0=BE?=
 =?UTF-8?q?=D0=B2=D0=B0=D0=BD=D0=B8=D0=B5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Прокручиваемый контейнер просмотра не имел min-w-0, поэтому в зуме он
раздувался до ширины картинки вместо того, чтобы прокручиваться: фото
нельзя было двигать влево-вправо. Та же правка применена к обёрткам просмотра.

Пробел теперь зумит к центру фото: 100% от оригинала с центрированием
изображения в просмотре.
---
 frontend/src/lib/components/Viewer.svelte | 15 +++++++--------
 1 file changed, 7 insertions(+), 8 deletions(-)

diff --git a/frontend/src/lib/components/Viewer.svelte b/frontend/src/lib/components/Viewer.svelte
index 0c436f4..42dac7a 100644
--- a/frontend/src/lib/components/Viewer.svelte
+++ b/frontend/src/lib/components/Viewer.svelte
@@ -423,15 +423,14 @@
 			scheduleViewport();
 			return;
 		}
-		// 100% от оригинала.
+		// 100% от оригинала, по центру фото.
 		zoomed = true;
 		scale = 1;
 		tick().then(() => {
 			const natW = baseWidth();
 			const natH = baseHeight();
-			const offset = imageOffset(natW, natH);
-			el.scrollLeft = offset.x;
-			el.scrollTop = offset.y;
+			el.scrollLeft = Math.max(0, (natW - el.clientWidth) / 2);
+			el.scrollTop = Math.max(0, (natH - el.clientHeight) / 2);
 			scheduleViewport();
 		});
 	}
@@ -625,7 +624,7 @@
 
 <div
 	bind:this={viewerEl}
-	class="bg-canvas relative flex h-full flex-col overflow-hidden"
+	class="bg-canvas relative flex h-full min-w-0 flex-col overflow-hidden"
 	data-pano={panoTag ? '1' : '0'}
 >
 	<div bind:this={topEl} class={topClass}>
@@ -654,7 +653,7 @@
 		</div>
 	</div>
 
-	<div class="relative flex min-h-0 flex-1 items-stretch">
+	<div class="relative flex min-h-0 min-w-0 flex-1 items-stretch">
 		<button
 			type="button"
 			class={leftBtnClass}
@@ -716,10 +715,10 @@
 				{/if}
 			</div>
 		{:else}
-			<div class="relative flex min-h-0 flex-1">
+			<div class="relative flex min-h-0 min-w-0 flex-1">
 				<div
 					bind:this={scroller}
-					class="bg-canvas flex min-h-0 flex-1 overscroll-contain {zoomed
+					class="bg-canvas flex min-h-0 min-w-0 flex-1 overscroll-contain {zoomed
 						? 'cursor-grab overflow-auto'
 						: 'overflow-hidden'}"
 					role="group"