diff options
| author | Eltrac <hi@guhub.cn> | 2025-09-10 19:52:02 +0800 |
|---|---|---|
| committer | Eltrac <hi@guhub.cn> | 2025-09-10 19:52:02 +0800 |
| commit | 5e0e390001626c49708df336b5d20fd831a370db (patch) | |
| tree | 51f478d94e1387800b9c7d85e7f804ddf7d63279 | |
| parent | 82d9b61713713b77ec152d23ca460e46897414a2 (diff) | |
fix: settings page lacks dark mode support
| -rw-r--r-- | assets/js/settings.js | 6 | ||||
| -rw-r--r-- | 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> |