Created
March 26, 2024 13:30
-
-
Save davidwolfpaw/576fbab4103ae4bdafbfb24e5b92ea5d to your computer and use it in GitHub Desktop.
david's YouTube Cleanup Stylesheet for Stylus
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* ==UserStyle== | |
@name david's YouTube Cleanup | |
@namespace github.com/openstyles/stylus | |
@version 1.0.0 | |
@description Various Options to Cleanup YouTube. You can toggle display of full video titles, blurring out watched videos, hiding a bunch of sidebar buttons, and some body cruft, including YouTube Shorts. | |
@author david wolfpaw | |
@preprocessor stylus | |
@var checkbox show-full-titles "Show Full Titles" 1 | |
@var checkbox hide-watched-videos "Blur Watched Videos" 1 | |
@var checkbox hide-sidebar-content "Hide Sidebar Content" 1 | |
@var checkbox hide-body-content "Hide Extra Body Content" 1 | |
==/UserStyle== */ | |
@-moz-document domain("youtube.com") { | |
/* Show the full title of videos */ | |
if show-full-titles == 1 { | |
#video-title.ytd-playlist-panel-video-renderer { | |
max-height: unset !important; | |
-webkit-line-clamp: unset !important; | |
} | |
#video-title.ytd-compact-video-renderer { | |
max-height: unset !important; | |
-webkit-line-clamp: unset !important; | |
} | |
h1.ytd-watch-metadata { | |
max-height: unset !important; | |
-webkit-line-clamp: unset !important; | |
} | |
h4.ytd-macro-markers-list-item-renderer { | |
max-height: unset !important; | |
-webkit-line-clamp: unset !important; | |
/* display: unset !important; */ | |
} | |
#video-title.yt-simple-endpoint.ytd-grid-video-renderer { | |
max-height: unset !important; | |
-webkit-line-clamp: unset !important; | |
display: unset !important; | |
} | |
#video-title.ytd-rich-grid-media { | |
max-height: unset !important; | |
-webkit-line-clamp: unset !important; | |
} | |
.title.reel-player-header-renderer{ | |
word-wrap: break-word !important; | |
-webkit-line-clamp: unset !important | |
} | |
} | |
} | |
@-moz-document domain("youtube.com") { | |
/* Blur out Watched videos */ | |
if hide-watched-videos == 1 { | |
/* Remove the below 5 lines if you want video previews enabled | |
Note: This disables the 'small video player' not the 'video preview gif' when you hover over the thumbnail*/ | |
/* Disable Video Previews */ | |
ytd-video-preview { | |
display: none !important; | |
} | |
/* Apply Filters */ | |
ytd-rich-grid-media:has(ytd-thumbnail-overlay-resume-playback-renderer) { | |
filter: saturate(.82); | |
opacity: .8; | |
} | |
ytd-video-renderer:has(ytd-thumbnail-overlay-resume-playback-renderer) { | |
filter: saturate(.9); | |
opacity: .8; | |
} | |
ytd-grid-video-renderer:has(ytd-thumbnail-overlay-resume-playback-renderer) { | |
filter: saturate(.82); | |
opacity: .8; | |
} | |
/* Change Progress bar in the thumbnail */ | |
ytd-thumbnail-overlay-resume-playback-renderer { | |
width: 100%; | |
height: 100%; | |
opacity: 0.9; | |
transition: all 200ms ease-out; | |
background-color: rgba(0, 0, 0, .1); | |
} | |
#progress.ytd-thumbnail-overlay-resume-playback-renderer { | |
height: 100%; | |
background-color: rgba(0, 0, 0, .75); | |
transition: all 200ms ease-out; | |
} | |
/* Remove filters on hover */ | |
ytd-rich-grid-media:hover { | |
filter: none; | |
opacity: 1; | |
transition: all 200ms ease-in-out 200ms; | |
} | |
ytd-rich-grid-media:hover #progress.ytd-thumbnail-overlay-resume-playback-renderer { | |
opacity: 0; | |
transition: all 200ms ease-in-out 200ms; | |
} | |
ytd-video-renderer:hover { | |
filter: none; | |
opacity: 1; | |
transition: all 200ms ease-in-out 200ms; | |
} | |
ytd-video-renderer:hover #progress.ytd-thumbnail-overlay-resume-playback-renderer { | |
opacity: 0; | |
transition: all 200ms ease-in-out 200ms; | |
} | |
ytd-grid-video-renderer:hover { | |
filter: none; | |
opacity: 1; | |
transition: all 200ms ease-in-out 200ms; | |
} | |
ytd-grid-video-renderer:hover #progress.ytd-thumbnail-overlay-resume-playback-renderer { | |
opacity: 0; | |
transition: all 200ms ease-in-out 200ms; | |
} | |
} | |
} | |
@-moz-document domain("youtube.com") { | |
/* Hide Sidebar Content */ | |
if hide-sidebar-content == 1 { | |
ytd-guide-collapsible-section-entry-renderer.ytd-guide-section-renderer:not(:first-child), | |
#sections.ytd-guide-renderer > ytd-guide-section-renderer.ytd-guide-renderer:not(:first-child), | |
#sections.ytd-guide-renderer > ytd-guide-subscriptions-section-renderer.ytd-guide-renderer { | |
margin-top: 0 !important; | |
margin-bottom: 0 !important; | |
padding: 1px 4px !important; | |
} | |
#sections.ytd-guide-renderer > *.ytd-guide-renderer:first-child { | |
padding: 1px 4px !important; | |
} | |
div#footer, | |
ytd-guide-section-renderer:nth-last-child(2), | |
ytd-guide-section-renderer:nth-last-child(3), | |
a[title="Explore"], | |
a[title="Originals"], | |
a[title="YouTube Music"], | |
a[title="Your videos"], | |
a[title="Your clips"], | |
a[title="Downloads"], | |
a[title="Your movies"], | |
a[title="Your movies and TV"], | |
a[title="Help"], | |
a[title="Send feedback"], | |
a[title="Shorts"], | |
div#voice-search-button,, | |
.yt-live-chat-renderer | |
/* A few of these are commented out to maybe use later | |
yt-page-navigation-progress, | |
yt-related-chip-cloud-renderer, | |
ytd-compact-radio-renderer, | |
ytd-badge-supported-renderer, | |
ytd-metadata-row-container-renderer, | |
ytd-moving-thumbnail-renderer, | |
ytd-thumbnail-overlay-endorsement-renderer, | |
a[title="Show more"], | |
div#start > yt-icon-button, | |
div#start > div#skip-navigation, | |
div#start > tp-yt-paper-tooltip, | |
ytd-rich-grid-renderer > div#header, | |
div#start > ytd-topbar-logo-renderer > span#country-code, | |
div#start > ytd-topbar-logo-renderer > a#logo > ytd-yoodle-renderer,*/ { | |
display: none !important; | |
} | |
} | |
} | |
@-moz-document domain("youtube.com") { | |
/* Hide Main Body Content */ | |
if hide-body-content == 1 { | |
div#clarify-box, | |
div#contents > ytd-rich-section-renderer, | |
div#purchase-button, | |
div#sponsor-button, | |
div#container > yt-formatted-string, | |
div#newness-dot, | |
div#video-preview { | |
display: none !important; | |
} | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment