Reverts back to the old polymer colors before September 2019.
YouTube Late 2017-Mid 2019 Polymer Colors by magma_craft
Details
Authormagma_craft
LicenseCC Zero
Categoryyoutube
Created
Updated
Size2.3 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
Requires this script here for the late 2019-mid 2020 YouTube layout: https://userstyles.world/style/6311/
Update history:
20220829.18.22 - Intinal Release.
20230202.01.42 - Improved colors for guide and channels.
20230525.01.04 - Fixed a bug with the topbar not being white after update.
20230822.01.35 - Rewrited the entire CSS so it will be less stable from now on.
20231217.05.27 - Added option to revert to the pre-August 2019 watch UI background.
Source code
/* ==UserStyle==
@name YouTube Late 2017-Mid 2019 Polymer Colors
@version 20231217.05.27
@namespace userstyles.world/user/magma_craft
@description Reverts back to the old polymer colors before September 2019.
@author magma_craft
@license CC Zero
@preprocessor stylus
@var checkbox watchBackground "Use pre-August 2019 watch UI background" 0
==/UserStyle== */
@-moz-document domain("youtube.com") {
html:not([dark]) {
--yt-app-background: hsl(0, 0%, 100%);
--yt-guide-background: hsl(0, 0%, 96%);
--yt-simple-menu-header-background: hsl(0, 0%, 93.3%);
--yt-channel-header-background: hsl(0, 0%, 98%);
}
html[dark] {
--yt-app-background: hsl(0, 0%, 7%);
--yt-guide-background: hsl(0, 0%, 11%);
--yt-simple-menu-header-background: hsla(0, 0%, 53.3%, .4);
--yt-channel-header-background: hsla(0, 0%, 11%, .8);
}
/* Revert pre-2019 polymer colors */
#masthead-container.ytd-app::after {
margin-bottom: -5px;
box-shadow: inset 0px 4px 8px -3px rgba(17, 17, 17, .06);
}
ytd-app[hide-header-shadow] #masthead-container.ytd-app::after {
opacity: 1;
}
#guide-content.ytd-app {
background: var(--yt-guide-background) !important;
}
ytd-mini-guide-entry-renderer {
background: var(--yt-guide-background) !important;
}
.guide-icon.ytd-mini-guide-entry-renderer {
color: #909090 !important;
}
ytd-multi-page-menu-renderer {
border: 0px !important;
border-radius: 0px !important;
box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.4) !important;
}
ytd-simple-menu-header-renderer, ytd-active-account-header-renderer.style-scope.ytd-multi-page-menu-renderer {
background-color: var(--yt-simple-menu-header-background) !important;
}
ytd-browse[page-subtype="channels"] {
background: var(--yt-app-background) !important;
}
ytd-c4-tabbed-header-renderer {
--yt-lightsource-section1-color: var(--yt-channel-header-background) !important;
}
#tabs-divider.ytd-c4-tabbed-header-renderer {
border-bottom: 0px !important;
}
if watchBackground {
div.style-scope.ytd-watch-flexy {
background-color: var(--yt-app-background) !important;
}
}
}