BitSquare/Codeman
2
0
Fork 0
mirror of https://github.com/Ark0N/Codeman.git synced 2026-10-07 07:59:42 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat: merge Process Monitor and Background Tasks into single Monitor panel

Browse Source 
- Combine two separate panels into unified Monitor panel with sections
- Move font size controls from toolbar to header
- Add CSS styles for new monitor panel with section headers
- Update JS to handle combined panel with toggleMonitorPanel()
- Keep legacy toggleTaskPanel() as alias for backward compatibility

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
arkon
2026-01-19 02:48:28 +01:00
co-authored by Claude Opus 4.5
parent c2177b659e
commit 89c9b0fe85
3 changed files with 174 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/web/public/styles.css
+117
View File
@@ -208,6 +208,34 @@ body {
transform: rotate(45deg);
}
.btn-icon-header.btn-sm {
width: 20px;
height: 20px;
font-size: 0.7rem;
font-weight: 600;
}
.btn-icon-header.btn-sm:hover {
transform: none;
}
.header-font-controls {
display: flex;
align-items: center;
gap: 0.25rem;
padding: 0.15rem 0.4rem;
background: var(--bg-input);
border-radius: 4px;
}
.header-font-controls .font-size-display {
font-size: 0.7rem;
color: var(--text-muted);
min-width: 18px;
text-align: center;
font-family: 'SF Mono', Monaco, monospace;
}
/* Session tab gear icon */
.session-tab .tab-gear {
opacity: 0;
@@ -1236,6 +1264,95 @@ kbd {
color: var(--yellow);
}
/* Combined Monitor Panel (Screen Sessions + Background Tasks) */
.monitor-panel {
position: fixed;
bottom: var(--toolbar-height);
right: 0.5rem;
width: 420px;
max-width: calc(100vw - 1rem);
max-height: 60vh;
background: var(--bg-card);
border: 1px solid var(--border);
border-bottom: none;
border-radius: 8px 8px 0 0;
box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.4);
z-index: 100;
transform: translateY(100%);
transition: transform 0.2s ease;
display: flex;
flex-direction: column;
}
.monitor-panel.open {
transform: translateY(0);
}
.monitor-panel-header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 0.6rem 1rem;
border-bottom: 1px solid var(--border);
font-size: 0.85rem;
font-weight: 500;
flex-shrink: 0;
}
.monitor-panel-actions {
display: flex;
align-items: center;
gap: 0.5rem;
}
.monitor-panel-body {
flex: 1;
overflow-y: auto;
padding: 0;
}
.monitor-section {
border-bottom: 1px solid var(--border);
}
.monitor-section:last-child {
border-bottom: none;
}
.monitor-section-header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 0.5rem 1rem;
background: var(--bg-input);
font-size: 0.75rem;
font-weight: 500;
color: var(--text-muted);
text-transform: uppercase;
letter-spacing: 0.5px;
}
.monitor-section-body {
padding: 0.5rem;
max-height: 25vh;
overflow-y: auto;
}
.monitor-empty {
padding: 1rem;
text-align: center;
color: var(--text-muted);
font-size: 0.8rem;
}
.task-stats {
font-size: 0.65rem;
color: var(--text-dim);
padding: 0.15rem 0.4rem;
background: var(--bg-card);
border-radius: 8px;
}
/* Responsive */
@media (max-width: 600px) {
.header-brand {