feat: v0.6.0 light mode, command palette, dialogs, toasts
build-deb / Lint, test, package (push) Failing after 1m59s
build-deb / Deploy to CT 126 (push) Skipped
build-deb / Notify on failure (push) Successful in 5s

- Light mode with the house ☀/◐ toggle and lt_theme preference; light
  terminal palette; Claude runs with dark-ansi so its colours follow the
  palette; tmux and the statusLine use ANSI colours.
- Command palette (⌕, Ctrl+Shift+P) with session, terminal, view, link and
  help commands.
- .lt-modal dialogs for new/rename/end and a keyboard shortcuts sheet.
- .lt-toast results for actions, uploads, copy and CI.
- ttyd dropped the reply of fast one-shot commands; replies now wait for the
  browser to hang up, and the client hangs up as soon as it has one.
- Sessions panel re-fetches after an action instead of reusing a stale poll.

Closes #31
Closes #32
Closes #33
Closes #34
Closes #35

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
2026-10-08 00:32:23 -04:00
co-authored by Claude Opus 5.5
parent 0d86f89957
commit 05057f695d
19 changed files with 975 additions and 112 deletions
+110
View File
@@ -569,3 +569,113 @@ body.dd-touch .dd-footer {
.dd-footer .lt-footer-hints .lt-footer-hint:nth-child(n + 5),
.dd-footer .lt-footer-sep:nth-child(n + 4) { display: none; }
}
/* ---- light theme (devdesk#31) ---------------------------------------------------
base.css restyles every lt- component; these cover DevDesk's own pieces. */
html[data-theme="light"] .dd-sidebar,
html[data-theme="light"] .dd-footer { background-image: none; }
html[data-theme="light"] .dd-overlay { background: rgba(237, 240, 245, 0.82); }
html[data-theme="light"] .dd-backdrop { background: rgba(17, 24, 39, 0.28); }
html[data-theme="light"] .dd-menu { box-shadow: 0 8px 28px rgba(50, 80, 130, 0.22), var(--box-glow-cyan); }
html[data-theme="light"] .dd-drop-overlay { background: var(--accent-cyan-dim); }
html[data-theme="light"] .dd-upload-status { box-shadow: 0 4px 16px rgba(50, 80, 130, 0.18); }
html[data-theme="light"] .dd-session-item.is-waiting,
html[data-theme="light"] .dd-session-chip[data-state="waiting"],
html[data-theme="light"] .dd-upload-status.is-error { border-color: rgba(181, 0, 31, 0.35); }
html[data-theme="light"] .dd-badge { color: #ffffff; }
html[data-theme="light"] .dd-session-chip[data-state="working"] .dd-state-dot,
html[data-theme="light"] .dd-session-chip[data-state="waiting"] .dd-state-dot { box-shadow: none; }
@media (max-width: 1099px) {
html[data-theme="light"] .dd-sidebar { box-shadow: -8px 0 28px rgba(50, 80, 130, 0.22); }
}
.dd-header .lt-theme-btn { flex: 0 0 auto; }
/* ---- command palette, dialogs, toasts (devdesk#32-#34) ---------------------------- */
.dd-cmd-btn { font-size: 0.8rem; letter-spacing: 0.02em; }
.dd-cmd-kbd { font-size: 0.62rem; opacity: 0.7; }
.lt-cmd-item.is-selected .dd-cmd-hint { color: inherit; }
.dd-cmd-hint { color: var(--text-muted); font-size: 0.66rem; white-space: nowrap; }
html[data-theme="light"] .lt-cmd-item.is-selected { background: var(--accent-cyan-dim); color: var(--accent-cyan); }
.lt-cmd-results { max-height: min(420px, 60vh); }
.lt-cmd-footer span { display: inline-flex; align-items: center; gap: 2px; }
.dd-dialog-body { display: flex; flex-direction: column; gap: var(--space-sm); }
.dd-dialog-fields { display: flex; flex-direction: column; gap: var(--space-md); }
.dd-field { display: flex; flex-direction: column; gap: 4px; font-size: 0.72rem; color: var(--text-secondary); }
.dd-field .lt-input,
.dd-field .lt-select { width: 100%; font-size: 0.8rem; }
.dd-dialog-text { color: var(--text-secondary); font-size: 0.8rem; line-height: 1.5; }
.dd-dialog-hint { color: var(--text-muted); font-size: 0.7rem; }
.dd-dialog-hint.is-error { color: var(--accent-red); }
.dd-keys { display: grid; gap: var(--space-lg); }
.dd-keys-title {
margin: 0 0 var(--space-sm);
font-size: 0.68rem;
letter-spacing: 0.12em;
text-transform: uppercase;
color: var(--accent-orange);
}
.dd-keys-list { display: grid; grid-template-columns: 10.5rem 1fr; gap: 6px var(--space-md); margin: 0; font-size: 0.76rem; }
.dd-keys-list dt { white-space: nowrap; }
.dd-keys-list dd { margin: 0; color: var(--text-secondary); }
.dd-keys kbd {
padding: 1px 6px;
border: 1px solid var(--border-color);
background: var(--bg-tertiary);
color: var(--accent-cyan);
font-family: var(--font-mono);
font-size: 0.72rem;
}
.dd-footer-help {
margin-left: var(--space-sm);
padding: 0 6px;
border: 1px solid var(--border-color);
background: none;
color: var(--accent-cyan);
font-family: var(--font-mono);
font-size: 0.64rem;
cursor: pointer;
}
.dd-footer-help:hover { border-color: var(--accent-cyan); }
/* Toasts sit above the footer (and the phone key bar); names keep their case. */
#lt-toast-container {
right: var(--space-md);
bottom: calc(var(--dd-footer-height) + var(--dd-kb, 0px) + env(safe-area-inset-bottom, 0px) + var(--space-md));
max-width: calc(100vw - 2 * var(--space-md));
}
.lt-toast {
position: relative;
overflow: hidden;
text-transform: none;
letter-spacing: 0.02em;
font-size: 0.74rem;
transition: opacity 0.25s ease;
}
.lt-toast.is-leaving { opacity: 0; }
.lt-toast-msg { flex: 1; overflow-wrap: anywhere; }
.lt-toast-icon { flex: 0 0 auto; }
.lt-toast-close {
flex: 0 0 auto;
background: none;
border: 0;
color: inherit;
opacity: 0.6;
cursor: pointer;
font-size: 0.8rem;
}
.lt-toast-close:hover { opacity: 1; }
@media (max-width: 719px) {
.dd-cmd-kbd { display: none; }
#lt-toast-container { left: var(--space-sm); right: var(--space-sm); }
.lt-toast { min-width: 0; max-width: none; }
.dd-keys-list { grid-template-columns: 1fr; gap: 2px; }
.dd-keys-list dd { margin-bottom: var(--space-sm); }
}
/* One highlight only: the row under a resting pointer isn't "selected" until the
pointer moves (mousemove updates the selection). */
.lt-cmd-item:hover:not(.is-selected) { background: none; color: inherit; }