akai/readest
2
1
Fork 1
Code Issues Pull Requests Actions 10 Packages Projects Releases Wiki Activity

fix(layout): symmetric margins and gap in 2-column layout, closes #3909 (#4002)

Browse Source
This commit is contained in:
Huang Xin
2026-04-30 02:30:48 +08:00
committed by GitHub
parent 1d8ed3fc92
commit a43845b4c5
3 changed files with 13 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/readest-app/src/__tests__/utils/style.test.ts
+6 -6
View File
@@ -245,17 +245,17 @@ describe('transformStylesheet', () => {
it('adds width when both left and right bleed', () => {
const css = '.bleed { duokan-bleed: left right; }';
const result = transformStylesheet(css, VW, VH, VERTICAL);
expect(result).toContain('width: calc(var(--available-width) * 1px) !important');
expect(result).toContain('min-width: calc(var(--available-width) * 1px) !important');
expect(result).toContain('max-width: calc(var(--available-width) * 1px) !important');
expect(result).toContain('width: calc(var(--full-width) * 1px) !important');
expect(result).toContain('min-width: calc(var(--full-width) * 1px) !important');
expect(result).toContain('max-width: calc(var(--full-width) * 1px) !important');
});
it('adds height when both top and bottom bleed', () => {
const css = '.bleed { duokan-bleed: top bottom; }';
const result = transformStylesheet(css, VW, VH, VERTICAL);
expect(result).toContain('height: calc(var(--available-height) * 1px) !important');
expect(result).toContain('min-height: calc(var(--available-height) * 1px) !important');
expect(result).toContain('max-height: calc(var(--available-height) * 1px) !important');
expect(result).toContain('height: calc(var(--full-height) * 1px) !important');
expect(result).toContain('min-height: calc(var(--full-height) * 1px) !important');
expect(result).toContain('max-height: calc(var(--full-height) * 1px) !important');
});
it('does not add bleed styles when vertical is true', () => {
apps/readest-app/src/utils/style.ts
+6 -6
View File
@@ -769,15 +769,15 @@ export const transformStylesheet = (css: string, vw: number, vh: number, vertica
}
if (directions.includes('left') && directions.includes('right')) {
block = block
.replace(/}$/, ' width: calc(var(--available-width) * 1px) !important; }')
.replace(/}$/, ' min-width: calc(var(--available-width) * 1px) !important; }')
.replace(/}$/, ' max-width: calc(var(--available-width) * 1px) !important; }');
.replace(/}$/, ' width: calc(var(--full-width) * 1px) !important; }')
.replace(/}$/, ' min-width: calc(var(--full-width) * 1px) !important; }')
.replace(/}$/, ' max-width: calc(var(--full-width) * 1px) !important; }');
}
if (directions.includes('top') && directions.includes('bottom')) {
block = block
.replace(/}$/, ' height: calc(var(--available-height) * 1px) !important; }')
.replace(/}$/, ' min-height: calc(var(--available-height) * 1px) !important; }')
.replace(/}$/, ' max-height: calc(var(--available-height) * 1px) !important; }');
.replace(/}$/, ' height: calc(var(--full-height) * 1px) !important; }')
.replace(/}$/, ' min-height: calc(var(--full-height) * 1px) !important; }')
.replace(/}$/, ' max-height: calc(var(--full-height) * 1px) !important; }');
}
}
return selector + block;
packages/foliate-js
+1 -1
Submodule packages/foliate-js updated: af4f384b74...0a0cedabb6