blomios/ReadaBook
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(web): lecteur — ancrer le stage vertical en haut du contenu (align-items/align-self: start, height auto) et désactiver l'overflow-anchor du stage pour éviter le centrage overflow au milieu du livre spécifique à Firefox (7e correctif bug #39)

Browse Source
This commit is contained in:
Git Agent
2026-08-26 12:39:53 +02:00
parent 937edd562f
commit b2e7dc5b16
2 changed files with 19 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
apps/web/src/reader/readerRuntime.test.ts
View File

@ -212,6 +212,16 @@ describe("reader runtime helpers", () => {
expect(verticalBranch).not.toContain('hidden={!imageSizes[item.page]}'); expect(verticalBranch).not.toContain('hidden={!imageSizes[item.page]}');
}); });
it("starts vertical reader overflow from the top edge instead of centered content", () => {
const styles = readFileSync(new URL("../styles/app.css", import.meta.url), "utf8");
const verticalStage = styles.match(/\.reader-mode-vertical \.reader-stage\s*\{[^}]+\}/)?.[0] ?? "";
const verticalContent = styles.match(/\.reader-mode-vertical \.reader-content\s*\{[^}]+\}/)?.[0] ?? "";
expect(verticalStage).toContain("align-items: start");
expect(verticalStage).toContain("overflow-anchor: none");
expect(verticalContent).toContain("align-self: start");
});
it("detects fullscreen support and active fullscreen element", () => { it("detects fullscreen support and active fullscreen element", () => {
const fullscreenElement = { requestFullscreen: () => Promise.resolve() } as unknown as HTMLElement; const fullscreenElement = { requestFullscreen: () => Promise.resolve() } as unknown as HTMLElement;
const regularElement = {} as HTMLElement; const regularElement = {} as HTMLElement;

9
apps/web/src/styles/app.css
View File

@ -1035,8 +1035,17 @@ main.app-main-reader .reader-page {
} }
.reader-mode-vertical .reader-content { .reader-mode-vertical .reader-content {
align-self: start;
align-items: start; align-items: start;
justify-self: stretch;
width: 100%; width: 100%;
height: auto;
}
.reader-mode-vertical .reader-stage {
align-items: start;
justify-items: center;
overflow-anchor: none;
} }
.pdf-reader, .pdf-reader,