Built in Reader and Stylish

Discussion of features in Mozilla Firefox
Post Reply
cliffzilla
Posts: 209
Joined: May 15th, 2003, 9:35 pm

Built in Reader and Stylish

Post by cliffzilla »

Is there a way to use Stylish to adjust the layout in the Firefox built-in reader?
I can inspect the elements I want to adjust, but since the reader deals with every site there's no way to add a specific UR or domain.
I tried having it set to apply to "Everything", but that doesn't work.
Is this even possible?
morat
Posts: 6394
Joined: February 3rd, 2009, 6:29 pm

Re: Built in Reader and Stylish

Post by morat »

Is it possible to tweak "about:" protocol pages in Firefox Quantum using the Stylish extension? I doubt it.

Try this:

Code: Select all

/* Firefox userContent.css */

@-moz-document url-prefix("about:reader") {
  body {
    background-color: black !important;
    color: white !important;
  }
}
http://kb.mozillazine.org/UserContent.css

Reference...

view-source:about:reader
view-source:chrome://global/content/reader/aboutReader.html
cliffzilla
Posts: 209
Joined: May 15th, 2003, 9:35 pm

Re: Built in Reader and Stylish

Post by cliffzilla »

Thanks. I can't seem to find the right selector to do what I want. I'll keep investigating.
I see the area I want to adjust is in a file called aboutReader.css. I can change the file in the Inspector.
When I then save it it asks for a location. Where would this go? The Chrome folder? It deson't seem to exist any where now.
morat
Posts: 6394
Joined: February 3rd, 2009, 6:29 pm

Re: Built in Reader and Stylish

Post by morat »

Are you editing the aboutReader.css file directly in the developer tools and saving the result to a local file so that the changes persist? I never did that before.

If you wish to tweak test page 1, but not test page 2, then do something like...

Code: Select all

/* Firefox userContent.css */

@-moz-document url-prefix("about:reader?url=https%3A%2F%2Fwww.gnu.org%2Fgnu%2Fgnu.html") {
  body {
    background-color: black !important;
    color: white !important;
  }
  .reader-title {
    color: orange !important;
  }
}
Test page 1
https://www.gnu.org/gnu/gnu.html

Test page 2
https://www.gnu.org/licenses/licenses.html

Reference...

view-source:chrome://global/skin/aboutReader.css
Post Reply