fix(ui): workspace pane now respects app theme (#807)

Closes #786. Seven hardcoded dark-mode rgba values replaced with theme-aware CSS vars.
This commit is contained in:
nesquena-hermes
2026-04-21 10:36:33 -07:00
committed by GitHub
parent 312a493a72
commit e05fc4e0e4
3 changed files with 12 additions and 7 deletions

View File

@@ -1,5 +1,10 @@
# Hermes Web UI -- Changelog # Hermes Web UI -- Changelog
## [v0.50.131] — 2026-04-21
### Fixed
- **Workspace pane now respects the app theme** — six hardcoded dark-mode `rgba(255,255,255,...)` colors in the workspace panel CSS have been replaced with theme-aware CSS variables (`--hover-bg`, `--border2`, `--code-inline-bg`). The file list hover, panel icon buttons, preview table rows, and the preview edit textarea now all update correctly when switching between light and dark themes. Reported in #786. (#807)
## [v0.50.130] — 2026-04-21 ## [v0.50.130] — 2026-04-21
### Fixed ### Fixed

View File

@@ -401,7 +401,7 @@
<pre class="preview-code" id="previewCode"></pre> <pre class="preview-code" id="previewCode"></pre>
<div class="preview-img-wrap" id="previewImgWrap" style="display:none"><img class="preview-img" id="previewImg" src="" alt=""></div> <div class="preview-img-wrap" id="previewImgWrap" style="display:none"><img class="preview-img" id="previewImg" src="" alt=""></div>
<div class="preview-md" id="previewMd" style="display:none"></div> <div class="preview-md" id="previewMd" style="display:none"></div>
<textarea id="previewEditArea" style="display:none;flex:1;width:100%;background:var(--code-bg);color:#e2e8f0;border:1px solid var(--border2);border-radius:8px;padding:12px;font-family:'SF Mono',ui-monospace,monospace;font-size:12px;line-height:1.6;resize:none;outline:none" oninput="_previewDirty=true;updateEditBtn()"></textarea> <textarea id="previewEditArea" style="display:none;flex:1;width:100%;background:var(--code-bg);color:var(--pre-text);border:1px solid var(--border2);border-radius:8px;padding:12px;font-family:'SF Mono',ui-monospace,monospace;font-size:12px;line-height:1.6;resize:none;outline:none" oninput="_previewDirty=true;updateEditBtn()"></textarea>
</div> </div>
</aside> </aside>
</div> </div>

View File

@@ -577,7 +577,7 @@
.panel-actions{display:flex;gap:4px;} .panel-actions{display:flex;gap:4px;}
.mobile-close-btn{display:none;} .mobile-close-btn{display:none;}
.panel-icon-btn{width:24px;height:24px;background:none;border:none;color:var(--muted);cursor:pointer;border-radius:5px;font-size:13px;display:flex;align-items:center;justify-content:center;transition:all .15s;} .panel-icon-btn{width:24px;height:24px;background:none;border:none;color:var(--muted);cursor:pointer;border-radius:5px;font-size:13px;display:flex;align-items:center;justify-content:center;transition:all .15s;}
.panel-icon-btn:hover{background:rgba(255,255,255,.08);color:var(--text);} .panel-icon-btn:hover{background:var(--hover-bg);color:var(--text);}
.panel-icon-btn:disabled{opacity:.35;cursor:not-allowed;} .panel-icon-btn:disabled{opacity:.35;cursor:not-allowed;}
.panel-icon-btn:disabled:hover{background:none;color:var(--muted);} .panel-icon-btn:disabled:hover{background:none;color:var(--muted);}
/* File row actions (shown on hover) */ /* File row actions (shown on hover) */
@@ -594,7 +594,7 @@
.breadcrumb-sep{color:var(--border);margin:0 1px;font-size:11px;} .breadcrumb-sep{color:var(--border);margin:0 1px;font-size:11px;}
.file-tree{flex:1;overflow-y:auto;padding:8px;} .file-tree{flex:1;overflow-y:auto;padding:8px;}
.file-item{display:flex;align-items:center;gap:6px;padding:6px 10px;border-radius:8px;cursor:pointer;font-size:12px;color:var(--muted);transition:all .12s;min-width:0;} .file-item{display:flex;align-items:center;gap:6px;padding:6px 10px;border-radius:8px;cursor:pointer;font-size:12px;color:var(--muted);transition:all .12s;min-width:0;}
.file-item:hover{background:rgba(255,255,255,.07);color:var(--text);} .file-item:hover{background:var(--hover-bg);color:var(--text);}
.file-item.active{background:var(--accent-bg);color:var(--accent-text);} .file-item.active{background:var(--accent-bg);color:var(--accent-text);}
.file-tree-toggle{font-size:10px;color:var(--muted);flex-shrink:0;width:10px;text-align:center;line-height:1;} .file-tree-toggle{font-size:10px;color:var(--muted);flex-shrink:0;width:10px;text-align:center;line-height:1;}
.file-item.file-empty{color:var(--muted);opacity:.5;font-style:italic;cursor:default;font-size:11px;} .file-item.file-empty{color:var(--muted);opacity:.5;font-style:italic;cursor:default;font-size:11px;}
@@ -623,16 +623,16 @@
.preview-md a{color:var(--blue);text-decoration:underline;} .preview-md a{color:var(--blue);text-decoration:underline;}
.preview-md hr{border:none;border-top:1px solid var(--border);margin:12px 0;} .preview-md hr{border:none;border-top:1px solid var(--border);margin:12px 0;}
.preview-md table{border-collapse:collapse;width:100%;margin:8px 0;font-size:12px;} .preview-md table{border-collapse:collapse;width:100%;margin:8px 0;font-size:12px;}
.preview-md th{background:rgba(255,255,255,.07);padding:6px 10px;text-align:left;font-weight:600;border:1px solid var(--border2);} .preview-md th{background:var(--hover-bg);padding:6px 10px;text-align:left;font-weight:600;border:1px solid var(--border2);}
.preview-md td{padding:5px 10px;border:1px solid rgba(255,255,255,.06);} .preview-md td{padding:5px 10px;border:1px solid var(--border2);}
.preview-md tr:nth-child(even){background:rgba(255,255,255,.03);} .preview-md tr:nth-child(even){background:var(--code-inline-bg);}
/* #486: inline code inside table cells needs scaled sizing to avoid overflow/clipping */ /* #486: inline code inside table cells needs scaled sizing to avoid overflow/clipping */
.preview-md td code,.preview-md th code{font-size:0.85em;padding:1px 4px;vertical-align:baseline;} .preview-md td code,.preview-md th code{font-size:0.85em;padding:1px 4px;vertical-align:baseline;}
/* File type badge in preview path bar */ /* File type badge in preview path bar */
.preview-badge{display:inline-block;font-size:10px;font-weight:600;padding:2px 6px;border-radius:4px;margin-left:8px;text-transform:uppercase;letter-spacing:.06em;} .preview-badge{display:inline-block;font-size:10px;font-weight:600;padding:2px 6px;border-radius:4px;margin-left:8px;text-transform:uppercase;letter-spacing:.06em;}
.preview-badge.img{background:var(--accent-bg);color:var(--accent-text);} .preview-badge.img{background:var(--accent-bg);color:var(--accent-text);}
.preview-badge.md{background:var(--accent-bg-strong);color:var(--accent-text);} .preview-badge.md{background:var(--accent-bg-strong);color:var(--accent-text);}
.preview-badge.code{background:rgba(255,255,255,.07);color:var(--muted);} .preview-badge.code{background:var(--hover-bg);color:var(--muted);}
::-webkit-scrollbar{width:4px;height:4px} ::-webkit-scrollbar{width:4px;height:4px}
::-webkit-scrollbar-track{background:transparent} ::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(255,255,255,.1);border-radius:99px;transition:background .2s} ::-webkit-scrollbar-thumb{background:rgba(255,255,255,.1);border-radius:99px;transition:background .2s}