Bilibili-Evolved/style/style-touch-player.scss
2018-07-24 22:41:56 +08:00

238 lines
6.2 KiB
SCSS

.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: 4px;
display: none;
align-items: center;
justify-content: center;
width: 50%;
height: 40%;
background: #000;
background: #000A;
backdrop-filter: blur(30px);
}
.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;
flex-grow: 1;
flex-shrink: 0;
margin-right: 1em;
margin-left: 0.2em;
color: $customStyleColor;
max-width: 15em;
}
.touch-result
{
display: block;
flex-grow: 1;
flex-shrink: 0;
font-size: 1.5rem;
}
.touch-speed
{
display: block;
flex-grow: 2;
flex-shrink: 0;
background: #444A;
padding: 0.5em;
margin-left: 1em;
border-radius: 4px;
margin-right: 0.2em;
max-width: 5em;
}
.videoshot
{
display: none;
background-image: none;
flex-grow: 0;
flex-shrink: 0;
border-radius: 4px;
width: 80px;
height: 45px;
background-size: 1000%;
margin-left: 1em;
}
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;
background: #222d !important;
}
.bilibili-player-video-control-bottom
{
align-items: center !important;
}
.bilibili-player-video-control-bottom-left
{
display: flex;
align-items: center;
}
.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;
}
.bilibili-player .bilibili-player-area .bilibili-player-video-control .bilibili-player-video-btn.bilibili-player-video-btn-start
{
padding-left: 0 !important;
flex-grow: 1.2 !important;
margin-right: 4px !important;
margin-left: 0 !important;
}
.bilibili-player .bilibili-player-area .bilibili-player-video-control .bilibili-player-video-btn
{
padding: 0 3px !important;
}
.bui-slider .bui-track.bui-track-video-progress .bui-bar-wrap
{
background: #666;
}
.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;
}
@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;
}
.bilibili-player.mode-fullscreen .bilibili-player-video-control-wrap .bilibili-player-video-control-top,
.bilibili-player.mode-webfullscreen .bilibili-player-video-control-wrap .bilibili-player-video-control-top
{
bottom: 48px !important;
}
}