☰

Greasy Fork is available in English.

Rehike Hitchhiker Thumbnail Resizer

can change the size of any thumbnail

/* ==UserStyle==
@name           Rehike Hitchhiker Thumbnail Resizer
@namespace      rlego
@version        1.0.0
@description    can change the size of any thumbnail
@author         rlego
@preprocessor   stylus
@license        MIT
@var range homewidth                " Home/Subscription width" [180, 120, 360, 1, 'px']
@var range channelwidth             " Channel thumbnail width" [180, 120, 360, 1, 'px']
@var range recomwidth               " Watch recommended width" [168, 90, 220, 1, 'px']
@var range searchwidth              " Search width" [196, 120, 360, 1, 'px']
@var range feedwidth                " Feed width" [196, 120, 360, 1, 'px']
@var checkbox newlinebadge          " Display NEW badge next to views" 0
@var checkbox WL                    " Move watch later to top of thumbnail" 0
==/UserStyle== */

@-moz-document domain("www.youtube.com") {
    :root {
        --hw: homewidth;
        --cw: channelwidth;
        --ww: recomwidth;
        --sw: searchwidth;
        --fw: feedwidth;
    }
    
    
    
    .yt-lockup-grid .yt-lockup-title {
        max-width:none
    }
    .yt-shelf-grid-item {
       width:var(--hw);
    }
    .yt-shelf-grid-item img {
        width:var(--hw);
        height:calc(var(--hw) / 1.78);
    }
    
    
    .channel .yt-shelf-grid-item {
       width:var(--cw);
    }
    .channel .yt-shelf-grid-item img {
        width:var(--cw);
        height:calc(var(--cw) / 1.78);
    }
    
    
    
    
    .related-list-item .yt-uix-simple-thumb-related,
    .related-list-item .yt-uix-simple-thumb-related>img,
    .related-list-item .thumb-wrapper {
        width:var(--ww);
        height:calc(var(--ww) / 1.78);
    }
    .related-list-item .content-wrapper {
        margin-left:calc(var(--ww) + 13px)
    }
    .related-list-item .content-link {
        min-height:calc(var(--ww) / 1.78);
    }
    
    
    .yt-lockup.yt-lockup-tile .yt-lockup-thumbnail,
 .yt-lockup.yt-lockup-tile .yt-lockup-thumbnail img {
        width:var(--fw);
        height:calc(var(--fw) / 1.78);
    }
    
    
    
    
    #results .yt-lockup-thumbnail,
    #results .yt-lockup-thumbnail img {
        width:var(--sw);
        height:calc(var(--sw) / 1.78);
    }
    #results .yt-lockup-channel img {
        width:calc(var(--sw) / 1.78);
    }
    
    
    
    
    
    
    
    
    if (newlinebadge) {
        .yt-badge-list {
            float:right;
            margin-top:-16px
        }
    }
    
    
    if (wl) {
        .video-actions {
            top:2px;
            bottom:auto;
        }
        .video-time, .video-time-overlay {
            display:inline-block!important;
            right:2px;
            z-index:3
        }
    }
    
    
    
}