For a Wide Screen and the YouTube New Design
目前为
/* ==UserStyle==
@name Youtube WideScreen (New Design Polymer)
@namespace youtube.com
@version 2.0.0
@author decembre
@description For a Wide Screen and the YouTube New Design
@license unlicense
==/UserStyle== */
@-moz-document domain("youtube.com") {
/* ==== 0- YouTube WideScreen (New Design Polymer) v.2 === */
/* GM in USE:
Youtube UI Fix (2020):
https://greasyfork.org/fr/scripts/11485-youtube-ui-fix
==== */
/* (new2) SUPP ADDS */
.annotation-type-custom > div ,
/* ytd-popup-container , */
/* yt-upsell-dialog-renderer[dialog][dialog][dialog] , */
/* #content + ytd-popup-container.style-scope.ytd-app , */
/* #content + ytd-popup-container.style-scope.ytd-app paper-dialog[prevent-autonav="true"] , */
.ytp-cards-teaser ,
#offer-module {
display: none !important;
}
/* DISMISS CONNECTION */
/* yt-upsell-dialog-renderer[dialog][dialog][dialog] , */
/* #content + ytd-popup-container.style-scope.ytd-app */
/* #content + ytd-popup-container.style-scope.ytd-app paper-dialog[prevent-autonav="true"] , */
#content + ytd-popup-container.style-scope.ytd-app paper-dialog[prevent-autonav="true"] .style-scope.yt-upsell-dialog-renderer.no-transition ,
#content + ytd-popup-container.style-scope.ytd-app paper-dialog[prevent-autonav="true"] #upsell-dialog-text ,
#content + ytd-popup-container.style-scope.ytd-app paper-dialog[prevent-autonav="true"] #icon-container {
display: none;
}
#content + ytd-popup-container.style-scope.ytd-app paper-dialog[prevent-autonav="true"] {
left: 7%;
max-height: 845px;
max-width: 1840px;
outline: medium none;
position: fixed;
top: -48px;
transform: scale(0.5);
z-index: 2202;
background: green;
}
#content + ytd-popup-container.style-scope.ytd-app paper-dialog[prevent-autonav="true"] yt-upsell-dialog-renderer[dialog][dialog][dialog]{
margin: 0;
padding: 0;
background: transparent;
}
#content + ytd-popup-container.style-scope.ytd-app paper-dialog[prevent-autonav="true"] #content.yt-upsell-dialog-renderer {
flex-direction: row !important;
height: 20px;
padding: 4px 4px 0;
margin-bottom: -47px;
}
/* FIXED POSITION - ALL */
html{
overflow: auto !important;
}
ytd-app[is-watch-page=""] ,
ytd-app[is-watch-page=""] app-drawer {
height: 1049px !important;
overflow: hidden !important;
}
/* LEFT COLUMN - === */
#items.ytd-watch-next-secondary-results-renderer {
position: fixed;
display: inline-block;
width: 39.5% ;
height: 69vh ;
top: 85px ;
left: 60% !important;
padding-top: 195px;
overflow: hidden;
overflow-y: auto;
border-bottom: 1px solid blue;
border-right: 5px solid red;
border-left: 5px solid red;
background-color: #333 ;
}
/* NO DARK */
html:not([dark]):not(.style-scope) #items.ytd-watch-next-secondary-results-renderer {
background-color: white !important;
}
/* TO RIGHT PANEL */
#related #items ytd-compact-autoplay-renderer ,
ytd-compact-autoplay-renderer.style-scope {
position: fixed;
clear: none ;
width: 39%;
height: 175px;
top: 85px !important;
margin-bottom: 0 ;
padding: 5px !important;
overflow: hidden !important;
overflow-y: auto !important;
z-index: 5000000 ;
background-color: #333;
border-bottom: 5px solid gray ;
}
/* NO DARK */
html:not([dark]):not(.style-scope) #related #items ytd-compact-autoplay-renderer ,
html:not([dark]):not(.style-scope) ytd-compact-autoplay-renderer.style-scope {
background-color: white;
border-bottom: 5px solid gray ;
}
ytd-compact-autoplay-renderer.style-scope:hover {
position: fixed;
clear: none ;
width: 39%;
height: auto !important;
max-height: 700px !important;
border-bottom: 5px solid red ;
background-color: black ;
}
/* POSITION LIST UNDER */
#head + #contents ytd-compact-video-renderer {
display: inline-block !important;
float: left;
clear: none ;
width: 100% !important;
max-width: 363px !important;
min-width: 363px !important;
height: 108px !important;
margin-right: 5px ;
background-color: black !important;
/* border: 1px solid red; */
}
/* QUEUE */
#contents + #suggestions-search {
position: absolute;
top: 22px ;
left: 20px !important;
}
/* (new2) NO QUEUE */
#related #suggestions-search.playlist-or-live {
position: fixed ;
top: 52px ;
right: 0% ;
width: 23% ;
padding: 1px 2px ;
z-index: 500 ;
border: 1px solid #333 !important;
}
#head.ytd-compact-autoplay-renderer {
margin-bottom: 35px ;
}
#head + #contents ytd-compact-video-renderer {
display: inline-block !important;
float: left;
clear: none ;
width: 100% !important;
max-width: 358px !important;
min-width: 358px !important;
height: 108px !important;
margin-right: 5px ;
background-color: black !important;
border: 1px solid yellow;
}
/* NO DARK */
html:not([dark]):not(.style-scope) #head + #contents ytd-compact-video-renderer {
background-color: white !important;
border: 1px solid yellow;
}
#items .ytd-watch-next-secondary-results-renderer:not(ytd-compact-autoplay-renderer) ,
.style-scope.ytd-watch-next-secondary-results-renderer.suggestion-tag {
display: inline-block !important;
float: left;
clear: none ;
width: 100% !important;
max-width: 48.3% !important;
min-width: 48.3% !important;
height: 108px !important;
margin-right: 5px ;
margin-left: 5px ;
background-color: black !important;
}
/* NO DARK */
html:not([dark]):not(.style-scope) #items .ytd-watch-next-secondary-results-renderer:not(ytd-compact-autoplay-renderer) ,
html:not([dark]):not(.style-scope) .style-scope.ytd-watch-next-secondary-results-renderer.suggestion-tag {
background-color: white !important;
}
/* COMMENTS - FIXED - MOVE RIGHT */
ytd-comments {
position: fixed;
display: inline-block;
min-width: 38.8% !important;
max-width: 38.8% !important;
height: 840px;
left: 60% !important;
top: 85px ;
padding: 0 10px ;
overflow: hidden;
z-index: 50000;
visibility: hidden ;
background: black ;
}
/* NO DARK */
html:not([dark]):not(.style-scope) ytd-comments {
background-color: white !important;
}
ytd-comments:hover {
visibility: visible ;
}
/* NO DARK */
html:not([dark]):not(.style-scope) ytd-comments:hover {
background-color: white !important;
}
ytd-comments ytd-item-section-renderer {
margin-top: -21px ;
}
ytd-comments ytd-item-section-renderer ytd-comments-header-renderer {
margin-bottom: 5px ;
margin-top: 25px ;
}
#title.ytd-comments-header-renderer {
margin-bottom: 5px;
}
/* (new2) */
ytd-comments #contents {
display: inline-block;
height: 745px;
width: 100% ;
top: -35px ;
padding: 5px 10px ;
overflow: hidden;
overflow-y: auto;
background: #333 ;
}
/* NO DARK */
html:not([dark]):not(.style-scope) ytd-comments #contents {
background-color: white !important;
}
ytd-comments:before {
content: "Comments" ;
position: fixed;
display: inline-block;
width: 100px ;
height: 24px;
line-height: 24px;
margin-top: -27px ;
margin-left: 125px ;
padding: 1px 5px ;
border-radius: 3px 3px 0 0 ;
text-align: center !important;
z-index: 5000000 !important;
visibility: visible ;
color: gray !important;
border-top: 1px solid #333 ;
border-bottom: 1px solid #333 ;
border-right: 5px solid #333 ;
border-left: 5px solid #333 ;
background-color: #222 ;
}
/* NO DARK */
html:not([dark]):not(.style-scope) ytd-comments:before {
background-color: white !important;
}
ytd-comments:hover:before {
font-size: 20px !important;
text-align: center !important;
color: gold !important;
border-bottom: 1px solid green;
border-top: 5px solid #333 ;
border-left: 5px solid #333 ;
border-right: 5px solid #333 ;
background-color: black ;
}
/* NO DARK */
html:not([dark]):not(.style-scope) ytd-comments:hover:before {
background-color: white !important;
}
ytd-comments #contents ytd-comment-thread-renderer {
display: block;
margin-bottom: 5px !important;
padding: 5px ;
border-radius: 5px ;
background-color: #222 ;
}
/* NO DARK */
html:not([dark]):not(.style-scope) ytd-comments #contents ytd-comment-thread-renderer {
background-color: white !important;
}
/* PLAYER - CONTAINER */
#columns.style-scope.ytd-watch-flexy {
min-width: 100% !important;
max-width: 100% !important;
height: 874px !important;
margin-left: 0 !important;
}
/* (new2) FULL SCREEN */
ytd-app[is-watch-page=""] app-drawer.ytd-app#guide ~ #page-manager.ytd-app[class="style-scope ytd-app"] {
position: fixed ;
display: flex;
width: 59.5% ;
height: 100% ;
height: 874px !important;
--ytd-toolbar-offset: var(--ytd-masthead-height, var(--ytd-toolbar-height));
margin-top: var(--ytd-masthead-height, var(--ytd-toolbar-height));
overflow-x: hidden;
overflow-y: hidden;
}
/* (new2) FULL SCREEN */
.no-scroll>ytd-app[style*="--ytd-app-fullerscreen-scrollbar-width:12px;"] #page-manager.ytd-app {
position: fixed ;
display: flex;
min-width: 100% !important;
min-height: 100% !important;
z-index: 500000000 !important;
}
.no-scroll>ytd-app[style*="--ytd-app-fullerscreen-scrollbar-width:12px;"] .video-stream.html5-main-video {
width: 100% !important;
left: 0;
}
.no-scroll>ytd-app[style*="--ytd-app-fullerscreen-scrollbar-width:12px;"] .html5-endscreen {
height: 100vh !important;
border: 1px solid yellow;
}
.no-scroll>ytd-app[style*="--ytd-app-fullerscreen-scrollbar-width:12px;"] .ytp-endscreen-content{
height: 80vh !important;
max-width: 100%;
min-width: 100%;
width: 100%;
margin-left: -49.8% !important;
margin-top: -15% !important;
}
.no-scroll>ytd-app[style*="--ytd-app-fullerscreen-scrollbar-width:12px;"] #columns.style-scope.ytd-watch-flexy {
display: none !important;
}
/* (new2) END SCREEN */
/* .ytp-autohide .ytp-player-content:not(.html5-endscreen),
.ytp-autohide .ytp-player-content:not(.ytp-upnext),
.ytp-hide-info-bar .ytp-player-content {
top: 0;
transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1) 0s, top 0.1s cubic-bezier(0.4, 0, 1, 1) 0s;
background: red !important;
} */
.html5-endscreen {
height: 75vh !important;
top: 25px !important;
padding-top: 20px !important;
overflow: hidden;
z-index: 34;
background: #333 !important;
}
.html5-endscreen:hover {
z-index: 50 !important;
}
.ytp-endscreen-content {
position: absolute;
height: 70vh !important;
left: 50%;
top: 33.5%;
}
.ytp-endscreen-content {
width: 100% !important;
min-width: 100% !important;
max-width: 100% !important;
margin-left: -54% !important;
margin-top: -24% !important;
transform: scale(0.9) !important;
}
.ytp-show-tiles .ytp-videowall-still {
border: 1px solid #333 !important;
}
.ytp-show-tiles .ytp-videowall-still:hover {
border: 1px solid red !important;
}
.ytp-videowall-still-image {
width: 100% !important;
background-size: contain !important;
}
/* (new2) END SCREEN SUGGESTION */
.ytp-ce-element.ytp-ce-element-show ,
.html5-endscreen + .ytp-ce-shadow + .ytp-ce-element.ytp-ce-element-show {
height: 320px;
width: 569px;
left: 35% !important;
top: 93px;
border: 1px solid red !important;
}
/* PLAYER */
#primary.style-scope.ytd-watch-flexy {
min-width: 97% !important;
max-width: 97% !important;
margin-left: 30% !important;
padding: 0;
/* border: 1px solid tan !important; */
}
#player-container-inner {
padding-top: 72vh !important;
}
.ytp-cards-teaser-shown .ytp-cards-teaser .ytp-cards-teaser-text {
max-width: 415px;
opacity: 1;
transition: opacity 0.165s cubic-bezier(0, 0, 0.2, 1) 0.415s;
}
.video-stream.html5-main-video {
width: 99% !important;
}
/* (new2) */
.ytp-iv-video-content {
width: 99% !important;
}
/* (new2) VIDEO PLAYER center MOVIE for
https://www.youtube.com/watch?v=_DsyLuxfu64
=== */
.video-stream.html5-main-video {
left: 0 !important;
}
/* (new2) CONTROL */
#player .ytp-chrome-bottom {
width: 100% !important;
height: 3px !important;
left: 0px !important;
opacity: 1 !important;
/* transform: scale(0.7) !important; */
}
#player:hover .ytp-chrome-bottom {
width: 100% !important;
height: 35px !important;
left: 5px !important;
opacity: 1 !important;
}
/* (new2) PB WITH CHAPTER :
https://www.youtube.com/watch?v=RIgBsz1MduI
=== */
/* .ytp-chapters-container,
.ytp-chapter-hover-container {
width: 100% !important;
} */
.ytp-big-mode .ytp-chapter-title.ytp-button.ytp-chapter-container-disabled,
.ytp-chapter-title.ytp-button.ytp-chapter-container-disabled {
opacity: 0.9;
display: none !important;
background: blue;
}
#player .ytp-progress-bar-container:not([aria-disabled="true"]) {
height: 5px;
margin-top: 0;
top: 0px;
opacity: 1 !important;
}
/* (new2) PLAYER TRANSLATION */
.caption-window.ytp-caption-window-bottom {
width: 95%!important;
left: 0 !important;
margin-bottom: -6px;
/* padding-left: 20%; */
background: rgba(0, 0, 0, 0.44);
}
.caption-window.ytp-caption-window-bottom .captions-text{
width: 100%!important;
left: 0 !important;
margin-bottom: -6px;
padding-left: 23%;
background: transparent !important;
}
.html5-video-player .caption-visual-line .ytp-caption-segment{
background: transparent !important;
}
/* PLAYER INFOS */
#meta-contents #container.ytd-video-secondary-info-renderer {
position: fixed;
display: inline-block;
width: 39% ;
min-height: 190px;
top: 85px ;
left: 60% !important;
padding: 0 10px ;
overflow: hidden;
border-radius: 0 0 5px 5px !important;
z-index: 5000000 !important;
visibility: hidden ;
border-bottom: 1px solid red;
border-right: 5px solid red;
border-left: 5px solid red;
background-color: #333 ;
}
/* NO DARK */
html:not([dark]):not(.style-scope) #meta-contents #container.ytd-video-secondary-info-renderer {
background-color: white !important;
}
#meta-contents #container.ytd-video-secondary-info-renderer:hover {
visibility: visible ;
}
#top-row.ytd-video-secondary-info-renderer {
display: flex;
flex-direction: row;
margin-bottom: 5px;
padding-top: 5px;
}
#meta-contents #container.ytd-video-secondary-info-renderer:before {
content: "Infos" ;
position: fixed;
display: inline-block;
width: 100px ;
height: 24px;
line-height: 24px;
margin-top: -27px ;
margin-left: -5px ;
padding: 1px 5px ;
border-radius: 3px 3px 0 0 ;
text-align: center !important;
z-index: 5000000 !important;
visibility: visible ;
border-top: 1px solid #333 ;
border-bottom: 1px solid #333 ;
border-right: 5px solid #333 ;
border-left: 5px solid #333 ;
color: gray !important;
background-color: #222 ;
}
/* NO DARK */
html:not([dark]):not(.style-scope) #meta-contents #container.ytd-video-secondary-info-renderer:before {
background-color: white !important;
}
#meta-contents #container.ytd-video-secondary-info-renderer:hover:before {
font-size: 20px !important;
text-align: center !important;
color: gold !important;
border-bottom: 1px solid green;
border-top: 5px solid #333 ;
border-left: 5px solid #333 ;
border-right: 5px solid #333 ;
background-color: black ;
}
/* NO DARK */
html:not([dark]):not(.style-scope) #meta-contents #container.ytd-video-secondary-info-renderer:hover:before {
background-color: white ;
}
.style-scope.ytd-video-secondary-info-renderer[style="--ytd-expander-collapsed-height:60px;"] {
display: inline-block;
width: 100% ;
max-width: 98%;
height: auto !important;
max-height: 82vh !important;
margin-left: 0;
padding: 5px ;
border-radius: 5px ;
overflow: hidden !important;
overflow-y: auto !important;
background-color: #222 ;
}
/* NO DARK */
html:not([dark]):not(.style-scope) .style-scope.ytd-video-secondary-info-renderer[style="--ytd-expander-collapsed-height:60px;"] {
background-color: white ;
}
#vidprogress {
display: none !important;
}
/* COLOR */
a.yt-simple-endpoint.style-scope.yt-formatted-string ,
a.linkifyplus{
color: peru;
}
a.yt-simple-endpoint.style-scope.yt-formatted-string:visited ,
a.linkifyplus:visited {
color: tan !important;
}
/* VISITED */
a#thumbnail {
border: 1px solid #262626;
}
a#thumbnail:visited {
border: 1px solid red !important;
}
/* === END ==== */
}
@-moz-document url-prefix("https://www.youtube.com/watch?") {
/* START - URL PREF - VIDEO WATCH ==== */
html{
overflow-y: hidden !important;
}
/* END URL PREF - VIDEO WATCH === */
}