How do I change the background of a empty window/tab before a page loads?
First time posting here,
I am not sure about protocol for posts, but I am on macOS 10.12 (Sierra) and using Firefox 57.
Anyway, I would like to change the background of the default window/pane that appears before any content is loaded into the window. Currently, it is white and that is very jarring when working in low light conditions.
I've managed to change the background for new tabs by adding the following code in the userContent.css
@-moz-document url("about:newtab") {
body { background-color: #303030 !important;}
}
But I also want to change the background color of the window/pane that is displayed before the content for the new tab is displayed or when switching from tab to tab and the page has to reload.
Any help with this will be greatly appreciated .
Thanks
Chosen solution
This was the most comprehensive treatment I bookmarked, but there may be newer/better ones out there by now:
(I generally search for white flash to find threads on this problem.)
As you can see, it adds a rule to a userChrome.css file to color in the frame that pages load into. The color, of course, is your call.
Read this answer in context 👍 1All Replies (4)
This can do it if want a extension : https://addons.mozilla.org/en-US/firefox/addon/new-tab-override/ There may be CSS rules but I do not know. Can go through these : USSER CHROME URL'S
https://www.howtogeek.com/334716/how-to-customize-firefoxs-user-interface-with-userchrome.css/ http://techdows.com/2017/09/classic-theme-restorer-userchrome-css-modify-firefox-57-photon-ui.html https://github.com/Aris-t2/CustomCSSforFx/issues/1 https://www.accessfirefox.org/Theme-Font-Size-Changer.php https://www.userchrome.org/ https://www.accessfirefox.org/Firefox_Accessibility_Themes.php https://www.userchrome.org/what-is-userchrome-css.html http://kb.mozillazine.org/UserChrome.css https://github.com/axydavid/FirefoxUI/blob/master/README.md https://github.com/wilfredwee/photon-australis https://www.reddit.com/r/FirefoxCSS/ Note not all code in one place.
Please let us know if this solved your issue or if need further assistance.
Hi there,
Thanks for responding. Unfortunately, none of those articles provide info in what I'm looking for.
Chosen Solution
This was the most comprehensive treatment I bookmarked, but there may be newer/better ones out there by now:
(I generally search for white flash to find threads on this problem.)
As you can see, it adds a rule to a userChrome.css file to color in the frame that pages load into. The color, of course, is your call.
Thanks @jscher2000 !!
I found the solution in that reddit post.
This specifically worked, which I added to "userChrome.css"
@-moz-document url(chrome://browser/content/browser.xul) {
#main-window,
browser[type="content-primary"],
browser[type="content"],
tabbrowser#content,
#content,
browser[type="content"] > html
{
background: #363636 !important;
}
}
Modified by Player1