Skip to content

Swarm Fix: [BUG] [alpha] Editor tab strip container (.tabs-container) uses padding: 0 — no outer inset around tab row #38275

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
willkhinz wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Swarm Fix: [BUG] [alpha] Editor tab strip container (.tabs-container) uses padding: 0 — no outer inset around tab row #38275

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
33 changes: 33 additions & 0 deletions FIX_PROPOSAL.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
To fix the issue of the editor tab strip container (`.tabs-container`) using `padding: 0` and not having an outer inset around the tab row, you can modify the CSS rule for `.tabs-container` to include a small padding value.

Here is the exact code fix:

```css
.tabs-container {
display: flex;
align-items: flex-end; /* Align tabs to bottom for fusion effect */
height: var(--editor-group-tab-height);
padding: 4px; /* Add a small padding value */
scrollbar-width: none; /* Firefox */
overflow: hidden;
background-color: var(--jb-panel);
/* NO border-bottom - tabs merge directly with editor */
}
```

Alternatively, you can use a more specific padding value for each side, for example:

```css
.tabs-container {
display: flex;
align-items: flex-end; /* Align tabs to bottom for fusion effect */
height: var(--editor-group-tab-height);
padding: 2px 4px; /* Add a small padding value to the top and bottom, and a slightly larger value to the left and right */
scrollbar-width: none; /* Firefox */
overflow: hidden;
background-color: var(--jb-panel);
/* NO border-bottom - tabs merge directly with editor */
}
```

You can adjust the padding values to achieve the desired amount of breathing room around the tab strip.
Comment on lines +1 to +33
Copy link
Copy Markdown

@coderabbitai coderabbitai bot Mar 26, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟠 Major

PR does not apply the fix in product code

This file documents a workaround, but it does not change the actual .tabs-container stylesheet used by the app. As-is, the reported UI bug will remain unresolved. Please include the real CSS change in the target style file (and keep this doc as supplemental context if needed).

🧰 Tools
🪛 LanguageTool

[style] ~1-~1: Consider using a different verb for a more formal wording.
Context: To fix the issue of the editor tab strip conta...

(FIX_RESOLVE)

🤖 Prompt for AI Agents 
Verify each finding against the current code and only fix it if needed.

In `@FIX_PROPOSAL.md` around lines 1 - 33, The PR only adds a documentation fix
(FIX_PROPOSAL.md) and does not modify the actual stylesheet; update the real CSS
file that defines the editor tab styles by changing the .tabs-container rule
(the selector .tabs-container and the var(--editor-group-tab-height) usage) to
include the padding (e.g., add padding: 4px or padding: 2px 4px) so the tab
strip gains the outer inset, keep other properties like display:flex,
align-items:flex-end, overflow:hidden and background-color:var(--jb-panel)
intact, and retain this FIX_PROPOSAL.md as supplemental context.