Generate a full width Channel Design on YouTube
// ==UserScript==
// @name YouTube Modern Channel Design
// @version 1.3.0
// @namespace sapkra
// @description Generate a full width Channel Design on YouTube
// @match *://*.youtube.com/user/*
// @match *://*.youtube.com/channel/*
// @grant none
// ==/UserScript==
//Content Area
document.getElementById('content').setAttribute( 'style', 'width: 100%;' );
//Thumbnails
function setStylesForClass(matchClasses, matchTag, styles) {
var classes = matchClasses.split( ', ' );
var elems = document.getElementsByClassName( classes[0] );
for (var i = 0; i < elems.length; i++) {
if(matchTag == 'multipleClasses') {
elems[i].getElementsByClassName( classes[1] )[0].setAttribute( 'style', styles );
}
else if(matchTag != '') {
elems[i].getElementsByTagName( matchTag )[0].setAttribute( 'style', styles );
}
else {
elems[i].setAttribute( 'style', styles );
}
}
}
setStylesForClass( 'yt-shelf-grid-item', '', 'width: 300px;' );
setStylesForClass( 'yt-thumb-196', '', 'width: 300px;' );
setStylesForClass( 'yt-lockup-title', '' , 'max-width: 300px;' );
setStylesForClass( 'expanded-shelf-content-item fluid yt-lockup-tile, yt-lockup-thumbnail', 'multipleClasses' , 'width: 300px;' );
setStylesForClass( 'yt-lockup clearfix yt-lockup-video yt-lockup-grid', 'img' , 'width: 300px;' );
setStylesForClass( 'yt-lockup clearfix yt-lockup-playlist yt-lockup-grid', 'img' , 'width: 300px;' );
setStylesForClass( 'yt-lockup-thumbnail', '' , 'width: 300px;' );
setStylesForClass( 'yt-thumb-default', 'img' , 'width: 300px;' );
setStylesForClass( 'yt-thumb-fluid', 'img' , 'width: 100%;' );
//Banner
function banner_width() {
var banner_width = document.documentElement.offsetWidth / 320 * 53;
document.getElementById('c4-header-bg-container').setAttribute('style', 'height: ' + banner_width + 'px;');
}
banner_width();
window.onresize = function(event) {
banner_width();
};