Bookmarklet to display Youtube subscriptions in a list instead of a grid

youtube-layout-hack.js

javascript:void function(){
const s=new CSSStyleSheet;
s.replaceSync(`
.ytd-rich-grid-renderer { --ytd-rich-grid-items-per-row: 1; align-items: start; }
ytd-rich-item-renderer { margin-inline: .5em !important; }
ytd-rich-section-renderer:has(.shortsLockupViewModelHost) { display:none; }
ytd-reel-shelf-renderer { display: none; }
.yt-lockup-view-model { flex-direction: row; }
.yt-lockup-view-model__content-image { flex-direction: column; width: 16em; margin-right: 1em; }
`);
document.adoptedStyleSheets.push(s)
}();

Copy this code into the URL of a bookmark and click it while on YouTube to hide all thumbnails and collapse the grid view into a single column, making it much easier to browse subscriptions by video title. Shorts are hidden as a bonus. Undo changes by refreshing the page.

This is a quick hack since YouTube removed the list view from the subscriptions feed. It will inevitably stop working at some point when they change some CSS class names or the layout.

Update:

• Now tricks the grid layout to have 1 full-width column, so long titles appear on a single line.
• Thumbnails are no longer hidden but given a fixed weight and shown on the left.
  • Video previews and hover/touch interactions are broken.
• The Shorts section is now entirely hidden from the page instead of collapsed.

Note that this was only tested in English on a 1080p screen with larger fonts. This code snippet is provided with zero warranties, use it at your own peril.

Update: Shorts are now also hidden from the recommendations besides a video. End the addiction.