Files
taiko-web/public/src/css/loader.css
2019-01-26 21:29:13 +03:00

120 lines
1.8 KiB
CSS

html,
body{
margin: 0;
width: 100%;
height: 100%;
background: #fe7839;
position: absolute;
user-select: none;
touch-action: none;
overflow: hidden;
}
#screen{
width: 100%;
height: 100%;
margin: 0;
padding: 0;
background-color: #000;
background-position: top center;
background-size: 30vh;
}
#screen.pattern-bg{
background-color: #fe7839;
}
#assets,
#browse{
display: none;
}
#loader{
width:90%;
height:10%;
border:1px solid black;
position: fixed;
top:50%;
left:5%;
background: rgba(0,0,0,0.65);
}
#loader .progress{
width:0%;
height: 100%;
background: #b52a2a;
opacity: 0.90;
}
#loader .percentage{
position:absolute;
top:0;
right:0;
bottom:0;
left:0;
display:flex;
justify-content:center;
align-items:center;
text-align:center;
font-family: sans-serif;
font-size: 5vmin;
color: white;
}
#unsupportedBrowser{
position: absolute;
top: 0;
right: 0;
left: 0;
max-height: 100%;
overflow: hidden auto;
padding: 0.5em;
background: #aef;
font-family: sans-serif;
font-size: 20px;
cursor: default;
z-index: 10;
}
#unsupportedWarn{
display: inline-block;
width: 1.5em;
height: 1.5em;
margin-right: 0.5em;
background: #39a;
color: #fff;
text-align: center;
line-height: 1.5em;
}
#unsupportedBrowser.hidden{
width: 1.5em;
}
#unsupportedBrowser.hidden *:not(#unsupportedWarn){
display: none !important;
}
#unsupportedBrowser a{
color: #02e;
cursor: pointer;
text-decoration: none;
}
#unsupportedBrowser a:hover{
text-decoration: underline;
}
#unsupportedBrowser ul{
margin: 0.25em;
}
#unsupportedDetails{
display: none;
margin: 0.5em 2.5em 0 2.5em;
border: 0.15em solid #39a;
padding: 0.25em;
cursor: auto;
user-select: text;
}
#unsupportedHide{
position: absolute;
right: 0;
top: 0;
width: 2.5em;
height: 2.5em;
text-align: center;
line-height: 2.25em;
color: #777;
text-shadow: 0.05em 0.05em #fff;
}