This userChrome.css file contains tweaks for Firefox proton to make things
a bit smaller. Also contains a few other minor tweaks like placing the
search bar above the page instead of the bottom since i find it easier to
use it there.

So, here is how to apply the same changes. First of all these changes are
only for my setup with the toolbar visible and the urlbar combined with
the search bar - if you use a separate url bar and search bar and/or
disable the title bar you'll get weird alignment. Also because the "compact"
mode is in its way out (it is hidden by default in new installations) i
based this one on the "normal" density. However you can hide the menu bar
and/or the bookmark bar to gain some extra vertical space if you want.

The steps are:

    1. Go to about:config and set
    
      toolkit.legacyUserProfileCustomizations.stylesheets
      
    to true. This enables auto-loading the userChrome.css from your
    profile folder.
    
    2. Open your profile folder (you can find it in
    
      %APPDATA%\Mozilla\Firefox\Profiles
      
    or preferably open about:support find the Profile Folder row and press
    the Open Folder button)
    
    3. Create a new "chrome" folder (this should be next to other folders
    like extensions, icons, storage, etc) and open it

    4. Copy userChrome.css inside that folder *or* copy the contents of the
    userChrome.css inside your own userChrome.css
    
    5. Restart Firefox

Only tested with Firefox Developer Edition (89.0b2 at the time of this writing)

I do not guarantee things will work. Actually it might break some stuff.
Whatever, all i want is the UI to be a bit smaller.