hexo-theme-butterfly/source/css/_layout/loadding.styl
Jerry b512eb761d feat: 增加標籤外掛 tag-toggle
 feat: 增加頁面加載動畫preloader close #193
 feat: 適配hexo-generator-indexed插件
 feat: aside subtitle可配置,優先顯示配置內容、沒有的顯示頁面subtitle close #191
 feat: aside card-tags可配置是否顯示顏色
 feat: algolia-search highligh文字加深
 feat: 增加頁面keywords設置 #191
 feat: darkmode和readmode配色微調
🐛 fix: 修復hide-block 配置顏色顯示出錯的bug
🐛 fix: 修正zh-TW部分用語
2020-04-17 19:48:07 +08:00

95 lines
1.8 KiB
Stylus

if hexo-config('preloader')
loading-bg()
position: fixed
z-index: 1000
width: 50%
height: 100%
background-color: $preloader-bg
transition: all .5s
#loading-box
.loading-left-bg
loading-bg()
.loading-right-bg
loading-bg()
right: 0
.spinner-box
position: fixed
z-index: 1001
display: flex
justify-content: center
align-items: center
width: 100%
height: 100vh
.configure-border-1
position: absolute
padding: 3px
width: 115px
height: 115px
background: #ffab91
animation: configure-clockwise 3s ease-in-out 0s infinite alternate
.configure-border-2
left: -115px
padding: 3px
width: 115px
height: 115px
background: rgb(63, 249, 220)
transform: rotate(45deg)
animation: configure-xclockwise 3s ease-in-out 0s infinite alternate
.loading-word
position: absolute
color: $white
font-size: .8rem
.configure-core
width: 100%
height: 100%
background-color: $preloader-bg
&.loaded
.loading-left-bg
transform: translate(-100%, 0)
.loading-right-bg
transform: translate(100%, 0)
.spinner-box
display: none
@keyframes configure-clockwise
0%
transform: rotate(0)
25%
transform: rotate(90deg)
50%
transform: rotate(180deg)
75%
transform: rotate(270deg)
100%
transform: rotate(360deg)
@keyframes configure-xclockwise
0%
transform: rotate(45deg)
25%
transform: rotate(-45deg)
50%
transform: rotate(-135deg)
75%
transform: rotate(-225deg)
100%
transform: rotate(-315deg)