From 562fea3a36fa67216b4311da3e8e5d4f86eb326e Mon Sep 17 00:00:00 2001
From: Huang Xin <chrox.huang@gmail.com>
Date: Fri, 10 Oct 2025 00:35:00 +0800
Subject: [PATCH] fix(layout): fix inconsistent background color for unpinned
 drag bars (#2186)

---
 .../src/app/reader/components/notebook/Notebook.tsx          | 5 ++++-
 .../src/app/reader/components/sidebar/SideBar.tsx            | 1 +
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/apps/readest-app/src/app/reader/components/notebook/Notebook.tsx b/apps/readest-app/src/app/reader/components/notebook/Notebook.tsx
index 88ae1f43..1236714a 100644
--- a/apps/readest-app/src/app/reader/components/notebook/Notebook.tsx
+++ b/apps/readest-app/src/app/reader/components/notebook/Notebook.tsx
@@ -230,7 +230,10 @@ const Notebook: React.FC = ({}) => {
           }
         `}</style>
         <div
-          className='drag-bar bg-base-100 absolute -left-2 top-0 h-full w-0.5 cursor-col-resize p-2'
+          className={clsx(
+            'drag-bar bg-base-100 absolute -left-2 top-0 h-full w-0.5 cursor-col-resize p-2',
+            isNotebookPinned ? 'bg-base-100' : 'bg-transparent',
+          )}
           role='slider'
           tabIndex={0}
           aria-label={_('Resize Notebook')}
diff --git a/apps/readest-app/src/app/reader/components/sidebar/SideBar.tsx b/apps/readest-app/src/app/reader/components/sidebar/SideBar.tsx
index 4a143780..314068a7 100644
--- a/apps/readest-app/src/app/reader/components/sidebar/SideBar.tsx
+++ b/apps/readest-app/src/app/reader/components/sidebar/SideBar.tsx
@@ -294,6 +294,7 @@ const SideBar: React.FC<{
         <div
           className={clsx(
             'drag-bar bg-base-100 absolute -right-2 top-0 h-full w-0.5 cursor-col-resize p-1',
+            isSideBarPinned ? 'bg-base-100' : 'bg-transparent',
             isMobile && 'hidden',
           )}
           role='slider'