Begin work on board.html page
This commit is contained in:
parent
dc6e40f3fa
commit
f0a6b66cad
@ -8,12 +8,17 @@
|
||||
<link rel="manifest" type="application/json" href="./manifest.json"/>
|
||||
</head>
|
||||
<body>
|
||||
<div id="content">
|
||||
<div id="loading">
|
||||
<div class="spinner">
|
||||
|
||||
</div>
|
||||
<p>Loading <span id="station"></span></p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<p id="output"></p>
|
||||
<div id="output">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
@ -0,0 +1,37 @@
|
||||
/* Loading Box: */
|
||||
@keyframes spinner {
|
||||
0% {
|
||||
transform: translate3d(-50%, -50%, 0) rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
transform: translate3d(-50%, -50%, 0) rotate(360deg);
|
||||
}
|
||||
}
|
||||
.spinner::before {
|
||||
animation: 1.5s linear infinite spinner;
|
||||
animation-play-state: inherit;
|
||||
border: solid 5px var(--overlay-color);
|
||||
border-bottom-color: white;
|
||||
border-radius: 50%;
|
||||
content: "";
|
||||
height: 40px;
|
||||
width: 40px;
|
||||
position: absolute;
|
||||
top: 30%;
|
||||
margin: auto;
|
||||
transform: translate3d(-50%, -50%, 0);
|
||||
will-change: transform;
|
||||
}
|
||||
#loading {
|
||||
position: absolute;
|
||||
top: 45%;
|
||||
margin: auto;
|
||||
background-color: var(--overlay-color);
|
||||
border-radius: 45px;
|
||||
padding: 20px;
|
||||
padding-bottom: 1px;
|
||||
min-width: 90px;
|
||||
}
|
||||
#loading p {
|
||||
padding-top: 50px;
|
||||
}
|
Reference in New Issue
Block a user