le-player
Version:
The best HTML5 video player made for Lectoriy.
105 lines (91 loc) • 1.39 kB
text/less
.leplayer-play-button
{
display: none;
align-items: center;
align-content: center;
justify-content: center;
background: rgba(0, 0, 0, 0.5);
color: @color-primary;
cursor: pointer;
position: absolute;
height: 100%;
width: 100%;
outline: 0;
text-align: center;
z-index: @z-index-base + 8;
font-size: 50px;
&:hover
{
background: rgba(0, 0, 0, 0.2);
.leplayer-play-button__button
{
opacity: 0.5;
}
}
&__button
{
text-shadow: 0 0 10px rgba(255, 255, 255, 0.3);
padding: 0.5em;
background-color: @color-active;
border-radius: 50%;
cursor: pointer;
}
.leplayer-icon
{
position: relative;
left: 0.08em;
svg {
filter: invert(38%) sepia(97%) saturate(395%) hue-rotate(129deg) brightness(95%) contrast(88%);
}
}
}
.leplayer--inited.leplayer--virgin
{
.leplayer-play-button
{
display: flex;
}
&.leplayer--waiting
{
.leplayer-play-button
{
display: none;
}
}
}
@media screen and (max-width: 420px) {
.leplayer-play-button
{
font-size: 35px;
}
}
.leplayer--fullscreen
{
.leplayer-play-button {
z-index: @z-index-fullscreen + 8;
}
.leplayer-play-button
{
font-size: 50px;
}
.leplayer-play-button__button
{
padding: 0.6em;
}
}
.leplayer--mini
{
.leplayer-play-button
{
font-size: 30px;
}
}
.leplayer--playing,
.leplayer--error,
.leplayer--waiting
{
.leplayer-play-button
{
display: none;
}
}