You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Connected editor tabs still suppressed legacy border customizations after #337986. This restores those colors while preserving the height, wrapping, and corner geometry introduced by #339028.
Restore active top/bottom, hover, selected, modified, and unfocused border customizations. Explicit selected-top colors remain the fallback when the active-top color is absent, without exposing the default theme accent.
Add tab.divider, inheriting tab.border unless customized separately. Legacy keeps its existing separators; Pill shows dedicated dividers at every adjacency; Connected shows them only between inactive neighbors. High Contrast retains theme-owned boundaries without redundant dividers.
Keep the connected cap, curved shoulders, and body separator continuous in default/custom colors and High Contrast. Reserve wrapped action space before assigning row markers so compact tabs do not lose their left boundary.
Preserve Modern action-background customization on ordinary, upper wrapped, and separate pinned tabs. Color fixtures use isolated customized themes and production-generated CSS, including derived colors.
Visual evidence
Current production fixtures in Dark: yellow is tab.border, white is tab.divider, cyan is the active-top accent, and red is the active-bottom accent. Top to bottom: Legacy, Pill, Connected. The linked issue contains the original missing-customization state.
Compact wrapped tabs in Dark High Contrast, without color overrides. Before/after detail shows the active left boundary and shoulder restored by correcting row classification; the updated tab height is unchanged.
The Screenshots & Tests check supplies the broader component-fixture theme report.
Testing
Enable Modern UI and select Connected tabs. Assign distinct colors to tab.border, tab.divider, tab.activeBorder, and tab.activeBorderTop. Verify the active contour and accents, with dividers only between inactive neighbors.
Switch to Pill, then disable Modern UI for Legacy. Verify rounded Pill outlines and independent dividers; Legacy must not gain a second separator.
Wrap enough tabs to select a bottom-row tab with neighbors on both sides. Switch between default and compact tab height. Verify both shoulders meet the body border, row markers remain correct, and Close/Unpin controls stay aligned.
Repeat in Dark and Light High Contrast with no overrides. Verify continuous theme-owned outlines and no dedicated dividers.
Customize modernEditorTab.hoverActionBackground differently from modernEditorTab.hoverBackground. Hover ordinary, upper wrapped, and separate pinned tabs in focused and unfocused groups.
With Dark+, customize only tab.selectedBorderTop and multi-select tabs. Verify the active tab retains the selected-color fallback. In a theme with an active-top color, confirm that fallback does not override it.
Customize only tab.border and verify tab.divider inherits it. Check modified, multi-selected, action-left, clipped, and unfocused states, then clear all overrides and verify the default appearance.
Validation
Production tab/color regression tests, existing tab fixture behavior checks, render/remount checks, ESLint, stylelint, and staged hygiene pass. Component Explorer validation includes full-folder views and matched physical-pixel shoulder checks.
The latest UI validation used production Component Explorer fixtures rather than a fresh native OSS run. Full local client type checking is blocked by three existing Foundry transcription errors in unchanged code.
Keep pill tabs on fill-owned borders while allowing connected tabs to use the standard full-width theme border indicators. Add component fixtures and computed-style coverage for active, unfocused, and selected border colors.
Fixes#325250.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Give explicit tab.border customizations precedence over the connected tab header border default, and cover the connected side stroke in unit, fixture, and Playwright assertions.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Paint active top border customizations on the rounded connected cap instead of layering a straight indicator over it. Preserve the transparent default top-row border and keep selected and modified indicator ownership unchanged.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Add matched legacy, pill, and connected fixtures plus first/middle continuity fixtures. Reuse the production legacy-to-modern color collector in the fixture harness and preserve connected structural borders and unfocused colors during active multi-selection.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Add a customizable tab.divider element between tabs while reserving tab.border for tab boundaries. Modern pill and connected styles show short dividers only between inactive tabs; legacy keeps dividers at every shared boundary.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Default tab.divider to tab.border while preserving an explicit divider customization as an independent override.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Show dedicated dividers at every pill boundary while keeping connected dividers inactive-only. Keep tab.border as the rounded pill outline and inset active top/bottom accents so mixed colors do not protrude through the corners.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Make the divider transparent in continuity fixtures so the shared tab and editor boundary is tested without an inherited divider repainting it.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Use a longer inactive tab run so divider ownership remains visually obvious across legacy, pill, and connected styles.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Keep inactive connected tabs unoutlined so their dedicated dividers own shared boundaries. Preserve the active left edge and inset selected top accents before their corners.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Expose first-in-row state directly instead of deriving it from sibling selectors, and add Dark and Light High Contrast fixtures and assertions for connected tab boundaries.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Let the outer editor frame own the left edge when the first connected tab is active, while retaining the tab boundary when no outer frame is present.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Keep legacy tab separators single-owned, make modern divider policies explicit, align the connected active bottom accent, and inherit high-contrast divider accents from the active group frame.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Keep dedicated dividers out of High Contrast, retain complete theme-owned tab outlines, and render customized wrapped-tab accents inside rounded pill corners. Align the tab geometry tests with production row and grid ownership.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Keep editor-only Pill accent pseudo-elements off shared Sessions tabs, model production row-start ownership in the Sessions fixture, and restore the missing component-fixture theme type import.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Use the boundary-aligned standard indicator for bottom-row Connected hover accents while upper wrapped pills keep their inset fill-owned border.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
At an inactive pinned-to-normal boundary this divider paints above the existing tab.lastPinnedBorder inset shadow (tabs.css:115-116) because .tab-divider has z-index 9. With distinct custom colors, the last-pinned separator is covered through its center and survives only as short fragments. Suppress the generic divider at that transition so the semantic pinned separator retains paint ownership.
The inset replacement is gated on .tab-border-bottom, so active upper-row hover rendering is inconsistent: without tab.activeBorder, tab.hoverBorder remains a full-width straight indicator across the rounded corners; with tab.activeBorder, this rule hides the hover indicator and the pseudo-element keeps the active-border color instead. Handle hovered active upper-row tabs explicitly with an inset hover accent.
Render focused and unfocused hover-border customizations as a single inset accent on upper wrapped tabs, preserving their rounded pill geometry.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Honor explicit Modern editor action colors in Connected tabs while preserving seamless defaults. Guard the complete 46-token editor-tab audit across legacy, shared Modern, editor-specific Modern, and editor-group-header color families.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Preserve the shared HC frame edge and load the production editor-frame styles in the migrated tab fixture harness.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Drop editor-group-header color imports that became unused when the color fixtures moved into the curated tabs harness.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Remove the redundant first-in-row marker introduced by this branch and use the row-boundary selectors owned by the merged tab structure overhaul.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Restore continuous shoulder strokes with the updated tab geometry and reserve wrapped action space before row classification. Preserve selected-border and upper-row action-color fallbacks, and validate customizations with isolated production theme resolution.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Connected editor tabs still suppressed legacy border customizations after #337986. This restores those colors while preserving the height, wrapping, and corner geometry introduced by #339028.
Fixes #325250.
Changes
tab.divider, inheritingtab.borderunless customized separately. Legacy keeps its existing separators; Pill shows dedicated dividers at every adjacency; Connected shows them only between inactive neighbors. High Contrast retains theme-owned boundaries without redundant dividers.Visual evidence
Current production fixtures in Dark: yellow is
tab.border, white istab.divider, cyan is the active-top accent, and red is the active-bottom accent. Top to bottom: Legacy, Pill, Connected. The linked issue contains the original missing-customization state.Compact wrapped tabs in Dark High Contrast, without color overrides. Before/after detail shows the active left boundary and shoulder restored by correcting row classification; the updated tab height is unchanged.
The Screenshots & Tests check supplies the broader component-fixture theme report.
Testing
tab.border,tab.divider,tab.activeBorder, andtab.activeBorderTop. Verify the active contour and accents, with dividers only between inactive neighbors.modernEditorTab.hoverActionBackgrounddifferently frommodernEditorTab.hoverBackground. Hover ordinary, upper wrapped, and separate pinned tabs in focused and unfocused groups.tab.selectedBorderTopand multi-select tabs. Verify the active tab retains the selected-color fallback. In a theme with an active-top color, confirm that fallback does not override it.tab.borderand verifytab.dividerinherits it. Check modified, multi-selected, action-left, clipped, and unfocused states, then clear all overrides and verify the default appearance.Validation
Production tab/color regression tests, existing tab fixture behavior checks, render/remount checks, ESLint, stylelint, and staged hygiene pass. Component Explorer validation includes full-folder views and matched physical-pixel shoulder checks.
The latest UI validation used production Component Explorer fixtures rather than a fresh native OSS run. Full local client type checking is blocked by three existing Foundry transcription errors in unchanged code.