make Youtube panes and pop-ups glassy
@charset "UTF-8"; /* ==UserStyle== @name Glassy Youtube @namespace @ngokimphu @version 0.2 @description make Youtube panes and pop-ups glassy @author Ngo Kim Phu @include https://www.youtube.com/* @license GPL-3.0-or-later ==/UserStyle== */ @-moz-document url-prefix("https://www.youtube.com") { html:not(.style-scope)[dark] { --yt-endpoint-visited-color: #a9c; --yt-spec-call-to-action: #9bd !important; --yt-spec-text-primary: #ccc !important; --yt-button-color: #ccc !important; --yt-spec-icon-active-other: var(--yt-button-color) !important; --yt-spec-icon-inactive: #777 !important; --yt-spec-brand-icon-inactive: var(--yt-spec-icon-inactive) !important; } .ytp-button > svg path { fill: var(--yt-button-color); } .sponsorSkipNotice *, .sponsorBlockPageBody * { border-color: var(--yt-spec-text-primary) !important; color: var(--yt-spec-text-primary) !important; } .sponsorBlockPageBody .switchDot { background-color: var(--yt-button-color) !important; } html:not(.style-scope)[dark] * { --app-drawer-content-container_-_background-color: #18181855; --yt-spec-brand-background-primary: #18181899; --yt-spec-brand-background-solid: #21212133; --yt-searchbox-background: #12121233; --ytd-searchbox-legacy-border-color: #30303055; --ytd-searchbox-legacy-button-border-color: #30303055; --yt-dialog-background: #24242455; --paper-listbox-background-color: #212121aa; --paper-dialog-background-color: #212121aa; } #contentWrapper, #masthead, #masthead-container + * #contentContainer, paper-listbox, paper-dialog { backdrop-filter: blur(4px); } #chips-wrapper { backdrop-filter: blur(2px); } ytd-thumbnail-overlay-time-status-renderer { opacity: .7 !important; } .ytp-ce-element.ytp-ce-element-show, .ytp-progress-list { opacity: .4 !important; } .ytp-ce-shadow, .ytp-title-text:hover, .ytp-gradient-top:hover { opacity: 0 !important; } }