search

Binaryify / OneDark-Pro

Atom's iconic One Dark theme for Visual Studio Code
https://marketplace.visualstudio.com/items?itemName=zhuangtongfa.Material-theme
MIT License
1.5k stars 290 forks source link

Can you make the active tab more prominent? #723

Closed zeroxia closed 2 years ago

zeroxia commented 2 years ago

Most of dark themes just keep the tab bar as dark as possible, and I find myself often very hard to identify which tab is active among several tabs.

The difficulty of discriminating the active one from others is not that obvious in the screenshot, but it is really obscure when you are on a high-resolution monitor.

active tab not prominent

Binaryify commented 2 years ago

you can add this in your setting.json

 "workbench.colorCustomizations": {
    "tab.activeBorder": "#fff"
  },
zeroxia commented 2 years ago

Thanks, this does help a lot. Now the tab has a white line at the bottom. Just curious, why isn't there a rectangular white box around the box?

Binaryify commented 2 years ago

the first time I use this, it's make me confuse too also you can try "tab.activeBorderTop": "#fff", I think it's not a good design

zeroxia commented 2 years ago

the first time I use this, it's make me confuse too also you can try "tab.activeBorderTop": "#fff", I think it's not a good design

Great! This is even better, I reckon these are not present:

{
        "tab.activeBorderLeft": "#ffffff",
        "tab.activeBorderRight": "#ffffff"
}
Binaryify commented 2 years ago

yep

zeroxia commented 2 years ago

There is some discussion on customization of the active tab bar:

https://stackoverflow.com/questions/59121072/is-there-a-way-of-making-the-active-tab-border-highlighted-on-top-instead-of-at

I'm currently setting it like this, it looks ugly, but it's more useful for me to know which tab is the active one...

    "workbench.colorCustomizations": {
        // "tab.activeBorder": "#ffffff",
        // "tab.activeBorderTop": "#ffffff",
        // "tab.activeForeground": "#000000",
        // "tab.inactiveForeground": "#888888",
        "tab.activeBackground": "#051ca2"
    },