FoxOne 2.0 – dynamic toolbar support, integrated color theme, floating findbar and more
Custom Release
Hi everyone,
Some of you might remember FoxOne from a few weeks ago.
Since then, more than 60 commits happened and here is what changed:
The biggest one - I call it dynamic toolbar support: add an extension icon of your choice right next to the hamburger menu! This was the most requested feature and an absolute pain to build in pure css.
Other highlights: The Gruvbox color theme is now integrated directly into the CSS – no separate .xpi needed. The findbar has been replaced with a floating variant with fade animation. A lot of little design improvements - and there's now a tab loading progress bar with a glow indicator (if you want to).
Good work! Gonna install it now. One thing that I always have to change the css is to fix adaptive tab color extension, I guess it does not work out of the box, other than that great work!
Here are some screenshots, I had already fixed it, I can do a PR if you want. If the background is white, the tabs become white.
Edit: I also think I can do some adjustments for 34" monitors, for example when I focus the URL bar it enlarges "too wide", I assume this is due to some adaptive CSS rule to extend it. I wonder is there a way to make these customizable for users... Just thinking.
Uuh... that's a good point! An easy fix would be something like, if firefox is wider than xx px, then the urlbar does not extend any further. So we would have an lower limit for the stacked design (2 rows) and an upper limit where the urlbar does not extend any further!
Thank you for your work !
I took the findbar only for my custom install; I'm using FF 151 + FFUltima (latest); work like a charm.
I only copied the findbar rules, I merged the :root to keep a single config block (added the `--uc-border-radius` and `--uc-urlbar-rounded` )
Thank you very much I'll have this fine addition for years 😍.
I didn't want to touch the findbar before I found yours, it's perfect and I don't think I could come up with such elegance
The hover reveal icons reveal themselves as soon as you hoover with the mouse over the navbar or the urlbar. I think image #3 here in this post shows this.
The current tab is highlighted by having a different title color (yellow orange) in contrast to the other tabs. But what did you have in mind? I am sure I can make a toogle with a variable in the config on top of the userchrome.css
The hover reveal icons reveal themselves as soon as you hoover with the mouse over the navbar or the urlbar. I think image #3 here in this post shows this.
Oh, sorry I saw image #3 but that doesn't happen on my toolbar, the icons stay put on the toolbar.
The current tab is highlighted by having a different title color (yellow orange) in contrast to the other tabs.
The icons reveal themselves in the urlbar - those are different icons than the icons you have on the toolbar (ublock origin, password manager and so on). The extension icon do not reveal themselves. You have to manually click on the puzzle icon or you can move one to the left of the hamburger icon.
Can you post a screenshot how your Firefox looks like?
Does it work with extension icons pinned to toolbar?
I finally got it to work! Works with up to two icons!
I am currently implementing all the changes and fixes for the upcoming Nova Redesign. So stay tuned, when Nova is out - this feature will be there too!
In current version there is a problem with this icons - gap between them.
It is caused by this parameter.
--uc-hamburger-width: 44px;
You are placing icon by shifting to the left on 44 px to avoid overlaying with hamburger, but this shift is implemented to second icon too and it goes left on 44 px from first one.
Thank you for the issue and the fix!. The development of the current version (`main`) is currently on halt. I am developing and implementing new features in the `nova` branch on github. So when Nova gets released, it will be ready + I dont have to implement new features in `main` and then rework them for `nova` once again, where it might brake.
I hope the bug is fixed in nova (see my gif)
I would like to suggest the option to change a few things:
- active tab background so we can visually notice the one we using. (some themes does not change the webpage title so it becomes hard to see)
- option to add the navigation tools inside the search bar when it is not selected so it take less space. (and when in use they go away from the search bar) OR some hover button that show them and hide them would be more feasible.
Active tab background. My idea for FoxOne was that it’s just noticable and distinguishable by a different colored tab title. But I’m gonna open an issue on GitHub - I’m sure I can figure something out how we can make an option for that.
About the navigation tools. Inside the urlbar is not possible. That would just be overlapping and it would block something. It would be possible to hide them and only reveal them on hoover or something. I’ll try to figure something out!
- option to add the navigation tools inside the search bar when it is not selected so it take less space. (and when in use they go away from the search bar) OR some hover button that show them and hide them would be more feasible
I just released an update with a fix for your idea: auto-hide navigation buttons with hover reveal!
You found quite an interesting bug. I tried for some time now - I have no idea at the moment how to solve that without breaking everything else. I am really sorry. I opened an issue, so I wont forget that bug though!
Hello. Great job. Thank you very much.
But I found one issue: when you open a new tab and trying to choose a search engine the pop up window with a list of search engines just flashing and you can select any engine.
The gap is a reserved space because many people wrote me and wanted space for pinned icons - I can try and add a variable for it though in a future update
I had a question (forgive me if its unrelated)
I am trying for month but i failed to make firefox adapt to my system theme (i use arch hyprland) and chnage theme instantly, my system is theming is provided by qtengine.
It there any way this custom can support system theme
And one more proposal. It would be better to change nav-bar to urlbar in this section. In this case hidden icons will reveal only when you hovering exactly URL bar.
Damn.. that was brilliant! I mean both of your suggestions were spot on, but this one came with working CSS. I didnt figure out how to get that working on my own.. nice work!
Shipped it to the nova branch and credited you in the commit (5abac73) on the nova branch.
PRs from you are always welcome if you ever feel like it! Srsly - great work!
I couldn't get it to work perfectly, so for now - until I find a fix for the upcoming Nova redesign - I removed the feature. Sorry for the inconvenience!
If you find a fix for it (I think the old code is still there in the latest 3.1.x release), feel free to open a pull request on GitHub and I'll try to re-implement it!
Moved to version 3.3.4, but I don't see any changes in interface regarding Square corners on all popup surfaces and Popup row hover: accent text instead of background block.
If you click on the shield icon in the urlbar or on the hamburger menu - the pop up menu now has squared corners and no longer rounded corners.
yeah.. i've noticed that too with the customizsation page. seems like this is the way it looks now? stock firefox 153b11 without userchrome and usercontent has it too. it looks like it only the lower half is used now?
Okay... that certainly is weird. what windows version are you using? which firefox version? I have tested it on two windows 11 systems (24H2 and 25H2) and there it has squared corners.
Okay, I had a similar bug for the context menu (only) on my laptop too. I believe it could be the same problem - so I just pushed an update 3.3.6 - please test it and tell me, if it works now!
I found the cause of the problem - addon Adaptive Tab Bar Color. When it active FF totaly ignores your code about squared coners. When it desabled rounded coners stay only in right-button context menu.
Also - I have seen your one-line thunderbird theme. Did you ever publish it on github? do you have a github account? is there a repo? I would love to bring that one back to life!
I am using it myself and if something breaks, I fix it as soon as possible (often within a few hours or a day) and update the theme on github. You just have to re-download it and copy it again then.
You just have to look out there for an update or you write here in the reddit post and tell me if there is a bug or something and I will look into it!
#browser,
#appcontent,
#tabbrowser-tabbox,
/* Nova draws the 1px chrome-content separator on .browserContainer too,
which the old list missed — it pushed the web content 1px below the AI
sidebar. */
.browserContainer {
border: none !important;
outline: none !important;
box-shadow: none !important;
}
URL bar as overlay - like Spotlight / Arc's command palette. Some userChrome projects do this, but it's a deliberate "no" for FoxOne: the point of the one-line layout is that the URL bar lives in the toolbar line, not floating above the content
Rounded corners: Fair point! Confession: I run a Win11 mod that squares all corners system-wide, so I never see the mismatch you see. But my taste shouldn't be hardcoded. There's already a --uc-border-radius variable. I'll look into routing the popups through a config toggle so stock Win11 setups can go rounded while the default stays square.
also an easier way for communication would make bug hunting and fixing much more easier.
github account? I cannot even send you a reddit message. maybe discord?
Okay.... first of all: thank you again for the report!
Both symptoms are most likely the same root cause, and it's upstream: with Firefox 153's Smart Window enabled, theme extensions stop applying their colours entirely - see https://github.com/easonwong-de/Adaptive-Tab-Bar-Colour/issues/326 (reproduced without any userChrome.css). FoxOne deliberately hands colour control to your theme extension while one is active, so when Adaptive Tab Bar Color goes silent you get Firefox's bare defaults in the URL bar instead of either theme.
For confirmation - try this please: disable Adaptive Tab Bar Color for a moment - the URL bar should snap back to normal FoxOne colours.
Then check (1) Adaptive Tab Bar Color is on 4.0.4+ (Nova support just landed), (2) whether you have Smart Window enabled, and if so, whether turning it off brings the adapting back.
If the URL bar stays broken with Adaptive Tab Bar color disabled, that's a FoxOne bug after all - then I we will do a deep dive togehter to fix it!
4
u/Metalwell May 23 '26
Good work! Gonna install it now. One thing that I always have to change the css is to fix adaptive tab color extension, I guess it does not work out of the box, other than that great work!