To make floating chat window on fullscreen
当前为
/* ==UserStyle==
@name YouTube: Floating Chat Window on Fullscreen
@version 0.1.1
@namespace github.com/cyfung1031
@license MIT
@description To make floating chat window on fullscreen
@author CY Fung
@preprocessor stylus
@var color color-handle-light "Handle Color (Light Theme)" #0cb8da
@var color color-handle-dark "Handle Color (Dark Theme)" #0c74e4
==/UserStyle== */
@-moz-document url-prefix("https://www.youtube.com/") {
userscript-control[enable-shorts-channel-handle-to-name] {
top:0;
}
[floating-chat-window]:fullscreen ytd-live-chat-frame#chat {
position:fixed !important;
top: var(--f3-top, 5px) !important;
left: var(--f3-left, calc(60vw + 100px)) !important;
height: var(--f3-h, 60vh) !important;
width: var(--f3-w, 320px) !important;
display:flex !important;
flex-direction: column !important;
padding: 4px;
cursor: all-scroll;
z-index:9999;
box-sizing: border-box !important;
margin:0 !important;
opacity: var(--floating-window-opacity, 1.0) !important;
}
.no-floating[floating-chat-window]:fullscreen ytd-live-chat-frame#chat {
top: -300vh !important;
left: -300vh !important;
}
[floating-chat-window]:fullscreen ytd-live-chat-frame#chat #show-hide-button[class]{
flex-grow: 0;
flex-shrink:0;
position:static;
cursor: all-scroll;
}
[floating-chat-window]:fullscreen ytd-live-chat-frame#chat #show-hide-button[class] *[class]{
cursor: inherit;
}
[floating-chat-window]:fullscreen ytd-live-chat-frame#chat iframe[class]{
flex-grow: 100;
flex-shrink:0;
height: 0;
position:static;
}
html{
--f7-handle-color: color-handle-light;
}
html[dark]{
--f7-handle-color: color-handle-dark;
}
:fullscreen .resize-handle{
position: absolute;
top: 0;
left: 0;
bottom: 0;
background: transparent;
right: 0;
border: 4px solid var(--f7-handle-color);
z-index: 999;
border-radius: inherit;
box-sizing: border-box;
pointer-events:none;
}
[moving] {
cursor: all-scroll;
--pointer-events:initial;
}
[moving] body {
--pointer-events:none;
}
[moving] ytd-live-chat-frame#chat{
--pointer-events:initial;
}
[moving] ytd-live-chat-frame#chat iframe {
--pointer-events:none;
}
[moving="move"] ytd-live-chat-frame#chat {
background-color: var(--yt-spec-general-background-a);
}
[moving="move"] ytd-live-chat-frame#chat iframe {
visibility: collapse;
}
[moving] * {
pointer-events:var(--pointer-events) !important;
}
:fullscreen tyt-iframe-popup-btn{
display: none !important;
}
[moving] tyt-iframe-popup-btn{
display: none !important;
}
}