akai-tools/readest
2
0
Fork 0
forked from akai/readest
Code Pull Requests Activity

fix(layout): fixed page navigation buttons have higher z-index than TTS control button (#3184)

Browse Source
This commit is contained in:
Huang Xin
2026-02-06 18:00:56 +08:00
committed by GitHub
parent fe9603ffb8
commit 9d6394fe2b
2 changed files with 7 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/readest-app/src/app/reader/components/PageNavigationButtons.tsx
+6 -10
View File
@@ -64,12 +64,10 @@ const PageNavigationButtons: React.FC<PageNavigationButtonsProps> = ({
<button
onClick={handleGoLeftPage}
className={clsx(
'absolute left-2 z-10 -translate-y-1/2',
'flex items-center justify-center',
'absolute left-2 -translate-y-1/2',
'flex h-20 w-20 items-center justify-center',
'transition-opacity duration-300 focus:outline-none',
isPageNavigationButtonsVisible
? 'top-1/2 h-20 w-20 opacity-100'
: 'bottom-12 h-10 w-10 opacity-0',
isPageNavigationButtonsVisible ? 'top-1/2 opacity-100' : 'bottom-12 opacity-0',
)}
aria-label={getLeftPageLabel()}
tabIndex={0}
@@ -89,12 +87,10 @@ const PageNavigationButtons: React.FC<PageNavigationButtonsProps> = ({
<button
onClick={handleGoRightPage}
className={clsx(
'absolute right-2 z-10 -translate-y-1/2',
'flex items-center justify-center',
'absolute right-2 -translate-y-1/2',
'flex h-20 w-20 items-center justify-center',
'transition-opacity duration-300 focus:outline-none',
isPageNavigationButtonsVisible
? 'top-1/2 h-20 w-20 opacity-100'
: 'bottom-12 h-10 w-10 opacity-0',
isPageNavigationButtonsVisible ? 'top-1/2 opacity-100' : 'bottom-12 opacity-0',
)}
aria-label={getRightPageLabel()}
tabIndex={0}
apps/readest-app/src/utils/style.ts
+1 -1
View File
@@ -841,7 +841,7 @@ export const applyTableStyle = (document: Document) => {
const computedTableStyle = window.getComputedStyle(table);
const computedWidth = computedTableStyle.width;
if (computedWidth && computedWidth !== 'auto' && computedWidth !== '0px') {
table.style.width = `calc(min(${computedWidth}, var(--available-width)))`;
table.style.width = `calc(min(${computedWidth}, var(--available-width) * 1px))`;
}
if (totalTableWidth > 0) {
const scale = `calc(min(1, var(--available-width) / ${totalTableWidth}))`;