bk-magic-vue/lib/ui/spin.min.css

基于蓝鲸 Magicbox 和 Vue 的前端组件库

.bk-spin{display:inline-block;text-align:center;vertical-align:middle}.bk-spin,.bk-spin .bk-spin-rotation{position:relative}.bk-spin .bk-spin-rotation .rotate{position:absolute;top:77%;right:43%;width:6px;height:8px;-webkit-transform-origin:50% -10px;transform-origin:50% -10px;border-radius:8px;-webkit-transform:scale(.4);transform:scale(.4);-webkit-animation-name:fadePrimary;animation-name:fadePrimary;-webkit-animation-duration:1.2s;animation-duration:1.2s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-direction:normal;animation-direction:normal}.bk-spin .bk-spin-rotation.bk-spin-rotation-default .rotate{-webkit-animation-name:fadeDefault;animation-name:fadeDefault}.bk-spin .bk-spin-rotation.bk-spin-rotation-primary .rotate{-webkit-animation-name:fadePrimary;animation-name:fadePrimary}.bk-spin .bk-spin-rotation.bk-spin-rotation-success .rotate{-webkit-animation-name:fadeSuccess;animation-name:fadeSuccess}.bk-spin .bk-spin-rotation.bk-spin-rotation-danger .rotate{-webkit-animation-name:fadeDanger;animation-name:fadeDanger}.bk-spin .bk-spin-rotation.bk-spin-rotation-warning .rotate{-webkit-animation-name:fadeWarning;animation-name:fadeWarning}.bk-spin .bk-spin-rotation.bk-spin-rotation-info .rotate{-webkit-animation-name:fadeInfo;animation-name:fadeInfo}.bk-spin .bk-spin-rotation.bk-spin-rotation-default-wait .rotate{background-color:#c4c6cc}.bk-spin .bk-spin-rotation.bk-spin-rotation-primary-wait .rotate{background-color:#3c96ff}.bk-spin .bk-spin-rotation.bk-spin-rotation-success-wait .rotate{background-color:#2dcb56}.bk-spin .bk-spin-rotation.bk-spin-rotation-danger-wait .rotate{background-color:#ff5656}.bk-spin .bk-spin-rotation.bk-spin-rotation-warning-wait .rotate{background-color:#ffb848}.bk-spin .bk-spin-rotation.bk-spin-rotation-info-wait .rotate{background-color:#63656e}.bk-spin .bk-spin-rotation .rotate1{-webkit-animation-delay:.45s;animation-delay:.45s;-webkit-transform:rotate(-90deg);transform:rotate(-90deg)}.bk-spin .bk-spin-rotation .rotate2{-webkit-animation-delay:.6s;animation-delay:.6s;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.bk-spin .bk-spin-rotation .rotate3{-webkit-animation-delay:.75s;animation-delay:.75s;-webkit-transform:rotate(0deg);transform:rotate(0deg)}.bk-spin .bk-spin-rotation .rotate4{-webkit-animation-delay:.9s;animation-delay:.9s;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.bk-spin .bk-spin-rotation .rotate5{-webkit-animation-delay:1.05s;animation-delay:1.05s;-webkit-transform:rotate(90deg);transform:rotate(90deg)}.bk-spin .bk-spin-rotation .rotate6{-webkit-animation-delay:1.2s;animation-delay:1.2s;-webkit-transform:rotate(135deg);transform:rotate(135deg)}.bk-spin .bk-spin-rotation .rotate7{-webkit-animation-delay:1.35s;animation-delay:1.35s;-webkit-transform:rotate(180deg);transform:rotate(180deg)}.bk-spin .bk-spin-rotation .rotate8{-webkit-animation-delay:1.5s;animation-delay:1.5s;-webkit-transform:rotate(-135deg);transform:rotate(-135deg)}.bk-spin .bk-spin-rotation-flex{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-negative:0;flex-shrink:0}.bk-spin .bk-spin-rotation-margin{margin:0 auto}.bk-spin .bk-spin-rotation-large{width:69px;height:69px}.bk-spin .bk-spin-rotation-large .rotate{width:10px;height:14px;-webkit-transform-origin:50% -18px;transform-origin:50% -18px}.bk-spin .bk-spin-rotation-normal{width:49px;height:49px}.bk-spin .bk-spin-rotation-normal .rotate{width:6px;height:9px;-webkit-transform-origin:50% -13px;transform-origin:50% -13px}.bk-spin .bk-spin-rotation-small{width:27px;height:27px}.bk-spin .bk-spin-rotation-small .rotate{width:4px;height:5px;-webkit-transform-origin:50% -7px;transform-origin:50% -7px}.bk-spin .bk-spin-rotation-mini{width:16px;height:16px}.bk-spin .bk-spin-rotation-mini .rotate{width:2px;height:3px;-webkit-transform-origin:50% -4px;transform-origin:50% -4px}.bk-spin .bk-spin-icon{color:#3c96ff;font-size:16px;-webkit-animation:icon-loading 1.2s linear infinite;animation:icon-loading 1.2s linear infinite}.bk-spin .bk-spin-icon i{vertical-align:middle}.bk-spin .bk-spin-icon-wait{-webkit-animation:none;animation:none}.bk-spin .bk-spin-icon-default{color:#c4c6cc}.bk-spin .bk-spin-icon-primary{color:#3c96ff}.bk-spin .bk-spin-icon-success{color:#2dcb56}.bk-spin .bk-spin-icon-warning{color:#ffb848}.bk-spin .bk-spin-icon-danger{color:#ff5656}.bk-spin .bk-spin-icon-info{color:#979ba5}.bk-spin .bk-spin-icon-large i{font-size:69px}.bk-spin .bk-spin-icon-normal i{font-size:49px}.bk-spin .bk-spin-icon-small i{font-size:27px}.bk-spin .bk-spin-icon-nimi i{font-size:16px}.bk-spin .bk-spin-title{text-align:center;font-size:14px;color:#63656e;line-height:normal;max-width:100%}.bk-spin .bk-spin-title-right{display:inline-block;padding-left:8px}.bk-spin .bk-spin-title-bottom{margin-top:8px}.bk-spin .bk-spin-title-large{height:69px}.bk-spin .bk-spin-title-normal{height:49px}.bk-spin .bk-spin-title-small{height:27px}.bk-spin .bk-spin-title-mini{height:16px}.bk-spin .bk-display-flex{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}@-webkit-keyframes fadeDefault{0%{background-color:#c4c6cc}to{background-color:none}}@keyframes fadeDefault{0%{background-color:#c4c6cc}to{background-color:none}}@-webkit-keyframes fadePrimary{0%{background-color:#3c96ff}to{background-color:none}}@keyframes fadePrimary{0%{background-color:#3c96ff}to{background-color:none}}@-webkit-keyframes fadeSuccess{0%{background-color:#2dcb56}to{background-color:none}}@keyframes fadeSuccess{0%{background-color:#2dcb56}to{background-color:none}}@-webkit-keyframes fadeDanger{0%{background-color:#ff5656}to{background-color:none}}@keyframes fadeDanger{0%{background-color:#ff5656}to{background-color:none}}@-webkit-keyframes fadeWarning{0%{background-color:#ffb848}to{background-color:none}}@keyframes fadeWarning{0%{background-color:#ffb848}to{background-color:none}}@-webkit-keyframes fadeInfo{0%{background-color:#979ba5}to{background-color:none}}@keyframes fadeInfo{0%{background-color:#979ba5}to{background-color:none}}@-webkit-keyframes icon-loading{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes icon-loading{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}
/*# sourceMappingURL=spin.min.css.map */