A CSS modification for Youtube, making it look like a Windows 11 Dark Mode Fluent style. Hope you like it
// ==UserScript==
// @name Youtube Dark Mode - Windows 11 Fluent Theme
// @version 2.5
// @namespace https://t.me/sobatambyarrrrrrr
// @description A CSS modification for Youtube, making it look like a Windows 11 Dark Mode Fluent style. Hope you like it
// @author sobatambyar
// @homepage https://www.youtube.com/
// @include https://www.youtube.com/
// @license No License
// ==/UserScript==
(function() {var css = ["@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500;600;700&display=swap');",
" ",
" .paused-mode:not(.unstarted-mode) > div:not(.html5-video-container) {",
" opacity: 0",
" }",
" .paused-mode:hover > div:not(.html5-video-container) {",
" opacity: 1",
"",
" }",
" .ytp-caption-segment {",
" --lt-color-gray-100: #f8f9fc;",
" --lt-color-gray-200: #f1f3f9;",
" --lt-color-gray-300: #dee3ed;",
" --lt-color-gray-400: #c2c9d6;",
" --lt-color-gray-500: #8f96a3;",
" --lt-color-gray-600: #5e636e;",
" --lt-color-gray-700: #2f3237;",
" --lt-color-gray-800: #1d1e20;",
" --lt-color-gray-900: #111213;",
" --lt-shadowDefault: 0 2px 6px -1px rgba(0, 0, 0, 0.16), 0 1px 4px -1px rgba(0, 0, 0, 0.04);",
" --lt-shadowActive: 0 0 8px -2px rgba(0, 0, 0, 0.1), 0 6px 20px -3px rgba(0, 0, 0, 0.2);",
" --lt-color-white: #fff !important;",
" --lt-color-black: #111213 !important;",
" --lt-color-transparent: rgba(255, 255, 255, 0) !important;",
" --lt-color-background-light: var(--lt-color-gray-100) !important;",
" --lt-color-background-default: var(--lt-color-gray-200) !important;",
" --lt-color-background-dark: var(--lt-color-gray-300) !important;",
" --lt-color-border-light: var(--lt-color-gray-200) !important;",
" --lt-color-border-default: var(--lt-color-gray-300) !important;",
" --lt-color-border-dark: var(--lt-color-gray-400) !important;",
" --lt-color-text-very-light: var(--lt-color-gray-500) !important;",
" --lt-color-text-light: var(--lt-color-gray-600) !important;",
" --lt-color-text-default: var(--lt-color-gray-700) !important;",
" --lt-color-text-dark: var(--lt-color-gray-800) !important;",
" --lt-color-overlay-default: #fff !important;",
" --lt-color-overlay-dark: #fff !important;",
" --lt-color-overlay-transparent: rgba(0, 0, 0, 0.1) !important;",
" --lt-shadow-website-overlay: 0 0 7px 0 rgba(0, 0, 0, 0.3) !important;",
" -webkit-font-smoothing: antialiased !important;",
" user-select: none !important;",
" direction: ltr !important;",
" white-space: nowrap !important;",
" text-align: center !important;",
" line-height: normal !important;",
" color: #ffffff !important;",
" text-shadow: #000000 0px 0px 12px !important;",
" font-family: Segoe UI, segoe-ui !important;",
" font-weight: normal !important;",
" }",
" .ytp-big-mode > div > div > span > span > span {",
" font-size: 32.5px !important;",
" }",
" .ytp-hide-info-bar > div > div > span > span > span {",
" font-size: 25.5px !important;",
" }",
" .ytp-caption-segment {",
" background: none !important;",
" }",
" .caption-window {",
" text-align: center !important;",
" width: 100% !important;",
" height: auto !important;",
" left: 0% !important;",
" margin-left: auto !important;",
" }",
" .ytp-big-mode > div > .caption-window, .ytp-hide-info-bar > div > .caption-window {",
" bottom: 6.9468% !important;",
" }",
" .ytp-big-mode.ytp-autohide-active > div > .caption-window, .ytp-autohide > div > .caption-window {",
" bottom: 10% !important;",
" }",
"",
" :root {",
" --accent-color: #FF0000 !important;",
" --accent-color-hover: #BE0D08;",
" --bg-color: #151719;",
" --bg-color-dark: #101113;",
" --bg-color-light: #18191C;",
" --text-color: #F1F2F3;",
" --text-color-2: #AEB1B9;",
" --text-color-3: #9FA2A8;",
"",
" --font-family: 'Segoe UI', segoe-ui;",
" --font-medium: 500;",
" --font-semibold: 600;",
" --font-bold: 700;",
" }",
"",
" ::-webkit-scrollbar {",
" width: 12px !important;",
" }",
"",
" ::-webkit-scrollbar-thumb {",
" background-color: #2f3237 !important;",
" }",
"",
" ytd-mini-guide-renderer.ytd-app,",
" a.ytd-mini-guide-entry-renderer {",
" width: 62px;",
" padding: 80px 0;",
" }",
" ",
" #items.ytd-mini-guide-renderer {",
" margin: 0;",
" }",
"",
" ytd-mini-guide-renderer,",
" ytd-mini-guide-entry-renderer {",
" background-color: var(--bg-color-dark);",
" }",
"",
" .title.ytd-mini-guide-entry-renderer {",
" display: none;",
" }",
"",
" a.ytd-mini-guide-entry-renderer {",
" padding: 35px 0 35px;",
" }",
"",
" .guide-icon.ytd-mini-guide-entry-renderer {",
" margin-bottom: 0;",
" }",
" ytd-mini-guide-entry-renderer[is-active] a{",
" height: 24px !important;",
" width: calc(100% - 6px) !important;",
" border-left: 6px solid #f00;",
" background-color: #0000;",
" color: #f00 !important;",
" margin-top: calc(50% - 12px);",
" }",
" ytd-mini-guide-entry-renderer[is-active] svg{",
" color: #f00 !important;",
" }",
" ytd-mini-guide-entry-renderer[is-active] .guide-icon.ytd-mini-guide-entry-renderer {",
" margin: 0px 0px 0px -6px !important;",
" }",
" ytd-mini-guide-entry-renderer[is-active] span{",
" color: #f00 !important;",
" display: none !important;",
" }",
"",
" ytd-mini-guide-entry-renderer:hover,",
" ytd-mini-guide-entry-renderer:focus {",
" background-color: transparent;",
" }",
"",
" #container.ytd-masthead {",
" padding-left: 0;",
" background-color: var(--bg-color);",
" height: 72px;",
" }",
" ",
" ytd-app[masthead-hidden] #page-manager.ytd-app {",
" margin-top: 0;",
" }",
"",
" #guide-button.ytd-masthead {",
" height: 72px;",
" width: 62px;",
" background-color: var(--bg-color-dark);",
" }",
"",
" #header.ytd-app {",
" height: 72px;",
" }",
"",
" #contentContainer.tp-yt-app-drawer,",
" #guide-content.ytd-app {",
" background-color: var(--bg-color-dark);",
" }",
"",
" tp-yt-app-drawer[persistent],",
" ytd-guide-renderer.ytd-app {",
" width: 200px;",
" }",
" ",
" #endpoint.yt-simple-endpoint.ytd-guide-entry-renderer,",
" tp-yt-paper-item.ytd-guide-entry-renderer {",
" min-height: 48px;",
" }",
"",
" ytd-guide-entry-renderer[active],",
" ",
" #endpoint.yt-simple-endpoint.ytd-guide-entry-renderer:focus {",
" background-color: transparent;",
" border-left: 5px solid #f00;",
" }",
"",
" #endpoint.yt-simple-endpoint.ytd-guide-entry-renderer {",
" color: var(--text-color);",
" }",
"",
" ytd-guide-entry-renderer[active] .guide-icon.ytd-guide-entry-renderer,",
" #endpoint.yt-simple-endpoint.ytd-guide-entry-renderer:hover .guide-icon.ytd-guide-entry-renderer,",
" #endpoint.yt-simple-endpoint.ytd-guide-entry-renderer:focus .guide-icon.ytd-guide-entry-renderer {",
" color: var(--accent-color);",
" transition: all .5s ease;",
" }",
" ",
" .guide-icon.ytd-guide-entry-renderer {",
" margin-right: 32px;",
" }",
"",
" .title.ytd-guide-entry-renderer,",
" ytd-guide-entry-renderer[active] .title.ytd-guide-entry-renderer {",
" font-family: var(--font-family);",
" font-weight: var(--font-medium);",
" }",
"",
" #country-code.ytd-topbar-logo-renderer {",
" display: none;",
" }",
"",
" @media (min-width: 876px) {",
" #logo.ytd-masthead,",
" #logo.ytd-topbar-logo-renderer,",
" ytd-yoodle-renderer.ytd-topbar-logo-renderer,",
" .ytd-topbar-logo-renderer {",
" width: 138px;",
" height: 72px;",
" display: flex;",
" align-items: center;",
" }",
" }",
"",
" #page-manager.ytd-app {",
" margin-top: 72px;",
" }",
"",
" ytd-app .ytd-topbar-logo-renderer,",
" ytd-app #guide-button.ytd-masthead {",
" background-color: transparent;",
" }",
"",
" ytd-app[mini-guide-visible] #guide-button.ytd-masthead,",
" ytd-app[guide-persistent-and-visible] .ytd-topbar-logo-renderer,",
" ytd-app[guide-persistent-and-visible] #guide-button.ytd-masthead {",
" background-color: var(--bg-color-dark) !important;",
" }",
"",
" ytd-app[guide-persistent-and-visible] ytd-page-manager.ytd-app {",
" margin-left: 210px;",
" }",
"",
" #page-manager.ytd-app,",
" #chips-wrapper.ytd-feed-filter-chip-bar-renderer {",
" background-color: var(--bg-color);",
" }",
"",
" #chips-wrapper.ytd-feed-filter-chip-bar-renderer {",
" border: 0;",
" border-bottom: 15px solid #151719;",
" }",
"",
" yt-chip-cloud-chip-renderer {",
" font-family: var(--font-family);",
" font-weight: var(--font-medium);",
" background-color: transparent !important;",
" font-size: 14px;",
" }",
"",
" yt-chip-cloud-chip-renderer[chip-style=STYLE_DEFAULT],",
" yt-chip-cloud-chip-renderer[chip-style=STYLE_HOME_FILTER],",
" yt-chip-cloud-chip-renderer[chip-style=STYLE_REFRESH_TO_NOVEL_CHIP] {",
" border: 0;",
" border-bottom: 2px solid transparent;",
" color: var(--text-color-2);",
" margin-bottom: 0;",
" padding: 0 3px;",
" padding-bottom: 6px;",
" border-radius: 0;",
" transition: all .4s ease;",
" }",
"",
" yt-chip-cloud-chip-renderer[chip-style=STYLE_DEFAULT][selected],",
" yt-chip-cloud-chip-renderer[chip-style=STYLE_HOME_FILTER][selected],",
" yt-chip-cloud-chip-renderer[chip-style=STYLE_DEFAULT]:not([selected]):hover,",
" yt-chip-cloud-chip-renderer[chip-style=STYLE_HOME_FILTER]:not([selected]):hover,",
" yt-chip-cloud-chip-renderer[chip-style=STYLE_REFRESH_TO_NOVEL_CHIP]:not([selected]):hover,",
" yt-chip-cloud-chip-renderer[chip-style=STYLE_DEFAULT]:not([selected]):focus,",
" yt-chip-cloud-chip-renderer[chip-style=STYLE_HOME_FILTER]:not([selected]):focus,",
" yt-chip-cloud-chip-renderer[chip-style=STYLE_REFRESH_TO_NOVEL_CHIP]:not([selected]):focus {",
" color: var(--text-color);",
" border-bottom: 4px solid var(--accent-color);",
" }",
"",
" #header.ytd-rich-grid-renderer {",
" width: 97.5%;",
" margin: 0 auto;",
" }",
"",
" #left-arrow-button.ytd-feed-filter-chip-bar-renderer,",
" #right-arrow-button.ytd-feed-filter-chip-bar-renderer {",
" background-color: var(--bg-color);",
" }",
"",
" #right-arrow.ytd-feed-filter-chip-bar-renderer {",
" right: 0px;",
" }",
"",
" #left-arrow.ytd-feed-filter-chip-bar-renderer {",
" left: initial;",
" right: 82px;",
" z-index: 11111;",
" }",
"",
" ytd-feed-filter-chip-bar-renderer[at-end] #right-arrow.ytd-feed-filter-chip-bar-renderer,",
" ytd-feed-filter-chip-bar-renderer[at-start] #left-arrow.ytd-feed-filter-chip-bar-renderer {",
" display: flex;",
" }",
"",
" ytd-feed-filter-chip-bar-renderer[at-end] #right-arrow.ytd-feed-filter-chip-bar-renderer ytd-button-renderer[is-icon-button][has-no-text],",
" ytd-feed-filter-chip-bar-renderer[at-start] #left-arrow.ytd-feed-filter-chip-bar-renderer ytd-button-renderer[is-icon-button][has-no-text] {",
" color: var(--text-color-3);",
" opacity: .7;",
" }",
"",
" ytd-button-renderer.ytd-feed-filter-chip-bar-renderer {",
" margin: 0;",
" }",
"",
" ytd-feed-filter-chip-bar-renderer[is-dark-theme] #left-arrow.ytd-feed-filter-chip-bar-renderer:before,",
" ytd-feed-filter-chip-bar-renderer[is-dark-theme] #right-arrow.ytd-feed-filter-chip-bar-renderer:after {",
" background: linear-gradient(to left, var(--bg-color) 20%, rgba(33, 33, 33, 0) 80%);",
" height: 100%;",
" width: 50px;",
" content: '';",
" pointer-events: none;",
" }",
"",
" ytd-feed-filter-chip-bar-renderer[is-dark-theme] #right-arrow.ytd-feed-filter-chip-bar-renderer:after {",
" background: var(--bg-color) !important;",
" }",
"",
" ytd-feed-filter-chip-bar-renderer[is-dark-theme] #right-arrow.ytd-feed-filter-chip-bar-renderer:before,",
" ytd-feed-filter-chip-bar-renderer[is-dark-theme] #left-arrow.ytd-feed-filter-chip-bar-renderer:after {",
" display: none;",
" }",
"",
" #contents.ytd-rich-grid-renderer {",
" background-color: var(--bg-color-dark);",
" border-radius: 12px;",
" padding: 24px;",
" width: 94%;",
" margin: 0 auto;",
" margin-top: 24px;",
" }",
"",
" yt-chip-cloud-chip-renderer.ytd-feed-filter-chip-bar-renderer {",
" margin-right: 58px;",
" }",
"",
" div#center {",
" background-color: #0A0B0C;",
" color: var(--text-color);",
" border: 0 !important;",
" box-shadow: none !important;",
" border-radius: 10px;",
" padding: 2px 6px 2px 40px;",
" margin: 0;",
" height: 38px;",
" font-family: var(--font-family);",
" font-weight: var(--font-medium);",
" }",
"",
" ytd-searchbox.ytd-masthead {",
" margin: 0px;",
" padding:0px;",
" }",
"",
" #container.ytd-searchbox, #search-icon-legacy.ytd-searchbox, #voice-search-button.ytd-masthead {",
" border: none;",
" background-color: transparent;",
" box-shadow: none;",
" }",
" #container.ytd-searchbox {",
" margin: 0px;",
" }",
" #search-icon-legacy.ytd-searchbox {",
" width: 40px;",
" height: 40px;",
" padding: 8px;",
" }",
" #search-icon-legacy.ytd-searchbox:hover {",
" background:transparent;",
" }",
" #voice-search-button.ytd-masthead{",
" margin: 10px;",
" }",
" ytd-searchbox#search[has-focus] {",
" border: none !important;",
" }",
" ytd-searchbox#search[has-focus] #search-icon.ytd-searchbox {",
" display: none;",
" }",
" ytd-searchbox#search[has-focus] #container.ytd-searchbox {",
" padding: 0px 0px 0px 6px;",
" border:none;",
" box-shadow: none;",
" }",
"",
"",
" .sbdd_b,",
" .sbsb_a,",
" .sbfl_b {",
" background: var(--bg-color-dark);",
" border-radius: 12px;",
" border: 0;",
" }",
"",
" .sbsb_b {",
" padding: 0 8px;",
" }",
"",
" .gsfs {",
" color: var(--text-color);",
" border-radius: 12px;",
" }",
"",
" .sbpqs_c {",
" color: var(--text-color-2);",
" }",
"",
" .sbsb_i,",
" .sbpqs_a,",
" .sbqs_c,",
" .sbfl_b {",
" font-family: var(--font-family);",
" font-weight: var(--font-medium);",
" }",
"",
" .sbpqs_a {",
" color: var(--text-color);",
" }",
"",
" .sbpqs_a:before,",
" .sbqs_c:before {",
" filter: brightness(0) invert(1);",
" }",
"",
" .sbsb_d {",
" background-color: #0A0B0C;",
" }",
"",
" #search-form.ytd-searchbox {",
" align-items: center;",
" }",
"",
" #scroll-container.ytd-feed-filter-chip-bar-renderer {",
" align-items: flex-end;",
" }",
"",
" ytd-feed-filter-chip-bar-renderer {",
" height: 42px;",
" }",
"",
" img.yt-img-shadow,",
" ytd-thumbnail.ytd-rich-grid-media:before,",
" #avatar.ytd-rich-grid-media,",
" yt-img-shadow.ytd-topbar-menu-button-renderer {",
" border-radius: 10px;",
" }",
"",
" #details.ytd-rich-grid-media {",
" padding-top: 8px;",
" }",
"",
" #video-title.ytd-rich-grid-media,",
" #video-title.ytd-video-renderer {",
" color: var(--text-color);",
" font-family: var(--font-family);",
" font-weight: var(--font-bold);",
" font-size: 15px;",
" }",
"",
" yt-formatted-string[has-link-only_]:not([force-default-style]) a.yt-simple-endpoint.yt-formatted-string,",
" ytd-video-meta-block[rich-meta] #metadata-line.ytd-video-meta-block,",
" #text.ytd-thumbnail-overlay-time-status-renderer,",
" #metadata-line.ytd-grid-video-renderer span.ytd-grid-video-renderer,",
" #description-text.ytd-video-renderer,",
" ytd-video-meta-block:not([rich-meta]) #metadata-line.ytd-video-meta-block {",
" color: var(--text-color-2);",
" font-family: var(--font-family);",
" font-weight: var(--font-medium);",
" font-size: 13.5px;",
" }",
"",
" ytd-thumbnail-overlay-time-status-renderer {",
" margin: 0;",
" border-top-left-radius: 10px;",
" padding-top: 4px;",
" padding-left: 4px;",
" min-width: 39px;",
" height: 13.5px;",
" display: flex;",
" justify-content: center;",
" background-color: rgba(16, 17, 19, 0.6);",
" border-bottom-left-radius: 0;",
" }",
"",
" ytd-thumbnail-overlay-bottom-panel-renderer,",
" ytd-thumbnail-overlay-hover-text-renderer {",
" background-color: rgba(16, 17, 19, 0.6) !important;",
" font-family: var(--font-family);",
" font-weight: var(--font-medium);",
" }",
"",
" #text.ytd-thumbnail-overlay-time-status-renderer {",
" color: var(--text-color);",
" font-weight: var(--font-semibold);",
" letter-spacing: .15rem;",
" }",
"",
" ytd-rich-grid-row #contents.ytd-rich-grid-row {",
" margin: 0;",
" }",
"",
" ytd-multi-page-menu-renderer {",
" border-radius: 10px;",
" border: 0;",
" background-color: var(--bg-color-dark);",
" }",
"",
" ytd-active-account-header-renderer,",
" ytd-simple-menu-header-renderer {",
" border: 0;",
" box-shadow: none;",
" background-color: var(--bg-color-light);",
" }",
"",
" ytd-compact-link-renderer,",
" ytd-notification-renderer {",
" border-radius: 10px;",
" margin-bottom: 6px;",
" }",
"",
"",
" tp-yt-paper-item.ytd-menu-service-item-renderer {",
" border-radius: 10px;",
" }",
"",
" tp-yt-paper-listbox,",
" ytd-menu-popup-renderer {",
" border-radius: 10px;",
" background-color: var(--bg-color);",
" }",
"",
" #label.ytd-compact-link-renderer,",
" #label.ytd-toggle-theme-compact-link-renderer,",
" #account-name.ytd-active-account-header-renderer,",
" a.yt-simple-endpoint.yt-formatted-string:visited,",
" a.yt-simple-endpoint.yt-formatted-string,",
" h2.ytd-simple-menu-header-renderer,",
" .message.ytd-notification-renderer,",
" .metadata.ytd-notification-renderer {",
" font-family: var(--font-family);",
" font-weight: var(--font-medium);",
" }",
"",
" .metadata.ytd-notification-renderer {",
" color: var(--text-color-2);",
" }",
"",
" #items.yt-multi-page-menu-section-renderer > *.yt-multi-page-menu-section-renderer:not([compact-link-style=compact-link-style-type-disclaimer]).yt-multi-page-menu-section-renderer:not([component-style=RENDER_STYLE_SIMPLE_HEADER]).yt-multi-page-menu-section-renderer:hover,",
" #items.yt-multi-page-menu-section-renderer > *.yt-multi-page-menu-section-renderer:not([compact-link-style=compact-link-style-type-disclaimer]).yt-multi-page-menu-section-renderer:not([component-style=RENDER_STYLE_SIMPLE_HEADER]).yt-multi-page-menu-section-renderer:hover,",
" #items.yt-multi-page-menu-section-renderer > *.yt-multi-page-menu-section-renderer:not([compact-link-style=compact-link-style-type-disclaimer]).yt-multi-page-menu-section-renderer:not([component-style=RENDER_STYLE_SIMPLE_HEADER]).yt-multi-page-menu-section-renderer:hover,",
" #items.yt-multi-page-menu-section-renderer > *.yt-multi-page-menu-section-renderer:not([compact-link-style=compact-link-style-type-disclaimer]).yt-multi-page-menu-section-renderer:not([component-style=RENDER_STYLE_SIMPLE_HEADER]).yt-multi-page-menu-section-renderer:hover,",
" tp-yt-paper-item.ytd-menu-service-item-renderer:hover {",
" background-color: black;",
" }",
"",
" #video-preview-container.ytd-video-preview {",
" background-color: var(--bg-color-dark);",
" border-radius: 10px;",
" }",
"",
" #video-title.ytd-video-preview,",
" ytd-toggle-button-renderer #button.ytd-toggle-button-renderer,",
" #destination-label.ytd-destination-button-renderer,",
" ytd-grid-video-renderer #video-title.yt-simple-endpoint.ytd-grid-video-renderer {",
" font-family: var(--font-family);",
" font-weight: var(--font-medium);",
" color: var(--text-color);",
" }",
"",
" ytd-grid-video-renderer #video-title.yt-simple-endpoint.ytd-grid-video-renderer {",
" line-height: 1.5rem;",
" height: fit-content;",
" max-height: 46px;",
" flex-wrap: wrap;",
" }",
"",
" #destination-label.ytd-destination-button-renderer {",
" font-weight: var(--font-semibold);",
" font-size: 1.4rem;",
" }",
"",
" ytd-toggle-button-renderer #button.ytd-toggle-button-renderer {",
" font-size: 12px !important;",
" }",
"",
" ytd-toggle-button-renderer.style-default[is-paper-button] {",
" color: var(--text-color) !important;",
" background-color: var(--bg-color-light) !important;",
" border-radius: 10px !important;",
" }",
"",
" tp-yt-paper-item.ytd-guide-entry-renderer:before {",
" display: none !important;",
" }",
"",
" .stroke.yt-interaction,",
" .fill.yt-interaction {",
" border: 0;",
" opacity: 0;",
" background-color: transparent !important;",
" }",
"",
" ytd-two-column-browse-results-renderer.grid:not(.grid-disabled) {",
" max-width: 100%;",
" width: 96% !important;",
" }",
"",
" ytd-destination-button-renderer {",
" width: 116px;",
" margin-right: 18px !important;",
" }",
"",
" ytd-destination-shelf-renderer {",
" background-color: var(--bg-color-dark);",
" border-radius: 10px;",
" padding: 18px;",
" }",
"",
" #destination-buttons.ytd-destination-shelf-renderer {",
" margin: 0;",
" }",
"",
" ytd-destination-button-renderer {",
" background-color: var(--bg-color);",
" border-radius: 10px;",
" box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.18);",
" }",
"",
" ytd-destination-button-renderer:hover {",
" background-color: var(--bg-color-light);",
" }",
"",
" ytd-thumbnail #thumbnail.ytd-thumbnail {",
" border-radius: 10px;",
" }",
"",
" ytd-thumbnail-overlay-time-status-renderer[overlay-style=SHORTS] {",
" background-color: rgba(16, 17, 19, 0.6) !important;",
" }",
"",
" .metadata.ytd-compact-video-renderer .yt-simple-endpoint {",
" flex-direction: column;",
" justify-content: left !important;",
" align-items: flex-start !important;",
" }",
"",
" #items.ytd-grid-renderer > ytd-grid-video-renderer.ytd-grid-renderer,",
" #items.ytd-grid-renderer > ytd-downloaded-video-grid-video-renderer.ytd-grid-renderer,",
" #items.ytd-grid-renderer > ytd-grid-radio-renderer.ytd-grid-renderer,",
" #items.ytd-grid-renderer > ytd-grid-channel-renderer.ytd-grid-renderer,",
" #items.ytd-grid-renderer > ytd-grid-playlist-renderer.ytd-grid-renderer,",
" #items.ytd-grid-renderer > ytd-grid-movie-playlist-renderer.ytd-grid-renderer,",
" #items.ytd-grid-renderer > ytd-grid-movie-renderer.ytd-grid-renderer,",
" #items.ytd-grid-renderer > ytd-grid-show-renderer.ytd-grid-renderer,",
" #items.ytd-grid-renderer > ytd-game-card-renderer.ytd-grid-renderer {",
" margin-right: 18px;",
" }",
"",
" ytd-two-column-browse-results-renderer.grid:not(.grid-disabled) {",
" background-color: var(--bg-color-dark);",
" padding: 12px;",
" padding-top: 0;",
" border-radius: 10px;",
" }",
"",
" ytd-thumbnail-overlay-toggle-button-renderer {",
" background-color: rgba(16, 17, 19, 0.6) !important;",
" font-family: var(--font-family);",
" font-weight: var(--font-medium);",
" color: var(--text-color);",
" border-radius: 4px;",
" }",
"",
" ytd-thumbnail-overlay-toggle-button-renderer {",
" border-top-left-radius: 0;",
" border-bottom-left-radius: 0;",
" }",
"",
" ytd-thumbnail-overlay-toggle-button-renderer[use-expandable-tooltip] tp-yt-paper-tooltip.ytd-thumbnail-overlay-toggle-button-renderer {",
" font-family: var(--font-family);",
" font-weight: var(--font-medium);",
" color: var(--text-color);",
" }",
"",
" html tp-yt-paper-tooltip .tp-yt-paper-tooltip[style-target=tooltip] {",
" font-family: var(--font-family);",
" font-weight: var(--font-medium);",
" color: var(--text-color);",
" background-color: #212226;",
" }",
"",
" ytd-thumbnail-overlay-toggle-button-renderer[use-expandable-tooltip] #label-container.ytd-thumbnail-overlay-toggle-button-renderer {",
" border-top-right-radius: 0;",
" border-bottom-right-radius: 0;",
" }",
"",
" .grid-subheader.ytd-shelf-renderer {",
" border-bottom: 1px solid #1A1B1E;",
" padding-bottom: 8px;",
" }",
"",
" #title-container.ytd-shelf-renderer,",
" h2.ytd-shelf-renderer {",
" height: 100%;",
" }",
"",
" #title-text.ytd-shelf-renderer,",
" #title.ytd-shelf-renderer {",
" position: relative;",
" font-family: var(--font-family);",
" font-weight: var(--font-medium);",
" color: var(--text-color);",
" overflow: initial;",
" }",
"",
" #sort-filter.style-scope.ytd-shelf-renderer {",
" height: 36px;",
" display: flex;",
" align-items: center;",
" }",
"",
" #title-text.ytd-shelf-renderer:after,",
" #title.ytd-shelf-renderer:after {",
" content: ' ';",
" height: 3px;",
" width: 100%;",
" border-top-left-radius: 4px;",
" border-top-right-radius: 4px;",
" background-color: var(--accent-color);",
" position: absolute;",
" bottom: -16px;",
" left: 0;",
" }",
"",
" ytd-two-column-browse-results-renderer.grid:not(.grid-disabled) {",
" background-color: transparent;",
" }",
"",
" ytd-two-column-browse-results-renderer[page-subtype=history] #secondary.ytd-two-column-browse-results-renderer,",
" #primary.ytd-two-column-browse-results-renderer {",
" background-color: var(--bg-color-dark);",
" border-radius: 10px;",
" }",
"",
" ytd-two-column-browse-results-renderer[page-subtype=history] #secondary.ytd-two-column-browse-results-renderer {",
" margin-left: 18px;",
" }",
"",
" #primary ytd-section-list-renderer {",
" padding: 18px;",
" padding-top: 0;",
" }",
"",
" iron-input.tp-yt-paper-input > input.tp-yt-paper-input,",
" yt-formatted-string.ytd-sub-feed-option-renderer {",
" font-family: var(--font-family);",
" font-weight: var(--font-medium);",
" color: var(--text-color);",
" }",
"",
" tp-yt-paper-input.ytd-search-box-renderer #labelAndInputContainer.tp-yt-paper-input-container > label,",
" tp-yt-paper-input.ytd-search-box-renderer #labelAndInputContainer.tp-yt-paper-input-container > .paper-input-label,",
" ytd-button-renderer yt-formatted-string.ytd-button-renderer,",
" ytd-compact-link-renderer[compact-link-style=compact-link-style-type-history-my-activity-link] #content-icon.ytd-compact-link-renderer[hidden] + #primary-text-container.ytd-compact-link-renderer > #label.ytd-compact-link-renderer {",
" color: var(--text-color-2);",
" font-family: var(--font-family);",
" font-weight: var(--font-medium);",
" font-size: 12px;",
" }",
"",
" ytd-compact-link-renderer[compact-link-style=compact-link-style-type-history-my-activity-link] #content-icon.ytd-compact-link-renderer[hidden] + #primary-text-container.ytd-compact-link-renderer > #label.ytd-compact-link-renderer {",
" font-size: 14px;",
" }",
"",
" ytd-button-renderer yt-formatted-string.ytd-button-renderer {",
" color: var(--text-color);",
" font-weight: var(--font-bold);",
" }",
"",
" #title.ytd-sub-feed-selector-renderer {",
" font-family: var(--font-family);",
" font-weight: var(--font-bold);",
" color: var(--text-color);",
" }",
"",
" tp-yt-paper-radio-button[checked] #offRadio.tp-yt-paper-radio-button {",
" border-color: var(--accent-color);",
" }",
"",
" #onRadio.tp-yt-paper-radio-button {",
" background-color: var(--accent-color);",
" }",
"",
" #offRadio.tp-yt-paper-radio-button {",
" border-color: var(--text-color-3);",
" }",
"",
" ytd-playlist-thumbnail.ytd-playlist-sidebar-primary-info-renderer:before {",
" border-radius: 10px;",
" background-color: transparent;",
" }",
"",
" ytd-playlist-sidebar-renderer {",
" background-color: var(--bg-color-dark);",
" border-radius: 10px;",
" }",
"",
" ytd-playlist-video-renderer {",
" border-radius: 10px;",
" }",
"",
" ytd-playlist-video-renderer:hover:not(.dragging) {",
" background-color: #000;",
" }",
"",
" #index.ytd-playlist-video-renderer,",
" #video-title.ytd-playlist-video-renderer {",
" font-family: var(--font-family);",
" font-weight: var(--font-medium);",
" color: var(--text-color-2);",
" }",
"",
" #video-title.ytd-playlist-video-renderer {",
" color: var(--text-color);",
" font-weight: var(--font-semibold);",
" }",
"",
" #content.ytd-playlist-video-renderer {",
" border: 0;",
" }",
"",
" ytd-playlist-video-renderer:hover #content.ytd-playlist-video-renderer {",
" border: 0;",
" }",
"",
" tp-yt-paper-item {",
" font-family: var(--font-family);",
" color: var(--text-color);",
" font-weight: var(--font-semibold);",
" border-radius: 10px;",
" }",
"",
" tp-yt-paper-item.ytd-menu-service-item-download-renderer:hover {",
" background-color: #000;",
" }",
"",
" ytd-watch-flexy[flexy][is-two-columns_] #columns.ytd-watch-flexy {",
" margin-top: 18px;",
" }",
"",
" #primary.ytd-watch-flexy {",
" background-color: var(--bg-color-dark);",
" border-radius: 10px;",
" margin-left: 0;",
" padding: 18px;",
" }",
"",
" ytd-watch-flexy[flexy] #secondary.ytd-watch-flexy {",
" padding-top: 0 !important;",
" margin-left: 18px;",
" margin-top: 0;",
" }",
"",
" #container.ytd-playlist-panel-renderer {",
" background-color: var(--bg-color-dark);",
" border: 0;",
" border-radius: 10px;",
" }",
"",
" .header.ytd-playlist-panel-renderer {",
" background-color: var(--bg-color-light);",
" border-top-left-radius: 10px;",
" border-top-right-radius: 10px;",
" }",
" ",
" .playlist-items.ytd-playlist-panel-renderer {",
" background-color: transparent;",
" }",
"",
" ytd-playlist-panel-renderer[collapsible] .title.ytd-playlist-panel-renderer a {",
" font-family: var(--font-family);",
" color: var(--text-color);",
" font-weight: var(--font-semibold);",
" font-size: 16px !important;",
" }",
"",
" ytd-playlist-panel-video-renderer {",
" border-radius: 10px;",
" }",
"",
" ytd-playlist-panel-video-renderer[selected][watch-color-update],",
" ytd-playlist-panel-video-renderer[watch-color-update][can-reorder]:hover.dragging,",
" ytd-playlist-panel-video-renderer[watch-color-update][can-reorder].dragging,",
" ytd-playlist-panel-video-renderer[watch-color-update]:hover:not(.dragging) {",
" background-color: #000000;",
" }",
" ",
" #container.ytd-playlist-panel-renderer {",
" max-height: 380px !important;",
" padding-bottom: 18px;",
" }",
" ",
" #related {",
" background-color: var(--bg-color-dark);",
" border-radius: 10px;",
" padding: 18px;",
" padding-top: 12px;",
" position: relative;",
" top: 0;",
" }",
" ",
" #left-arrow-button.yt-chip-cloud-renderer, #right-arrow-button.yt-chip-cloud-renderer {",
" background-color: var(--bg-color-dark);",
" }",
" ",
" yt-chip-cloud-renderer[is-dark-theme] #right-arrow.yt-chip-cloud-renderer:before {",
" background: linear-gradient(to left,var(--bg-color-dark) 10%,rgba(24,24,24,0) 90%);",
" }",
" ",
" yt-chip-cloud-renderer[is-dark-theme] #left-arrow.yt-chip-cloud-renderer:after {",
" background: linear-gradient(to right,var(--bg-color-dark) 10%,rgba(24,24,24,0) 90%);",
" }",
" ",
" #scroll-container.yt-chip-cloud-renderer {",
" height: 40px;",
" border-bottom: 1px solid #1A1B1E;",
" }",
" ",
" yt-icon-button.style-default-active,",
" yt-formatted-string.style-default-active {",
" color: var(--accent-color) !important;",
" font-family: var(--font-family);",
" font-weight: var(--font-semibold);",
" }",
" ",
" ytd-watch-metadata:not([modern-metapanel]) #owner.ytd-watch-metadata,",
" ytd-comments-entry-point-header-renderer:not([modern-metapanel]),",
" #simple-box.ytd-comments-header-renderer {",
" border-radius: 10px;",
" background-color: #000;",
" border: 0;",
" }",
" ",
" #simple-box.ytd-comments-header-renderer {",
" padding: 18px;",
" }",
" ",
" #author-thumbnail.ytd-comment-simplebox-renderer {",
" border-radius: 10px;",
" }",
" ",
" tp-yt-paper-button.ytd-subscribe-button-renderer {",
" color: var(--text-color);",
" font-family: var(--font-family);",
" font-weight: var(--font-bold);",
" background-color: var(--accent-color) !important;",
" border-radius: 10px;",
" }",
" ",
" tp-yt-paper-button.ytd-subscribe-button-renderer:hover,",
" tp-yt-paper-button.ytd-subscribe-button-renderer:focus,",
" tp-yt-paper-button.ytd-subscribe-button-renderer[subscribed] {",
" background-color: var(--accent-color-hover) !important;",
" color: var(--text-color);",
" }",
" ",
" yt-confirm-dialog-renderer[dialog][dialog][dialog],",
" tp-yt-paper-dialog {",
" background-color: var(--bg-color-dark);",
" border-radius: 10px;",
" }",
" ",
" yt-button-renderer #button.yt-button-renderer {",
" font-family: var(--font-family);",
" font-weight: var(--font-bold);",
" }",
" ",
" #scroller.yt-confirm-dialog-renderer span {",
" font-family: var(--font-family);",
" }",
" ",
" ytd-menu-service-item-renderer[is-selected],",
" ytd-menu-service-item-renderer[is-selected] tp-yt-paper-item.ytd-menu-service-item-renderer:hover {",
" background-color: #000;",
" border-radius: 10px;",
" }",
" ",
" ytd-button-renderer.style-primary[is-paper-button] {",
" background-color: #1D1F22;",
" border-radius: 10px;",
" color: var(--text-color);",
" }",
" ",
" .ytd-commentbox #submit-button #text {",
" color: var(--text-color) !important;",
" }",
" ",
" .ytd-commentbox #submit-button[disabled] #text {",
" color: var(--text-color-3) !important;",
" }",
" ",
" #content-text.ytd-comment-renderer,",
" #vote-count-middle.ytd-comment-action-buttons-renderer {",
" font-family: var(--font-family);",
" font-weight: var(--font-medium);",
" color: var(--text-color);",
" }",
" ",
" #vote-count-middle.ytd-comment-action-buttons-renderer {",
" color: var(--text-color-2);",
" }",
" ",
" ytd-button-renderer[is-paper-button],",
" ytd-button-renderer.style-suggestive[is-paper-button],",
" ytd-button-renderer.style-suggestive[is-paper-button] tp-yt-paper-button.ytd-button-renderer {",
" background-color: var(--accent-color);",
" color: var(--text-color) !important;",
" border: 0;",
" border-radius: 10px;",
" }",
" ",
" ytd-button-renderer[is-paper-button]:hover {",
" background-color: var(--accent-color-hover);",
" }",
" ",
" #end ytd-button-renderer yt-formatted-string.ytd-button-renderer {",
" color: var(--text-color) !important;",
" }",
" ",
" ytd-browse[page-subtype='home'] #primary {",
" background-color: transparent;",
" }",
" ",
" #reply-button-end ytd-button-renderer[is-paper-button],",
" #replies #more-replies,",
" #replies #less-replies,",
" #cancel-button {",
" background-color: transparent !important;",
" font-weight: var(--font-medium) !important;",
" color: var(--text-color-2) !important;",
" }",
" ",
" ytd-page-manager>*.ytd-page-manager {",
" overflow: hidden;",
" }",
" ",
" .ytd-continuation-item-renderer {",
" background-color: transparent !important;",
" }",
" ",
" .ytd-continuation-item-renderer ytd-button-renderer #button.ytd-button-renderer {",
" color: var(--text-color);",
" }",
" ",
" .ytd-continuation-item-renderer ytd-button-renderer #button.ytd-button-renderer:hover,",
" .ytd-continuation-item-renderer ytd-button-renderer #button.ytd-button-renderer:hover yt-formatted-string.ytd-button-renderer{",
" color: var(--accent-color);",
" }",
" ",
" tp-yt-paper-listbox.yt-dropdown-menu .iron-selected.yt-dropdown-menu, ",
" tp-yt-paper-listbox.yt-dropdown-menu .iron-selected.yt-dropdown-menu .yt-dropdown-menu::before {",
" border-radius: 10px !important;",
" }",
" ",
" #sponsor-button ytd-button-renderer {",
" background-color: transparent !important;",
" }",
" ",
" #sponsor-button ytd-button-renderer:hover yt-formatted-string.ytd-button-renderer {",
" color: var(--accent-color);",
" }",
" ",
" .ytd-live-chat-frame ytd-toggle-button-renderer #button.ytd-toggle-button-renderer {",
" background-color: var(--bg-color-dark);",
" border-radius: 10px;",
" border: 0;",
" }",
" ",
" .ytd-live-chat-frame ytd-toggle-button-renderer #button.ytd-toggle-button-renderer[aria-pressed='true'] {",
" border-top-left-radius: 0;",
" border-top-right-radius: 0;",
" }",
" ",
" .ytd-live-chat-frame ytd-toggle-button-renderer #button.ytd-toggle-button-renderer[aria-pressed='false'] {",
" border-top-left-radius: 10px;",
" border-top-right-radius: 10px;",
" }",
" ",
" #show-hide-button.ytd-live-chat-frame>ytd-toggle-button-renderer.ytd-live-chat-frame {",
" background-color: var(--bg-color-dark);",
" border: 0;",
" border-radius: 10px;",
" border-bottom-left-radius: 10px;",
" border-bottom-right-radius: 10px;",
" }",
" ",
" ytd-live-chat-frame {",
" border: 0;",
" }",
" ",
" yt-live-chat-renderer {",
" border-top-left-radius: 10px;",
" border-top-right-radius: 10px;",
" background-color: var(--bg-color-dark);",
" }",
" ",
" yt-live-chat-header-renderer {",
" border-top-left-radius: 10px;",
" border-top-right-radius: 10px;",
" background-color: var(--bg-color-light);",
" }",
" ",
" ytd-video-renderer[is-backstage-video] ytd-thumbnail.ytd-video-renderer {",
" height: auto;",
" }",
" ",
" ytd-search[center-results] ytd-two-column-search-results-renderer.ytd-search,",
" ytd-two-column-search-results-renderer[guide-persistent-and-visible] #primary.ytd-two-column-search-results-renderer {",
" width: 200%;",
" max-width: 200%;",
" }",
" ",
" ytd-search[center-results] #container.ytd-search {",
" border-radius: 10px;",
" background-color: var(--bg-color-dark);",
" padding: 8px;",
" }",
" ",
" .html5-video-player {",
" border-radius: 10px;",
" }",
" ",
" ytd-rich-grid-row #contents.ytd-rich-grid-row {",
" max-width: calc(4 * (540px + var(--ytd-rich-grid-item-margin)));",
" }",
" ",
" ytd-rich-item-renderer {",
" padding-left: calc(46px/2);",
" padding-right: calc(46px/2);",
" margin-left: 0;",
" margin-right: 0;",
" }",
" ",
" ytd-watch-flexy[theater] .html5-video-player {",
" border-radius: 0;",
" }",
" ",
" .video-preview-container ytd-toggle-button-renderer.force-icon-button a.ytd-toggle-button-renderer {",
" color: var(--text-color) !important;",
" background-color: var(--bg-color-light) !important;",
" }",
" ",
" ytd-alert-with-button-renderer[type=INFO],",
" ytd-browse[page-subtype=playlist] ytd-two-column-browse-results-renderer.ytd-browse{",
" background-color: var(--bg-color-dark);",
" }",
" ",
" ytd-browse[page-subtype=playlist][has-sidebar_] ytd-two-column-browse-results-renderer.ytd-browse,",
" ytd-browse[page-subtype=playlist][has-sidebar_] #alerts.ytd-browse{",
" padding-left: 380px;",
" }",
" ",
" ytd-browse[page-subtype=playlist] {",
" border-radius: 10px;",
" width: 96%;",
" margin: 0 24px;",
" margin-top: 16px;",
" }",
" ",
" #wrapper.tp-yt-app-header-layout > [slot=header] {",
" top: 10px;",
" }",
" ",
" ytd-browse[page-subtype=channels],",
" #channel-container.ytd-c4-tabbed-header-renderer, #tabs-container.ytd-c4-tabbed-header-renderer,",
" #channel-header.ytd-c4-tabbed-header-renderer,",
" #tabs-inner-container.ytd-c4-tabbed-header-renderer {",
" background-color: var(--bg-color);",
" }",
" ",
" ytd-browse[page-subtype~=channels] ytd-two-column-browse-results-renderer.ytd-browse {",
" margin-top: 32px;",
" }",
"}"
].join("\n");
if (typeof GM_addStyle != 'undefined') {
GM_addStyle(css);
} else if (typeof PRO_addStyle != 'undefined') {
PRO_addStyle(css);
} else if (typeof addStyle != 'undefined') {
addStyle(css);
} else {
var node = document.createElement('style');
node.type = 'text/css';
node.appendChild(document.createTextNode(css));
var heads = document.getElementsByTagName('head');
if (heads.length > 0) { heads[0].appendChild(node);
} else {
// no head yet, stick it whereever
document.documentElement.appendChild(node);
}
}})();