diff options
Diffstat (limited to 'styles/websites/youtube.css')
| -rw-r--r-- | styles/websites/youtube.css | 165 |
1 files changed, 0 insertions, 165 deletions
diff --git a/styles/websites/youtube.css b/styles/websites/youtube.css deleted file mode 100644 index 568e425..0000000 --- a/styles/websites/youtube.css +++ /dev/null @@ -1,165 +0,0 @@ -@import url("../global/base.css");
-
-:root {
- --main-background: transparent !important;
- --yt-spec-base-background: transparent !important;
- --second-background: transparent !important;
-}
-
-html[dark] {
- background: transparent !important;
-}
-
-#masthead-container {
- background: var(--transparent-background-darker) !important;
- backdrop-filter: var(--backdrop-blur);
-}
-
-#home-chips,
-#chips-wrapper.ytd-feed-filter-chip-bar-renderer {
- position: static;
-
- yt-chip-cloud-chip-renderer[chip-style="STYLE_DEFAULT"][selected],
- yt-chip-cloud-chip-renderer[chip-style="STYLE_HOME_FILTER"][selected] {
- background: none !important;
-
- #chip-container.yt-chip-cloud-chip-renderer {
- background: var(--color-bg) !important;
- outline: 1px solid var(--color-primary);
- outline-offset: -1px;
- }
- }
-}
-
-a#thumbnail {
- background: var(--transparent-background) !important;
-}
-
-#efyt-background {
- background: var(--color-bg) !important;
-}
-
-.ytSearchboxComponentInputBox {
- background: var(--color-bg) !important;
-}
-
-.ytSearchboxComponentSearchButton {
- background: black !important;
-
- &:hover {
- background: var(--color-primary) !important;
- }
-}
-
-.ytSearchboxComponentSuggestionsContainer {
- background: var(--color-bg) !important;
- top: 48px;
- border-radius: 0;
- border-bottom-left-radius: var(--border-radius);
- border-bottom-right-radius: var(--border-radius);
-
- .ytSuggestionComponentSuggestion:hover {
- background: var(--transparent-primary) !important;
- cursor: pointer;
-
- .ytSuggestionComponentText {
- cursor: pointer;
- }
- }
-}
-
-.ytp-popup.ytp-contextmenu,
-.ytd-popup-container {
- background-color: var(--transparent-background-dark) !important;
- backdrop-filter: var(--backdrop-blur);
- border-radius: var(--border-radius);
-
- .ytp-menuitem,
- .ytd-menu-service-item-renderer {
- &:hover {
- background-color: var(--color-bg) !important;
- }
- }
-
- ytd-menu-service-item-renderer:hover {
- background: none !important;
- }
-}
-
-#contents .ytd-rich-grid-renderer:has(.ytwFeedAdMetadataViewModelHostIsClickableAdComponent),
-#contents .ytd-rich-grid-renderer:has(.ytd-in-feed-ad-layout-renderer) {
- display: none !important;
-}
-
-/* Youtube Player (incl. embeds) */
-#player,
-#player-container {
- #cinematics.ytd-watch-flexy {
- /* Disable ambient mode */
- display: none !important;
- }
-
- .ytp-popup,
- .ytp-tooltip {
- background-color: var(--transparent-background-darker) !important;
- backdrop-filter: var(--backdrop-blur);
- border-radius: var(--border-radius);
- }
-
- .ytp-title-channel {
- &.ytp-title-expanded {
- background-color: var(--transparent-background-darker) !important;
- backdrop-filter: var(--backdrop-blur);
- border-radius: 25px;
- }
- }
-
- .ytp-title-link {
- color: var(--color-white) !important;
- }
-
- .ytp-progress-bar-container {
- .ytp-progress-list {
- background-color: rgb(from var(--color-white) r g b / 0.25) !important;
-
- .ytp-play-progress {
- background-color: var(--color-primary) !important;
- }
-
- .ytp-load-progress,
- .ytp-hover-progress {
- background-color: rgb(from var(--color-white) r g b / 0.5) !important;
- }
- }
-
- .ytp-scrubber-button {
- background-color: var(--color-primary) !important;
- }
- }
-
- .ytp-volume-area {
- .ytp-volume-slider-handle {
- background-color: var(--color-white) !important;
-
- &::before {
- background-color: var(--color-white) !important;
- }
-
- &::after {
- background-color: rgb(from var(--color-white) r g b / 0.25) !important;
- }
- }
- }
-
- .ytp-settings-button.ytp-hd-quality-badge,
- .ytp-settings-button.ytp-hdr-quality-badge,
- .ytp-settings-button.ytp-4k-quality-badge,
- .ytp-settings-button.ytp-5k-quality-badge,
- .ytp-settings-button.ytp-8k-quality-badge,
- .ytp-settings-button.ytp-3d-badge-grey,
- .ytp-settings-button.ytp-3d-badge {
- &::after {
- background-color: var(--color-red) !important;
- }
- }
-}
|