From 3a102ba9d8b5425bb47275228b836980ee57c825 Mon Sep 17 00:00:00 2001
From: Brian Krabach <brkrabac@microsoft.com>
Date: Mon, 30 Mar 2026 22:07:38 -0700
Subject: [PATCH] fix: add 18px font option, click-outside-dialog to dismiss
 settings

Added 18px to font size select. Dialog click handler checks
e.target === settingsDialog (click landed on ::backdrop area,
not dialog content) and closes settings.
---
 muxplex/frontend/app.js     | 8 +++++++-
 muxplex/frontend/index.html | 1 +
 2 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/muxplex/frontend/app.js b/muxplex/frontend/app.js
index 43f5e99..fe210be 100644
--- a/muxplex/frontend/app.js
+++ b/muxplex/frontend/app.js
@@ -1595,7 +1595,13 @@ function bindStaticEventListeners() {
   on($('settings-close-btn'), 'click', closeSettings);
   on($('settings-backdrop'), 'click', closeSettings);
   const settingsDialog = $('settings-dialog');
-  if (settingsDialog) settingsDialog.addEventListener('cancel', closeSettings);
+  if (settingsDialog) {
+    settingsDialog.addEventListener('cancel', closeSettings);
+    // Click on the ::backdrop area (outside dialog content) dismisses settings
+    settingsDialog.addEventListener('click', function(e) {
+      if (e.target === settingsDialog) closeSettings();
+    });
+  }
   document.querySelectorAll('.settings-tab').forEach(function(tab) {
     on(tab, 'click', function() { switchSettingsTab(tab.dataset.tab); });
   });
diff --git a/muxplex/frontend/index.html b/muxplex/frontend/index.html
index b96b453..e2e274a 100644
--- a/muxplex/frontend/index.html
+++ b/muxplex/frontend/index.html
@@ -99,6 +99,7 @@
               <option value="13">13</option>
               <option value="14" selected>14</option>
               <option value="16">16</option>
+              <option value="18">18</option>
             </select>
           </div>
           <div class="settings-field">