2023619 - Nova tab strip visual updates

Status: RESOLVED FIXED

(Firefox :: Tabbed Browser, task, P1)

Description

[Stephen Thompson [:sthompson]]

Horizontal and vertical tabstrip

• On hover separator between pinned tabs and regular tabs
• On hover separator between tools and tabs (target needs to be larger than it currently is in vertical tabs)
• Add active tab border gradient
• update hover/active/selected/etc. states
• pinned tab updates (horizontal, vertical)

Tab group lines, space in/around tab groups
Split view tab state and wrapper adjustments, including in tab groups (also need to address HCM bugs) (break it out if it gets too large)

Bug 2023692 covers updating the tab group label itself

No changes to animations

Comment 1

[Stephen Thompson [:sthompson]]

UX specs:

• https://www.figma.com/design/XT0eDYh4RtbMNWaYQi0efM/Chrome-Sidebar-UX-Specifications--Sprint-1-?node-id=10072-193177&t=8JmJB8LIHAYiDTm9-0
• https://www.figma.com/design/XT0eDYh4RtbMNWaYQi0efM/Chrome-Sidebar-UX-Specifications--Sprint-1-?node-id=10043-13761&t=8JmJB8LIHAYiDTm9-0

Comment 2

[Stephen Thompson [:sthompson]]

Specific issue with horizontal tab strip on at least macOS: when a tab group has N tabs, the tab group line only extends under the first N-1 tabs. Likely coming from https://searchfox.org/firefox-main/rev/37ae122d8d03366820f487aeac25e74a4be97fab/browser/themes/shared/tabbrowser/tabs.css#1558 since the current border radius is 8px but in Nova it's 9999px, which makes the calculation wonky.

The current design tries to end the tab group line at the far end of the tab's horizontal, non-curvy part. Based on the Nova UX spec https://www.figma.com/design/XT0eDYh4RtbMNWaYQi0efM/Chrome-Sidebar-UX-Specifications--Sprint-1-?node-id=9155-92546&t=iGYl85NxOfeJiC4A-0 it looks like that design is no longer expected, so perhaps this can be simplified and we can just end the tab group line at the furthest extent of the tab.

Comment 3

[Nikki Sharpley (:nikkis) (she/her)]

Attachment: Bug 2023619 - Nova tab strip visual updates r=#tabbrowser-reviewers

Comment 4

[Pulsebot]

Pushed by [e-mail]:
https://github.com/mozilla-firefox/firefox/commit/1b5eb58d7fd5
https://hg.mozilla.org/integration/autoland/rev/f9ddc88983a8
Nova tab strip visual updates r=tabbrowser-reviewers,desktop-theme-reviewers,hjones,sclements,sthompson,dao

Comment 5

[pstanciu]

https://hg.mozilla.org/mozilla-central/rev/f9ddc88983a8

Comment 6

[Sören Hentzschel]

Just a note: Bug 2026246 set browser.theme.native-theme to true on macOS, which removed the colored border for the active tab that had been introduced by this bug. I guess it wasn't the intention to revert parts of the changes you introduced just one day before.

Edit: I will open a new bug.