From f108e2e70a7f81631ca80a4a3a3b09bcbe06bee0 Mon Sep 17 00:00:00 2001
From: Gigi <dergigi@pm.me>
Date: Mon, 13 Oct 2025 23:17:21 +0200
Subject: [PATCH] refactor: replace arbitrary color values with Tailwind
 utilities in ThreePaneLayout

---
 src/components/ThreePaneLayout.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/ThreePaneLayout.tsx b/src/components/ThreePaneLayout.tsx
index 48b7011f..f9533a72 100644
--- a/src/components/ThreePaneLayout.tsx
+++ b/src/components/ThreePaneLayout.tsx
@@ -224,7 +224,7 @@ const ThreePaneLayout: React.FC<ThreePaneLayoutProps> = (props) => {
       {/* Mobile bookmark button - only show when viewing article */}
       {isMobile && !props.isSidebarOpen && props.isHighlightsCollapsed && (
         <button
-          className={`fixed z-[900] bg-[#2a2a2a]/70 border border-[#444]/40 rounded-lg text-[#ddd] flex items-center justify-center transition-all duration-300 active:scale-95 backdrop-blur-sm md:hidden ${
+          className={`fixed z-[900] bg-zinc-800/70 border border-zinc-600/40 rounded-lg text-zinc-200 flex items-center justify-center transition-all duration-300 active:scale-95 backdrop-blur-sm md:hidden ${
             showMobileButtons ? 'opacity-90 visible' : 'opacity-0 invisible pointer-events-none'
           }`}
           style={{
@@ -244,7 +244,7 @@ const ThreePaneLayout: React.FC<ThreePaneLayoutProps> = (props) => {
       {/* Mobile highlights button - only show when viewing article */}
       {isMobile && !props.isSidebarOpen && props.isHighlightsCollapsed && (
         <button
-          className={`fixed z-[900] border border-[#444]/40 rounded-lg flex items-center justify-center transition-all duration-300 active:scale-95 backdrop-blur-sm md:hidden ${
+          className={`fixed z-[900] border border-zinc-600/40 rounded-lg flex items-center justify-center transition-all duration-300 active:scale-95 backdrop-blur-sm md:hidden ${
             showMobileButtons ? 'opacity-90 visible' : 'opacity-0 invisible pointer-events-none'
           }`}
           style={{