☰

YouTube - Non-Rounded Design

This script disables YouTube's new rounded corners (reverts back to the previous layout before 2022 with extra stuff included.)

目前为 2023-02-14 提交的版本。查看 最新版本。

  1. // ==UserScript==
  2. // @name         YouTube - Non-Rounded Design
  3. // @version      3.3.0
  4. // @description  This script disables YouTube's new rounded corners (reverts back to the previous layout before 2022 with extra stuff included.)
  5. // @author       Magma_Craft
  6. // @license MIT
  7. // @match        https://www.youtube.com/*
  8. // @namespace    https://greasyfork.org/en/users/933798
  9. // @icon         https://www.youtube.com/favicon.ico
  10. // @run-at       document-start
  11. // @grant        none
  12. // ==/UserScript==
  13.  
  14. // Attributes to remove from <html>
  15. const ATTRS = [
  16.     "darker-dark-theme",
  17.     "darker-dark-theme-deprecate"
  18. ];
  19.  
  20. // Regular config keys.
  21. const CONFIGS = {
  22.     BUTTON_REWORK: false
  23. }
  24.  
  25. // Experiment flags.
  26. const EXPFLAGS = {
  27.     enable_header_channel_handler_ui: false,
  28.     kevlar_unavailable_video_error_ui_client: false,
  29.     kevlar_refresh_on_theme_change: false,
  30.     kevlar_watch_cinematics: false,
  31.     kevlar_watch_metadata_refresh: false,
  32.     kevlar_watch_modern_metapanel: false,
  33.     web_amsterdam_playlists: false,
  34.     web_animated_like: false,
  35.     web_button_rework: false,
  36.     web_button_rework_with_live: false,
  37.     web_darker_dark_theme: false,
  38.     web_filled_subscribed_button: false,
  39.     web_guide_ui_refresh: false,
  40.     web_modern_ads: false,
  41.     web_modern_buttons: false,
  42.     web_modern_chips: false,
  43.     web_modern_dialogs: false,
  44.     web_modern_playlists: false,
  45.     web_modern_subscribe: false,
  46.     web_rounded_containers: false,
  47.     web_rounded_thumbnails: false,
  48.     web_searchbar_style: "default",
  49.     web_segmented_like_dislike_button: false,
  50.     web_sheets_ui_refresh: false,
  51.     web_snackbar_ui_refresh: false
  52. }
  53.  
  54. // Player flags
  55. // !!! USE STRINGS FOR VALUES !!!
  56. // For example: "true" instead of true
  57. const PLYRFLAGS = {
  58.     web_rounded_containers: "false",
  59.     web_rounded_thumbnails: "false"
  60. }
  61.  
  62. class YTP {
  63.     static observer = new MutationObserver(this.onNewScript);
  64.  
  65.     static _config = {};
  66.  
  67.     static isObject(item) {
  68.         return (item && typeof item === "object" && !Array.isArray(item));
  69.     }
  70.  
  71.     static mergeDeep(target, ...sources) {
  72.         if (!sources.length) return target;
  73.         const source = sources.shift();
  74.  
  75.         if (this.isObject(target) && this.isObject(source)) {
  76.             for (const key in source) {
  77.                 if (this.isObject(source[key])) {
  78.                     if (!target[key]) Object.assign(target, { [key]: {} });
  79.                     this.mergeDeep(target[key], source[key]);
  80.                 } else {
  81.                     Object.assign(target, { [key]: source[key] });
  82.                 }
  83.             }
  84.         }
  85.  
  86.         return this.mergeDeep(target, ...sources);
  87.     }
  88.  
  89.  
  90.     static onNewScript(mutations) {
  91.         for (var mut of mutations) {
  92.             for (var node of mut.addedNodes) {
  93.                 YTP.bruteforce();
  94.             }
  95.         }
  96.     }
  97.  
  98.     static start() {
  99.         this.observer.observe(document, {childList: true, subtree: true});
  100.     }
  101.  
  102.     static stop() {
  103.         this.observer.disconnect();
  104.     }
  105.  
  106.     static bruteforce() {
  107.         if (!window.yt) return;
  108.         if (!window.yt.config_) return;
  109.  
  110.         this.mergeDeep(window.yt.config_, this._config);
  111.     }
  112.  
  113.     static setCfg(name, value) {
  114.         this._config[name] = value;
  115.     }
  116.  
  117.     static setCfgMulti(configs) {
  118.         this.mergeDeep(this._config, configs);
  119.     }
  120.  
  121.     static setExp(name, value) {
  122.         if (!("EXPERIMENT_FLAGS" in this._config)) this._config.EXPERIMENT_FLAGS = {};
  123.  
  124.         this._config.EXPERIMENT_FLAGS[name] = value;
  125.     }
  126.  
  127.     static setExpMulti(exps) {
  128.         if (!("EXPERIMENT_FLAGS" in this._config)) this._config.EXPERIMENT_FLAGS = {};
  129.  
  130.         this.mergeDeep(this._config.EXPERIMENT_FLAGS, exps);
  131.     }
  132.  
  133.     static decodePlyrFlags(flags) {
  134.         var obj = {},
  135.             dflags = flags.split("&");
  136.  
  137.         for (var i = 0; i < dflags.length; i++) {
  138.             var dflag = dflags[i].split("=");
  139.             obj[dflag[0]] = dflag[1];
  140.         }
  141.  
  142.         return obj;
  143.     }
  144.  
  145.     static encodePlyrFlags(flags) {
  146.         var keys = Object.keys(flags),
  147.             response = "";
  148.  
  149.         for (var i = 0; i < keys.length; i++) {
  150.             if (i > 0) {
  151.                 response += "&";
  152.             }
  153.             response += keys[i] + "=" + flags[keys[i]];
  154.         }
  155.  
  156.         return response;
  157.     }
  158.  
  159.     static setPlyrFlags(flags) {
  160.         if (!window.yt) return;
  161.         if (!window.yt.config_) return;
  162.         if (!window.yt.config_.WEB_PLAYER_CONTEXT_CONFIGS) return;
  163.         var conCfgs = window.yt.config_.WEB_PLAYER_CONTEXT_CONFIGS;
  164.         if (!("WEB_PLAYER_CONTEXT_CONFIGS" in this._config)) this._config.WEB_PLAYER_CONTEXT_CONFIGS = {};
  165.  
  166.         for (var cfg in conCfgs) {
  167.             var dflags = this.decodePlyrFlags(conCfgs[cfg].serializedExperimentFlags);
  168.             this.mergeDeep(dflags, flags);
  169.             this._config.WEB_PLAYER_CONTEXT_CONFIGS[cfg] = {
  170.                 serializedExperimentFlags: this.encodePlyrFlags(dflags)
  171.             }
  172.         }
  173.     }
  174. }
  175.  
  176. window.addEventListener("yt-page-data-updated", function tmp() {
  177.     YTP.stop();
  178.     for (i = 0; i < ATTRS.length; i++) {
  179.         document.getElementsByTagName("html")[0].removeAttribute(ATTRS[i]);
  180.     }
  181.     window.removeEventListener("yt-page-date-updated", tmp);
  182. });
  183.  
  184. YTP.start();
  185.  
  186. YTP.setCfgMulti(CONFIGS);
  187. YTP.setExpMulti(EXPFLAGS);
  188. YTP.setPlyrFlags(PLYRFLAGS);
  189.  
  190. function $(q) {
  191.     return document.querySelector(q);
  192. }
  193.  
  194. // Re-add 'Explore' tab in sidebar (it also replaces the 'Shorts' tab)
  195. function waitForElm(selector) {
  196.     return new Promise(resolve => {
  197.         if (document.querySelector(selector)) {
  198.             return resolve(document.querySelector(selector));
  199.         }
  200.  
  201.         const observer = new MutationObserver(mutations => {
  202.             if (document.querySelector(selector)) {
  203.                 resolve(document.querySelector(selector));
  204.                 observer.disconnect();
  205.             }
  206.         });
  207.  
  208.         observer.observe(document.body, {
  209.             childList: true,
  210.             subtree: true
  211.         });
  212.     });
  213. }
  214.  
  215.     function restoreTrending() {
  216.  
  217.         var trendingData = {
  218.             "navigationEndpoint": {
  219.                 "clickTrackingParams": "CBwQtSwYASITCNqYh-qO_fACFcoRrQYdP44D9Q==",
  220.                 "commandMetadata": {
  221.                     "webCommandMetadata": {
  222.                         "url": "/feed/explore",
  223.                         "webPageType": "WEB_PAGE_TYPE_BROWSE",
  224.                         "rootVe": 6827,
  225.                         "apiUrl": "/youtubei/v1/browse"
  226.                     }
  227.                 },
  228.                 "browseEndpoint": {
  229.                     "browseId": "FEtrending"
  230.                 }
  231.             },
  232.             "icon": {
  233.                 "iconType": "EXPLORE"
  234.             },
  235.             "trackingParams": "CBwQtSwYASITCNqYh-qO_fACFcoRrQYdP44D9Q==",
  236.             "formattedTitle": {
  237.                 "simpleText": "Explore"
  238.             },
  239.             "accessibility": {
  240.                 "accessibilityData": {
  241.                     "label": "Explore"
  242.                 }
  243.             },
  244.             "isPrimary": true
  245.         };
  246.  
  247.         var guidetemplate = `<ytd-guide-entry-renderer class="style-scope ytd-guide-section-renderer" is-primary="" line-end-style="none"><!--css-build:shady--><a id="endpoint" class="yt-simple-endpoint style-scope ytd-guide-entry-renderer" tabindex="-1" role="tablist"><tp-yt-paper-item role="tab" class="style-scope ytd-guide-entry-renderer" tabindex="0" aria-disabled="false"><!--css-build:shady--><yt-icon class="guide-icon style-scope ytd-guide-entry-renderer" disable-upgrade=""></yt-icon><yt-img-shadow height="24" width="24" class="style-scope ytd-guide-entry-renderer" disable-upgrade=""></yt-img-shadow><yt-formatted-string class="title style-scope ytd-guide-entry-renderer"><!--css-build:shady--></yt-formatted-string><span class="guide-entry-count style-scope ytd-guide-entry-renderer"></span><yt-icon class="guide-entry-badge style-scope ytd-guide-entry-renderer" disable-upgrade=""></yt-icon><div id="newness-dot" class="style-scope ytd-guide-entry-renderer"></div></tp-yt-paper-item></a><yt-interaction class="style-scope ytd-guide-entry-renderer"><!--css-build:shady--><div class="stroke style-scope yt-interaction"></div><div class="fill style-scope yt-interaction"></div></yt-interaction></ytd-guide-entry-renderer>`;
  248.         document.querySelector(`#items > ytd-guide-entry-renderer:nth-child(2)`).data = trendingData;
  249.  
  250.         var miniguidetemplate = `<ytd-mini-guide-entry-renderer class="style-scope ytd-mini-guide-section-renderer" is-primary="" line-end-style="none"><!--css-build:shady--><a id="endpoint" class="yt-simple-endpoint style-scope ytd-guide-entry-renderer" tabindex="-1" role="tablist"><tp-yt-paper-item role="tab" class="style-scope ytd-guide-entry-renderer" tabindex="0" aria-disabled="false"><!--css-build:shady--><yt-icon class="guide-icon style-scope ytd-guide-entry-renderer" disable-upgrade=""></yt-icon><yt-img-shadow height="24" width="24" class="style-scope ytd-guide-entry-renderer" disable-upgrade=""></yt-img-shadow><yt-formatted-string class="title style-scope ytd-guide-entry-renderer"><!--css-build:shady--></yt-formatted-string><span class="guide-entry-count style-scope ytd-guide-entry-renderer"></span><yt-icon class="guide-entry-badge style-scope ytd-guide-entry-renderer" disable-upgrade=""></yt-icon><div id="newness-dot" class="style-scope ytd-guide-entry-renderer"></div></tp-yt-paper-item></a><yt-interaction class="style-scope ytd-guide-entry-renderer"><!--css-build:shady--><div class="stroke style-scope yt-interaction"></div><div class="fill style-scope yt-interaction"></div></yt-interaction></ytd-guide-entry-renderer>`;
  251.         document.querySelector(`#items > ytd-mini-guide-entry-renderer:nth-child(2)`).data = trendingData;
  252.  
  253.     }
  254.  
  255.  
  256. waitForElm("#items.ytd-guide-section-renderer").then((elm) => {
  257.     restoreTrending();
  258. });
  259.  
  260. waitForElm("#items.ytd-mini-guide-section-renderer").then((elm) => {
  261.     restoreTrending();
  262. });
  263.  
  264. // Fix for like-dislike ratio
  265. function $(q) {
  266.     return document.querySelector(q);
  267. }
  268.  
  269. addEventListener('yt-page-data-updated', function() {
  270.     if(!location.pathname.startsWith('/watch')) return;
  271.     
  272.     var lds = $('ytd-video-primary-info-renderer div#top-level-buttons-computed');
  273.     var like = $('ytd-video-primary-info-renderer div#segmented-like-button > ytd-toggle-button-renderer');
  274.     var share = $('ytd-video-primary-info-renderer div#top-level-buttons-computed > ytd-segmented-like-dislike-button-renderer + ytd-button-renderer');
  275.     
  276.     lds.insertBefore(like, share);
  277.     
  278.     like.setAttribute('class', like.getAttribute('class').replace('ytd-segmented-like-dislike-button-renderer', 'ytd-menu-renderer force-icon-button'));
  279.     like.removeAttribute('is-paper-button-with-icon');
  280.     like.removeAttribute('is-paper-button');
  281.     like.setAttribute('style-action-button', '');
  282.     like.setAttribute('is-icon-button', '');
  283.     like.querySelector('a').insertBefore(like.querySelector('yt-formatted-string'), like.querySelector('tp-yt-paper-tooltip'));
  284.     try { like.querySelector('paper-ripple').remove(); } catch(e) {}
  285.     var paper = like.querySelector('tp-yt-paper-button');
  286.     paper.removeAttribute('style-target');
  287.     paper.removeAttribute('animated');
  288.     paper.removeAttribute('elevation');
  289.     like.querySelector('a').insertBefore(paper.querySelector('yt-icon'), like.querySelector('yt-formatted-string'));
  290.     paper.outerHTML = paper.outerHTML.replace('<tp-yt-paper-button ', '<yt-icon-button ').replace('</tp-yt-paper-button>', '</yt-icon-button>');
  291.     paper = like.querySelector('yt-icon-button');
  292.     paper.querySelector('button#button').appendChild(like.querySelector('yt-icon'));
  293.     
  294.     var dislike = $('ytd-video-primary-info-renderer div#segmented-dislike-button > ytd-toggle-button-renderer');
  295.     lds.insertBefore(dislike, share);
  296.     $('ytd-video-primary-info-renderer ytd-segmented-like-dislike-button-renderer').remove();
  297.     dislike.setAttribute('class', dislike.getAttribute('class').replace('ytd-segmented-like-dislike-button-renderer', 'ytd-menu-renderer force-icon-button'));
  298.     dislike.removeAttribute('has-no-text');
  299.     dislike.setAttribute('style-action-button', '');
  300.     var dlabel = document.createElement('yt-formatted-stringx');
  301.     dlabel.setAttribute('id', 'text');
  302.     if(dislike.getAttribute('class').includes('style-default-active'))
  303.         dlabel.setAttribute('class', dlabel.getAttribute('class').replace('style-default', 'style-default-active'));
  304.     dislike.querySelector('a').insertBefore(dlabel, dislike.querySelector('tp-yt-paper-tooltip'));
  305.     
  306.     $('ytd-video-primary-info-renderer').removeAttribute('flex-menu-enabled');
  307. });
  308.  
  309. // Restore old comment replies UI
  310. var observingComments = false;
  311. var hl;
  312.  
  313. const cfconfig = {
  314.     unicodeEmojis: false
  315. };
  316.  
  317. const cfi18n = {
  318.     en: {
  319.         viewSingular: "View reply",
  320.         viewMulti: "View %s replies",
  321.         viewSingularOwner: "View reply from %s",
  322.         viewMultiOwner: "View %s replies from %s and others",
  323.         hideSingular: "Hide reply",
  324.         hideMulti: "Hide replies",
  325.         replyCountIsolator: /( REPLIES)|( REPLY)/
  326.     }
  327. }
  328.  
  329. /**
  330.  * Get a string from the localization strings.
  331.  *
  332.  * @param {string}   string  Name of string to get
  333.  * @param {string}   hl      Language to use.
  334.  * @param {...array} args    Strings.
  335.  * @returns {string}
  336.  */
  337.  function getString(string, hl = "en", ...args) {
  338.     if (!string) return;
  339.     var str;
  340.     if (cfi18n[hl]) {
  341.         if (cfi18n[hl][string]) {
  342.             str = cfi18n[hl][string];
  343.         } else if (cfi18n.en[string]) {
  344.             str = cfi18n.en[string];
  345.         } else {
  346.             return;
  347.         }
  348.     } else {
  349.         if (cfi18n.en[string]) str = cfi18n.en[string];
  350.     }
  351.  
  352.     for (var i = 0; i < args.length; i++) {
  353.         str = str.replace(/%s/, args[i]);
  354.     }
  355.  
  356.     return str;
  357. }
  358.  
  359. /**
  360.  * Wait for a selector to exist
  361.  *
  362.  * @param {string}       selector  CSS Selector
  363.  * @param {HTMLElement}  base      Element to search inside
  364.  * @returns {Node}
  365.  */
  366. async function waitForElm(selector, base = document) {
  367.     if (!selector) return null;
  368.     if (!base.querySelector) return null;
  369.     while (base.querySelector(selector) == null) {
  370.         await new Promise(r => requestAnimationFrame(r));
  371.     };
  372.     return base.querySelector(selector);
  373. };
  374.  
  375. /**
  376.  * Is a value in an array?
  377.  *
  378.  * @param {*}     needle    Value to search
  379.  * @param {Array} haystack  Array to search
  380.  * @returns {boolean}
  381.  */
  382.  function inArray(needle, haystack) {
  383.     for (var i = 0; i < haystack.length; i++) {
  384.         if (needle == haystack[i]) return true;
  385.     }
  386.     return false;
  387. }
  388.  
  389. /**
  390.  * Get text of an InnerTube string.
  391.  *
  392.  * @param {object} object  String container.
  393.  */
  394. function getSimpleString(object) {
  395.     if (object.simpleText) return object.simpleText;
  396.  
  397.     var str = "";
  398.     for (var i = 0; i < object.runs.length; i++) {
  399.         str += object.runs[i].text;
  400.     }
  401.     return str;
  402. }
  403.  
  404. /**
  405.  * Format a commentRenderer.
  406.  *
  407.  * @param {object} comment  commentRenderer from InnerTube.
  408.  */
  409. function formatComment(comment) {
  410.     if (cfconfig.unicodeEmojis) {
  411.         var runs;
  412.         try {
  413.             runs = comment.contentText.runs
  414.             for (var i = 0; i < runs.length; i++) {
  415.                 delete runs[i].emoji;
  416.                 delete runs[i].loggingDirectives;
  417.             }
  418.         } catch(err) {}
  419.     }
  420.  
  421.     return comment;
  422. }
  423.  
  424. /**
  425.  * Format a commentThreadRenderer.
  426.  *
  427.  * @param {object} thread  commentThreadRenderer from InnerTube.
  428.  */
  429. async function formatCommentThread(thread) {
  430.     if (thread.comment.commentRenderer) {
  431.         thread.comment.commentRenderer = formatComment(thread.comment.commentRenderer);
  432.     }
  433.  
  434.     var replies;
  435.     try {
  436.         replies = thread.replies.commentRepliesRenderer;
  437.         if (replies.viewRepliesIcon) {
  438.             replies.viewReplies.buttonRenderer.icon = replies.viewRepliesIcon.buttonRenderer.icon;
  439.             delete replies.viewRepliesIcon;
  440.         }
  441.  
  442.         if (replies.hideRepliesIcon) {
  443.             replies.hideReplies.buttonRenderer.icon = replies.hideRepliesIcon.buttonRenderer.icon;
  444.             delete replies.hideRepliesIcon;
  445.         }
  446.  
  447.         var creatorName;
  448.         try {
  449.             creatorName = replies.viewRepliesCreatorThumbnail.accessibility.accessibilityData.label;
  450.             delete replies.viewRepliesCreatorThumbnail;
  451.         } catch(err) {}
  452.  
  453.         var replyCount = getSimpleString(replies.viewReplies.buttonRenderer.text);
  454.         replyCount = +replyCount.replace(getString("replyCountIsolator", hl), "");
  455.  
  456.         var viewMultiString = creatorName ? "viewMultiOwner" : "viewMulti";
  457.         var viewSingleString = creatorName ? "viewSingularOwner" : "viewSingular";
  458.  
  459.         replies.viewReplies.buttonRenderer.text = {
  460.             runs: [
  461.                 {
  462.                     text: (replyCount > 1) ? getString(viewMultiString, hl, replyCount, creatorName) : getString(viewSingleString, hl, creatorName)
  463.                 }
  464.             ]
  465.         }
  466.  
  467.         replies.hideReplies.buttonRenderer.text = {
  468.             runs: [
  469.                 {
  470.                     text: (replyCount > 1) ? getString("hideMulti", hl) :  getString("hideSingular", hl)
  471.                 }
  472.             ]
  473.         };
  474.     } catch(err) {}
  475.  
  476.     return thread;
  477. }
  478.  
  479. /**
  480.  * Force Polymer to refresh data of an element.
  481.  *
  482.  * @param {Node} element  Element to refresh data of.
  483.  */
  484. function refreshData(element) {
  485.     var clone = element.cloneNode();
  486.     clone.data = element.data;
  487.     // Let the script know we left our mark
  488.     // in a way that doesn't rely on classes
  489.     // because Polymer likes to cast comments
  490.     // into the void for later reuse
  491.     clone.data.fixedByCF = true;
  492.     for (var i in element.properties) {
  493.         clone[i] = element[i];
  494.     }
  495.     element.insertAdjacentElement("afterend", clone);
  496.     element.remove();
  497. }
  498.  
  499. var commentObserver = new MutationObserver((list) => {
  500.     list.forEach(async (mutation) => {
  501.         if (mutation.addedNodes) {
  502.             for (var i = 0; i < mutation.addedNodes.length; i++) {
  503.                 var elm = mutation.addedNodes[i];
  504.                 if (elm.classList && elm.data && !elm.data.fixedByCF) {
  505.                     if (elm.tagName == "YTD-COMMENT-THREAD-RENDERER") {
  506.                         elm.data = await formatCommentThread(elm.data);
  507.                         refreshData(elm);
  508.                     } else if (elm.tagName == "YTD-COMMENT-RENDERER") {
  509.                         if (!elm.classList.contains("ytd-comment-thread-renderer")) {
  510.                             elm.data = formatComment(elm.data);
  511.                             refreshData(elm);
  512.                         }
  513.                     }
  514.                 }
  515.             }
  516.         }
  517.     });
  518. });
  519.  
  520. document.addEventListener("yt-page-data-updated", async (e) => {
  521.     hl = yt.config_.HL;
  522.     commentObserver.observe(document.querySelector("ytd-app"),  { childList: true, subtree: true });
  523. });
  524.  
  525. // CSS adjustments and UI fixes
  526. (function() {
  527. ApplyCSS();
  528. function ApplyCSS() {
  529. var styles = document.createElement("style");
  530. styles.innerHTML=`
  531.     /* Disable rounded corners including inform news such as covid19 */
  532.     #cinematics.ytd-watch-flexy {
  533.     display: none !important;
  534.     }
  535.  
  536.     div#clarify-box.attached-message.style-scope.ytd-watch-flexy {
  537.     margin-top: 0px !important;
  538.     }
  539.  
  540.     ytd-clarification-renderer.style-scope.ytd-item-section-renderer {
  541.     border: 1px solid !important;
  542.     border-color: #0000001a !important;
  543.     border-radius: 0px !important;
  544.     }
  545.  
  546.     ytd-clarification-renderer.style-scope.ytd-watch-flexy {
  547.     border: 1px solid !important;
  548.     border-color: #0000001a !important;
  549.     border-radius: 0px !important;
  550.     }
  551.  
  552.     yt-formatted-string.description.style-scope.ytd-clarification-renderer {
  553.     font-size: 1.4rem !important;
  554.     }
  555.  
  556.     div.content-title.style-scope.ytd-clarification-renderer {
  557.     padding-bottom: 4px !important;
  558.     }
  559.  
  560.     ytd-playlist-panel-renderer[modern-panels]:not([within-miniplayer]) #container.ytd-playlist-panel-renderer {
  561.     border-radius: 0px !important;
  562.     }
  563.  
  564.     ytd-playlist-panel-renderer[modern-panels]:not([hide-header-text]) .title.ytd-playlist-panel-renderer {
  565.     font-family: Roboto !important;
  566.     font-size: 1.4rem !important;
  567.     line-height: 2rem !important;
  568.     font-weight: 500 !important;
  569.     }
  570.  
  571.     ytd-tvfilm-offer-module-renderer[modern-panels] {
  572.     border-radius: 0px !important;
  573.     }
  574.  
  575.     ytd-tvfilm-offer-module-renderer[modern-panels] #header.ytd-tvfilm-offer-module-renderer {
  576.     border-radius: 0px !important;
  577.     font-family: Roboto !important;
  578.     font-size: 1.6rem !important;
  579.     line-height: 2.2rem !important;
  580.     font-weight: 400 !important;
  581.     }
  582.  
  583.     ytd-donation-shelf-renderer.style-scope.ytd-watch-flexy {
  584.     border-radius: 0px !important;
  585.     }
  586.  
  587.     ytd-donation-shelf-renderer[modern-panels] #header-text.ytd-donation-shelf-renderer {
  588.     font-family: Roboto !important;
  589.     font-size: 1.6rem !important;
  590.     font-weight: 500 !important;
  591.     }
  592.  
  593.     /* Disable rounded corners under the player */
  594.     .ytp-ad-player-overlay-flyout-cta-rounded {
  595.     border-radius: 2px !important;
  596.     }
  597.  
  598.     .ytp-flyout-cta .ytp-flyout-cta-action-button.ytp-flyout-cta-action-button-rounded {
  599.     border-radius: 2px !important;
  600.     text-transform: uppercase !important;
  601.     }
  602.  
  603.     .ytp-ad-action-interstitial-action-button.ytp-ad-action-interstitial-action-button-rounded {
  604.     border-radius: 2px !important;
  605.     text-transform: uppercase !important;
  606.     }
  607.  
  608.     .ytp-settings-menu.ytp-rounded-menu, .ytp-screen-mode-menu.ytp-rounded-menu {
  609.     border-radius: 2px !important;
  610.     }
  611.  
  612.     .ytp-videowall-still-round-medium .ytp-videowall-still-image {
  613.     border-radius: 2px !important;
  614.     }
  615.  
  616.     .ytp-sb-subscribe.ytp-sb-rounded, .ytp-sb-unsubscribe.ytp-sb-rounded {
  617.     border-radius: 2px !important;
  618.     }
  619.  
  620.     .branding-context-container-inner.ytp-rounded-branding-context {
  621.     border-radius: 2px !important;
  622.     }
  623.  
  624.     .ytp-autonav-endscreen-upnext-button.ytp-autonav-endscreen-upnext-button-rounded {
  625.     border-radius: 2px !important;
  626.     }
  627.  
  628.     .ytp-autonav-cancelled-mini-mode .ytp-autonav-endscreen-upnext-thumbnail.rounded-thumbnail, .countdown-running .ytp-autonav-endscreen-small-mode .ytp-autonav-endscreen-upnext-thumbnail.rounded-thumbnail {
  629.     border-radius: 2px !important;
  630.     }
  631.  
  632.     .ytp-autonav-endscreen-upnext-thumbnail.rounded-thumbnail {
  633.     border-radius: 2px !important;
  634.     }
  635.  
  636.     .ytp-ad-overlay-container.ytp-rounded-overlay-ad .ytp-ad-overlay-image img, .ytp-ad-overlay-container.ytp-rounded-overlay-ad .ytp-ad-text-overlay, .ytp-ad-overlay-container.ytp-rounded-overlay-ad .ytp-ad-enhanced-overlay {
  637.     border-radius: 0px !important;
  638.     }
  639.  
  640.     .ytp-tooltip.ytp-rounded-tooltip.ytp-text-detail.ytp-preview .ytp-tooltip-bg {
  641.     border-top-left-radius: 0px !important;
  642.     border-bottom-left-radius: 0px !important;
  643.     }
  644.  
  645.     .ytp-tooltip.ytp-rounded-tooltip.ytp-text-detail.ytp-preview {
  646.     border-radius: 0px !important;
  647.     }
  648.  
  649.     /* Subscribe button fix + including notification bell fixes */
  650.     tp-yt-paper-button.style-scope.ytd-subscribe-button-renderer {
  651.     display: flex !important;
  652.     }
  653.  
  654.     .yt-spec-button-shape-next--size-m {
  655.     background-color: transparent !important;
  656.     padding-left: 14px !important;
  657.     padding-right: 2px !important;
  658.     }
  659.  
  660.     .yt-spec-button-shape-next--mono.yt-spec-button-shape-next--tonal {
  661.     background-color: transparent !important;
  662.     }
  663.  
  664.     div.cbox.yt-spec-button-shape-next--button-text-content {
  665.     display: none !important;
  666.     }
  667.  
  668.     div.yt-spec-button-shape-next__secondary-icon {
  669.     display: none !important;
  670.     }
  671.  
  672.     /* Remove Shorts, Trending and Podcasts in the sidebar + fix for 3rd-party YouTube scripts */
  673.     #endpoint.yt-simple-endpoint.ytd-guide-entry-renderer.style-scope[title="Shorts"] {
  674.     display: none !important;
  675.     }
  676.  
  677.     #endpoint.yt-simple-endpoint.ytd-mini-guide-entry-renderer.style-scope[title="Shorts"] {
  678.     display: none !important;
  679.     }
  680.  
  681.     #endpoint.yt-simple-endpoint.ytd-guide-entry-renderer.style-scope[title="Trending"] {
  682.     display: none !important;
  683.     }
  684.  
  685.     #endpoint.yt-simple-endpoint.ytd-guide-entry-renderer.style-scope[title="Podcasts"] {
  686.     display: none !important;
  687.     }
  688.  
  689.     .box {
  690.     margin-top: -18px !important;
  691.     left: 0px !important;
  692.     }`
  693. document.head.appendChild(styles);
  694. }
  695. })();