diff --git a/_locales/en/messages.json b/_locales/en/messages.json index 686f493a0..b4234fc92 100644 --- a/_locales/en/messages.json +++ b/_locales/en/messages.json @@ -1428,6 +1428,9 @@ "squaredThumbnails": { "message": "Squared thumbnails" }, + "blurThumbnails": { + "message": "Blur thumbnails" + }, "static": { "message": "Static" }, diff --git a/js&css/extension/www.youtube.com/general/general.css b/js&css/extension/www.youtube.com/general/general.css index 3a3fef248..ff6e0c656 100644 --- a/js&css/extension/www.youtube.com/general/general.css +++ b/js&css/extension/www.youtube.com/general/general.css @@ -15,6 +15,7 @@ # Hide thumbnail icon # Hide dots on thumbnails # Squared thumbnails +# Blur thumbnails --------------------------------------------------------------*/ html[it-cursorLighting=true] #below {opacity:.4; transition:3s;} html[it-cursorLighting=true] #below:hover {opacity:1; transition:.5s;} @@ -81,6 +82,31 @@ html[it-squared-thumbnails='true'] .yt-lockup-view-model-wiz__content-image .yt- border-radius: 0 !important; } /*-------------------------------------------------------------- +# BLUR THUMBNAILS +--------------------------------------------------------------*/ +html[it-blur-thumbnails='true'] ytd-thumbnail img, +html[it-blur-thumbnails='true'] ytd-playlist-thumbnail #thumbnail, +html[it-blur-thumbnails='true'] ytd-playlist-thumbnail img, +html[it-blur-thumbnails='true'] .yt-thumbnail-view-model img, +html[it-blur-thumbnails='true'] .yt-lockup-view-model-wiz__content-image img, +html[it-blur-thumbnails='true'] .yt-video-card-view-model__thumbnail, +html[it-blur-thumbnails='true'] .yt-video-card-view-model__thumbnail img, +html[it-blur-thumbnails='true'] .ytThumbnailViewModelImage, +html[it-blur-thumbnails='true'] .ytwTopLandscapeImageLayoutViewModelHostImageHoverOverlayContainer, +html[it-blur-thumbnails='true'] #img.ytp-cued-thumbnail-overlay-image { + filter: blur(10px) !important; + transition: filter .2s; +} + +html[it-blur-thumbnails='true'] ytd-thumbnail:hover img, +html[it-blur-thumbnails='true'] ytd-playlist-thumbnail:hover img, +html[it-blur-thumbnails='true'] .yt-thumbnail-view-model:hover img, +html[it-blur-thumbnails='true'] .yt-lockup-view-model-wiz__content-image:hover img, +html[it-blur-thumbnails='true'] .yt-video-card-view-model__thumbnail:hover img, +html[it-blur-thumbnails='true'] .ytThumbnailViewModelImage:hover { + filter: blur(0) !important; +} +/*-------------------------------------------------------------- HIDING STUFF (display:none !important) (Usually the !important isn't necessary) --------------------------------------------------------------*/ /*-------------------------------------------------------------- diff --git a/menu/skeleton-parts/general.js b/menu/skeleton-parts/general.js index 0992e4e01..537999463 100644 --- a/menu/skeleton-parts/general.js +++ b/menu/skeleton-parts/general.js @@ -295,6 +295,11 @@ extension.skeleton.main.layers.section.general = { text: 'squaredThumbnails', tags: 'thumbnail square radius rounded corners' }, + blur_thumbnails: { + component: 'switch', + text: 'blurThumbnails', + tags: 'thumbnail blur privacy hide spoiler' + }, thumbnails_quality: { component: 'select', text: 'thumbnailsQuality',