[lxc-users] custom style for lxd.readthedocs.io for Firefox

[Mike Wright]

I find using the online docs at "lxd.readthedocs.io" tedious because the 
tables that show all the configuration options are narrow with the 
"Description" column being particularly narrow.  This causes the 
description to wrap into several lines and reduces the rows of 
configuration options that can be displayed on the screen at one time.

By adding a user style to Firefox you can make the tables as wide as the 
screen.  Call it an accessibility feature for people who don't like 
scrolling.  The two links below show before and after views of a page.

   Original https://pasteboard.co/IZfbCz2.png
   Styled   https://pasteboard.co/IZfc9jq.png

1) start firefox

   we have to enable user styles
   go to about:config and search for the following key:

     toolkit.legacyUserProfileCustomizations.stylesheets and make it true

2) change directory to the profile currently in use
   cd ~/.mozilla/firefox
   cd $(ls -rt |tail -1)
   mkdir chrome (if it doesn't exist)
   cd chrome

3) add the following lines to userContent.css:

   @-moz-document domain("lxd.readthedocs.io"){
    .wy-nav-content { max-width: 100% !important; }
   }

4) the following advice is provided because, at least on ff-73, having 
the namespace directive causes user styles not to work:

   if userContent.css previously existed and it contains a "namespace"
   directive comment it out using css style commenting /* ... */ or
   just delete it (up to you)

5) check if it works:

   restart firefox and go to

     "https://lxd.readthedocs.io/en/latest/configuration/networks"

   scroll down until you find a table;  widen your browser window.  you
   should see the table expand with it.

Enjoy,
Mike Wright