zen-browser / theme-store

🎨 Theme repository for @zen-browser!
https://zen-browser.github.io/theme-store/themes.json
MIT License
133 stars 41 forks source link

[create-theme]: Better Tab Highlight #491

Closed BrunoPoiano closed 1 month ago

BrunoPoiano commented 1 month ago

Name

Better Tab Highlight

Description

Adds a soft border to the collapsed tabs

Homepage

https://github.com/BrunoPoiano/zen-browser-dark-theme-tab-highlight

Image

https://raw.githubusercontent.com/BrunoPoiano/zen-browser-dark-theme-tab-highlight/refs/heads/main/images/exemple.png

Type

Theme Styles

@media (-moz-bool-pref: "zen.tabs.vertical") {
  #navigator-toolbox:not(
      #navigator-toolbox:is(
          #navigator-toolbox[zen-user-hover="true"][zen-has-hover],
          #navigator-toolbox[zen-user-hover="true"]:focus-within,
          #navigator-toolbox[zen-user-hover="true"][movingtab],
          #navigator-toolbox[zen-user-hover="true"][flash-popup],
          #navigator-toolbox[zen-user-hover="true"][has-popup-menu],
          #navigator-toolbox[zen-user-hover="true"]:has(
              [open="true"]:not(tab):not(#zen-sidepanel-button)
            ),
          #navigator-toolbox[zen-expanded="true"]:not([zen-user-hover="true"])
        )
    ) {
    & #tabbrowser-tabs {
      & .tabbrowser-tab {
        --new-border-color: color-mix(
          in oklab,
          var(--zen-colors-border) 80%,
          white
        );
        border: 1px solid var(--new-border-color) !important;
        margin-bottom: 5px !important;
      }
    }
  }
}

Readme

# Better Tab Highlight For Dark Themes

Adds a soft border to the collapsed tabs.

Preferences

No response

github-actions[bot] commented 1 month ago

Thank you for your contribution! :tada:

Your theme has been successfully submitted. The maintainers will review it and get back to you soon.

Here are some details about your submission:

If you have any questions or need help, feel free to ask in the comments below or in the PR.