switchboard/core
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Releases 9 Wiki Activity

Changeset 0.22.0.1 (#94)

Browse Source
This commit is contained in:
xcaliber
2026-03-02 01:55:19 +00:00
parent 12e03cec8b
commit 06c4e2a5a1
33 changed files with 1929 additions and 418 deletions
Download Patch File Download Diff File Expand all files Collapse all files

114
src/css/styles.css
View File

@@ -117,6 +117,40 @@ a:hover { text-decoration: underline; }
.app { display: flex; height: 100vh; height: 100dvh; flex-direction: column; }
.app-body { display: flex; flex: 1; min-height: 0; }
/* ── Workspace (everything right of sidebar) ── */
.workspace {
display: flex; flex: 1; min-width: 0; min-height: 0;
overflow: hidden; position: relative;
}
.workspace-pane { display: flex; flex-direction: column; min-height: 0; overflow: hidden; }
.workspace-primary { flex: 1; min-width: 0; background: var(--bg); }
.workspace-secondary {
width: 0; min-width: 0; overflow: hidden;
background: var(--bg); border-left: 1px solid var(--border);
transition: width 0.25s ease, min-width 0.25s ease;
}
.workspace-secondary.open {
width: 480px; min-width: 480px;
}
.workspace-secondary.fullscreen {
position: fixed; top: 0; right: 0; bottom: 0;
width: 100% !important; min-width: 100% !important;
z-index: 100; transition: none;
}
.workspace-handle {
width: 0; flex-shrink: 0; position: relative; z-index: 10;
}
.workspace-handle.active {
width: 6px; cursor: col-resize;
}
.workspace-handle.active::after {
content: ''; position: absolute; inset: 0;
transition: background 0.15s;
}
.workspace-handle.active:hover::after { background: var(--accent); opacity: 0.3; }
.workspace-secondary.fullscreen ~ .workspace-handle { display: none; }
/* ── Environment Banners ──────────────────── */
.banner {
@@ -379,7 +413,8 @@ a:hover { text-decoration: underline; }
/* ── Chat Area ───────────────────────────── */
.chat-area { flex: 1; display: flex; flex-direction: column; min-width: 0; background: var(--bg); }
/* .chat-area is now .workspace-primary — alias kept for compat */
.chat-area, .workspace-primary { flex: 1; display: flex; flex-direction: column; min-width: 0; background: var(--bg); }
.model-bar {
display: flex; align-items: center; gap: 6px;
@@ -651,27 +686,9 @@ a:hover { text-decoration: underline; }
/* HTML preview */
/* ── Side Panel (Preview + Notes) ──────── */
.side-panel {
width: 0; min-width: 0; overflow: hidden;
background: var(--bg); border-left: 1px solid var(--border);
display: flex; flex-direction: column; position: relative;
transition: width 0.25s ease, min-width 0.25s ease;
}
.side-panel.open {
width: 480px; min-width: 480px;
}
.side-panel.fullscreen {
position: fixed; top: 0; right: 0; bottom: 0;
width: 100% !important; min-width: 100% !important;
z-index: 100;
transition: none;
}
.side-panel-resize {
position: absolute; left: -3px; top: 0; bottom: 0; width: 6px;
cursor: col-resize; z-index: 10;
}
.side-panel-resize:hover { background: var(--accent); opacity: 0.3; }
.side-panel.fullscreen .side-panel-resize { display: none; }
/* ── Secondary Pane (was .side-panel, now .workspace-secondary) ── */
/* Layout handled by .workspace-secondary above; these are internal styles */
.side-panel-header {
display: flex; align-items: center; justify-content: space-between;
padding: 8px 12px; border-bottom: 1px solid var(--border);
@@ -709,23 +726,23 @@ a:hover { text-decoration: underline; }
flex: 1; width: 100%; border: none; background: #fff;
}
/* Notes inside side panel */
/* Notes inside secondary pane */
.notes-actions-bar {
display: flex; align-items: center; gap: 8px;
padding: 8px 12px; border-bottom: 1px solid var(--border);
}
.side-panel .notes-list { padding: 4px 8px; }
.side-panel .notes-editor { padding: 8px 12px; }
.side-panel .note-read-content {
.workspace-secondary .notes-list, .side-panel .notes-list { padding: 4px 8px; }
.workspace-secondary .notes-editor, .side-panel .notes-editor { padding: 8px 12px; }
.workspace-secondary .note-read-content, .side-panel .note-read-content {
max-height: none; flex: 1; overflow-y: auto;
}
.side-panel .notes-content-input {
.workspace-secondary .notes-content-input, .side-panel .notes-content-input {
min-height: 150px;
}
.side-panel #notesListView {
.workspace-secondary #notesListView, .side-panel #notesListView {
flex: 1; overflow-y: auto; min-height: 0;
}
.side-panel #notesEditorView {
.workspace-secondary #notesEditorView, .side-panel #notesEditorView {
flex: 1; overflow-y: auto; min-height: 0;
}
@@ -737,17 +754,11 @@ a:hover { text-decoration: underline; }
/* Mobile: full-width overlay */
@media (max-width: 768px) {
.side-panel.open {
.workspace-secondary.open {
position: fixed; top: 0; right: 0; bottom: 0;
width: 100vw; min-width: 100vw; z-index: 200;
}
/* Disable dual-view on mobile — not enough space */
.side-panel-body.dual {
display: flex; flex-direction: column;
grid-template-columns: unset !important;
}
.side-panel-divider { display: none !important; }
.side-panel-dual-btn { display: none; }
.workspace-handle { display: none !important; }
/* Larger touch targets on mobile */
.side-panel-close { font-size: 20px; padding: 4px 10px; }
@@ -755,33 +766,8 @@ a:hover { text-decoration: underline; }
.side-panel-header { padding: 10px 12px; }
}
/* ── Dual-View Mode ───────────────────────── */
.side-panel.dual-open {
width: 680px; min-width: 680px;
}
.side-panel-body.dual {
display: grid;
grid-template-columns: 1fr 6px 1fr;
overflow: hidden;
}
.side-panel-body.dual > .side-panel-page {
overflow-y: auto; min-width: 0; min-height: 0;
}
.side-panel-divider {
grid-column: 2;
width: 6px; cursor: col-resize;
background: var(--border);
transition: background 0.15s;
flex-shrink: 0;
}
.side-panel-divider:hover,
.side-panel-divider:active {
background: var(--accent); opacity: 0.5;
}
.side-panel-dual-btn.active {
background: var(--accent); color: var(--bg);
}
/* Dual-view removed in workspace refactor (v0.22.0) — workspace
handles all pane placement via primary/secondary slots. */
.msg-text ul, .msg-text ol { margin: 0.4em 0; padding-left: 1.5em; }
.msg-text li { margin: 0.2em 0; }