Fixes places inreader where navbar width was not considered (#908)

* Fixes two places where navbar was not considered

When set to static, the navbar consumes space, so `vw` units are not
enough.
On small screens, the `left`+`transform` approach does not work nicely,
so just use standard flex alignment, the container is already a flexbox.

* Change card also consider wide viewports

* Update src/modules/reader/components/viewer/ReaderTransitionPage.tsx

Co-authored-by: schroda <50052685+schroda@users.noreply.github.com>

* Reader: Apply new alignment code also to horizontal scroll mode

---------

Co-authored-by: schroda <50052685+schroda@users.noreply.github.com>
This commit is contained in:
Constantin Piber
2025-03-24 23:23:50 +01:00
committed by GitHub
parent dc88b42191
commit 1fd7624e98
2 changed files with 12 additions and 24 deletions

View File

@@ -72,13 +72,7 @@ export const getImagePlaceholderStyling = (
): CSSObject => {
const OVER_9000 = 9000;
const getMaxWidth = (width: string) => {
if (width === '100vw') {
return `calc(${width} - ${widthOffset}px)`;
}
return width;
};
const getMaxWidth = (width: string) => `calc(${width} - ${widthOffset}px)`;
const getDesktopWidth = (width: number, readerWidthValue?: number) =>
getMaxWidth(`${coerceIn(readerWidthValue ?? width, Math.min(width, readerWidthValue ?? OVER_9000), width)}vw`);