From 28a640d769704ebbc0975e7acf4e6f7258d557ba Mon Sep 17 00:00:00 2001
From: Eltrac <hi@guhub.cn>
Date: Wed, 10 Sep 2025 19:52:02 +0800
Subject: fix: settings page lacks dark mode support

Former-commit-id: 5e0e390001626c49708df336b5d20fd831a370db
---
 assets/js/settings.js | 6 +++---
 layouts/settings.html | 4 ++--
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/assets/js/settings.js b/assets/js/settings.js
index a640ca24..6aa35cd7 100644
--- a/assets/js/settings.js
+++ b/assets/js/settings.js
@@ -44,15 +44,15 @@
         textAlterButtons.forEach(button => {
           // highlight selected button
           if (button.dataset.textSize === localStorage.getItem('geedeapro.ui.fontSize')) {
-            button.classList.add('bg-neutral-200/50');
+            button.classList.add('bg-neutral-200/50', 'dark:bg-neutral-700/50');
           }
 
           // switch font size when clicked
           button.addEventListener('click', () => {
             setFontSize(button.dataset.textSize);
             // highlight selected button
-            textAlterButtons.forEach(btn => btn.classList.remove('bg-neutral-200/50'));
-            button.classList.add('bg-neutral-200/50');
+            textAlterButtons.forEach(btn => btn.classList.remove('bg-neutral-200/50', 'dark:bg-neutral-700/50'));
+            button.classList.add('bg-neutral-200/50', 'dark:bg-neutral-700/50');
           });
         });
       }
diff --git a/layouts/settings.html b/layouts/settings.html
index 8f373567..9caf15a9 100644
--- a/layouts/settings.html
+++ b/layouts/settings.html
@@ -10,12 +10,12 @@
         <h3>{{ T "settings.fontSize" . }}</h3>
         <section class="shadow">
             <div id="text-alter-buttons" class="grid grid-cols-3">
-                {{ $buttonClass := "font-extrabold bg-neutral-100 hover:bg-neutral-200/50 rounded py-5" }}
+                {{ $buttonClass := "font-extrabold bg-neutral-100 dark:bg-neutral-800 hover:bg-neutral-200/50 dark:hover:bg-neutral-700/50 rounded py-5" }}
                 <button data-text-size="small" class="{{ $buttonClass }} text-sm md:text-base">{{ T "settings.sampleText" }}</button>
                 <button data-text-size="medium" class="{{ $buttonClass }} text-base md:text-lg">{{ T "settings.sampleText" }}</button>
                 <button data-text-size="large" class="{{ $buttonClass }} text-lg md:text-xl">{{ T "settings.sampleText" }}</button>
             </div>
-            <div class="leading-relaxed bg-neutral-200/50 py-1 px-4 rounded
+            <div class="leading-relaxed bg-neutral-200/50 dark:bg-neutral-700/50 py-1 px-4 rounded
                 h-50 overflow-y-auto">
                 <p class="markdown-body">{{ T "settings.loremIpsum" . }}</p>
             </div>
-- 
cgit v1.2.3