Text overlap when auto hiding navbar

[Zabooby]

The text of bookmarks overlaps the url bar text.

[black7375]

Please write down your environment and settings.
Without it, the reproduction is very hard.

[Zabooby]

Windows 11
Firefox version: 107.0.1
userChrome.autohide.navbar to true

[black7375]

Hmm..There seems to be more conditions.
In my environment, urlbar background does not seem transparent.

[Zabooby]

Maybe it's because my url background colour and bookmarks bar colour are the same?

Also it only overlaps with icons/text on the bookmarks bar

[black7375]

As far as I know, it was fixed in v6.4.0.

See #501 (aff13a5), 1cbcb9a

[Zabooby]

I've made my own solution, put everything in folders so there is no overlap. Should I close the issue?

[black7375]

Once it can't reproduced, I will close it if it has been solved.
If you have the same problem in the latest version later, please contact me again. 👍

[Zabooby]

I'm already on the latest version. Also is it possible to change the colour of the separator in the search bar in the picture above?

[black7375]

It's strange..

If you solve it, please share the relevant code here.
It helps other users who patch or search.

---

Here is a urlView separator color

.urlbarView-title-separator::before {
  color: red;
}

[Zabooby]

I'll try and set up a fresh profile myself tomorrow and see if can reproduce it, I might have forgot some changes I made. I'll keep you posted.

I tried the code but the colour isn't changing.

[Zabooby]

It's strange..

If you solve it, please share the relevant code here. It helps other users who patch or search.

Here is a urlView separator color

.urlbarView-title-separator::before {
  color: red;
}

I just made a fresh profile and installed v6.5.1 the bug is still there. These are all the changes that I had, see if you can replicate:

User.js

user_pref("userChrome.icon.disabled",                       true);
user_pref("userChrome.tab.dynamic_separator",          false); // Original, Proton
user_pref("userChrome.autohide.navbar",                     true);
user_pref("userChrome.autohide.toolbar_overlap",            true);

userChrome.css

html#main-window menupopup:not(.in-menulist) {
  --menu-border-color: black !important;
  --panel-border-color: var(--menu-border-color) !important;
}
html#main-window menupopup:not(.in-menulist) menuseparator {
 --menu-border-color: black !important;
 border-top: 1px solid var(--menu-border-color) !important;
}
#customization-container {
	background-color: #1E2021 !important;
	background-image: none !important;
}

#customization-footer {
	border: black !important;
	background-color: #1E2021 !important;
}
:root {
  --panel-separator-color: black !important;
}

html#main-window menupopup:not(.in-menulist, [placespopup]) menuseparator,
toolbarbutton menupopup[placespopup] menuseparator::before {
  --menu-border-color: black !important;
}

.urlbarView-title-separator::before {
  color: black;
}

Also the separator that I was talking about above was this one, is it possible to change the colour?: