This repository contains a userscript with userstyles for YouTube, meant to be used with the Greasemonkey extension for Gecko-based browsers. These browsers include Firefox, SeaMonkey, GNU IceCat, Debian Iceweasel, and others that are compatible.
For those not in the know, see https://en.wikipedia.org/wiki/Greasemonkey for a description on how this works.
I primarily refer to the userscript file as a userstyle, because I don't use actual scripting beyond applying CSS. My preference for Greasemonkey is described further below under the Rationale chapter.
Purpose. The userstyles do the following:
Adjust the video viewing design for smaller displays, such as those with a 1024x768 resolution.
This was the primary rationale, as the target audience would be users with computers and computer monitors that cannot display in any greater resolution. Nowadays, these are typically notebook computers and netbooks that are still perfectly capable of video playback on YouTube.
The other reason was, that I wanted the browser window showing YouTube to be narrower, especially if I wanted it side-by-side with another window. This works well with wider screens.
With the design, I've tried to avoid the appearance of horizontal scrollbars.
The design is meant to be fluid and responsive, whilst for the most part avoiding @media hooks, which can be resource-intensive. (Though at some point, YouTube's own @media CSS kicks in when reducing window widths to much less than 1024px.)
Design: The search bar at the top is not fixed anymore and scrolls with the rest of the page, and thus won't take away screen real estate.
Specific font color for links to viewed videos.
The likes/dislikes bar shows red colour (default was blue).
Change the background color from an all-white to a light gray;
I think I changed the font to Arial and Helvetica, which offer better legibility because of font rendering issues in Firefox on Windows xp. Font changes are not widespread, so they're not applied everywhere.
Font size was changed on some UI elements to avoid the 2015/2016+ design disease of bigger text everywhere (presumably to appease people with large-resolution tablets).
Font size changes when hovering over a comment to better view font-based emoticons. But that hover feature may be a bit jarring.
Some pre-requisites:
Code characteristics:
Errata
Rationale
Greasemonkey was chosen perhaps for the following reasons:
A bit of legal stuff