merge: fix/42-reader-vertical-black-flash dans develop (fallback page-sized pour pages CBZ verticales non chargées, plus de flash noir au scroll — correctif #42)

This commit is contained in:
Git Agent
2026-08-26 13:46:22 +02:00
2 changed files with 24 additions and 0 deletions

View File

@ -222,6 +222,15 @@ describe("reader runtime helpers", () => {
expect(verticalBranch).not.toContain('hidden={!imageSizes[item.page]}'); expect(verticalBranch).not.toContain('hidden={!imageSizes[item.page]}');
}); });
it("keeps unloaded CBZ vertical pages visually covered by a page-sized fallback", () => {
const styles = readFileSync(new URL("../styles/app.css", import.meta.url), "utf8");
expect(styles).toContain(".comic-page-frame-vertical > img,\n.comic-page-frame-vertical > .reader-fallback");
expect(styles).toContain(".comic-page-frame-vertical > .reader-fallback {\n width: 100%;");
expect(styles).toContain("min-height: inherit");
expect(styles).toContain("background: #f7f0df");
});
it("starts vertical reader overflow from the top edge instead of centered content", () => { 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 styles = readFileSync(new URL("../styles/app.css", import.meta.url), "utf8");
const verticalStage = styles.match(/\.reader-mode-vertical \.reader-stage\s*\{[^}]+\}/)?.[0] ?? ""; const verticalStage = styles.match(/\.reader-mode-vertical \.reader-stage\s*\{[^}]+\}/)?.[0] ?? "";

View File

@ -1114,6 +1114,21 @@ main.app-main-reader .reader-page {
padding: 0 12px; padding: 0 12px;
} }
.comic-page-frame-vertical > img,
.comic-page-frame-vertical > .reader-fallback {
grid-area: 1 / 1;
}
.comic-page-frame-vertical > .reader-fallback {
width: 100%;
min-height: inherit;
box-sizing: border-box;
border: 1px solid var(--line);
border-radius: var(--radius);
background: #f7f0df;
color: #17110d;
}
.pdf-page-frame canvas, .pdf-page-frame canvas,
.cbz-reader img { .cbz-reader img {
display: block; display: block;