react-xrplayer
Version:
An excellent xr player for react
48 lines (41 loc) • 1.03 kB
text/less
.overlay {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100vw;
height: 100vh;
background-color: rgba(0, 0, 0, .5);
}
.container {
.video {
box-shadow: h-shadow v-shadow blur spread color inset;
-moz-box-shadow: 10px 10px 10px rgba(0, 0, 0, .5);
-webkit-box-shadow: 10px 10px 10px rgba(0, 0, 0, .5);
position: fixed;
top: 50%;
left: 50%;
width: 100%;
max-height: 100%;
z-index: 12;
-webkit-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
mix-blend-mode: screen;
}
}
.content {
margin: auto;
}
.close {
position: absolute;
z-index: 12;
right: 1rem;
top: 1rem;
width: 2rem;
cursor: pointer;
height: 2rem;
background: url(./images/close.png) 0 0 no-repeat;
background-size: cover;
}