Minimalize for YouTube SuperAssistant

Transparent description and improve theater mode for: https://greasyfork.org/ja/scripts/521538-youtubeᴾˡᵘˢ-super-assistant-video-downloader-no-ads-new-layout-for-yt

目前为 2025-03-19 提交的版本,查看 最新版本

  1. /* ==UserStyle==
  2. @name Minimalize for YouTube SuperAssistant
  3. @description Transparent description and improve theater mode for: https://greasyfork.org/ja/scripts/521538-youtubeᴾˡᵘˢ-super-assistant-video-downloader-no-ads-new-layout-for-yt
  4. @match *://www.youtube.com/**
  5. @license MIT
  6. @version 0.1
  7. @namespace djshigel
  8. ==/UserStyle== */
  9.  
  10. @media screen and (min-height: 580px) {
  11. html {
  12. overflow: hidden;
  13. }
  14. }
  15.  
  16. #masthead[page-dark-theme] {
  17. background: linear-gradient(#202020, transparent);
  18. }
  19.  
  20. #masthead[page-dark-theme][theater] {
  21. background: linear-gradient(#202020, #000000);
  22. }
  23.  
  24. @media screen and (min-height: 1270px) and (orientation: landscape),
  25. @media screen and (min-height: 1980px) and (orientation: portrait) {
  26. #masthead[page-dark-theme] {
  27. background: linear-gradient(#000, transparent);
  28. }
  29.  
  30. #masthead[page-dark-theme][theater] {
  31. background: #000;
  32. }
  33. }
  34.  
  35. #content:has(#movie_player.ytp-autohide) #masthead[theater] #container {
  36. opacity: 0;
  37. transition: opacity .3s;
  38. }
  39.  
  40. #content:has(#movie_player.ytp-autohide) #masthead[theater]:hover #container {
  41. opacity: 1;
  42. }
  43.  
  44. ytd-watch-flexy[theater] #columns {
  45. background: #000;
  46. }
  47.  
  48. ytd-watch-flexy[theater]:has(#movie_player.ytp-autohide) #columns #primary,
  49. ytd-watch-flexy[theater]:has(#movie_player.ytp-autohide) #columns #secondary {
  50. opacity: 0;
  51. transition: opacity .3s;
  52. }
  53.  
  54. ytd-watch-flexy[theater]:has(#movie_player.ytp-autohide) #columns:hover #primary,
  55. ytd-watch-flexy[theater]:has(#movie_player.ytp-autohide) #columns:hover #secondary {
  56. opacity: 1;
  57. }
  58.  
  59. #movie_player.ytp-autohide .branding-img {
  60. display: none !important;
  61. }
  62.  
  63. #description {
  64. background-color: transparent !important;
  65. opacity: .7;
  66. }
  67.  
  68. #description-inner{
  69. margin-left: 0 !important;
  70. }
  71.  
  72. #inline-expander, #inline-expander:hover {
  73. background: transparent;
  74. }
  75.  
  76. #secondary {
  77. opacity: .5;
  78. transition: opacity cubic-bezier(.98, -.01, .69, .11) .5s;
  79. height: 1000px;
  80. }
  81.  
  82. #secondary:hover {
  83. opacity: 1;
  84. }
  85.  
  86. #material-tabs > a {
  87. background-color: var(--yt-active-playlist-panel-background-color) !important;
  88. }
  89.  
  90. .ytp-button[aria-label="Hide chats"], .ytp-button[aria-label="Show chats"] {
  91. margin-top: 5px;
  92. margin-right: 10px;
  93. }