feat: add page loader animation

Signed-off-by: Ryan Wang <i@ryanc.cc>
pull/3445/head
Ryan Wang 2022-04-13 16:06:56 +08:00
parent 6b9d05112c
commit a64663701f
1 changed files with 42 additions and 3 deletions

View File

@ -2,12 +2,51 @@
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="renderer" content="webkit" />
<meta
name="viewport"
content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"
/>
<meta name="robots" content="noindex,nofollow" />
<title>Halo</title>
<link rel="icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite App</title>
<style>
body {
height: 100%;
background-color: #f5f5f5;
}
#loader {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: auto;
border: solid 3px #e5e5e5;
border-top-color: #333;
border-radius: 50%;
width: 30px;
height: 30px;
animation: spin 0.6s linear infinite;
}
@keyframes spin {
to {
transform: rotate(360deg);
}
}
</style>
</head>
<body class="themeable-default">
<div id="app"></div>
<noscript>
<strong>
We're sorry but halo admin client doesn't work properly without
JavaScript enabled. Please enable it to continue.
</strong>
</noscript>
<div id="app">
<div id="loader"></div>
</div>
<script type="module" src="/src/main.ts"></script>
</body>
</html>