Youtube 2013 for redux by haltingtuber

Details

Authorhaltingtuber
LicenseNo License
Categoryyoutube
Created2 years, 11 months ago
Updated2 years, 11 months ago
Size12 kB
Statistics

Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description

Youtube 2013 layout
Notes

CSS: https://github.com/HaltingTuber/youtube-redux/blob/main/2013
Source code

Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link.
/* ==UserStyle==
@name           Youtube 2013 for redux
@namespace      youtube.com
@version        1.0.0
@description    A new userstyle
@author         Me
==/UserStyle== */

@-moz-document domain("youtube.com") {
    /**
        ytd-masthead #logo-icon-container, #contentContainer #logo-icon-container, ytd-topbar-logo-renderer > #logo, #start > #masthead-logo, #masthead > #masthead-logo {
    content: url(https://upload.wikimedia.org/wikipedia/commons/1/19/Logo_of_YouTube_%282011-2013%29.svg) !important;
    width: 72px !important;
    padding: 18px 14px 18px 16px !important;
}
ytd-topbar-menu-button-renderer:first-of-type yt-icon-button{
    margin-right:20px;
}
ytd-topbar-menu-button-renderer yt-icon-button{
    top:-2px
}
ytd-topbar-menu-button-renderer:first-of-type yt-icon-button:before {
    content:"Upload"!important;
    font-size:13px;
    line-height:2.2;
    color:#333;
    padding:2px;
	margin-left: -300px
}
ytd-topbar-menu-button-renderer:first-of-type yt-icon-button:after {
    content:"|";
    font-size:13px;
    line-height:2.2;
    color:#ccc;
    padding:2px;
    position:absolute;
    top:5px;
    right:-28px
}
ytd-masthead {
    background-color:#ededec
}
ytd-topbar-menu-button-renderer yt-icon-button yt-icon, ytd-notification-topbar-button-renderer  {
    display:none
}
#reduxSubDiv > #subscribe-button > ytd-subscribe-button-renderer > paper-button:not([subscribed]), #reduxSubDiv > #subscribe-button > ytd-subscribe-button-renderer > tp-yt-paper-button:not([subscribed]) {
    background: linear-gradient(to bottom, #ffffff 0%,#e0e0e0 100%);
    color: #000;
    border: 1px solid #CCCCCC;
    border-radius: 3px;
   
}

#reduxSubDiv > #subscribe-button > ytd-subscribe-button-renderer > paper-button:not([subscribed]), #reduxSubDiv > #subscribe-button > ytd-subscribe-button-renderer > tp-yt-paper-button:not([subscribed]):hover {
    background: linear-gradient(to bottom, #ffffff 0%,#e0e0e0 100%);
    color: #000;
    border-color: #999;
    border: 1px solid;
    border-radius: 3px;
    box-shadow: 0 0 3px#999;
}
#top-level-buttons-computed > ytd-toggle-button-renderer > a > yt-icon-button > #button > yt-icon {
    height: 20px
 !important;
    width: 20px !important;
}
ytd-guide-entry-renderer[active] tp-yt-paper-item.ytd-guide-entry-renderer {
    border-right-color: #cc181e!important;
    background: #cc181e!important;
}
ytd-guide-entry-renderer[active] .guide-icon.ytd-guide-entry-renderer {
    color:#fff
}
ytd-guide-entry-renderer[active] .title.ytd-guide-entry-renderer {
    color: #ededed;
}
ytd-guide-icons-renderer[active] .guide-icon.ytd-guide-entry-renderer {
    color: #ededed;
}
#masthead-skeleton-icons, #related-skeleton {
    display:none
}
#container.ytd-masthead {
    height:49px
}
  #search-icon-legacy.ytd-searchbox {
    width:65px;
    background-image: linear-gradient(to bottom,#fafafa 0,#dcdcdc 100%);
}
  ytd-app[standardized-themed-scrollbar] #guide-inner-content.ytd-app::-webkit-scrollbar-thumb, ytd-app[standardized-themed-scrollbar] #guide-inner-content.ytd-app::-webkit-scrollbar, body:not(.style-scope)[standardized-themed-scrollbar]:not(.style-scope):not([no-y-overflow]):not(.style-scope)::-webkit-scrollbar {
    all:unset
}
#upload-info yt-formatted-string[has-link-only_]:not([force-default-style]) a.yt-simple-endpoint.yt-formatted-string {
    font-size:14px;
    font-weight:bold
}
ytd-topbar-menu-button-renderer:first-of-type yt-icon-button:before {

text-transform:none;
text-decoration: none;
}
.ytp-swatch-background-color {
    background-image: -moz-linear-gradient(top,#ef0000 0,#660000 100%);
    background-image: -ms-linear-gradient(top,#ef0000 0,#660000 100%);
    background-image: -o-linear-gradient(top,#ef0000 0,#660000 100%);
    background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0,#c40000),color-stop(100%,#660000));
    background-image: -webkit-linear-gradient(top,#ef0000 0,#660000 100%);
    background-image: linear-gradient(to bottom,#ef0000 0,#660000 100%);
}

.html5-scrubber-button, .ytp-scrubber-button {
    margin-top: 2.3px;
    width: -4px ;
    height: -4px ;
}
.html5-scrubber-button, .ytp-scrubber-button {
   background: radial-gradient(ellipse at center, #aaaaaa 25%,#fafafa 55%) !important;
   width: 16px !important;
   height: 16px !important;
   left: 0px !important;
   border: none !important;
   margin-top: -1px !important;
}

.ytp-big-mode .ytp-scrubber-button {
   background: radial-gradient(ellipse at center, #aaaaaa 25%,#fafafa 55%) !important;
   width: 20px !important;
   height: 20px !important;
   left: 0px !important;
   border: none !important;
   margin-top: -1px !important;
}
.ytp-chrome-top, .ytp-chrome-bottom {
    background-color: #252525;
	height: 24px;
}
.ytp-chrome-controls svg path { fill: #8E8E8E 
}
div.ytp-chrome-bottom
  {
    width: 100% !important;
    left: 0% !important;
    height: 30px !important;
    background: #252525 none repeat scroll 0% 0% !important;
    bottom: -2px !important;
  }
/*Control Style*/  
  .ytp-chrome-controls{ height: 32px !important; line-height: 32px !important; Display: block !important; }
  .ytp-gradient-bottom, .ytp-gradient-top { display: none !important; }
  .ytp-watch-later-button.ytp-button{ padding: 3px !important }
  .ytp-button.ytp-cards-button { top: 0% !important;
}
.ytp-watch-later-icon { width: 24px; height: 24px;
}
.ytp-progress-bar-container
  {
    bottom: 27px !important;
    width: 96% !important;
    left: 2% !important;
  }
ytp-volume-slider-track {
    background-image: -moz-linear-gradient(top,#ef0000 0,#660000 100%);
    background-image: -ms-linear-gradient(top,#ef0000 0,#660000 100%);
    background-image: -o-linear-gradient(top,#ef0000 0,#660000 100%);
    background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0,#c40000),color-stop(100%,#660000));
    background-image: -webkit-linear-gradient(top,#ef0000 0,#660000 100%);
    background-image: linear-gradient(to bottom,#ef0000 0,#660000 100%);
    border-radius: 2px;
}

.ytp-volume-slider-handle{
	height: 15px;
	width: 7px;
    background-image: linear-gradient(to bottom,#fff 0,#eee 100%);
}

.ytp-big-mode .ytp-volume-slider-handle{
	height: 15px;
	width: 7px;
    background-image: linear-gradient(to bottom,#fff 0,#eee 100%);
    
}

.ytp-volume-slider-handle:before{
    background-image: -moz-linear-gradient(top,#ef0000 0,#660000 100%);
    background-image: -ms-linear-gradient(top,#ef0000 0,#660000 100%);
    background-image: -o-linear-gradient(top,#ef0000 0,#660000 100%);
    background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0,#c40000),color-stop(100%,#660000));
    background-image: -webkit-linear-gradient(top,#ef0000 0,#660000 100%);
    background-image: linear-gradient(to bottom,#ef0000 0,#660000 100%);
    border-radius: 2px;
}
   
.ytp-volume-slider-handle:after{
    background-image: -moz-linear-gradient(top,#292929 0,#252525 100%);
    background-image: -ms-linear-gradient(top,#292929 0,#252525 100%);
    background-image: -o-linear-gradient(top,#292929 0,#252525 100%);
    background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0,#292929),color-stop(100%,#252525));
    background-image: -webkit-linear-gradient(top,#292929 0,#252525 100%);
    background-image: linear-gradient(to bottom,#292929 0,#252525 100%);
    border-radius: 2px;
}
  .ytp-time-duration {
    color: #888;
}

.ytp-time-separator {
	color: #999;
} 
  .ytp-time-display {
    font-size: 109%;
    display: inline-block;
    vertical-align: top;
    padding: 0 5px;
    white-space: nowrap;
    line-height: 35px;
   background-image: linear-gradient(to bottom,#292929 0,#252525 100%);
}

.ytp-time-display {
    background-image: linear-gradient(to bottom,#292929 0,#252525 100%);
}
/* Spinner */
.ytp-spinner-rotator {
    width: 31px;
    height: 31px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB8AAAAfCAQAAAC1p96yAAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAAAEgAAABIAEbJaz4AAAAJdnBBZwAAAB8AAAAfACoIA9kAAAIHSURBVDjLlZWxahtBEIa/OzmxtUThQMEgokDAnTsXAePODJigxoXLPEFKP0HIE7hMk0eICzchCAZSGVcWIeBORYiDq5AD2RcpcL4Ukk47q9OFTCFu9p+PHe3cvxexMrTBa9rAT95JXl0TrYQjPnEwS/q8lKKqKl65+VEJwwFH1UVr3n4xPVrAiI9yz7GpO+YDaEIDyCVdal4j3rIzSwa8IWPDw8fS1C5ulmVyHTa/V8Kwwx6XZvdLbZUwOG2F+KEpP+TE5CckJk9CfMvIW5zSL7M+p+avMM8W+NDIQynoScQ++xLRk4Kx0cchfmbkM5Ac+CKfgcdAavQ0xM8ZlM8DzqcP8mv+KyOyUs9k5A1OI17QJOaOMYV81VjuqQx1wMPF9Kevzavy4H7Ie8BxW40zoYOjQQ76SK5j0G3v1J/qNsgqGBwOmBrIaSsGdk3BLnWR2CwGOmapU4sH04+BG7N0U4sH04+BC7N0UYunNotBrrw3bihXdXQ4/dncpdDnQMoahe9nG3O/8wckA9/vGzzBsc4Ez88GXvh9It9AG5IvXtoHOGACeH72YN/v69qaemJxWSWmOmEUXE4Vum+ZJT9rl03atNnUbpVu8WCiS5fTP/xuTztdajbULb7k56DZGr975+vmE9VnND3ht3y3etj8NCaSgTZYcTl5etXuppOKz8J/hjp1dfpfJ3WnaHXCf5IAAAAASUVORK5CYII=);
}
.ytp-spinner-container {
    width: 31px;
    padding-bottom: 31px;
    margin-top: -15px;
    margin-left: -15px;
    transform: rotate(617688888888grad);
}
.ytp-spinner-left {
    right: 49%;
    opacity: 0;
}
.ytp-spinner-right {
    left: 49%;
    opacity: 0;
}
.ytp-volume-slider{
    background-image: -moz-linear-gradient(top,#292929 0,#252525 100%);
    background-image: -ms-linear-gradient(top,#292929 0,#252525 100%);
    background-image: -o-linear-gradient(top,#292929 0,#252525 100%);
    background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0,#292929),color-stop(100%,#252525));
    background-image: -webkit-linear-gradient(top,#292929 0,#252525 100%);
    background-image: linear-gradient(to bottom,#292929 0,#252525 100%);
    border-radius: 2px;
 }
/* Next + Previous */
a.ytp-next-button.ytp-button {
    display: none !important;
}

a.ytp-prev-button.ytp-button {
    display: none !important;
}
.ytd-browse.grid.grid-5-columns .banner-visible-area.y...
Reviews

No reviews yet.