1 line
2.4 KiB
CSS
1 line
2.4 KiB
CSS
|
.bsloader-container{position:fixed;top:0;left:0;width:100%;height:100%;z-index:10000;opacity:.95}.bsloader-container *,.bsloader-container *::before,.bsloader-container *::after{-webkit-box-sizing:unset!important;box-sizing:unset!important}.bsloader-container:before{content:'';position:absolute;top:0;left:0;width:100%;height:50%;background:#00a551;z-index:-1;transition:top 1.2s linear 3.1s}.bsloader-container:after{content:'';position:absolute;bottom:0;left:0;width:100%;height:50%;background:#00a551;z-index:-1;transition:bottom 1.2s linear 3.1s}.bsloader-container.done:before{top:-50%}.bsloader-container.done:after{bottom:-50%}.bsprogress{position:absolute;top:50%;left:50%;transform:translateX(-50%) translateY(-50%);transform-origin:center}.bsprogress .bsprogress__item{text-align:center;width:100px;height:100px;line-height:100px;border:2px solid #fff;border-radius:50%}.bsprogress .bsprogress__item:before{content:'';position:absolute;top:0;left:50%;margin-top:-3px;margin-left:0;width:45px;height:45px;border-top:solid 10px #fff;border-right:solid 10px #fff;border-top-right-radius:100%;transform-origin:left bottom;-webkit-animation:spin 3s linear infinite}.bsprogress.bsfloat .bsprogress__item:before{border-top-width:2px;margin-top:0;height:50px}.bsprogress.bsfloat.bsshadow:before{border-top-width:2px;margin-top:-41px;height:50px}.bsprogress.bsshadow:before{content:'';position:absolute;top:50%;left:50%;margin:-43px 0 0 12px;width:45px;height:45px;border-top:solid 10px #039048;border-right:solid 10px #039048;border-top-right-radius:100%;z-index:-1;transform-origin:left bottom;-webkit-animation:spin 3s linear infinite}.bsprogress.bsshadow:after{content:'';position:absolute;top:50%;left:50%;width:100px;height:100px;color:#039048;text-align:center;line-height:100px;border:2px solid #039048;border-radius:50%;margin:-40px 0 0 -40px;z-index:-1;transform-origin:center}.bsprogress.done .bsprogress__item{opacity:0;-webkit-animation:done 3.1s;transition:opacity 0.3s linear 3.1s}.bsprogress.done .bsprogress__item:before{display:none}.bsprogress.done:before{display:none}.bsprogress.done:after{opacity:0;-webkit-animation:done 3.1s;transition:opacity 0.15s linear 3.1s}@-webkit-keyframes done{10%{transform:scale(1.1)}20%{transform:scale(.9)}30%{transform:scale(1.07)}40%{transform:scale(.93)}50%{transform:scale(1.04)}60%{transform:scale(.97)}80%{transform:scale(1.01)}90%{transform:scale(.99)}100%{transform:scale(1)}}@-webkit-keyframes spin{100%{-webkit-transform:rotate(360deg)}}
|