From dcfe2a667c18bf53d22305071196406ffb886ad2 Mon Sep 17 00:00:00 2001
From: Brad Arant <barant@barant.com>
Date: Mon, 7 Sep 2026 04:09:12 +0000
Subject: [PATCH] Restyle htmleditor.page to match site theme, remove email
 disconnect button

htmleditor.page previously used hardcoded blue/gray Windows-95-era
inline styles (#678, #abc, #808080, #def) totally disconnected from
the site current dark/gold Bond theme (main.css --bond-* variables) -
this is what showed up as "the old page with the blue stylesheet"
when opening a file to edit. Restyled the window chrome, toolbar,
title bar, and buttons to use the same custom properties/.button
class the rest of the site uses; left the #mainpage content-preview
canvas white since it renders the actual page being edited.

email.js: removed the Disconnect button/handler and its unused icon
from the email toolbar per request. Bumped its cache-buster in
admin-email.subpage.
---
 jetc/barant-site/assets/images/email.js  | 24 ----------
 jetc/barant-site/src/admin-email.subpage |  2 +-
 jetc/barant-site/src/htmleditor.page     | 58 ++++++++++++------------
 3 files changed, 30 insertions(+), 54 deletions(-)

diff --git a/jetc/barant-site/assets/images/email.js b/jetc/barant-site/assets/images/email.js
index 8350cc3..9313894 100644
--- a/jetc/barant-site/assets/images/email.js
+++ b/jetc/barant-site/assets/images/email.js
@@ -24,12 +24,6 @@
       '<path d="M20 11a8 8 0 0 0-14.6-4.4M4 4v5h5"/>' +
       '<path d="M4 13a8 8 0 0 0 14.6 4.4M20 20v-5h-5"/>' +
       '</svg>',
-    disconnect:
-      '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round">' +
-      '<path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"/>' +
-      '<path d="M16 17l5-5-5-5"/>' +
-      '<path d="M21 12H9"/>' +
-      '</svg>',
     flag:
       '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round">' +
       '<path d="M5 3v18"/>' +
@@ -142,7 +136,6 @@
       '</span>' +
       '<button type="button" id="email-compose-btn" class="icon-btn" title="New Mail">' + ICONS.compose + '</button>' +
       '<button type="button" id="email-refresh-btn" class="icon-btn" title="Refresh">' + ICONS.refresh + '</button>' +
-      '<button type="button" id="email-disconnect-btn" class="icon-btn" title="Disconnect">' + ICONS.disconnect + '</button>' +
       '</span>' +
       '</div>' +
       '<div id="email-layout">' +
@@ -202,23 +195,6 @@
     document.getElementById('email-refresh-btn').addEventListener('click', function() {
       loadMessageList();
     });
-    document.getElementById('email-disconnect-btn').addEventListener('click', function() {
-      // Disconnecting only ever drops the ACTIVE account now (see
-      // /email/disconnect's own doc comment in email.jet) - if another
-      // already-connected account remains, res.active names it and the
-      // view just switches there instead of falling back to the
-      // connect form.
-      post('/email/disconnect', {}).then(function(res) {
-        if (res.active) {
-          resetViewForActiveAccount(res.active);
-        } else {
-          currentFolder = 'Inbox';
-          currentUid = null;
-          syncActiveFolder();
-          showConnectForm();
-        }
-      });
-    });
 
     // Matches sender, subject, or body content in whatever folder is
     // currently open (see __imap.cpp's searchMessages()) - an empty
diff --git a/jetc/barant-site/src/admin-email.subpage b/jetc/barant-site/src/admin-email.subpage
index 2e32e50..ffa4ee5 100644
--- a/jetc/barant-site/src/admin-email.subpage
+++ b/jetc/barant-site/src/admin-email.subpage
@@ -135,4 +135,4 @@
  </div>
 </if>
 </div>
-<script src="/assets/email.js?v=20260905o"></script>
+<script src="/assets/email.js?v=20260907a"></script>
diff --git a/jetc/barant-site/src/htmleditor.page b/jetc/barant-site/src/htmleditor.page
index 4923ed5..70f6c56 100644
--- a/jetc/barant-site/src/htmleditor.page
+++ b/jetc/barant-site/src/htmleditor.page
@@ -49,22 +49,22 @@ $[filelist]
 
   <div style="position: relative;">
 
-  <div id="window1" style="position: absolute; left: 0px; top: 0px; border: 1pt solid black; display: inline-block; padding: 2px; background: #808080; color: #ffffff;"
+  <div id="window1" style="position: absolute; left: 0px; top: 0px; border: 1px solid var(--bond-line); display: inline-block; padding: 2px; background: var(--bond-panel); color: var(--bond-text);"
 onmousemove="window_mousemove(this, event); return true;"
 onmousedown="window_mousedown(this, event); return true;"
 onmouseup="window_mouseup(this, event); return true;">
-  <div style="background-color: #678; height: 21px; padding: 2px 2px 2px 2px;">
-    <div style="float: left;"><b style="padding: 2px 8px;">$[letter_dir]/$[letter_file]</b></div>
-    <div style="float: left;"><button type="button" onclick="save(this.form);">SAVE</button></div>
-    <div style="float: left;"><button type="button" onclick="savenexit(this.form);">SAVE AND EXIT</button></div>
-    <div style="float: right;"><button type="button" onclick="exitnosave(this.form);">EXIT NO SAVE</button></div>
+  <div style="background: linear-gradient(180deg, #1c1c24, #101014); height: 21px; padding: 2px 2px 2px 2px;">
+    <div style="float: left;"><b style="padding: 2px 8px; color: var(--bond-gold-bright);">$[letter_dir]/$[letter_file]</b></div>
+    <div style="float: left;"><button type="button" class="button" onclick="save(this.form);">SAVE</button></div>
+    <div style="float: left;"><button type="button" class="button" onclick="savenexit(this.form);">SAVE AND EXIT</button></div>
+    <div style="float: right;"><button type="button" class="button" onclick="exitnosave(this.form);">EXIT NO SAVE</button></div>
   </div>
-  <div style="background-color: #abc; padding: 0px 2px 6px 2px;">
-   <div style="float: left; display: inline-block; margin: 2px 2px 2px 0px; border-radius: 3px; width: 18px; height: 18px; border: 1px solid #012; background-color: #def; cursor: pointer;" onclick="return do_undo();"><img width="18" src="/assets/htmleditor_undo.png"></div>
-   <div style="float: left; display: inline-block; margin: 2px 2px 2px 0px; border-radius: 3px; width: 18px; height: 18px; border: 1px solid #012; background-color: #def; cursor: pointer;" onclick="return do_redo();"><img width="18" src="/assets/htmleditor_redo.png"></div>
+  <div style="background: var(--bond-bg-2); padding: 0px 2px 6px 2px;">
+   <div style="float: left; display: inline-block; margin: 2px 2px 2px 0px; border-radius: 3px; width: 18px; height: 18px; border: 1px solid var(--bond-line); background-color: var(--bond-panel-2); cursor: pointer;" onclick="return do_undo();"><img width="18" src="/assets/htmleditor_undo.png"></div>
+   <div style="float: left; display: inline-block; margin: 2px 2px 2px 0px; border-radius: 3px; width: 18px; height: 18px; border: 1px solid var(--bond-line); background-color: var(--bond-panel-2); cursor: pointer;" onclick="return do_redo();"><img width="18" src="/assets/htmleditor_redo.png"></div>
    &nbsp;
    <div style="display: inline-block; float: left; margin: 2px 0px 0px 0px;">
-   <select style="border: 1pt solid #123; border-radius: 3px; background-color: #def;" onchange="document.execCommand('formatBlock',false,this.value);return true;">
+   <select style="border: 1px solid var(--bond-line); border-radius: 3px; background-color: var(--bond-panel-2); color: var(--bond-text);" onchange="document.execCommand('formatBlock',false,this.value);return true;">
    <option value="p">Paragraph</option>
    <option value="h1">Heading 1</option>
    <option value="h2">Heading 2</option>
@@ -72,13 +72,13 @@ onmouseup="window_mouseup(this, event); return true;">
    <option value="pre">Monospace</option>
    </select>
    </div>
-   <div style="float: left; display: inline-block; margin: 2px 2px 2px 5px; border-radius: 3px; width: 18px; height: 18px; border: 1px solid #012; background-color: #def; cursor: pointer;" onclick="document.execCommand('bold');return true;"><img width="14" style="padding: 2px;" src="/assets/htmleditor_bold.png"></div>
-   <div style="float: left; display: inline-block; margin: 2px 2px 2px 0px; border-radius: 3px; width: 18px; height: 18px; border: 1px solid #012; background-color: #def; cursor: pointer;" onclick="document.execCommand('underline');return true;"><img width="14" style="padding: 2px;" src="/assets/htmleditor_underline.png"></div>
-   <div style="float: left; display: inline-block; margin: 2px 2px 2px 5px; border-radius: 3px; width: 18px; height: 18px; border: 1px solid #012; background-color: #def; cursor: pointer;" onclick="document.execCommand('justifyLeft');return true;"><img width="14" style="padding: 2px;" src="/assets/htmleditor_jl.png"></div>
-   <div style="float: left; display: inline-block; margin: 2px 2px 2px 0px; border-radius: 3px; width: 18px; height: 18px; border: 1px solid #012; background-color: #def; cursor: pointer;" onclick="document.execCommand('justifyCenter');return true;"><img width="14" style="padding: 2px;" src="/assets/htmleditor_jc.png"></div>
-   <div style="float: left; display: inline-block; margin: 2px 2px 2px 0px; border-radius: 3px; width: 18px; height: 18px; border: 1px solid #012; background-color: #def; cursor: pointer;" onclick="document.execCommand('justifyRight');return true;"><img width="14" style="padding: 2px;" src="/assets/htmleditor_jr.png"></div>
-   <div style="float: left; display: inline-block; margin: 2px 2px 2px 0px; border-radius: 3px; width: 18px; height: 18px; border: 1px solid #012; background-color: #def; cursor: pointer;" onclick="document.execCommand('justifyFull');return true;"><img width="14" style="padding: 2px;" src="/assets/htmleditor_jj.png"></div>
-   <div id="map" style="display: inline-block; color: #012; font-size: 10px;"></div>
+   <div style="float: left; display: inline-block; margin: 2px 2px 2px 5px; border-radius: 3px; width: 18px; height: 18px; border: 1px solid var(--bond-line); background-color: var(--bond-panel-2); cursor: pointer;" onclick="document.execCommand('bold');return true;"><img width="14" style="padding: 2px;" src="/assets/htmleditor_bold.png"></div>
+   <div style="float: left; display: inline-block; margin: 2px 2px 2px 0px; border-radius: 3px; width: 18px; height: 18px; border: 1px solid var(--bond-line); background-color: var(--bond-panel-2); cursor: pointer;" onclick="document.execCommand('underline');return true;"><img width="14" style="padding: 2px;" src="/assets/htmleditor_underline.png"></div>
+   <div style="float: left; display: inline-block; margin: 2px 2px 2px 5px; border-radius: 3px; width: 18px; height: 18px; border: 1px solid var(--bond-line); background-color: var(--bond-panel-2); cursor: pointer;" onclick="document.execCommand('justifyLeft');return true;"><img width="14" style="padding: 2px;" src="/assets/htmleditor_jl.png"></div>
+   <div style="float: left; display: inline-block; margin: 2px 2px 2px 0px; border-radius: 3px; width: 18px; height: 18px; border: 1px solid var(--bond-line); background-color: var(--bond-panel-2); cursor: pointer;" onclick="document.execCommand('justifyCenter');return true;"><img width="14" style="padding: 2px;" src="/assets/htmleditor_jc.png"></div>
+   <div style="float: left; display: inline-block; margin: 2px 2px 2px 0px; border-radius: 3px; width: 18px; height: 18px; border: 1px solid var(--bond-line); background-color: var(--bond-panel-2); cursor: pointer;" onclick="document.execCommand('justifyRight');return true;"><img width="14" style="padding: 2px;" src="/assets/htmleditor_jr.png"></div>
+   <div style="float: left; display: inline-block; margin: 2px 2px 2px 0px; border-radius: 3px; width: 18px; height: 18px; border: 1px solid var(--bond-line); background-color: var(--bond-panel-2); cursor: pointer;" onclick="document.execCommand('justifyFull');return true;"><img width="14" style="padding: 2px;" src="/assets/htmleditor_jj.png"></div>
+   <div id="map" style="display: inline-block; color: var(--bond-text-dim); font-size: 10px;"></div>
 </div>
 
   <div id="mainpage"
@@ -93,16 +93,16 @@ onmouseup="window_mouseup(this, event); return true;">
 
 
   <div id="window3" style="position:absolute; top: 235px; left: 1010px;
-       border: 1pt solid black; display: inline-block; padding: 2px; background: #808080; color: #ffffff;">
+       border: 1px solid var(--bond-line); display: inline-block; padding: 2px; background: var(--bond-panel); color: var(--bond-text);">
 
-  <span>Options</span>
+  <span style="color: var(--bond-gold-bright);">Options</span>
 
-  <div style="width: 320px; color: #000000; border: 1px solid black; position: relative; background: #ffffff;">
+  <div style="width: 320px; color: var(--bond-text); border: 1px solid var(--bond-line); position: relative; background: var(--bond-bg-2);">
 
   <div id="controls">
     <input type="checkbox" name="grid" onchange="showGrid = this.checked; drawGrid(); return true;"><span style="font-size: 12px; margin-bottom: 2px;">Show Grid</span><br>
     <input type="checkbox" name="snaptogrid" onchange="snapToGrid = this.checked; return true;"><span style="font-size: 12px; margin-bottom: 2px;">Snap To Grid</span><br>
-    <span style="font-size: 12px; margin-bottom: 2px;">Grid Size: </span><input type="text" name="gridsize" id="gridsize" style="width: 20px;" size="3" onchange="gridSize = parseInt(this.value); drawGrid(); return true;"><br>
+    <span style="font-size: 12px; margin-bottom: 2px;">Grid Size: </span><input type="text" name="gridsize" id="gridsize" class="fieldinput" style="width: 20px;" size="3" onchange="gridSize = parseInt(this.value); drawGrid(); return true;"><br>
   </div>
 
   <div id="itemparameters" style="font-size: 12px;"></div>
@@ -116,27 +116,27 @@ onmouseup="window_mouseup(this, event); return true;">
 
 
 
-  <div id="window2" style="position:absolute; top: 0px; left: 1010px; border: 1pt solid black; display: inline-block; padding: 2px; background: #808080; color: #ffffff;">
-  <span>Toolbar</span>
-  <div id="toolbar" style="overflow-y: auto; width: 200px; height: 300px; border: 1px solid black; position: relative; background: #ffffff;">
+  <div id="window2" style="position:absolute; top: 0px; left: 1010px; border: 1px solid var(--bond-line); display: inline-block; padding: 2px; background: var(--bond-panel); color: var(--bond-text);">
+  <span style="color: var(--bond-gold-bright);">Toolbar</span>
+  <div id="toolbar" style="overflow-y: auto; width: 200px; height: 300px; border: 1px solid var(--bond-line); position: relative; background: var(--bond-bg-2);">
   </div>
   </div>
 
 
 
   <div id="window4" style="position:absolute; top: 860px; left: 0px;
-       border: 1pt solid black; display: inline-block; padding: 2px; background: #808080; color: #ffffff;">
+       border: 1px solid var(--bond-line); display: inline-block; padding: 2px; background: var(--bond-panel); color: var(--bond-text);">
 
-  <span>Images</span>
+  <span style="color: var(--bond-gold-bright);">Images</span>
 
-  <div style="width: 1000px; height: 300px; color: #000000; border: 1px solid black; position: relative; background: #ffffff;">
+  <div style="width: 1000px; height: 300px; color: var(--bond-text); border: 1px solid var(--bond-line); position: relative; background: var(--bond-bg-2);">
   <div id="controls" style="overflow-y: scroll; max-height: 275px; padding: 3px;">
    <div style="display: inline-block;">
-   <div style="width: 100px; height: 100px; border: 1px solid #000; margin: 5px 0px 5px 5px; background-image: url('/assets/htmleditor_drinkwise_logo.png'); background-size: contain; background-repeat: no-repeat; cursor: pointer;" onmousedown="newImage('htmleditor_drinkwise_logo.png', event); return true;"></div>
+   <div style="width: 100px; height: 100px; border: 1px solid var(--bond-line); margin: 5px 0px 5px 5px; background-image: url('/assets/htmleditor_drinkwise_logo.png'); background-size: contain; background-repeat: no-repeat; cursor: pointer;" onmousedown="newImage('htmleditor_drinkwise_logo.png', event); return true;"></div>
    <div style="font-size: 8px;">drinkwise_logo.png</div>
    </div>
    <div style="display: inline-block;">
-   <div style="width: 100px; height: 100px; border: 1px solid #000; margin: 5px 0px 5px 5px; background-image: url('/assets/htmleditor_dwbackground.png'); background-size: contain; background-repeat: no-repeat; cursor: pointer;" onmousedown="newImage('htmleditor_dwbackground.png', event); return true;"></div>
+   <div style="width: 100px; height: 100px; border: 1px solid var(--bond-line); margin: 5px 0px 5px 5px; background-image: url('/assets/htmleditor_dwbackground.png'); background-size: contain; background-repeat: no-repeat; cursor: pointer;" onmousedown="newImage('htmleditor_dwbackground.png', event); return true;"></div>
    <div style="font-size: 8px;">dwbackground.png</div>
    </div>
   </div>