新增loading
This commit is contained in:
parent
55b6313ed7
commit
0ab4e958e1
|
@ -7,7 +7,8 @@
|
||||||
<?php echo $site['title']; ?> -
|
<?php echo $site['title']; ?> -
|
||||||
<?php echo $site['subtitle']; ?>
|
<?php echo $site['subtitle']; ?>
|
||||||
</title>
|
</title>
|
||||||
<link rel="shortcut icon" href="https://obsidian-img-use.oss-cn-beijing.aliyuncs.com/browser-img/qnloft-blog-favicon.png">
|
<link rel="shortcut icon"
|
||||||
|
href="https://obsidian-img-use.oss-cn-beijing.aliyuncs.com/browser-img/qnloft-blog-favicon.png">
|
||||||
<meta name="keywords" content="<?php echo $site['keywords']; ?>" />
|
<meta name="keywords" content="<?php echo $site['keywords']; ?>" />
|
||||||
<meta name="description" content="<?php echo $site['description']; ?>" />
|
<meta name="description" content="<?php echo $site['description']; ?>" />
|
||||||
<link rel="stylesheet" id="block-library-css" href="templates/qnloft/assets/css/block-library.min-5.6.2.css"
|
<link rel="stylesheet" id="block-library-css" href="templates/qnloft/assets/css/block-library.min-5.6.2.css"
|
||||||
|
@ -77,6 +78,63 @@
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body class="io-grey-mode">
|
<body class="io-grey-mode">
|
||||||
|
<div id="loading">
|
||||||
|
<style>
|
||||||
|
.loader {
|
||||||
|
width: 250px;
|
||||||
|
height: 50px;
|
||||||
|
line-height: 50px;
|
||||||
|
text-align: center;
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
font-family: helvetica, arial, sans-serif;
|
||||||
|
font-weight: 900;
|
||||||
|
color: #07C160;
|
||||||
|
letter-spacing: 0.2em
|
||||||
|
}
|
||||||
|
|
||||||
|
.loader::before,
|
||||||
|
.loader::after {
|
||||||
|
content: "";
|
||||||
|
display: block;
|
||||||
|
width: 15px;
|
||||||
|
height: 15px;
|
||||||
|
background: #07C160;
|
||||||
|
position: absolute;
|
||||||
|
animation: load .7s infinite alternate ease-in-out
|
||||||
|
}
|
||||||
|
|
||||||
|
.loader::before {
|
||||||
|
top: 0
|
||||||
|
}
|
||||||
|
|
||||||
|
.loader::after {
|
||||||
|
bottom: 0
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes load {
|
||||||
|
0% {
|
||||||
|
left: 0;
|
||||||
|
height: 30px;
|
||||||
|
width: 15px
|
||||||
|
}
|
||||||
|
|
||||||
|
50% {
|
||||||
|
height: 8px;
|
||||||
|
width: 40px
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
left: 235px;
|
||||||
|
height: 30px;
|
||||||
|
width: 15px
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<div class="loader"><?php echo $site['title']; ?></div>
|
||||||
|
</div>
|
||||||
<div class="page-container">
|
<div class="page-container">
|
||||||
<!-- 左侧 -->
|
<!-- 左侧 -->
|
||||||
<div id="sidebar" class="sticky sidebar-nav fade animate-nav mini-sidebar" style="width: 60px">
|
<div id="sidebar" class="sticky sidebar-nav fade animate-nav mini-sidebar" style="width: 60px">
|
||||||
|
@ -96,9 +154,10 @@
|
||||||
<?php } ?>
|
<?php } ?>
|
||||||
</a>
|
</a>
|
||||||
<a href="" class="logo-collapsed">
|
<a href="" class="logo-collapsed">
|
||||||
<img src="templates/qnloft/assets/images/logos/qnLogo.png" height="40" class="logo-light" alt="青柠炸机街">
|
<img src="templates/qnloft/assets/images/logos/qnLogo.png" height="40" class="logo-light"
|
||||||
<img src="templates/qnloft/assets/images/logos/qnLogo_dark.png" height="40" class="logo-dark d-none"
|
|
||||||
alt="青柠炸机街">
|
alt="青柠炸机街">
|
||||||
|
<img src="templates/qnloft/assets/images/logos/qnLogo_dark.png" height="40"
|
||||||
|
class="logo-dark d-none" alt="青柠炸机街">
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Reference in New Issue