Stylish reader mode extensions: columns, custom width and real dark background

README.md

Firefox reader mode: real black background, columns & custom width

Firefox has the new reader mode (about:reader) to facilitate reading of (almost) any article in a simple, pleasant, constant style. However, the width of the article view is remarkably thin for a single column. Meh... change. This styles allows to customize the width of the view but also to use a layout with more than a single column, making it more akin to a newspaper.

This style based on style 114669 by user 13655. It adds the feature to choose other colors for the dark background mode - where I prefer #000000 as a real dark black. This also works on Firefox for Android and is usable for AMOLED devices, where the #000000 black looks really nice and saves energy.

Screenshot:

Userstyles.org config: https://i.imgur.com/VgTvZwJ.png

Download: https://userstyles.org/styles/120855/ff-reader-mode-real-dark-background-col-width

To install this from GitHub you should use stylish_readermode_default.css and possibly you also have to pay attention to some things. You might be able to install it using this link.

CHANGELOG.md

Changelog.md

2016-09-25

• removed static width as it breaks the width changing mechanism of Firefox 49

2015-11-25

• improved comments in css files
• better config on userstyles.org

LICENSE.md

Licensed under CC-BY-SA 4.0 by MiV. Edited by rugk.

Original version: https://userstyles.org/styles/114669/firefox-reader-custom-width-multi-column

stylish_readermode.css

/*
    Link: https://userstyles.org/styles/120855/ff-reader-mode-real-dark-background-col-width

    Licensed under [CC-BY-SA 4.0](https://creativecommons.org/licenses/by-sa/4.0/) by [MiV](https://userstyles.org/users/13655).
    Edited by [rugk](https://userstyles.org/users/302864).

    Original version: https://userstyles.org/styles/114669/firefox-reader-custom-width-multi-column
    Available on GitHub: https://gist.github.com/rugk/6dd70c50c35ee750cb88
*/

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document url-prefix("about:reader") {

  body.dark {
    color:               /*[[darkcolor]]*/ !important;
    background-color:    /*[[darkbgcolor]]*/ !important;
  }
  
  .dark-button {
    color:               /*[[darkcolor]]*/ !important;
    background-color:    /*[[darkbgcolor]]*/ !important;
  }
}

stylish_readermode_default.css

/*
    Link: https://userstyles.org/styles/120855/ff-reader-mode-real-dark-background-col-width

    Licensed under [CC-BY-SA 4.0](https://creativecommons.org/licenses/by-sa/4.0/) by [MiV](https://userstyles.org/users/13655).
    Edited by [rugk](https://userstyles.org/users/302864).

    Original version: https://userstyles.org/styles/114669/firefox-reader-custom-width-multi-column
    Available on GitHub: https://gist.github.com/rugk/6dd70c50c35ee750cb88
*/

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document url-prefix("about:reader") {

  body.dark {
    color:               #F9F9F9 !important;
    background-color:    #000000 !important;
  }
  
  .dark-button {
    color:               #F9F9F9 !important;
    background-color:    #000000 !important;
  }
}