Files
openidea/src/features/terminal/Terminal.module.css
T
时雨遥 f5e12238bb feat(terminal): split the tool window into tab groups, as IDEA (#864)
The Terminal could only split panes inside one tab. Split Right / Split Down now create tab groups, each with its own tabs, + and ▾; tabs can be moved between groups by dragging or Split and Move Right/Down, Unsplit merges a group back, and closing a group's last tab focuses the neighbouring group. Split actions are registered as actions and appear in the tab context menu.

Fixes #774

Co-authored-by: StarryKira <[email protected]>
2026-11-03 23:20:11 +08:00

156 lines
2.7 KiB
CSS

.root {
flex: 1;
display: flex;
flex-direction: column;
min-height: 0;
min-width: 0;
background: var(--bg-island, var(--bg-app));
}
.tabs {
min-width: 0;
display: flex;
align-items: center;
}
.tabStrip {
min-width: 0;
border: 0;
background: none;
}
.tabActions {
display: flex;
align-items: center;
gap: 2px;
padding: 0 2px;
}
/* A tab group: its header (while split) over its tabs' terminals. */
.group {
flex: 1;
display: flex;
flex-direction: column;
min-width: 0;
min-height: 0;
}
.panels {
flex: 1;
position: relative;
min-height: 0;
}
.panel {
position: absolute;
inset: 0;
display: flex;
}
.panel[hidden] {
display: none;
}
.split {
flex: 1;
}
.splitPanel {
display: flex;
min-width: 0;
min-height: 0;
}
.pane {
flex: 1;
min-width: 0;
min-height: 0;
padding: 6px 0 0 8px;
overflow: hidden;
outline: none;
position: relative;
}
.paneActions {
position: absolute;
right: 14px;
bottom: 8px;
z-index: 10;
display: flex;
gap: 2px;
opacity: 0;
transition: opacity 0.15s;
background: var(--bg-elev, var(--bg-app));
border-radius: 4px;
}
.pane:hover .paneActions,
.pane:focus-within .paneActions,
.paneActions:focus-within {
opacity: 1;
}
.exited :global(.xterm-cursor-layer),
.exited :global(.xterm-cursor) {
visibility: hidden;
}
.pane :global(.xterm) {
height: 100%;
}
/* xterm's DOM renderer stretches the cursor cell over the whole row (line height
included); keep it to the font's own height, centred like the glyphs. */
.pane :global(.xterm-rows .xterm-cursor) {
position: relative;
top: 50%;
height: auto;
max-height: 100%;
line-height: normal;
transform: translateY(-50%);
}
.pane :global(.xterm-viewport) {
background-color: var(--bg-island, var(--bg-app)) !important;
}
.pane :global(.xterm .xterm-scrollable-element > .scrollbar > .slider) {
box-sizing: border-box;
border: 2px solid transparent;
border-radius: 6px;
background: var(--scrollbar-thumb) content-box;
}
.pane :global(.xterm .xterm-scrollable-element > .scrollbar > .slider:hover),
.pane :global(.xterm .xterm-scrollable-element > .scrollbar > .slider.active) {
background: var(--scrollbar-thumb-hover) content-box;
}
.rename {
padding: 6px;
width: 220px;
}
/* Find bar (⌘F) */
.find {
flex: none;
display: flex;
align-items: center;
gap: 4px;
padding: 4px 8px;
background: var(--bg-elev);
border-bottom: 1px solid var(--border);
}
.findField {
flex: 0 1 360px;
min-width: 160px;
}
.findCount {
font-family: var(--font-mono);
font-size: var(--fs-small);
color: var(--fg-subtle);
padding: 0 6px;
white-space: nowrap;
min-width: 56px;
}
.findCountNone {
color: var(--danger);
}
.findSpacer {
flex: 1;
}