From e4253633c914ad4f837252a567c946efb4ccf270 Mon Sep 17 00:00:00 2001
From: schroda <50052685+schroda@users.noreply.github.com>
Date: Tue, 17 Dec 2024 01:01:58 +0100
Subject: [PATCH] Properly center images in "single page mode"

While the reader width was set images weren't centered correctly in the images wrapper element
---
 .../reader/components/viewer/ReaderPage.tsx   |  4 ++--
 .../reader/utils/ReaderPager.utils.tsx        | 21 ++++++-------------
 2 files changed, 8 insertions(+), 17 deletions(-)

diff --git a/src/modules/reader/components/viewer/ReaderPage.tsx b/src/modules/reader/components/viewer/ReaderPage.tsx
index 3bdcf9f0..b72d9b80 100644
--- a/src/modules/reader/components/viewer/ReaderPage.tsx
+++ b/src/modules/reader/components/viewer/ReaderPage.tsx
@@ -97,7 +97,7 @@ export const ReaderPage = forwardRef(
                     ...applyStyles(!display, {
                         display: 'none',
                     }),
-                    ...getImageMarginStyling(readingMode.value, doublePage, position),
+                    ...getImageMarginStyling(doublePage, position),
                     ...applyStyles(marginTop !== undefined, {
                         mt: `${marginTop}px`,
                     }),
@@ -119,7 +119,7 @@ export const ReaderPage = forwardRef(
                     objectFit: 'contain',
                     objectPosition: position,
                     userSelect: 'none',
-                    ...getImageMarginStyling(readingMode.value, doublePage, position),
+                    ...getImageMarginStyling(doublePage, position),
                     ...applyStyles(marginTop !== undefined, {
                         mt: `${marginTop}px`,
                     }),
diff --git a/src/modules/reader/utils/ReaderPager.utils.tsx b/src/modules/reader/utils/ReaderPager.utils.tsx
index 5311310b..a6adf15e 100644
--- a/src/modules/reader/utils/ReaderPager.utils.tsx
+++ b/src/modules/reader/utils/ReaderPager.utils.tsx
@@ -205,21 +205,12 @@ export const getImageWidthStyling = (
     }
 };
 
-export const getImageMarginStyling = (
-    readingMode: IReaderSettings['readingMode'],
-    doublePage: boolean,
-    objectFitPosition?: 'left' | 'right',
-): CSSObject => ({
-    ...applyStyles(!isContinuousReadingMode(readingMode), {
-        my: 'auto',
-        ...applyStyles(doublePage, {
-            // the applied margin is the opposite of the objectFitPosition
-            ...applyStyles(objectFitPosition === 'right', { ml: 'auto ' }),
-            ...applyStyles(objectFitPosition === 'left', { mr: 'auto ' }),
-        }),
-    }),
-    ...applyStyles(isContinuousReadingMode(readingMode), {
-        m: 'auto',
+export const getImageMarginStyling = (doublePage: boolean, objectFitPosition?: 'left' | 'right'): CSSObject => ({
+    m: 'auto',
+    ...applyStyles(doublePage, {
+        // the applied margin is the opposite of the objectFitPosition
+        ...applyStyles(objectFitPosition === 'right', { ml: 'auto ' }),
+        ...applyStyles(objectFitPosition === 'left', { mr: 'auto ' }),
     }),
 });