cb9330bcef
Co-authored-by: zubiden <19638254+zubiden@users.noreply.github.com> Co-authored-by: Alexander Zinchuk <alx.zinchuk@gmail.com>
71 lines
1.2 KiB
SCSS
71 lines
1.2 KiB
SCSS
.RoundVideo {
|
|
position: relative;
|
|
width: 15rem;
|
|
height: 15rem;
|
|
cursor: var(--custom-cursor, pointer);
|
|
|
|
&.non-interactive {
|
|
pointer-events: none;
|
|
}
|
|
|
|
.video-wrapper {
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
border-radius: 50%;
|
|
overflow: hidden;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
|
|
.thumbnail {
|
|
border-radius: 50%;
|
|
}
|
|
|
|
.progress {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.progress-circle {
|
|
stroke: white;
|
|
fill: transparent;
|
|
stroke-width: 4;
|
|
stroke-opacity: 0.35;
|
|
stroke-linecap: round;
|
|
}
|
|
|
|
video::-internal-media-controls-cast-button,
|
|
video::-webkit-media-controls,
|
|
video::-webkit-media-controls-start-playback-button {
|
|
display: none;
|
|
}
|
|
|
|
.play-wrapper {
|
|
position: absolute;
|
|
|
|
.icon-play {
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.icon-view-once {
|
|
position: absolute;
|
|
background-color: rgba(0, 0, 0, 0.75);
|
|
padding: 0.125rem;
|
|
left: 1.625rem;
|
|
bottom: 0;
|
|
font-size: 1rem;
|
|
border-radius: 50%;
|
|
color: var(--color-white);
|
|
z-index: var(--z-badge);
|
|
}
|
|
}
|
|
}
|