.video-js .vjs-progress-control:hover .vjs-time-tooltip,
|
.video-js .vjs-progress-control:hover .vjs-progress-holder:focus .vjs-time-tooltip,
|
.video-js.vjs-scrubbing.vjs-touch-enabled .vjs-progress-control .vjs-time-tooltip {
|
white-space: nowrap;
|
}
|
|
.video-js .vjs-volume-tooltip {
|
white-space: nowrap;
|
}
|
|
.playback-dialog {
|
position: relative;
|
margin: 0;
|
|
display: flex;
|
flex-direction: column;
|
|
width: 100%;
|
height: 100%;
|
background: transparent;
|
border: none;
|
|
.el-dialog__header {
|
position: absolute;
|
width: 100%;
|
top: 0;
|
left: 0;
|
box-sizing: border-box;
|
padding: 0 20px;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
height: 48px;
|
background: rgba(2, 2, 2, 0.6);
|
border-radius: 0px 0px 0px 0px;
|
backdrop-filter: blur(13.7px);
|
z-index: 9;
|
|
.title {
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
font-weight: bold;
|
font-size: 16px;
|
color: #FFFFFF;
|
text-align: left;
|
font-style: normal;
|
text-transform: none;
|
}
|
|
.close {
|
width: 24px;
|
height: 24px;
|
background: url('@/assets/images/playbackVideo/close.svg') no-repeat center / 100% 100%;
|
cursor: pointer;
|
}
|
}
|
|
.el-dialog__body {
|
position: relative;
|
height: 0;
|
flex: 1;
|
background: transparent;
|
|
&>div {
|
width: 100%;
|
height: 100%;
|
}
|
}
|
}
|
|
.vjs-marker {
|
position: relative;
|
width: 1px;
|
background: transparent !important;
|
// transform: translateX(4px) !important;
|
|
&::after {
|
content: '';
|
position: absolute;
|
left: -1px;
|
bottom: 0;
|
width: 2px;
|
}
|
|
&::before {
|
content: '';
|
position: absolute;
|
left: -7px;
|
bottom: 14px;
|
width: 14px;
|
height: 14px;
|
border-radius: 50% !important;
|
}
|
|
// 待处理
|
&.pending {
|
&::after {
|
height: 9px;
|
background: #ff7411 !important;
|
}
|
|
&::before {
|
bottom: 9px;
|
background: #ff7411 !important;
|
}
|
}
|
|
// 待审核
|
&.reviewed {
|
&::after {
|
height: 6px;
|
background: #ff472f !important;
|
}
|
|
&::before {
|
bottom: 6px;
|
background: #ff472f !important;
|
}
|
}
|
|
// 处理中
|
&.processing {
|
&::after {
|
height: 12px;
|
background: #ffff61 !important;
|
}
|
|
&::before {
|
bottom: 12px;
|
background: #ffff61 !important;
|
}
|
}
|
|
// 已完成
|
&.done {
|
&::after {
|
height: 16px !important;
|
background: #06d957 !important;
|
}
|
|
&::before {
|
bottom: 16px;
|
background: #06d957 !important;
|
}
|
}
|
|
// 已完结
|
&.ended {
|
&::after {
|
height: 16px !important;
|
background: #06d957 !important;
|
}
|
|
&::before {
|
bottom: 16px;
|
background: #06d957 !important;
|
}
|
}
|
|
// 待处理
|
&.noneEvent {
|
&::after {
|
height: 16px;
|
background: #76F6FF !important;
|
}
|
|
&::before {
|
bottom: 16px;
|
background: #76F6FF !important;
|
}
|
}
|
}
|
|
.vjs-marker:hover {
|
transform: scale(1, 1) !important;
|
}
|
|
.vjs-progress-control.vjs-control {
|
.vjs-tip {
|
bottom: 54px !important;
|
transform: translateX(3px);
|
}
|
}
|
|
.vjs-control-bar {
|
height: 48px !important;
|
background: rgba(2, 2, 2, 0.52) !important;
|
|
&>.vjs-control {
|
margin-top: auto !important;
|
height: 30px !important;
|
}
|
}
|
|
.vjs-playback-rate .vjs-menu {
|
z-index: 99;
|
}
|