bk-magic-vue/lib/ui/loading.min.css.map

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

{"version":3,"sources":["loading.css"],"names":[],"mappings":"AAOA,YACI,UAAW,CACX,WAAY,CACZ,iBAAkB,CAClB,KAAM,CACN,OAAQ,CACR,QAAS,CACT,MAAO,CACP,WAAY,CACZ,mCAA0C,CAC1C,WA4DJ,CA3DI,gCACI,iBAAkB,CAClB,aAAc,CACd,iBAAkB,CAClB,QAAS,CACT,OAAQ,CACR,8BAAgC,CAChC,sCACJ,CACA,kBACI,iBAAkB,CAClB,cAAe,CACf,aAAmB,CACnB,kBAAoB,CACpB,cACJ,CACA,yBACI,iBAAkB,CAClB,UAAW,CACX,WAAY,CACZ,WAAY,CACZ,oBAqCJ,CApCI,gCACI,iBAAkB,CAClB,KAAM,CACN,UAAW,CACX,WAAY,CACZ,oCAA6B,CAA7B,4BAA6B,CAC7B,8BAAuB,CAAvB,sBAAuB,CACvB,0CAAmC,CAAnC,kCAAmC,CACnC,kCAA2B,CAA3B,0BAA2B,CAC3B,2BAAoB,CAApB,mBAAoB,CACpB,kBACJ,CAEA,iCACI,wBAAyB,CACzB,MAAO,CACP,2BAAqB,CAArB,mBACJ,CAEA,iCACI,wBAAyB,CACzB,SAAU,CACV,4BAAsB,CAAtB,oBACJ,CAEA,iCACI,wBAAyB,CACzB,SAAU,CACV,2BAAqB,CAArB,mBACJ,CAEA,iCACI,wBAAyB,CACzB,SAAU,CACV,4BAAsB,CAAtB,oBACJ,CAOJ,uDACI,UAsBJ,CApBI,qEACI,SAAU,CACV,UACJ,CAEA,uEACI,MACJ,CAEA,uEACI,SACJ,CAEA,uEACI,SACJ,CAEA,uEACI,SACJ,CAGJ,yDACI,UAsBJ,CApBI,uEACI,UAAW,CACX,WACJ,CAEA,yEACI,MACJ,CAEA,yEACI,SACJ,CAEA,yEACI,SACJ,CAEA,yEACI,SACJ,CAIA,4PAII,kBACJ,CAIA,4QAII,kBACJ,CAIA,oQAII,kBACJ,CAIA,4QAII,kBACJ,CAGA,4QAII,kBACJ,CAIR,yBACI,GACI,0BAAmB,CAAnB,kBACJ,CAEA,GACI,2BAAoB,CAApB,mBACJ,CACJ,CAEA,iCACI,GACI,0BACJ,CAEA,GACI,2BACJ,CACJ,CAEA,8BAEI,UAAW,CACX,WAAY,CACZ,iBAAkB,CAClB,WAAY,CACZ,oBAAoB,CACpB,qBAAsB,CACtB,mBAAa,CAAb,mBAAa,CAAb,YAAa,CACb,uBAAuB,CAAvB,oBAAuB,CAAvB,sBAuGJ,CAtGI,8CACI,iBAAkB,CAKlB,SAAU,CACV,UAAW,CACX,iCAA0B,CAA1B,yBAA0B,CAC1B,iBAAkB,CAClB,2BAAqB,CAArB,mBAAqB,CACrB,2BAAoB,CAApB,mBAAoB,CACpB,+BAAwB,CAAxB,uBAAwB,CACxB,0CAAmC,CAAnC,kCAAmC,CACnC,kCAA2B,CAA3B,0BACJ,CAEI,8FAEI,kCAA2B,CAA3B,0BACJ,CAGA,4FAEI,iCAA0B,CAA1B,yBACJ,CAGA,8FAEI,kCAA2B,CAA3B,0BACJ,CAGA,8FAEI,kCAA2B,CAA3B,0BACJ,CAIA,0FAEI,gCAAyB,CAAzB,wBACJ,CAGJ,gDA5PA,4BAAsB,CAAtB,oBAAsB,CACtB,gCAAuB,CAAvB,wBA6PA,CACA,gDA/PA,2BAAsB,CAAtB,mBAAsB,CACtB,gCAAuB,CAAvB,wBAgQA,CACA,gDAlQA,4BAAsB,CAAtB,oBAAsB,CACtB,8BAAuB,CAAvB,sBAmQA,CACA,gDArQA,2BAAsB,CAAtB,mBAAsB,CACtB,+BAAuB,CAAvB,uBAsQA,CACA,gDAxQA,6BAAsB,CAAtB,qBAAsB,CACtB,+BAAuB,CAAvB,uBAyQA,CACA,gDA3QA,4BAAsB,CAAtB,oBAAsB,CACtB,gCAAuB,CAAvB,wBA4QA,CACA,gDA9QA,6BAAsB,CAAtB,qBAAsB,CACtB,gCAAuB,CAAvB,wBA+QA,CACA,gDAjRA,4BAAsB,CAAtB,oBAAsB,CACtB,iCAAuB,CAAvB,yBAkRA,CACA,0EACI,UAAW,CACX,WAOJ,CANI,0FACI,UAAW,CACX,WAAY,CACZ,kBAAmB,CACnB,iCAA0B,CAA1B,yBACJ,CAEJ,0EACI,UAAW,CACX,WAOJ,CANI,0FACI,SAAU,CACV,UAAW,CACX,iBAAkB,CAClB,iCAA0B,CAA1B,yBACJ,CAEJ,wEACI,UAAW,CACX,WAOJ,CANI,wFACI,SAAU,CACV,UAAW,CACX,iBAAkB,CAClB,gCAAyB,CAAzB,wBACJ,CAaR,wBACI,GACI,wBACJ,CAEA,GACI,4BACJ,CACJ,CAYA,+BACI,GACI,wBACJ,CAEA,GACI,4BACJ,CACJ,CAYA,+BACI,GACI,wBACJ,CAEA,GACI,4BACJ,CACJ,CAYA,8BACI,GACI,wBACJ,CAEA,GACI,4BACJ,CACJ,CAYA,+BACI,GACI,wBACJ,CAEA,GACI,4BACJ,CACJ,CAYA,6BACI,GACI,qBACJ,CAEA,GACI,4BACJ,CACJ,CAGA,4BAEI,UAAW,CACX,WAAY,CACZ,iBAAkB,CAClB,KAAM,CACN,OAAQ,CACR,QAAS,CACT,MAAO,CACP,WAAY,CACZ,mCAA0C,CAC1C,WAgBJ,CAfI,oEACI,iBAAkB,CAClB,aAAc,CACd,iBAAkB,CAClB,QAAS,CACT,OAAQ,CACR,sCAAgC,CAAhC,8BACJ,CACA,wCACI,iBAAkB,CAClB,cAAe,CACf,aAAmB,CACnB,kBAAoB,CACpB,cACJ,CAGJ,gBACI,GACI,wBACJ,CAEA,GACI,4BACJ,CACJ,CAEA,uBACI,GACI,wBACJ,CAEA,GACI,4BACJ,CACJ,CAEA,uBACI,GACI,wBACJ,CAEA,GACI,4BACJ,CACJ,CAEA,sBACI,GACI,wBACJ,CAEA,GACI,4BACJ,CACJ,CAEA,uBACI,GACI,wBACJ,CAEA,GACI,4BACJ,CACJ,CAEA,qBACI,GACI,qBACJ,CAEA,GACI,4BACJ,CACJ,CAEA,2BACI,GACI,2BAAmB,CAAnB,mBACJ,CAEA,GACI,2BAAmB,CAAnB,mBACJ,CACJ,CARA,mBACI,GACI,2BAAmB,CAAnB,mBACJ,CAEA,GACI,2BAAmB,CAAnB,mBACJ,CACJ,CAEA,oBACI,oBAoBJ,CAnBI,wCACI,0BAAoB,CAApB,0BAAoB,CAApB,mBAAoB,CACpB,2BAAsB,CAAtB,4BAAsB,CAAtB,yBAAsB,CAAtB,qBAAsB,CACtB,wBAAmB,CAAnB,qBAAmB,CAAnB,kBAAmB,CACnB,uBAAuB,CAAvB,oBAAuB,CAAvB,sBAAuB,CACvB,iBAAkB,CAClB,UAAW,CACX,WAAY,CACZ,UAAW,CACX,KAAM,CACN,eAAgB,CAChB,uBAAwB,CACxB,kBAAmB,CACnB,aAKJ,CAHI,qDACI,YACF","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}\n\n/* 加载动画一，点状 */\n.bk-dot-loading,\n.bk-loading1 {\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@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: 48px;\n    height: 48px;\n    position: relative;\n    margin: auto;\n    display:inline-block;\n    vertical-align: middle;\n    display: flex;\n    justify-content: center;\n    .rotate {\n        position: absolute;\n        /* top: 77%; */\n        /* right: 43%; */\n        /* background-color: transparent; */\n        /* background-color: #39424e\\9\\0; */\n        width: 6px;\n        height: 8px;\n        transform-origin: 50% 24px;\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; */\n            animation-name: fadeSuccess;\n        }\n    }\n    &.bk-spin-loading-danger {\n        .rotate {\n            /* background:  #ff5656; */\n            animation-name: fadeDanger;\n        }\n    }\n    &.bk-spin-loading-warning {\n        .rotate {\n            /* background: #ffb400; */\n            animation-name: fadeWarning;\n        }\n    }\n    &.bk-spin-loading-primary {\n        .rotate {\n            /* background-color: #3c96ff; */\n            animation-name: fadePrimary;\n        }\n    }\n\n    &.bk-spin-loading-white {\n        .rotate {\n            /* background: #fff; */\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: 68px;\n        height: 68px;\n        .rotate {\n            width: 10px;\n            height: 12px;\n            border-radius: 12px;\n            transform-origin: 50% 34px;\n        }\n    }\n    &.bk-spin-loading-small {\n        width: 32px;\n        height: 32px;\n        .rotate {\n            width: 4px;\n            height: 5px;\n            border-radius: 5px;\n            transform-origin: 50% 16px;\n        }\n    }\n    &.bk-spin-loading-mini {\n        width: 16px;\n        height: 16px;\n        .rotate {\n            width: 2px;\n            height: 3px;\n            border-radius: 3px;\n            transform-origin: 50% 8px;\n        }\n    }\n}\n\n@keyframes fade {\n    0% {\n        background-color: #39424e;\n    }\n\n    100% {\n        background-color: transparent;\n    }\n}\n@-webkit-keyframes fade {\n    0% {\n        background-color: #39424e;\n    }\n\n    100% {\n        background-color: transparent;\n    }\n}\n\n@keyframes fadeSuccess {\n    0% {\n        background-color: $successColor;\n    }\n\n    100% {\n        background-color: transparent;\n    }\n}\n\n@-webkit-keyframes fadeSuccess {\n    0% {\n        background-color: $successColor;\n    }\n\n    100% {\n        background-color: transparent;\n    }\n}\n\n@keyframes fadePrimary {\n    0% {\n        background-color: $primaryColor;\n    }\n\n    100% {\n        background-color: transparent;\n    }\n}\n\n@-webkit-keyframes fadePrimary {\n    0% {\n        background-color: $primaryColor;\n    }\n\n    100% {\n        background-color: transparent;\n    }\n}\n\n@keyframes fadeDanger {\n    0% {\n        background-color: $dangerColor;\n    }\n\n    100% {\n        background-color: transparent;\n    }\n}\n\n@-webkit-keyframes fadeDanger {\n    0% {\n        background-color: $dangerColor;\n    }\n\n    100% {\n        background-color: transparent;\n    }\n}\n\n@keyframes fadeWarning {\n    0% {\n        background-color: $warningColor;\n    }\n\n    100% {\n        background-color: transparent;\n    }\n}\n\n@-webkit-keyframes fadeWarning {\n    0% {\n        background-color: $warningColor;\n    }\n\n    100% {\n        background-color: transparent;\n    }\n}\n\n@keyframes fadeWhite {\n    0% {\n        background-color: rgb(255, 255, 255);\n    }\n\n    100% {\n        background-color: transparent;\n    }\n}\n\n@-webkit-keyframes fadeWhite {\n    0%{\n        background-color: rgb(255, 255, 255);\n    }\n\n    100%{\n        background-color: transparent;\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: transparent;\n    }\n}\n\n@keyframes fadeSuccess {\n    0% {\n        background-color: #30d878;\n    }\n\n    100% {\n        background-color: transparent;\n    }\n}\n\n@keyframes fadePrimary {\n    0% {\n        background-color: #3c96ff;\n    }\n\n    100% {\n        background-color: transparent;\n    }\n}\n\n@keyframes fadeDanger {\n    0% {\n        background-color: #ff5656;\n    }\n\n    100% {\n        background-color: transparent;\n    }\n}\n\n@keyframes fadeWarning {\n    0% {\n        background-color: #ffb400;\n    }\n\n    100% {\n        background-color: transparent;\n    }\n}\n\n@keyframes fadeWhite {\n    0% {\n        background-color: white;\n    }\n\n    100% {\n        background-color: transparent;\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}\n"]}