We have been using YouTube's 'hqdefault.jpg' image which works consistently to provide a 480x360 thumbnail. YouTube does provide larger thumbnails, but not consistently for every video. By using og:image, we will fetch the best resolution YouTube can provide for each video.
This commit also refactors lazy-yt to re-use the thumbnail already existing in the cooked content. This means we get lazy-loading for free, and avoid hotlinking images to YouTube (when download remote images is enabled on the site).
This will make a few minor improvements to the second factor user interface. Highlights include:
- Using the site's title to prefix the backup code filename. If non-ascii characters are detected, then prefix "discourse" instead.
- Add icons and change the text on some of the buttons for better clarity and consistency
- Add an education link to the security key modal