forked from cerc-io/cosmos-explorer
Initial project
This commit is contained in:
Binary file not shown.
|
After Width: | Height: | Size: 4.2 KiB |
@@ -0,0 +1,38 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1" />
|
||||
|
||||
<!-- Splash Screen/Loader Styles -->
|
||||
<link rel="stylesheet" type="text/css" href="<%= BASE_URL %>loader.css" />
|
||||
|
||||
<link rel="icon" href="<%= BASE_URL %>favicon.ico" />
|
||||
<link
|
||||
href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,300;0,400;0,500;0,600;1,400&display=swap"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
<title>Vuexy - Vuejs Admin Dashboard Template</title>
|
||||
</head>
|
||||
<body>
|
||||
<noscript>
|
||||
<strong
|
||||
>We're sorry but Vuexy - Vuejs Admin Dashboard Template doesn't work properly without JavaScript enabled. Please
|
||||
enable it to continue.</strong
|
||||
>
|
||||
</noscript>
|
||||
<div id="loading-bg">
|
||||
<div class="loading-logo">
|
||||
<img src="<%= BASE_URL %>logo.png" alt="Logo" />
|
||||
</div>
|
||||
<div class="loading">
|
||||
<div class="effect-1 effects"></div>
|
||||
<div class="effect-2 effects"></div>
|
||||
<div class="effect-3 effects"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="app"></div>
|
||||
<!-- built files will be auto injected -->
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,84 @@
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#loading-bg {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: #fff;
|
||||
display: block;
|
||||
position: absolute;
|
||||
}
|
||||
.loading-logo {
|
||||
position: absolute;
|
||||
left: calc(50% - 45px);
|
||||
top: 40%;
|
||||
}
|
||||
.loading {
|
||||
position: absolute;
|
||||
left: calc(50% - 35px);
|
||||
top: 50%;
|
||||
width: 55px;
|
||||
height: 55px;
|
||||
border-radius: 50%;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
border: 3px solid transparent;
|
||||
}
|
||||
.loading .effect-1,
|
||||
.loading .effect-2 {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border: 3px solid transparent;
|
||||
border-left: 3px solid rgba(121, 97, 249, 1);
|
||||
border-radius: 50%;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.loading .effect-1 {
|
||||
animation: rotate 1s ease infinite;
|
||||
}
|
||||
.loading .effect-2 {
|
||||
animation: rotateOpacity 1s ease infinite 0.1s;
|
||||
}
|
||||
.loading .effect-3 {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border: 3px solid transparent;
|
||||
border-left: 3px solid rgba(121, 97, 249, 1);
|
||||
-webkit-animation: rotateOpacity 1s ease infinite 0.2s;
|
||||
animation: rotateOpacity 1s ease infinite 0.2s;
|
||||
border-radius: 50%;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.loading .effects {
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
@keyframes rotate {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(1turn);
|
||||
transform: rotate(1turn);
|
||||
}
|
||||
}
|
||||
@keyframes rotateOpacity {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
opacity: 0.1;
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(1turn);
|
||||
transform: rotate(1turn);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 3.4 KiB |
Reference in New Issue
Block a user