mirror of
https://github.com/the1812/Bilibili-Evolved.git
synced 2025-11-04 21:22:45 +08:00
348 lines
10 KiB
CSS
348 lines
10 KiB
CSS
.touch-video-box-wrapper
|
|
{
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 100%;
|
|
height: 100%;
|
|
position: absolute;
|
|
top: 0px;
|
|
left: 0px;
|
|
z-index: 14;
|
|
pointer-events: none;
|
|
}
|
|
.touch-video-box
|
|
{
|
|
border-radius: 0px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 100%;
|
|
height: 100%;
|
|
background: rgba(0,0,0,0.85);
|
|
position: relative;
|
|
max-width: 520px;
|
|
max-height: 240px;
|
|
border: 4px solid transparent;
|
|
transform-origin: center;
|
|
}
|
|
.touch-video-box.animation,
|
|
.bilibili-player-video-control-top
|
|
{
|
|
transition: all 0.2s;
|
|
}
|
|
@supports (backdrop-filter: blur(60px)) or (-webkit-backdrop-filter: blur(60px))
|
|
{
|
|
.touch-video-box
|
|
{
|
|
background: rgba(0,0,0,0.618);
|
|
-webkit-backdrop-filter: blur(60px);
|
|
backdrop-filter: blur(60px);
|
|
}
|
|
}
|
|
.touch-video-info
|
|
{
|
|
color: white;
|
|
font-size: 2rem;
|
|
text-align: center;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
flex-direction: column;
|
|
height: 100%;
|
|
width: 100%;
|
|
}
|
|
.touch-row
|
|
{
|
|
flex-grow: 1;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 100%;
|
|
}
|
|
.touch-info
|
|
{
|
|
display: block;
|
|
color: var(--theme-color);
|
|
}
|
|
.touch-result
|
|
{
|
|
display: block;
|
|
font-size: 1.5rem;
|
|
line-height: 150%;
|
|
}
|
|
.touch-speed
|
|
{
|
|
display: block;
|
|
background: rgba(0,0,0,0.1);
|
|
padding: 0.5em;
|
|
}
|
|
.touch-progress
|
|
{
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 0;
|
|
background: var(--theme-color);
|
|
width: 100%;
|
|
transform-origin: left;
|
|
transform: scaleX(0);
|
|
height: 4px;
|
|
transition: all 0.2s;
|
|
}
|
|
.touch-row-item
|
|
{
|
|
flex: 1 0 0;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
.touch-row-item-wide
|
|
{
|
|
flex: 1.5 0 0;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
.videoshot
|
|
{
|
|
background-color: transparent;
|
|
background-image: none;
|
|
transform-origin: center;
|
|
transform: scale(0.9);
|
|
}
|
|
.adjust-closed
|
|
{
|
|
transform: rotateX(90deg) rotateY(90deg) scale(0.5);
|
|
}
|
|
.adjust-opened
|
|
{
|
|
transform: rotateX(0deg) rotateY(0deg) scale(1);
|
|
}
|
|
|
|
.disable-original-hover .bilibili-player-video-control-bottom,
|
|
.disable-original-hover .bilibili-player-video-control-mask
|
|
{
|
|
opacity: 0 !important;
|
|
visibility: hidden !important;
|
|
}
|
|
.disable-original-hover.touch-video-control-show .bilibili-player-video-control-bottom,
|
|
.disable-original-hover .bilibili-player-video-control-wrap,
|
|
.disable-original-hover.touch-video-control-show .bilibili-player-video-control-mask
|
|
{
|
|
opacity: 1 !important;
|
|
visibility: visible !important;
|
|
}
|
|
.disable-original-hover .bilibili-player-video-control-top,
|
|
.bilibili-player-video-control-top
|
|
{
|
|
left: 0 !important;
|
|
right: 0 !important;
|
|
bottom: 0px !important;
|
|
}
|
|
.bilibili-player-video-control-top
|
|
{
|
|
bottom: 0 !important;
|
|
}
|
|
.disable-original-hover.touch-video-control-show .bilibili-player-video-control-top
|
|
{
|
|
left: 0 !important;
|
|
right: 0 !important;
|
|
bottom: 38px !important;
|
|
}
|
|
.bilibili-player-video-control-bottom
|
|
{
|
|
padding: 0 !important;
|
|
}
|
|
|
|
|
|
div.bilibili-player-video-control
|
|
{
|
|
height: 38px !important;
|
|
align-items: center !important;
|
|
}
|
|
.bilibili-player-video-btn
|
|
{
|
|
flex-grow: 1 !important;
|
|
height: 100% !important;
|
|
display: flex !important;
|
|
align-items: center !important;
|
|
justify-content: center !important;
|
|
}
|
|
.bilibili-player-video-inputbar,
|
|
.bilibili-player-video-progress
|
|
{
|
|
flex-grow: 30 !important;
|
|
}
|
|
.bilibili-player-video-quality-menu
|
|
{
|
|
display: flex !important;
|
|
align-items: center !important;
|
|
justify-content: center !important;
|
|
}
|
|
.bilibili-player-iconfont-start,
|
|
.bilibili-player-iconfont-pause,
|
|
.bilibili-player-iconfont-volume,
|
|
.bilibili-player-iconfont-volume-max,
|
|
.bilibili-player-iconfont-volume-min,
|
|
.bilibili-player-iconfont-setting,
|
|
.bilibili-player-iconfont-danmaku,
|
|
.bilibili-player-iconfont-danmaku-off,
|
|
.bilibili-player-iconfont-repeat,
|
|
.bilibili-player-iconfont-widescreen,
|
|
.bilibili-player-iconfont-web-fullscreen,
|
|
.bilibili-player-iconfont-fullscreen,
|
|
.bilibili-player-iconfont-color
|
|
{
|
|
font-size: 2.5rem !important;
|
|
}
|
|
.bilibili-player-iconfont-next
|
|
{
|
|
font-size: 2rem !important;
|
|
}
|
|
.bpui-selectmenu-list,
|
|
.bilibili-player-video-danmaku-setting-wrap,
|
|
.bilibili-player-video-btn-setting-panel,
|
|
.bilibili-player.mode-fullscreen .bilibili-player-video-sendbar
|
|
{
|
|
left: unset !important;
|
|
bottom: 38px !important;
|
|
}
|
|
.bilibili-player-video-volumebar-wrp
|
|
{
|
|
left: unset !important;
|
|
}
|
|
.bilibili-player-video-control-wrap
|
|
{
|
|
padding: 0 !important;
|
|
}
|
|
.bilibili-player-video-control-bottom
|
|
{
|
|
align-items: center !important;
|
|
}
|
|
.bilibili-player-iconfont-setting,
|
|
.bilibili-player-video-btn-volume.video-state-volume-max .bilibili-player-iconfont-volume-max,
|
|
.bilibili-player-video-btn-volume.video-state-volume-min .bilibili-player-iconfont-volume-min,
|
|
.bilibili-player-video-btn-volume:not(.video-state-volume-max):not(.video-state-volume-min) .bilibili-player-iconfont-volume,
|
|
.bilibili-player-iconfont-next,
|
|
.bilibili-player-video-control-bottom-left
|
|
{
|
|
display: flex !important;
|
|
align-items: center !important;
|
|
}
|
|
.bilibili-player-video-btn-danmaku
|
|
{
|
|
flex-grow: 0 !important;
|
|
display: flex !important;
|
|
align-items: center !important;
|
|
height: 100% !important;
|
|
margin: 0 !important;
|
|
padding: 0 !important;
|
|
}
|
|
.bilibili-player.mode-webfullscreen .bilibili-player-video-control-wrap .bilibili-player-video-control-bottom-right
|
|
{
|
|
flex-grow: 1 !important;
|
|
}
|
|
.bilibili-player.mode-fullscreen .bilibili-player-video-sendbar
|
|
{
|
|
bottom: 0 !important;
|
|
}
|
|
.bilibili-player .bilibili-player-area .bilibili-player-video-control .bilibili-player-video-btn.bilibili-player-video-btn-fullscreen
|
|
{
|
|
margin-right: 0 !important;
|
|
padding-right: 8px !important;
|
|
}
|
|
.bilibili-player .bilibili-player-area .bilibili-player-video-control .bilibili-player-video-btn.bilibili-player-video-btn-start
|
|
{
|
|
padding-left: 8px !important;
|
|
flex-grow: 1.2 !important;
|
|
margin-right: 0px !important;
|
|
margin-left: 0 !important;
|
|
}
|
|
.bilibili-player .bilibili-player-area .bilibili-player-video-control .bilibili-player-video-btn
|
|
{
|
|
padding: 0 3px !important;
|
|
}
|
|
.bilibili-player .bilibili-player-area .bilibili-player-video-control-bottom,
|
|
.bilibili-player-video-control-bottom-left,
|
|
.bilibili-player .bilibili-player-area .bilibili-player-video-control-bottom-right
|
|
{
|
|
height: 100% !important;
|
|
margin: 0 !important;
|
|
}
|
|
.bilibili-player-video-btn-setting-panel-hover-bridge
|
|
{
|
|
display: none !important;
|
|
}
|
|
.disable-original-hover .bilibili-player-video-control-wrap:hover .bilibili-player-video-control-top .bilibili-player-video-progress-slider,
|
|
.disable-original-hover.bilibili-player-area.video-control-show .bilibili-player-video-control-top .bilibili-player-video-progress-slider
|
|
{
|
|
height: 2px !important;
|
|
}
|
|
.disable-original-hover.bilibili-player-area .bilibili-player-video-control .bilibili-player-video-progress-detail.show
|
|
{
|
|
bottom: 1px !important;
|
|
}
|
|
#bofqi *
|
|
{
|
|
-webkit-tap-highlight-color: transparent !important;
|
|
}
|
|
|
|
|
|
@media screen and (min-width: 750px)
|
|
{
|
|
.bilibili-player.mode-fullscreen .bilibili-player-video-control-wrap .bilibili-player-video-control-bottom-center .bilibili-player-video-sendbar .bilibili-player-video-inputbar,
|
|
.bilibili-player.mode-webfullscreen .bilibili-player-video-control-wrap .bilibili-player-video-control-bottom-center .bilibili-player-video-sendbar .bilibili-player-video-inputbar
|
|
{
|
|
background: #fff1 !important;
|
|
}
|
|
.bilibili-player.mode-fullscreen .bilibili-player-video-control-wrap .bilibili-player-video-control,
|
|
.bilibili-player.mode-webfullscreen .bilibili-player-video-control-wrap .bilibili-player-video-control
|
|
{
|
|
height: 100% !important;
|
|
margin: 0 !important;
|
|
}
|
|
.bilibili-player.mode-fullscreen .bilibili-player-video-control-wrap .bilibili-player-video-control-bottom,
|
|
.bilibili-player.mode-webfullscreen .bilibili-player-video-control-wrap .bilibili-player-video-control-bottom
|
|
{
|
|
margin: 0 !important;
|
|
}
|
|
.bilibili-player.mode-fullscreen .bilibili-player-video-control-wrap .bilibili-player-video-control-bottom-left,
|
|
.bilibili-player.mode-webfullscreen .bilibili-player-video-control-wrap .bilibili-player-video-control-bottom-left
|
|
{
|
|
height: 100% !important;
|
|
}
|
|
.bilibili-player-video-btn.bilibili-player-video-btn-start
|
|
{
|
|
flex-grow: 0.5 !important;
|
|
}
|
|
.player .bilibili-player.mode-webfullscreen .bilibili-player-video-control-wrap .bilibili-player-video-control-top,
|
|
.player .bilibili-player.mode-fullscreen .bilibili-player-video-control-wrap .bilibili-player-video-control-top
|
|
{
|
|
left: 0 !important;
|
|
right: 0 !important;
|
|
}
|
|
.player .bilibili-player.mode-fullscreen .disable-original-hover.bilibili-player-video-control-wrap .bilibili-player-video-control-top,
|
|
.player .bilibili-player.mode-webfullscreen .disable-original-hover.bilibili-player-video-control-wrap .bilibili-player-video-control-top
|
|
{
|
|
left: 0 !important;
|
|
right: 0 !important;
|
|
bottom: 0 !important;
|
|
}
|
|
.player .bilibili-player.mode-fullscreen .disable-original-hover.touch-video-control-show .bilibili-player-video-control-top,
|
|
.player .bilibili-player.mode-webfullscreen .disable-original-hover.touch-video-control-show .bilibili-player-video-control-top
|
|
{
|
|
left: 0 !important;
|
|
right: 0 !important;
|
|
bottom: 54px !important;
|
|
}
|
|
.mode-fullscreen .bilibili-player-area.video-control-show:not(.disable-original-hover) .bilibili-player-video-control-top,
|
|
.mode-fullscreen .bilibili-player-area.mouse-hover:not(.disable-original-hover) .bilibili-player-video-control-top,
|
|
.mode-webfullscreen .bilibili-player-area.video-control-show:not(.disable-original-hover) .bilibili-player-video-control-top,
|
|
.mode-webfullscreen .bilibili-player-area.mouse-hover:not(.disable-original-hover) .bilibili-player-video-control-top
|
|
{
|
|
left: 0 !important;
|
|
right: 0 !important;
|
|
bottom: 48px !important;
|
|
}
|
|
}
|