@cw-devops/bk-magic-vue
Version:
基于蓝鲸 Magicbox 和 Vue 的前端组件库
1 lines • 18.6 kB
Source Map (JSON)
{"version":3,"sources":["loading.css"],"names":[],"mappings":"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","file":"loading.min.css","sourcesContent":["@import './variable.css';\n\n@define-mixin create-rotate $time, $deg {\n animation-delay: $time;\n transform: rotate($deg);\n}\n\n.bk-loading {\n width: 100%;\n height: 100%;\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n margin: auto;\n background-color: rgba(255, 255, 255, 0.9);\n z-index: $loadingZIndex;\n .bk-loading-wrapper {\n text-align: center;\n line-height: 1;\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n -webkit-transform: translate(-50%, -50%);\n }\n &-title {\n text-align: center;\n font-size: 14px;\n color: $fnMainColor;\n line-height: initial;\n margin-top: 5px;\n }\n .bk-loading1 {\n position: relative;\n width: 75px;\n height: 14px;\n margin: auto;\n display: inline-block;\n .point {\n position: absolute;\n top: 0;\n width: 14px;\n height: 14px;\n animation-name: scale-animate;\n animation-duration: .8s;\n animation-iteration-count: infinite;\n animation-direction: normal;\n transform: scale(.6);\n border-radius: 19px;\n }\n\n .point1 {\n background-color: #fd6154;\n left: 0;\n animation-delay: 0.1s;\n }\n\n .point2 {\n background-color: #ffb726;\n left: 20px;\n animation-delay: 0.25s;\n }\n\n .point3 {\n background-color: #4cd084;\n left: 40px;\n animation-delay: 0.4s;\n }\n\n .point4 {\n background-color: #57a3f1;\n left: 60px;\n animation-delay: 0.55s;\n }\n\n &.bk-black {\n .point1,\n .point2,\n .point3,\n .point4{\n background: #979ba5;\n }\n }\n }\n}\n\n/* 加载动画一,点状 */\n.bk-dot-loading,\n.bk-loading1 {\n position: relative;\n width: 75px;\n height: 14px;\n margin: auto;\n display: inline-block;\n .point {\n position: absolute;\n top: 0;\n width: 14px;\n height: 14px;\n animation-name: scale-animate;\n animation-duration: .8s;\n animation-iteration-count: infinite;\n animation-direction: normal;\n transform: scale(.6);\n border-radius: 19px;\n }\n\n .point1 {\n background-color: #fd6154;\n left: 0;\n animation-delay: 0.1s;\n }\n\n .point2 {\n background-color: #ffb726;\n left: 20px;\n animation-delay: 0.25s;\n }\n\n .point3 {\n background-color: #4cd084;\n left: 40px;\n animation-delay: 0.4s;\n }\n\n .point4 {\n background-color: #57a3f1;\n left: 60px;\n animation-delay: 0.55s;\n }\n\n &.bk-size-mini {\n width: 30px;\n\n .point {\n width: 6px;\n height: 6px;\n }\n\n .point1 {\n left: 0;\n }\n\n .point2 {\n left: 10px;\n }\n\n .point3 {\n left: 20px;\n }\n\n .point4 {\n left: 30px;\n }\n }\n\n &.bk-size-small {\n width: 45px;\n\n .point {\n width: 10px;\n height: 10px;\n }\n\n .point1 {\n left: 0;\n }\n\n .point2 {\n left: 15px;\n }\n\n .point3 {\n left: 30px;\n }\n\n .point4 {\n left: 45px;\n }\n }\n\n &.bk-black {\n .point1,\n .point2,\n .point3,\n .point4 {\n background: #979ba5;\n }\n }\n\n &.bk-primary {\n .point1,\n .point2,\n .point3,\n .point4 {\n background: $primaryColor;\n }\n }\n\n &.bk-danger {\n .point1,\n .point2,\n .point3,\n .point4 {\n background: $dangerColor;\n }\n }\n\n &.bk-warning {\n .point1,\n .point2,\n .point3,\n .point4 {\n background: $warningColor;\n }\n }\n &.bk-default {\n .point1,\n .point2,\n .point3,\n .point4 {\n background: #979BA5;\n }\n }\n}\n\n.bk-spin-loading,\n.bk-loading2 {\n width: 39px;\n height: 39px;\n position: relative;\n margin: auto;\n display: inline-block;\n vertical-align: middle;\n}\n\n.bk-spin-loading .rotate,\n.bk-loading2 .rotate {\n position: absolute;\n top: 77%;\n right: 43%;\n background-color: none;\n background-color: #39424e\\9\\0;\n width: 6px;\n height: 8px;\n transform-origin: 50% -10px;\n border-radius: 8px;\n transform: scale(0.4);\n animation-name: fade;\n animation-duration: 1.2s;\n animation-iteration-count: infinite;\n animation-direction: normal;\n}\n\n.bk-spin-loading.bk-spin-loading-success .rotate,\n.bk-loading2.bk-spin-loading-success .rotate {\n background: #30d878\\9\\0;\n animation-name: fadeSuccess;\n}\n\n.bk-spin-loading.bk-spin-loading-danger .rotate,\n.bk-loading2.bk-spin-loading-danger .rotate {\n background: #ff5656\\9\\0;\n animation-name: fadeDanger;\n}\n\n.bk-spin-loading.bk-spin-loading-warning .rotate,\n.bk-loading2.bk-spin-loading-warning .rotate {\n background: #ffb400\\9\\0;\n animation-name: fadeWarning;\n}\n\n.bk-spin-loading.bk-spin-loading-primary .rotate,\n.bk-loading2.bk-spin-loading-primary .rotate {\n background: #3c96ff\\9\\0;\n animation-name: fadePrimary;\n}\n\n.bk-spin-loading.bk-spin-loading-white .rotate,\n.bk-loading2.bk-spin-loading-white .rotate {\n background: #fff\\9\\0;\n animation-name: fadeWhite;\n}\n\n.bk-spin-loading .rotate1,\n.bk-loading2 .rotate1 {\n animation-delay: 0.45s;\n transform: rotate(-90deg);\n}\n\n.bk-spin-loading .rotate2,\n.bk-loading2 .rotate2 {\n animation-delay: 0.6s;\n transform: rotate(-45deg);\n}\n\n.bk-spin-loading .rotate3,\n.bk-loading2 .rotate3 {\n animation-delay: 0.75s;\n transform: rotate(0deg);\n}\n\n.bk-spin-loading .rotate4,\n.bk-loading2 .rotate4 {\n animation-delay: 0.9s;\n transform: rotate(45deg);\n}\n\n.bk-spin-loading .rotate5,\n.bk-loading2 .rotate5 {\n animation-delay: 1.05s;\n transform: rotate(90deg);\n}\n\n.bk-spin-loading .rotate6,\n.bk-loading2 .rotate6 {\n animation-delay: 1.2s;\n transform: rotate(135deg);\n}\n\n.bk-spin-loading .rotate7,\n.bk-loading2 .rotate7 {\n animation-delay: 1.35s;\n transform: rotate(180deg);\n}\n\n.bk-spin-loading .rotate8,\n.bk-loading2 .rotate8 {\n animation-delay: 1.5s;\n transform: rotate(-135deg);\n}\n\n.bk-spin-loading.bk-spin-loading-large,\n.bk-loading2.bk-spin-loading-large {\n width: 69px;\n height: 69px;\n}\n\n.bk-spin-loading.bk-spin-loading-large .rotate,\n.bk-loading2.bk-spin-loading-large .rotate {\n width: 10px;\n height: 14px;\n transform-origin: 50% -18px;\n}\n\n.bk-spin-loading.bk-spin-loading-small,\n.bk-loading2.bk-spin-loading-small {\n width: 27px;\n height: 27px;\n}\n\n.bk-spin-loading.bk-spin-loading-small .rotate,\n.bk-loading2.bk-spin-loading-small .rotate {\n width: 4px;\n height: 5px;\n transform-origin: 50% -7px;\n}\n\n.bk-spin-loading.bk-spin-loading-mini,\n.bk-loading2.bk-spin-loading-mini {\n width: 16px;\n height: 16px;\n}\n\n.bk-spin-loading.bk-spin-loading-mini .rotate,\n.bk-loading2.bk-spin-loading-mini .rotate {\n width: 2px;\n height: 3px;\n transform-origin: 50% -4px;\n}\n\n@keyframes scale-animate {\n 0% {\n transform: scale(1);\n }\n\n 100% {\n transform: scale(.6);\n }\n}\n\n@-webkit-keyframes scale-animate {\n 0% {\n -webkit-transform: scale(1);\n }\n\n 100% {\n -webkit-transform: scale(.6);\n }\n}\n\n.bk-spin-loading,\n.bk-loading2 {\n width: 39px;\n height: 39px;\n position: relative;\n margin: auto;\n display:inline-block;\n vertical-align: middle;\n .rotate {\n position: absolute;\n top: 77%;\n right: 43%;\n background-color: none;\n background-color: #39424e\\9\\0;\n width: 6px;\n height: 8px;\n transform-origin: 50% -10px;\n border-radius: 8px;\n transform: scale(0.4);\n animation-name: fade;\n animation-duration: 1.2s;\n animation-iteration-count: infinite;\n animation-direction: normal;\n }\n &.bk-spin-loading-success {\n .rotate {\n background: #30d878\\9\\0;\n animation-name: fadeSuccess;\n }\n }\n &.bk-spin-loading-danger {\n .rotate {\n background: #ff5656\\9\\0;\n animation-name: fadeDanger;\n }\n }\n &.bk-spin-loading-warning {\n .rotate {\n background: #ffb400\\9\\0;\n animation-name: fadeWarning;\n }\n }\n &.bk-spin-loading-primary {\n .rotate {\n background: #3c96ff\\9\\0;\n animation-name: fadePrimary;\n }\n }\n\n &.bk-spin-loading-white {\n .rotate {\n background: #fff\\9\\0;\n animation-name: fadeWhite;\n }\n }\n\n .rotate1 {\n @mixin create-rotate 0.45s, -90deg;\n }\n .rotate2 {\n @mixin create-rotate 0.6s, -45deg;\n }\n .rotate3 {\n @mixin create-rotate 0.75s, 0deg;\n }\n .rotate4 {\n @mixin create-rotate 0.9s, 45deg;\n }\n .rotate5 {\n @mixin create-rotate 1.05s, 90deg;\n }\n .rotate6 {\n @mixin create-rotate 1.2s, 135deg;\n }\n .rotate7 {\n @mixin create-rotate 1.35s, 180deg;\n }\n .rotate8 {\n @mixin create-rotate 1.5s, -135deg;\n }\n &.bk-spin-loading-large {\n width: 69px;\n height: 69px;\n .rotate {\n width: 10px;\n height: 14px;\n transform-origin: 50% -18px;\n }\n }\n &.bk-spin-loading-small {\n width: 27px;\n height: 27px;\n .rotate {\n width: 4px;\n height: 5px;\n transform-origin: 50% -7px;\n }\n }\n &.bk-spin-loading-mini {\n width: 16px;\n height: 16px;\n .rotate {\n width: 2px;\n height: 3px;\n transform-origin: 50% -4px;\n }\n }\n}\n\n@keyframes fade {\n 0% {\n background-color: #39424e;\n }\n\n 100% {\n background-color: none;\n }\n}\n@-webkit-keyframes fade {\n 0% {\n background-color: #39424e;\n }\n\n 100% {\n background-color: none;\n }\n}\n\n@keyframes fadeSuccess {\n 0% {\n background-color: $successColor;\n }\n\n 100% {\n background-color: none;\n }\n}\n\n@-webkit-keyframes fadeSuccess {\n 0% {\n background-color: $successColor;\n }\n\n 100% {\n background-color: none;\n }\n}\n\n@keyframes fadePrimary {\n 0% {\n background-color: $primaryColor;\n }\n\n 100% {\n background-color: none;\n }\n}\n\n@-webkit-keyframes fadePrimary {\n 0% {\n background-color: $primaryColor;\n }\n\n 100% {\n background-color: none;\n }\n}\n\n@keyframes fadeDanger {\n 0% {\n background-color: $dangerColor;\n }\n\n 100% {\n background-color: none;\n }\n}\n\n@-webkit-keyframes fadeDanger {\n 0% {\n background-color: $dangerColor;\n }\n\n 100% {\n background-color: none;\n }\n}\n\n@keyframes fadeWarning {\n 0% {\n background-color: $warningColor;\n }\n\n 100% {\n background-color: none;\n }\n}\n\n@-webkit-keyframes fadeWarning {\n 0% {\n background-color: $warningColor;\n }\n\n 100% {\n background-color: none;\n }\n}\n\n@keyframes fadeWhite {\n 0% {\n background-color: rgb(255, 255, 255);\n }\n\n 100% {\n background-color: none;\n }\n}\n\n@-webkit-keyframes fadeWhite {\n 0%{\n background-color: rgb(255, 255, 255);\n }\n\n 100%{\n background-color: none;\n }\n}\n\n/* 加载动画容器,.bk-loading 保留,为了兼容 */\n.bk-loading-box,\n.bk-loading {\n width: 100%;\n height: 100%;\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n margin: auto;\n background-color: rgba(255, 255, 255, 0.9);\n z-index: $loadingZIndex;\n .bk-loading-wrapper {\n text-align: center;\n line-height: 1;\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n }\n &-title {\n text-align: center;\n font-size: 14px;\n color: $fnMainColor;\n line-height: initial;\n margin-top: 5px;\n }\n}\n\n@keyframes fade {\n 0% {\n background-color: #39424e;\n }\n\n 100% {\n background-color: none;\n }\n}\n\n@keyframes fadeSuccess {\n 0% {\n background-color: #30d878;\n }\n\n 100% {\n background-color: none;\n }\n}\n\n@keyframes fadePrimary {\n 0% {\n background-color: #3c96ff;\n }\n\n 100% {\n background-color: none;\n }\n}\n\n@keyframes fadeDanger {\n 0% {\n background-color: #ff5656;\n }\n\n 100% {\n background-color: none;\n }\n}\n\n@keyframes fadeWarning {\n 0% {\n background-color: #ffb400;\n }\n\n 100% {\n background-color: none;\n }\n}\n\n@keyframes fadeWhite {\n 0% {\n background-color: white;\n }\n\n 100% {\n background-color: none;\n }\n}\n\n@keyframes animate {\n 0% {\n transform: scale(.5)\n }\n\n 100% {\n transform: scale(.3)\n }\n}\n\n.bk-default-loading {\n display: inline-block;\n .bk-loading-wrapper {\n display: inline-flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n position: absolute;\n width: 100%;\n height: 100%;\n left: unset;\n top: 0;\n transform: unset;\n -webkit-transform: unset;\n background: inherit;\n padding: 0 25%;\n\n & :nth-child(1) {\n margin: unset;\n }\n }\n}"]}