feat: add option to blur thumbnails - #4218
Open
Ishaan488 wants to merge 2 commits into
Open
Conversation
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
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Category
Feature Request
Problem
Users lack an option to blur YouTube thumbnails to protect privacy, avoid spoilers, or reduce visual distractions. Additionally, previous blur attempts caused a jarring "flash" of the unblurred image when hovering before the video preview loaded.
Solution
Added a "Blur thumbnails" toggle that blurs static thumbnails but allows preview videos to play normally on hover.
it-blur-thumbnails="true"on<html>when enabled.filter: blur(10px)ingeneral.cssfor thumbnails across home, search, sidebar, and playlists..ytThumbnailViewModelImage,.ytwTopLandscapeImageLayoutViewModelHostImageHoverOverlayContainer) to support modern YouTube DOM layouts and image ads.:hoverCSS unblur rules on the static image to prevent the unblur "flash", allowing the native video preview to overlay smoothly.blurThumbnailsstring in_locales/en/messages.json.Alternatives
Considered using a JS-created overlay element (like the night-mode
dimfeature). A pure CSSfilteris simpler, more performant, and perfectly matches the existingsquared_thumbnailsimplementation.Testing
npm test— all 88 tests pass successfully.Closes #4182