style(header): session tabs follow the titlebar tab design language
Uniform compact tabs (h-7, 6px radius, 13px medium) that share the strip width and shrink before scrolling, thin separators between inactive neighbours that disappear around the active or hovered tab, a hover-revealed menu button anchored to the tab's end, a soft selection pill for the active tab, and hidden scrollbars with fade edges. The active tab is single-line: the project/branch meta row stays only in the VS Code header, which keeps the plain title.
This commit is contained in:
@@ -1781,3 +1781,25 @@ html.desktop-runtime [class*="cursor-pointer"] {
|
||||
html.desktop-runtime .markdown-content [data-openchamber-file-link="true"] {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
/* Header session tabs: thin separators between inactive neighbours, hidden
|
||||
around the active or hovered tab (mirrors the titlebar tab language). */
|
||||
.session-tab-slot {
|
||||
position: relative;
|
||||
}
|
||||
.session-tab-slot:not(:first-child):not([data-active='true'])::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 8px;
|
||||
inset-inline-start: -2.75px;
|
||||
width: 1.5px;
|
||||
height: 12px;
|
||||
border-radius: 9999px;
|
||||
background: var(--border);
|
||||
opacity: 0.6;
|
||||
}
|
||||
.session-tab-slot[data-active='true'] + .session-tab-slot::before,
|
||||
.session-tab-slot:not([data-active='true']):hover::before,
|
||||
.session-tab-slot:not([data-active='true']):hover + .session-tab-slot::before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user