Update

static/js/config.js

@@ -13,7 +13,6 @@ const SPECIAL_CARD_ORDER = {
     '☕': 3,
 };
 
-const themeToggleBtn = document.getElementById('theme-toggle');
 const roomConfigForm = document.getElementById('room-config-form');
 const statusLine = document.getElementById('config-status');
 const scaleSelect = document.getElementById('estimation-scale');
@@ -29,14 +28,14 @@ const usernameInput = document.getElementById('username');
 const savePresetButton = document.getElementById('save-preset');
 const pickerToggleButton = document.getElementById('preset-picker-toggle');
 const shareDeckButton = document.getElementById('share-deck');
-const presetPicker = document.getElementById('preset-picker');
+const presetModalOverlay = document.getElementById('preset-modal-overlay');
+const presetModalCloseButton = document.getElementById('preset-modal-close');
+const presetModalDoneButton = document.getElementById('preset-modal-done');
 const presetList = document.getElementById('preset-list');
 const importToggleButton = document.getElementById('import-toggle');
 const importPane = document.getElementById('import-pane');
 const importInput = document.getElementById('import-b64');
 const importApplyButton = document.getElementById('import-apply');
-
-let isDarkMode = false;
 let nextCardID = 1;
 let currentCards = [];
 let draggingCardID = '';
@@ -48,17 +47,6 @@ if (savedUsername && !usernameInput.value) {
     usernameInput.value = savedUsername;
 }
 
-themeToggleBtn.addEventListener('click', () => {
-    isDarkMode = !isDarkMode;
-    if (isDarkMode) {
-        document.documentElement.setAttribute('data-theme', 'dark');
-        themeToggleBtn.textContent = 'Light Mode';
-        return;
-    }
-
-    document.documentElement.removeAttribute('data-theme');
-    themeToggleBtn.textContent = 'Dark Mode';
-});
 
 function parseNumericCard(value) {
     if (!/^-?\d+(\.\d+)?$/.test(value)) {
@@ -341,13 +329,13 @@ function renderPresetList() {
 }
 
 function showPresetPicker() {
-    presetPicker.classList.remove('hidden');
+    presetModalOverlay.classList.remove('hidden');
     pickerToggleButton.setAttribute('aria-expanded', 'true');
     renderPresetList();
 }
 
 function hidePresetPicker() {
-    presetPicker.classList.add('hidden');
+    presetModalOverlay.classList.add('hidden');
     pickerToggleButton.setAttribute('aria-expanded', 'false');
 }
 
@@ -414,7 +402,7 @@ savePresetButton.addEventListener('click', () => {
 });
 
 pickerToggleButton.addEventListener('click', () => {
-    if (presetPicker.classList.contains('hidden')) {
+    if (presetModalOverlay.classList.contains('hidden')) {
         showPresetPicker();
         return;
     }
@@ -464,20 +452,15 @@ importApplyButton.addEventListener('click', () => {
     }
 });
 
-document.addEventListener('click', (event) => {
-    const target = event.target;
-    if (!(target instanceof Element)) {
-        return;
+presetModalOverlay.addEventListener('click', (event) => {
+    if (event.target === presetModalOverlay) {
+        hidePresetPicker();
     }
-    if (presetPicker.classList.contains('hidden')) {
-        return;
-    }
-    if (presetPicker.contains(target) || pickerToggleButton.contains(target)) {
-        return;
-    }
-    hidePresetPicker();
 });
 
+presetModalCloseButton.addEventListener('click', hidePresetPicker);
+presetModalDoneButton.addEventListener('click', hidePresetPicker);
+
 customCardInput.addEventListener('keydown', (event) => {
     if (event.key === 'Enter') {
         event.preventDefault();