Skip to content

Instantly share code, notes, and snippets.

@lextra2
Last active March 5, 2023 02:12
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save lextra2/deeb1634f823010edc31f839127eb355 to your computer and use it in GitHub Desktop.
Save lextra2/deeb1634f823010edc31f839127eb355 to your computer and use it in GitHub Desktop.
youtube.com CSS
/* country code besides the youtube logo - top left */
#country-code {
display: none !important;
}
/* video player gradients */
.ytp-gradient-top,
.ytp-gradient-bottom {
display: none !important;
}
/* video player overlay - volume text when adjusted with keyboard arrow keys */
.ytp-bezel-text {
background-color: black !important;
}
/* video player progress bar - current position circle - scrubber-button = hover only */
.ytp-scrubber-container,
.ytp-scrubber-button {
background-color: white !important;
border-radius: 50% !important;
}
/* seekbar - video player background */
.ytp-chrome-controls {
background-color: rgba(0, 0, 0, 0.8) !important;
}
/* seekbar - useless tooltip */
.ytp-tooltip-edu {
display: none !important;
}
/* seekbar - timestamp */
.ytp-preview:not(.ytp-text-detail) .ytp-tooltip-text {
background: black !important;
position: relative !important;
border: 0 !important;
padding: 0 !important;
margin: 0 !important;
right: 0 !important;
left: 0 !important;
top: 2em !important;
bottom: 0 !important;
}
/* seekbar - chapter */
.ytp-preview:not(.ytp-text-detail) .ytp-tooltip-title {
width: auto !important;
height: auto !important;
text-align: left !important;
right: 0 !important;
left: 0 !important;
top: -6em !important;
bottom: 0 !important;
display: block !important;
overflow: visible !important;
position: relative !important;
white-space: normal !important;
background-color: black !important;
border: 0 !important;
padding: 0 !important;
margin: 0 !important;
}
/*
extended playlist height,
removes all transition animations
*/
* {
--ytd-watch-flexy-panel-max-height: 800px !important;
transition-delay: 0.0s !important;
transition-duration: 0.0s !important;
}
/* video player gradient */
.ytp-gradient-top,
.ytp-gradient-bottom {
display: none !important;
}
/* video player progress bar - current position circle - scrubber-button = hover only */
.ytp-scrubber-container,
.ytp-scrubber-button {
background-color: rgba(255, 255, 255, 1) !important;
border-radius: 50% !important;
}
/* video player button background */
.ytp-chrome-controls {
background-color: rgba(0, 0, 0, 0.5) !important;
}
/* thumbnails */
ytd-thumbnail #thumbnail.ytd-thumbnail {
border-radius: 4px !important;
}
/* "SUBSCRIBE" button */
paper-button.ytd-subscribe-button-renderer {
border-radius: 4px !important;
}
/* search results Box */
.sbdd_b {
border: 1px solid rgb(60, 60, 60) !important;
box-shadow: 0px 0px 32px rgba(0, 0, 0, 0.5) !important;
}
/* search results Background color */
.sbsb_a {
background: rgb(30, 30, 30) !important;
}
/* search results Text color */
.sbse {
color: rgba(255, 255, 255, 0.88) !important;
}
/* search results Hover background color */
.sbsb_d {
background: rgb(60, 60, 60) !important;
cursor: pointer !important;
}
/* search results Searched text color */
.sbpqs_a {
color: rgba(255, 255, 255, 0.88) !important;
}
/* search results "Remove" text color */
.sbsb_i {
color: rgba(255, 255, 255, 0.88) !important;
}
/* search results "Report search predictions" */
.sbfl_a {
display: none !important;
}
/* channel tabs category selection bar */
#selectionBar.paper-tabs {
display: none !important;
}
/* hides country code besides youtube logo - top left */
#country-code {
display: none !important;
}
/* video suggestions on video - idle */
#dismissable.ytd-video-renderer,
#dismissable.ytd-compact-video-renderer,
#dismissable.ytd-compact-radio-renderer,
#dismissable.ytd-compact-playlist-renderer {
border: 4px solid transparent !important;
border-radius: 4px !important;
}
/* video suggestions on video - hover */
#dismissable.ytd-video-renderer:hover,
#dismissable.ytd-compact-video-renderer:hover,
#dismissable.ytd-compact-radio-renderer:hover,
#dismissable.ytd-compact-playlist-renderer:hover {
border: 4px solid rgb(45, 45, 45) !important;
background: rgb(45, 45, 45) !important;
box-shadow: 0px 0px 32px rgba(0, 0, 0, 0.5) !important;
}
/* video spacing - sub tab */
.grid-subheader.ytd-shelf-renderer,
#contents.ytd-shelf-renderer {
margin-top: 16px;
}
/* hides left mini sidebar */
ytd-mini-guide-renderer.ytd-app {
display: none !important;
}
/* sidebar expand and collapse button */
#guide-icon.ytd-masthead:hover,
#guide-icon.style-scope.ytd-app:hover {
background: rgba(215, 0, 55, 1.0) !important;
border-radius: 50% !important;
}
/* actual readable timestamps and chapters */
.ytp-time-current,
.ytp-time-separator,
.ytp-time-duration,
.ytp-chapter-title {
color: white !important;
font-weight: bold !important;
}
/* almost readable seekbar preview text */
.ytp-tooltip-title,
.ytp-tooltip-text {
color: white !important;
font-weight: bold !important;
text-shadow: 0 0 2px black, 0 0 4px red !important;
}
/* removes all transition animations */
* {
transition-delay: 0.0s !important;
transition-duration: 0.0s !important;
}
/* hides country code besides youtube logo - top left */
#country-code {
display: none !important;
}
/* video player gradient */
.ytp-gradient-top,
.ytp-gradient-bottom {
display: none !important;
}
/* video player progress bar - current position circle - scrubber-button = hover only */
.ytp-scrubber-container,
.ytp-scrubber-button {
background-color: rgba(255, 255, 255, 1) !important;
border-radius: 50% !important;
}
/* seekbar - video player background */
.ytp-chrome-controls {
background-color: rgba(0, 0, 0, 0.6) !important;
}
/* seekbar - actual readable timestamps and chapters */
.ytp-time-current,
.ytp-time-separator,
.ytp-time-duration,
.ytp-chapter-title {
color: white !important;
font-weight: bold !important;
}
/* seekbar - almost readable preview text */
.ytp-tooltip-title,
.ytp-tooltip-text {
color: white !important;
font-weight: bold !important;
}
/* hides country code besides youtube logo - top left */
#country-code {
display: none !important;
}
/* hides video player gradient */
.ytp-gradient-top,
.ytp-gradient-bottom {
display: none !important;
}
/* changes video player progress bar - current position circle - scrubber-button = hover only */
.ytp-scrubber-container,
.ytp-scrubber-button {
background-color: rgba(255, 255, 255, 1) !important;
border-radius: 50% !important;
}
/* seekbar - video player background */
.ytp-chrome-controls {
background-color: rgba(0, 0, 0, 0.6) !important;
}
/* seekbar - actual readable timestamps and chapters */
.ytp-time-current,
.ytp-time-separator,
.ytp-time-duration,
.ytp-chapter-title {
color: white !important;
font-weight: bold !important;
}
/* seekbar - almost readable preview text */
.ytp-tooltip-title,
.ytp-tooltip-text {
color: white !important;
font-weight: bold !important;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment