fix session with split screens
This commit is contained in:
+60
-4
@@ -33,6 +33,12 @@ html, body { height: 100%; background: #0d0f14; color: #e2e8f0;
|
||||
border-color: rgba(255,255,255,0.08);
|
||||
}
|
||||
.tab-label { cursor: pointer; }
|
||||
.tab-rename-input {
|
||||
background: #0d0f14; border: 1px solid rgba(110,231,183,0.45);
|
||||
border-radius: 3px; color: #e2e8f0; font-size: 11px;
|
||||
font-family: inherit; padding: 1px 5px; outline: none;
|
||||
width: 90px; min-width: 40px;
|
||||
}
|
||||
.tab-x {
|
||||
width: 16px; height: 16px; border: none; border-radius: 3px;
|
||||
background: transparent; color: inherit; cursor: pointer;
|
||||
@@ -54,7 +60,53 @@ html, body { height: 100%; background: #0d0f14; color: #e2e8f0;
|
||||
#termContainer {
|
||||
position: fixed; top: 36px; left: 0; right: 0; bottom: 48px;
|
||||
}
|
||||
.term-pane { width: 100%; height: 100%; }
|
||||
|
||||
/* One per tab — holds the entire pane tree for that tab */
|
||||
.tab-pane { width: 100%; height: 100%; }
|
||||
|
||||
/* Leaf node — wraps an xterm canvas */
|
||||
.term-pane { width: 100%; height: 100%; overflow: hidden; }
|
||||
|
||||
/* Active pane highlight (shown only when 2+ panes exist in a tab) */
|
||||
.pane-active { box-shadow: inset 0 0 0 1px rgba(110,231,183,0.45); }
|
||||
|
||||
/* ── Split containers ── */
|
||||
/* dir 'h': side-by-side with a vertical divider */
|
||||
.split-h {
|
||||
display: flex; flex-direction: row;
|
||||
width: 100%; height: 100%; overflow: hidden;
|
||||
}
|
||||
/* dir 'v': stacked with a horizontal divider */
|
||||
.split-v {
|
||||
display: flex; flex-direction: column;
|
||||
width: 100%; height: 100%; overflow: hidden;
|
||||
}
|
||||
|
||||
/* ── Draggable dividers ── */
|
||||
.split-div-h {
|
||||
flex: 0 0 4px; height: 100%;
|
||||
background: rgba(255,255,255,0.07);
|
||||
cursor: col-resize;
|
||||
transition: background 0.15s;
|
||||
position: relative;
|
||||
}
|
||||
.split-div-h::after {
|
||||
content: ''; position: absolute; inset: 0 -2px;
|
||||
/* wider hit target without affecting layout */
|
||||
}
|
||||
.split-div-h:hover { background: rgba(110,231,183,0.35); }
|
||||
|
||||
.split-div-v {
|
||||
flex: 0 0 4px; width: 100%;
|
||||
background: rgba(255,255,255,0.07);
|
||||
cursor: row-resize;
|
||||
transition: background 0.15s;
|
||||
position: relative;
|
||||
}
|
||||
.split-div-v::after {
|
||||
content: ''; position: absolute; inset: -2px 0;
|
||||
}
|
||||
.split-div-v:hover { background: rgba(110,231,183,0.35); }
|
||||
|
||||
/* ── Compact toolbar ── */
|
||||
.toolbar {
|
||||
@@ -91,9 +143,13 @@ html, body { height: 100%; background: #0d0f14; color: #e2e8f0;
|
||||
}
|
||||
.tb-btn:hover { background: rgba(255,255,255,0.1); color: #e2e8f0; }
|
||||
.tb-btn svg { flex-shrink: 0; }
|
||||
.tb-btn.accent { background: rgba(110,231,183,0.1); color: #6ee7b7;
|
||||
border: 1px solid rgba(110,231,183,0.15); }
|
||||
.tb-btn.accent:hover { background: rgba(110,231,183,0.18); }
|
||||
.tb-btn.accent { background: rgba(110,231,183,0.1); color: #6ee7b7;
|
||||
border: 1px solid rgba(110,231,183,0.15); }
|
||||
.tb-btn.accent:hover { background: rgba(110,231,183,0.18); }
|
||||
.tb-btn.tb-danger { background: rgba(239,68,68,0.08); color: #f87171;
|
||||
border: 1px solid rgba(239,68,68,0.15); }
|
||||
.tb-btn.tb-danger:hover { background: rgba(239,68,68,0.16); color: #fca5a5; }
|
||||
.tb-sep { width: 1px; height: 20px; background: rgba(255,255,255,0.07); flex-shrink: 0; margin: 0 2px; }
|
||||
|
||||
/* ── Toast ── */
|
||||
.toast {
|
||||
|
||||
Reference in New Issue
Block a user