756000 - about:newtab does not inherit theme styles

Status: RESOLVED WONTFIX

(Firefox :: New Tab Page, defect)

Description

[Caspy7]

I have neurological issues such that I have frequent light sensitivity.  As a result I prefer web pages & UI with darker colors. I use a dark Stylish theme on all pages and a simple dark Persona for the Firefox UI.

It used to be that when I opened a new blank tab, the background would be dark gray because of the Stylish theme. But now it can be rather like walking from a dark room into the sun for me, because the background of the about:newtab page is pure white.
If the background could inherit from the theme/persona or be styled by Stylish this would be great.
I rather like the newtab functionality and would like to keep it, but this is a real annoyance.

Chrome's solution to this is rather nice as it allows themes/personas to put in their own background image both allowing authors' further creative expression & the new tab page to mesh well with the rest of the current theme - something we're currently doing poorly.

Comment 1

[mcdavis941 (sporadically reading bugmail)]

Hey Mark,

The following code in Stylish seems to be able to style the background of about:newtab with Firefox 15.

@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
@-moz-document url(about:newtab) {
  window { background: #181818 !important }
}

The above code does things as needed specifically for about:newtab.  about:blank is an xhtml document, while about:newtab is an xul:window and so needs both a different namespace in Stylish and a rule that targets window rather than html or body elements.

Just as another option, you can also go to about:config and change the pref browser.newtab.url to be about:blank if you'd rather stick with that for new tabs.  You'd give up the about:newtab functionality if you do that.

Also, about:newtab is able to be styled by themes (not personas) if the theme is written to do that, as it should be.  This wasn't possible with about:blank, so this is a very nice benefit of the switch to about:newtab.  You might want to check out recent versions of dark themes on AMO.

This doesn't address your request for new functionality in personas, but may get you what you need.  Hope this helps.

Comment 2

[mcdavis941 (sporadically reading bugmail)]

(In reply to mcdavis941 (sporadically reading bugmail) from comment #1)
> The following code in Stylish seems to be able to style the background of
> about:newtab with Firefox 15.

For the record, for anyone trying to do the same thing as Mark .. the above code sample works with my non-default theme, but for use with the Firefox default theme you'd want something more like this:

@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
@namespace html url(http://www.w3.org/1999/xhtml);
@-moz-document url(about:newtab) {
  window { background: #181818 !important }
  html|*#newtab-scrollbox { background: transparent !important }
}

or this:

@namespace url(http://www.w3.org/1999/xhtml);
@-moz-document url(about:newtab) {
  #newtab-scrollbox { background: #181818 !important }
}

and maybe using background-attachment: fixed on #newtab-scrollbox if you're using a patterned background image there.

Comment 3

[Matthew N. [:MattN]]

Mass-move to Firefox::New Tab Page.

Filter on new-tab-page-component.

Comment 4

[Jessilyn Davis]

Hello!

This bug has been closed due to inactivity and/or the potential for this bug to no longer be an issue with the new Discovery Stream-powered New Tab experience.

Please help us triage by reopening if this issue still persists and should be addressed.

Thanks!