Modifying Firefox userChrome.css on Librem 5

Hardware Librem 5
1

Hello,

I have a firefox profile in which I’d like to hide the tabbar and … toolbar? (Not sure what you call the one that contains the address bar and back and forward buttons.) I don’t want to just use fullscreen because I’d like to still see the system bar at the top of the phone.

It seems that with firefox-esr-mobile-config installed, the phone is set up to copy the large PostmarketOS firefox userChrome.css to each new profile that’s created. Said copy warns that changes will be overwritten, advising to instead change the master that’s located in /etc/. But I would only want to make this change for this one profile, not my main one.

But at this moment I don’t have any idea how I would modify the css anyway. It’s complex!

How should I move forward?

Thanks!

2

Maybe a screenshot would at least show what you are trying to hide, screenshot annotated if necessary.

3

I found that I had to uninstall this package to prevent this problem.
Afterwords, I just maintain the files within ~/.mozilla/firefox/<my-profile>/chrome myself.

What you’re seeking to do is definitely possible.

https://www.reddit.com/r/FirefoxCSS/
You might find some help here.

If you’re still stuck and trying to do this, please let me know. I’d be happy to take a stab at hiding that UI.

Meanwhile, here is something I had saved from one of my projects that might do the trick for you.

#TabsToolbar {visibility: collapse;}
#navigator-toolbox {visibility: collapse;}

If you create a chrome/userChrome.css file with that inside and make sure that user stylesheets are enabled in FF, that may be all you need.

1 Like