Closed suhr closed 6 years ago
Is the border present, if you don't move the appbutton there?
What settings are you using, Which windows are you on?
Is the border present, if you don't move the appbutton there?
No.
What settings are you using, Which windows are you on?
Linux, i3wm.
Is this the default theme or the "Light compact" theme?
Standard compact. I removed the blue line on an active tab with .tab-line { display: none !important; }
.
FF 58 beta.
Alright I see, you have not written, that this is about default tabs and not the squared tabs offered by CustomCSSforFx project.
Set border colors like this:
.tabbrowser-tab {
border-top: 1px solid var(--tabs-border-color) !important;
border-left: 1px solid var(--tabs-border-color) !important;
border-right: 1px solid var(--tabs-border-color) !important;
}
Now it looks like this:
Not exactly the result I wanted to achieve.
#PanelUI-button #PanelUI-menu-button .toolbarbutton-badge-stack {
border-radius: 0 !important;
border-right: 1px solid var(--tabs-border-color) !important;
}
This gives a natural looking result when the leftmost tab is selected, but when it's not it looks weird:
I want the app button to look as natural as the +
button looks.
You have to adopt the code for your needs.
Only active tab needs borders, right? Or maybe left and right borders only?
Experiment with the code
.tabbrowser-tab[selected=true] {
border-left: 1px solid var(--tabs-border-color) !important;
border-right: 1px solid var(--tabs-border-color) !important;
}
It would be easier if I knew what I actually try to CSS.
Anyway, CSS I have already looks reasonable good. I'll share it, maybe it will be useful for someone else:
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
#PanelUI-button {
-moz-appearance: none !important;
-moz-box-ordinal-group: 0 !important;
position: absolute !important;
top: -29px !important;
}
#PanelUI-button #PanelUI-menu-button .toolbarbutton-badge-stack {
border-radius: 0 !important;
border-right: 1px solid var(--tabs-border-color) !important;
}
#TabsToolbar{
-moz-padding-start: 30px !important;
}
.tab-line{
display: none !important;
}
You are still tying to create a proper border for selected tab (default tabs). Adding a border to main menu buttons right, is no solution.
Please throw this @namespace
stuff away and never put it back. It not only breaks some styles it also is very very useless. It comes from a time were user styles were added to Stylish and could break web content, but nothing in userChrome.css can access web content.
It lacks the left border.