From c15e85025209dfd9af74633e9a65b10ec22204f2 Mon Sep 17 00:00:00 2001
From: loveheaven <loveheaven_zhengwei@hotmail.com>
Date: Tue, 9 Jun 2026 23:42:32 +0800
Subject: [PATCH] fix(reader): shrink hidden page-nav buttons on Android so
 they don't eat long-press (#4501)

On Android, the four 80x80 page-navigation buttons stay mounted on top of the foliate viewer even when hidden (opacity-0). pointer-events:none can't be used on Android (it breaks touch propagation to the iframe), so the prev/next-section buttons already have an h-4 w-4 fallback for the hidden state. The prev-page / next-page buttons were missing this fallback and therefore kept covering ~80x80 hot zones in the lower-left and lower-right of the page, swallowing long-press touches on the first/last words of the bottom two lines so they could neither be highlighted nor open the toolbar. Apply the same h-4 w-4 fallback to those two buttons.
---
 .../app/reader/components/PageNavigationButtons.tsx    | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/apps/readest-app/src/app/reader/components/PageNavigationButtons.tsx b/apps/readest-app/src/app/reader/components/PageNavigationButtons.tsx
index 2f0b8b08..f55e259d 100644
--- a/apps/readest-app/src/app/reader/components/PageNavigationButtons.tsx
+++ b/apps/readest-app/src/app/reader/components/PageNavigationButtons.tsx
@@ -111,7 +111,10 @@ const PageNavigationButtons: React.FC<PageNavigationButtonsProps> = ({
         </button>
         <button
           onClick={handleGoLeftPage}
-          className='flex h-20 w-20 items-center justify-center focus:outline-none'
+          className={clsx(
+            'flex h-20 w-20 items-center justify-center focus:outline-none',
+            !isPageNavigationButtonsVisible && appService?.isAndroidApp && 'h-4 w-4',
+          )}
           aria-hidden={false}
           aria-label={getLeftPageLabel()}
           tabIndex={0}
@@ -139,7 +142,10 @@ const PageNavigationButtons: React.FC<PageNavigationButtonsProps> = ({
       >
         <button
           onClick={handleGoRightPage}
-          className='flex h-20 w-20 items-center justify-center focus:outline-none'
+          className={clsx(
+            'flex h-20 w-20 items-center justify-center focus:outline-none',
+            !isPageNavigationButtonsVisible && appService?.isAndroidApp && 'h-4 w-4',
+          )}
           aria-hidden={false}
           aria-label={getRightPageLabel()}
           tabIndex={0}