// ==UserScript==
// @name YouTube Q2 2023 rounded UI
// @version 20240810.19.45
// @description This is the version of YouTube Rounded UI from April to June 2023.
// @author xX_LegendCraftd_Xx
// @icon https://www.youtube.com/favicon.ico
// @namespace https://greasyfork.org/en/users/933798
// @license MIT
// @match *://www.youtube.com/*
// @grant none
// @run-at document-start
// ==/UserScript==
// Enable strict mode to catch common coding mistakes
"use strict";
// Define the flags to assign to the EXPERIMENT_FLAGS object
const flagsToAssign = {
kevlar_watch_grid: false,
kevlar_watch_grid_hide_chips: false,
kevlar_watch_metadata_refresh_no_old_secondary_data: false,
enable_channel_page_header_profile_section: false,
kevlar_modern_sd_v2: false,
kevlar_watch_comments_panel_button: false,
smartimation_background: false,
web_animated_actions: false,
web_modern_collections_v2: false,
web_modern_tabs: false,
web_modern_typography: false,
web_enable_youtab: false,
web_watch_rounded_player_large: false,
// Extra additions to remove the watch grid UI
web_player_enable_featured_product_banner_exclusives_on_desktop: false,
kevlar_watch_comments_panel_button: false,
fill_view_models_on_web_vod: true,
kevlar_watch_flexy_metadata_height: 136,
kevlar_watch_max_player_width: 1280,
live_chat_over_engagement_panels: false,
live_chat_scaled_height: false,
live_chat_smaller_min_height: false,
main_app_controller_extraction_batch_18: false,
main_app_controller_extraction_batch_19: false,
no_iframe_for_web_stickiness: false,
optimal_reading_width_comments_ep: false,
remove_masthead_channel_banner_on_refresh: false,
small_avatars_for_comments: false,
small_avatars_for_comments_ep: false,
web_watch_compact_comments: false,
web_watch_compact_comments_header: false,
web_watch_log_theater_mode: false,
web_watch_theater_chat: false,
web_watch_theater_fixed_chat: false,
wn_grid_max_item_width: 0,
wn_grid_min_item_width: 0
};
const updateFlags = () => {
// Check if the EXPERIMENT_FLAGS object exists in the window.yt.config_ property chain
const expFlags = window?.yt?.config_?.EXPERIMENT_FLAGS;
// If EXPERIMENT_FLAGS is not found, exit the function
if (!expFlags) return;
// Assign the defined flags to the EXPERIMENT_FLAGS object
Object.assign(expFlags, flagsToAssign);
};
// Create a MutationObserver that calls the updateFlags function when changes occur in the document's subtree
const mutationObserver = new MutationObserver(updateFlags);
mutationObserver.observe(document, { subtree: true, childList: true });
(function() {
let css = `
div#chip-bar.style-scope.ytd-search-header-renderer > yt-chip-cloud-renderer.style-scope.ytd-search-header-renderer > div#container.style-scope.yt-chip-cloud-renderer {
display: none !important
}
ytd-watch-flexy[rounded-player-large]:not([fullscreen]):not([theater]) #ytd-player.ytd-watch-flexy {
border-radius: 0px !important
}
#voice-search-button.ytd-masthead {
background-color: var(--yt-spec-general-background-a) !important;
margin-left: 4px !important
}
[page-subtype="history"] #channel-header.ytd-tabbed-page-header {
padding-top: 0 !important;
padding-bottom: 0 !important
}
.page-header-view-model-wiz__page-header-title--page-header-title-large {
margin-top: 24px !important;
margin-bottom: 8px !important;
color: var(--yt-spec-text-primary) !important;
font-size: 1.6em !important;
line-height: 1.4em !important;
font-weight: 500 !important
}
#endpoint.yt-simple-endpoint.ytd-guide-entry-renderer.style-scope[title="Your channel"] {
display: none !important
}
ytd-guide-entry-renderer > a[href*="/playables"] {
display: none !important
}
#avatar.ytd-c4-tabbed-header-renderer {
width: 128px !important;
height: 128px !important;
margin-bottom: 12px !important
}
.yt-spec-avatar-shape__button--button-giant, .yt-spec-avatar-shape--avatar-size-giant {
width: 128px !important;
height: 128px !important
}
ytd-c4-tabbed-header-renderer[use-page-header-style] #channel-name.ytd-c4-tabbed-header-renderer,
[page-subtype="channels"] .page-header-view-model-wiz__page-header-title--page-header-title-large {
font-size: 2.4em !important;
font-weight: 400 !important;
line-height: var(--yt-channel-title-line-height, 3rem) !important
}
ytd-c4-tabbed-header-renderer[use-page-header-style] #channel-handle.ytd-c4-tabbed-header-renderer {
font-weight: 500 !important
}
ytd-c4-tabbed-header-renderer[use-page-header-style] #channel-pronouns.ytd-c4-tabbed-header-renderer,
yt-formatted-string#channel-pronouns.style-scope.ytd-c4-tabbed-header-renderer {
display: none !important
}
span.delimiter.style-scope.ytd-c4-tabbed-header-renderer,
.yt-content-metadata-view-model-wiz__delimiter {
display: none !important
}
ytd-c4-tabbed-header-renderer[use-page-header-style] .meta-item.ytd-c4-tabbed-header-renderer, .yt-content-metadata-view-model-wiz--medium-text .yt-content-metadata-view-model-wiz__metadata-text {
margin-right: 8px !important
}
div#channel-header-links.style-scope.ytd-c4-tabbed-header-renderer, .page-header-view-model-wiz__page-header-attribution {
display: none !important
}
div#meta.style-scope.ytd-c4-tabbed-header-renderer {
width: auto !important
}
ytd-c4-tabbed-header-renderer[use-page-header-style] #inner-header-container.ytd-c4-tabbed-header-renderer {
flex-direction: row !important
}
ytd-c4-tabbed-header-renderer[use-page-header-style] #channel-header-container.ytd-c4-tabbed-header-renderer {
padding-top: 8px !important;
margin-bottom: 0px !important
}
div.page-header-banner.style-scope.ytd-c4-tabbed-header-renderer, [has-inset-banner] #page-header-banner.ytd-tabbed-page-header {
margin-left: 0px !important;
margin-right: 0px !important;
border-radius: 0px !important
}
ytd-c4-tabbed-header-renderer[use-page-header-style] .page-header-banner.ytd-c4-tabbed-header-renderer,
.yt-image-banner-view-model-wiz--inset {
border-radius: 0px !important
}
[has-inset-banner] #page-header-banner.ytd-tabbed-page-header {
padding-left: 0 !important;
padding-right: 0 !important;
}
.yt-content-metadata-view-model-wiz__metadata-text {
margin-right: 8px !important
}
.yt-content-metadata-view-model-wiz__metadata-text, .truncated-text-wiz, .truncated-text-wiz__absolute-button {
font-size: 1.4rem !important
}
.yt-tab-shape-wiz {
padding: 0 32px !important;
margin-right: 0 !important
}
.yt-tab-shape-wiz__tab {
font-size: 14px !important;
font-weight: 500 !important;
letter-spacing: var(--ytd-tab-system-letter-spacing) !important;
text-transform: uppercase !important
}
.yt-tab-group-shape-wiz__slider {
display: none !important
}
.yt-tab-shape-wiz__tab-bar {
display: none !important
}
yt-formatted-string.style-scope.yt-chip-cloud-chip-renderer {
font-weight: 400 !important
}
span.style-scope.ytd-rich-shelf-renderer {
font-weight: 400 !important
}
span.style-scope.ytd-shelf-renderer {
font-size: 1.6rem !important;
font-weight: 500 !important
}
.count-text.ytd-comments-header-renderer {
font-size: 1.6rem !important;
line-height: 2.2rem !important;
font-weight: 400 !important
}
.ytp-tooltip.ytp-rounded-tooltip.ytp-preview:not(.ytp-text-detail), .ytp-tooltip.ytp-rounded-tooltip.ytp-preview:not(.ytp-text-detail) .ytp-tooltip-bg {
border-radius: 2px !important
}
[d*="m12.71 12 8.15 8.15-.71.71L12 12.71l-8.15 8.15-.71-.71L11.29 12 3.15 3.85l.71-.71L12 11.29l8.15-8.15.71.71L12.71 12z"] {
d: path("M12.7,12l6.6,6.6l-0.7,0.7L12,12.7l-6.6,6.6l-0.7-0.7l6.6-6.6L4.6,5.4l0.7-0.7l6.6,6.6l6.6-6.6l0.7,0.7L12.7,12z")
}
[d*="M16.296 16.996a8 8 0 11.707-.708l3.909 3.91-.707.707-3.909-3.909zM18 11a7 7 0 00-14 0 7 7 0 1014 0z"] {
d: path("m20.87 20.17-5.59-5.59C16.35 13.35 17 11.75 17 10c0-3.87-3.13-7-7-7s-7 3.13-7 7 3.13 7 7 7c1.75 0 3.35-.65 4.58-1.71l5.59 5.59.7-.71zM10 16c-3.31 0-6-2.69-6-6s2.69-6 6-6 6 2.69 6 6-2.69 6-6 6z")
}
[d*="M18 4v15.06l-5.42-3.87-.58-.42-.58.42L6 19.06V4h12m1-1H5v18l7-5 7 5V3z"] {
d: path("M22 13h-4v4h-2v-4h-4v-2h4V7h2v4h4v2zm-8-6H2v1h12V7zM2 12h8v-1H2v1zm0 4h8v-1H2v1z")
}
/* Revert video list and watch UI fixes */
ytd-watch-flexy #comment-teaser.ytd-watch-metadata {
display: none
}
ytd-watch-flexy #dismissible.ytd-rich-grid-media {
flex-direction: row
}
ytd-watch-flexy #attached-survey.ytd-rich-grid-media,
ytd-watch-flexy #avatar-link.ytd-rich-grid-media {
display: none
}
ytd-watch-flexy ytd-thumbnail.ytd-rich-grid-media,
ytd-watch-flexy ytd-playlist-thumbnail.ytd-rich-grid-media {
margin-right: 8px;
height: 94px;
width: 168px
}
ytd-watch-flexy ytd-thumbnail[size=large] a.ytd-thumbnail, ytd-watch-flexy ytd-thumbnail[size=large]:before,
ytd-watch-flexy ytd-thumbnail[size=large][large-margin] a.ytd-thumbnail, ytd-watch-flexy ytd-thumbnail[size=large][large-margin]:before {
border-radius: 8px
}
ytd-watch-flexy ytd-thumbnail[size=large][large-margin] ytd-thumbnail-overlay-time-status-renderer.ytd-thumbnail, ytd-watch-flexy ytd-thumbnail[size=large][large-margin] ytd-thumbnail-overlay-button-renderer.ytd-thumbnail, ytd-watch-flexy ytd-thumbnail[size=large][large-margin] ytd-thumbnail-overlay-toggle-button-renderer.ytd-thumbnail,
ytd-watch-flexy ytd-thumbnail[size=large] ytd-thumbnail-overlay-time-status-renderer.ytd-thumbnail, ytd-watch-flexy ytd-thumbnail[size=large] ytd-thumbnail-overlay-button-renderer.ytd-thumbnail, ytd-watch-flexy ytd-thumbnail[size=large] ytd-thumbnail-overlay-toggle-button-renderer.ytd-thumbnail {
margin: 4px
}
ytd-watch-flexy ytd-rich-item-renderer,
ytd-watch-flexy ytd-rich-grid-row #contents.ytd-rich-grid-row {
margin: 0
}
ytd-watch-flexy ytd-rich-item-renderer[reduced-bottom-margin] {
margin-top: 8px;
margin-bottom: 0
}
ytd-watch-flexy ytd-rich-grid-renderer[reduced-top-margin] #contents.ytd-rich-grid-renderer {
padding-top: 0px
}
ytd-watch-flexy ytd-rich-grid-media {
margin-bottom: 8px
}
ytd-watch-flexy #details.ytd-rich-grid-media {
width: 100%;
min-width: 0
}
ytd-watch-flexy ytd-video-meta-block[rich-meta] #metadata-line.ytd-video-meta-block,
ytd-watch-flexy #channel-name.ytd-video-meta-block {
font-family: "Roboto", "Arial", sans-serif;
font-size: 1.2rem;
line-height: 1.8rem;
font-weight: 400
}
ytd-watch-flexy #video-title.ytd-rich-grid-media {
margin: 0 0 4px 0;
display: block;
font-family: "Roboto", "Arial", sans-serif;
font-size: 1.4rem;
line-height: 2rem;
font-weight: 500;
overflow: hidden;
display: block;
max-height: 4rem;
-webkit-line-clamp: 2;
display: box;
display: -webkit-box;
-webkit-box-orient: vertical;
text-overflow: ellipsis;
white-space: normal
}
ytd-watch-flexy h3.ytd-rich-grid-media {
margin: 0
}
ytd-watch-flexy .title-badge.ytd-rich-grid-media, ytd-watch-flexy .video-badge.ytd-rich-grid-media {
margin-top: 0
}
ytd-watch-flexy ytd-rich-section-renderer.style-scope.ytd-rich-grid-renderer {
display: none
}
ytd-watch-flexy ytd-rich-grid-renderer[hide-chips-bar] ytd-feed-filter-chip-bar-renderer.ytd-rich-grid-renderer, ytd-watch-flexy ytd-rich-grid-renderer[hide-chips-bar-on-watch] ytd-feed-filter-chip-bar-renderer.ytd-rich-grid-renderer, ytd-watch-flexy ytd-rich-grid-renderer[hide-chips-bar-on-home] #header.ytd-rich-grid-renderer ytd-feed-filter-chip-bar-renderer.ytd-rich-grid-renderer {
display: flex;
height: 51px;
margin-bottom: 8px
}
ytd-watch-flexy #chips-wrapper.ytd-feed-filter-chip-bar-renderer {
position: relative;
top: 0
}
ytd-watch-flexy ytd-feed-filter-chip-bar-renderer[fluid-width] #chips-content.ytd-feed-filter-chip-bar-renderer {
padding: 0
}
ytd-watch-flexy yt-chip-cloud-chip-renderer.ytd-feed-filter-chip-bar-renderer, ytd-watch-flexy yt-chip-cloud-chip-renderer.ytd-feed-filter-chip-bar-renderer:first-of-type {
margin: 8px;
margin-left: 0
}
ytd-watch-flexy ytd-button-renderer.ytd-feed-filter-chip-bar-renderer {
margin: 0;
padding: 0 8px
}
ytd-watch-flexy[default-layout][reduced-top-margin] #primary.ytd-watch-flexy, ytd-watch-flexy[default-layout][reduced-top-margin] #secondary.ytd-watch-flexy {
padding-top: var(--ytd-margin-6x) !important
}
ytd-watch-metadata[title-headline-xs] h1.ytd-watch-metadata, ytd-watch-metadata[title-headline-m] h1.ytd-watch-metadata {
font-family: "YouTube Sans","Roboto",sans-serif !important;
font-weight: 600 !important;
font-size: 2rem !important;
line-height: 2.8rem !important
}
`;
if (typeof GM_addStyle !== "undefined") {
GM_addStyle(css);
} else {
let styleNode = document.createElement("style");
styleNode.appendChild(document.createTextNode(css));
(document.querySelector("head") || document.documentElement).appendChild(styleNode);
}
})();