Skip to content

Conversation

carlos-zamora
Copy link
Member

@carlos-zamora carlos-zamora commented Sep 15, 2025

Summary of the Pull Request

Adds the tab color profile setting to the settings UI. It's positioned next to the tab title at the root of the profile page.

The new component uses a nullable color picker control to allow the user to pick a color. The null color is represented as "Use theme color".

The tricky part is evaluating the ThemeColor for null (aka "use theme color"). Since the value is dependent on the active theme, it can be any of the following values:

  • theme.tab.background...
    • explicit color
    • accent color
    • terminal background color
  • (if no theme.tab.background is defined) theme.window.applicationTheme
    • light --> #F9F9F9
    • dark --> #282828
    • default --> one of the above two values depending on the application theme

The above light/dark values were acquired by using the color picker on the tab when in light/dark theme.

Validation Steps Performed

✅ accessible value is read out
✅ explicit tab color set

  • tab color is null, so we fall back to...
    • ✅ theme.tab.background: explicit color, accent color, terminal background color
    • ✅ theme.window.applicationTheme (and no theme.tab.background defined): light, dark, default (aka not defined)
      • ✅ updates when theme is changed locally and via JSON

PR Checklist

Closes part of #18318

@carlos-zamora
Copy link
Member Author

Demo

image

@carlos-zamora carlos-zamora merged commit ad6473d into main Sep 25, 2025
19 checks passed
@carlos-zamora carlos-zamora deleted the dev/cazamor/SUI/tab-color branch September 25, 2025 18:37
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants