bk-magic-vue 2.4.0 → 2.4.1

package/lib/ui/image-viewer.css

@@ -14,6 +14,14 @@
                 flex-direction:column;
     }
 
+.bk-image-viewer-mask{
+        position:absolute;
+        top:0;
+        right:0;
+        bottom:0;
+        left:0;
+    }
+
 .bk-image-viewer-header{
         position:absolute;
         top:0;
@@ -30,9 +38,7 @@
         -webkit-box-align:center;
             -ms-flex-align:center;
                 align-items:center;
-        padding:0 13px 0 25px;
-        background:rgba(0, 0, 0, .7);
-        color:#fff;
+        color:#c4c6cc;
     }
 
 .bk-image-viewer-header > div{
@@ -42,6 +48,8 @@
             overflow:hidden;
             white-space:nowrap;
             text-overflow:ellipsis;
+            font-size:14px;
+            padding:0 25px;
         }
 
 .bk-image-viewer-header .quit-box{
@@ -55,9 +63,6 @@
                 -ms-flex-pack:end;
                     justify-content:flex-end;
             height:100%;
-        }
-
-.bk-image-viewer-header .quit-tips{
             color:#979ba5;
         }
 
@@ -77,19 +82,25 @@
         opacity:.8;
         -webkit-box-sizing:border-box;
                 box-sizing:border-box;
-        color:#fff;
+        background-color:rgba(0, 0, 0, .3);
+        color:#DCDEE5;
         -webkit-user-select:none;
            -moz-user-select:none;
             -ms-user-select:none;
                 user-select:none
     }
 
+.bk-image-viewer-btn:hover{
+            background-color:rgba(0, 0, 0, .4);
+            color:#fff;
+        }
+
 .bk-image-viewer-close{
-        width:40px;
-        height:40px;
-        line-height:38px;
+        width:80px;
+        height:80px;
+        line-height:80px;
         text-align:center;
-        font-size:32px;
+        font-size:50px;
         color:#fff;
         cursor:pointer;
     }
@@ -134,15 +145,19 @@
         padding:0 23px;
         background-color:rgba(0,0,0,0.4);
         border-color:#fff;
-        border-radius:22px;
+        border-radius:22px
     }
 
+.bk-image-viewer-actions:hover{
+            background:rgba(0,0,0,.5);
+        }
+
 .bk-image-viewer-actions-inner{
             width:100%;
             height:100%;
             text-align:justify;
             font-size:23px;
-            color:#fff;
+            color:#c4c6cc;
             display:-webkit-box;
             display:-ms-flexbox;
             display:flex;
@@ -151,18 +166,24 @@
                     align-items:center;
             -ms-flex-pack:distribute;
                 justify-content:space-around;
-            cursor:pointer;
+
         }
 
+.bk-image-viewer-actions-inner .bk-icon{
+                cursor:pointer
+            }
+
+.bk-image-viewer-actions-inner .bk-icon:hover{
+                    color:#fff;
+                }
+
 .bk-image-viewer-next, .bk-image-viewer-prev{
         top:50%;
         width:80px;
         height:80px;
         font-size:40px;
-        color:#fff;
-        background-color:rgba(0,0,0,0.4);
-        border-color:#fff;
         cursor:pointer;
+    //background:rgb(76,76,76);
     }
 
 .bk-image-viewer-prev{

package/lib/ui/image-viewer.min.css

@@ -1,2 +1,2 @@
-.bk-image-viewer-wrapper{position:fixed;right:0;bottom:0;background:rgba(0,0,0,.6);-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.bk-image-viewer-header,.bk-image-viewer-wrapper{top:0;left:0;display:-webkit-box;display:-ms-flexbox;display:flex}.bk-image-viewer-header{position:absolute;z-index:9;width:100%;height:52px;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:0 13px 0 25px;background:rgba(0,0,0,.7);color:#fff}.bk-image-viewer-header>div{-webkit-box-flex:1;-ms-flex:1;flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.bk-image-viewer-header .quit-box{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;height:100%}.bk-image-viewer-header .quit-tips{color:#979ba5}.bk-image-viewer-btn{position:absolute;z-index:1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;border-radius:50%;opacity:.8;-webkit-box-sizing:border-box;box-sizing:border-box;color:#fff;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.bk-image-viewer-close{width:40px;height:40px;line-height:38px;text-align:center;font-size:32px;color:#fff;cursor:pointer}.bk-image-viewer-canvas{width:100%;height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.bk-image-viewer-has-header{padding-top:52px}.bk-image-viewer-error{text-align:center;font-size:14px;color:#313238}.bk-image-viewer-error .bk-icon{font-size:85px;line-height:1;margin-bottom:15px}.bk-image-viewer-actions{left:50%;bottom:30px;-webkit-transform:translateX(-50%);transform:translateX(-50%);width:282px;height:44px;padding:0 23px;background-color:rgba(0,0,0,.4);border-color:#fff;border-radius:22px}.bk-image-viewer-actions-inner{width:100%;height:100%;text-align:justify;font-size:23px;color:#fff;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-pack:distribute;justify-content:space-around;cursor:pointer}.bk-image-viewer-next,.bk-image-viewer-prev{top:50%;width:80px;height:80px;font-size:40px;color:#fff;background-color:rgba(0,0,0,.4);border-color:#fff;cursor:pointer}.bk-image-viewer-prev{left:40px}.bk-image-viewer-next,.bk-image-viewer-prev{-webkit-transform:translateY(-50%);transform:translateY(-50%)}.bk-image-viewer-next{right:40px;text-indent:2px}
+.bk-image-viewer-wrapper{position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0,.6);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.bk-image-viewer-mask{position:absolute;top:0;right:0;bottom:0;left:0}.bk-image-viewer-header{position:absolute;top:0;left:0;z-index:9;width:100%;height:52px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:#c4c6cc}.bk-image-viewer-header>div{-webkit-box-flex:1;-ms-flex:1;flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:14px;padding:0 25px}.bk-image-viewer-header .quit-box{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;height:100%;color:#979ba5}.bk-image-viewer-btn,.bk-image-viewer-header .quit-box{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.bk-image-viewer-btn{position:absolute;z-index:1;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;border-radius:50%;opacity:.8;-webkit-box-sizing:border-box;box-sizing:border-box;background-color:rgba(0,0,0,.3);color:#dcdee5;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.bk-image-viewer-btn:hover{background-color:rgba(0,0,0,.4);color:#fff}.bk-image-viewer-close{width:80px;height:80px;line-height:80px;text-align:center;font-size:50px;color:#fff;cursor:pointer}.bk-image-viewer-canvas{width:100%;height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.bk-image-viewer-has-header{padding-top:52px}.bk-image-viewer-error{text-align:center;font-size:14px;color:#313238}.bk-image-viewer-error .bk-icon{font-size:85px;line-height:1;margin-bottom:15px}.bk-image-viewer-actions{left:50%;bottom:30px;-webkit-transform:translateX(-50%);transform:translateX(-50%);width:282px;height:44px;padding:0 23px;background-color:rgba(0,0,0,.4);border-color:#fff;border-radius:22px}.bk-image-viewer-actions:hover{background:rgba(0,0,0,.5)}.bk-image-viewer-actions-inner{width:100%;height:100%;text-align:justify;font-size:23px;color:#c4c6cc;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-pack:distribute;justify-content:space-around}.bk-image-viewer-actions-inner .bk-icon{cursor:pointer}.bk-image-viewer-actions-inner .bk-icon:hover{color:#fff}.bk-image-viewer-next,.bk-image-viewer-prev{top:50%;width:80px;height:80px;font-size:40px;cursor:pointer;//background:#4c4c4c}.bk-image-viewer-prev{left:40px}.bk-image-viewer-next,.bk-image-viewer-prev{-webkit-transform:translateY(-50%);transform:translateY(-50%)}.bk-image-viewer-next{right:40px;text-indent:2px}
 /*# sourceMappingURL=image-viewer.min.css.map */

package/lib/ui/image-viewer.min.css.map

@@ -1 +1 @@
-{"version":3,"sources":["image-viewer.css"],"names":[],"mappings":"AAGI,yBACI,cAAe,CAEf,OAAQ,CACR,QAAS,CAET,yBAA6B,CAE7B,2BAAsB,CAAtB,4BAAsB,CAAtB,yBAAsB,CAAtB,qBACJ,CAEA,iDATI,KAAM,CAGN,MAAO,CAEP,mBAAa,CAAb,mBAAa,CAAb,YAmCJ,CA/BA,wBACI,iBAAkB,CAGlB,SAAU,CACV,UAAW,CACX,WAAY,CAEZ,wBAA8B,CAA9B,qBAA8B,CAA9B,6BAA8B,CAC9B,wBAAmB,CAAnB,qBAAmB,CAAnB,kBAAmB,CACnB,qBAAsB,CACtB,yBAA6B,CAC7B,UAmBJ,CAjBI,4BACI,kBAAO,CAAP,UAAO,CAAP,MAAO,CACP,eAAgB,CAChB,kBAAmB,CACnB,sBACJ,CAEA,kCACI,mBAAa,CAAb,mBAAa,CAAb,YAAa,CACb,wBAAmB,CAAnB,qBAAmB,CAAnB,kBAAmB,CACnB,oBAAyB,CAAzB,iBAAyB,CAAzB,wBAAyB,CACzB,WACJ,CAEA,mCACI,aACJ,CAGJ,qBACI,iBAAkB,CAClB,SAAU,CACV,mBAAa,CAAb,mBAAa,CAAb,YAAa,CACb,wBAAmB,CAAnB,qBAAmB,CAAnB,kBAAmB,CACnB,uBAAuB,CAAvB,oBAAuB,CAAvB,sBAAuB,CACvB,iBAAkB,CAClB,UAAW,CACX,6BAAsB,CAAtB,qBAAsB,CACtB,UAAyB,CACzB,wBAAgB,CAAhB,qBAAgB,CAAhB,oBAAgB,CAAhB,gBACJ,CAEA,uBACI,UAAW,CACX,WAAY,CACZ,gBAAiB,CACjB,iBAAkB,CAClB,cAAe,CACf,UAAyB,CACzB,cACJ,CAEA,wBACI,UAAW,CACX,WAAY,CACZ,mBAAa,CAAb,mBAAa,CAAb,YAAa,CACb,uBAAuB,CAAvB,oBAAuB,CAAvB,sBAAuB,CACvB,wBAAkB,CAAlB,qBAAkB,CAAlB,kBACJ,CAEA,4BACI,gBACJ,CAEA,uBACI,iBAAkB,CAClB,cAAe,CACf,aAOJ,CALI,gCACI,cAAe,CACf,aAAc,CACd,kBACJ,CAGJ,yBACI,QAAS,CACT,WAAY,CACZ,kCAA2B,CAA3B,0BAA2B,CAC3B,WAAY,CACZ,WAAY,CACZ,cAAe,CACf,+BAAiC,CACjC,iBAAgC,CAChC,kBAaJ,CAXI,+BACI,UAAW,CACX,WAAY,CACZ,kBAAmB,CACnB,cAAe,CACf,UAAyB,CACzB,mBAAa,CAAb,mBAAa,CAAb,YAAa,CACb,wBAAmB,CAAnB,qBAAmB,CAAnB,kBAAmB,CACnB,wBAA6B,CAA7B,4BAA6B,CAC7B,cACJ,CAGJ,4CACI,OAAQ,CACR,UAAW,CACX,WAAY,CACZ,cAAe,CACf,UAAyB,CACzB,+BAAiC,CACjC,iBAAgC,CAChC,cACJ,CAEA,sBAGI,SACJ,CAEA,4CALI,kCAAmC,CACnC,0BASJ,CALA,sBAGI,UAAW,CACX,eACJ","file":"image-viewer.min.css","sourcesContent":["@import './variable.css';\n\n.bk-image-viewer {\n    &-wrapper {\n        position: fixed;\n        top: 0;\n        right: 0;\n        bottom: 0;\n        left: 0;\n        background: rgba(0, 0, 0, .6);\n        display: flex;\n        flex-direction: column;\n    }\n\n    &-header {\n        position: absolute;\n        top: 0;\n        left: 0;\n        z-index: 9;\n        width: 100%;\n        height: 52px;\n        display: flex;\n        justify-content: space-between;\n        align-items: center;\n        padding: 0 13px 0 25px;\n        background: rgba(0, 0, 0, .7);\n        color: $defaultColor;\n\n        > div {\n            flex: 1;\n            overflow: hidden;\n            white-space: nowrap;\n            text-overflow: ellipsis;\n        }\n\n        .quit-box {\n            display: flex;\n            align-items: center;\n            justify-content: flex-end;\n            height: 100%;\n        }\n\n        .quit-tips {\n            color: $newBlackColor3;\n        }\n    }\n\n    &-btn {\n        position: absolute;\n        z-index: 1;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        border-radius: 50%;\n        opacity: .8;\n        box-sizing: border-box;\n        color: $defaultLightColor;\n        user-select: none\n    }\n\n    &-close {\n        width: 40px;\n        height: 40px;\n        line-height: 38px;\n        text-align: center;\n        font-size: 32px;\n        color: $defaultLightColor;\n        cursor: pointer;\n    }\n\n    &-canvas {\n        width: 100%;\n        height: 100%;\n        display: flex;\n        justify-content: center;\n        align-items: center\n    }\n\n    &-has-header {\n        padding-top: 52px;\n    }\n\n    &-error {\n        text-align: center;\n        font-size: 14px;\n        color: $newBlackColor1;\n\n        .bk-icon {\n            font-size: 85px;\n            line-height: 1;\n            margin-bottom: 15px;\n        }\n    }\n\n    &-actions {\n        left: 50%;\n        bottom: 30px;\n        transform: translateX(-50%);\n        width: 282px;\n        height: 44px;\n        padding: 0 23px;\n        background-color: $newBlackColor4;\n        border-color: $defaultLightColor;\n        border-radius: 22px;\n\n        &-inner {\n            width: 100%;\n            height: 100%;\n            text-align: justify;\n            font-size: 23px;\n            color: $defaultLightColor;\n            display: flex;\n            align-items: center;\n            justify-content: space-around;\n            cursor: pointer;\n        }\n    }\n\n    &-next, &-prev {\n        top: 50%;\n        width: 80px;\n        height: 80px;\n        font-size: 40px;\n        color: $defaultLightColor;\n        background-color: $newBlackColor4;\n        border-color: $defaultLightColor;\n        cursor: pointer;\n    }\n\n    &-prev {\n        -webkit-transform: translateY(-50%);\n        transform: translateY(-50%);\n        left: 40px\n    }\n\n    &-next {\n        -webkit-transform: translateY(-50%);\n        transform: translateY(-50%);\n        right: 40px;\n        text-indent: 2px\n    }\n}\n"]}
+{"version":3,"sources":["image-viewer.css"],"names":[],"mappings":"AAOI,yBACI,cAAe,CACf,KAAM,CACN,OAAQ,CACR,QAAS,CACT,MAAO,CACP,yBAA6B,CAC7B,mBAAa,CAAb,mBAAa,CAAb,YAAa,CACb,2BAAsB,CAAtB,4BAAsB,CAAtB,yBAAsB,CAAtB,qBACJ,CACA,sBACI,iBAAkB,CAClB,KAAM,CACN,OAAQ,CACR,QAAS,CACT,MACJ,CAEA,wBACI,iBAAkB,CAClB,KAAM,CACN,MAAO,CACP,SAAU,CACV,UAAW,CACX,WAAY,CACZ,mBAAa,CAAb,mBAAa,CAAb,YAAa,CACb,wBAA8B,CAA9B,qBAA8B,CAA9B,6BAA8B,CAC9B,wBAAmB,CAAnB,qBAAmB,CAAnB,kBAAmB,CACnB,aAkBJ,CAhBI,4BACI,kBAAO,CAAP,UAAO,CAAP,MAAO,CACP,eAAgB,CAChB,kBAAmB,CACnB,sBAAuB,CACvB,cAAe,CACf,cACJ,CAEA,kCAGI,oBAAyB,CAAzB,iBAAyB,CAAzB,wBAAyB,CACzB,WAAY,CACZ,aACJ,CAGJ,uDARQ,mBAAa,CAAb,mBAAa,CAAb,YAAa,CACb,wBAAmB,CAAnB,qBAAmB,CAAnB,kBAwBR,CAjBA,qBACI,iBAAkB,CAClB,SAAU,CAGV,uBAAuB,CAAvB,oBAAuB,CAAvB,sBAAuB,CACvB,iBAAkB,CAClB,UAAW,CACX,6BAAsB,CAAtB,qBAAsB,CACtB,+BAAmC,CACnC,aAAc,CACd,wBAAiB,CAAjB,qBAAiB,CAAjB,oBAAiB,CAAjB,gBAMJ,CAJI,2BACI,+BAAmC,CACnC,UACJ,CAGJ,uBACI,UAAW,CACX,WAAY,CACZ,gBAAiB,CACjB,iBAAkB,CAClB,cAAe,CACf,UAAyB,CACzB,cACJ,CAEA,wBACI,UAAW,CACX,WAAY,CACZ,mBAAa,CAAb,mBAAa,CAAb,YAAa,CACb,uBAAuB,CAAvB,oBAAuB,CAAvB,sBAAuB,CACvB,wBAAkB,CAAlB,qBAAkB,CAAlB,kBACJ,CAEA,4BACI,gBACJ,CAEA,uBACI,iBAAkB,CAClB,cAAe,CACf,aAOJ,CALI,gCACI,cAAe,CACf,aAAc,CACd,kBACJ,CAGJ,yBACI,QAAS,CACT,WAAY,CACZ,kCAA2B,CAA3B,0BAA2B,CAC3B,WAAY,CACZ,WAAY,CACZ,cAAe,CACf,+BAAiC,CACjC,iBAAgC,CAChC,kBAwBJ,CAvBI,+BACI,yBACJ,CAEA,+BACI,UAAW,CACX,WAAY,CACZ,kBAAmB,CACnB,cAAe,CACf,aAAwB,CACxB,mBAAa,CAAb,mBAAa,CAAb,YAAa,CACb,wBAAmB,CAAnB,qBAAmB,CAAnB,kBAAmB,CACnB,wBAA6B,CAA7B,4BAUJ,CARI,wCACI,cAKJ,CAHI,8CACI,UACJ,CAMZ,4CACI,OAAQ,CACR,UAAW,CACX,WAAY,CACZ,cAAe,CACf,cAAe,CACnB,oBACA,CAEA,sBAGI,SACJ,CAEA,4CALI,kCAAmC,CACnC,0BASJ,CALA,sBAGI,UAAW,CACX,eACJ","file":"image-viewer.min.css","sourcesContent":["@import './variable.css';\n\n$imgWrapTextColor:$newGreyColor;\n$tipsColor:$newBlackColor3;\n\n\n.bk-image-viewer {\n    &-wrapper {\n        position: fixed;\n        top: 0;\n        right: 0;\n        bottom: 0;\n        left: 0;\n        background: rgba(0, 0, 0, .6);\n        display: flex;\n        flex-direction: column;\n    }\n    &-mask{\n        position: absolute;\n        top: 0;\n        right: 0;\n        bottom: 0;\n        left: 0;\n    }\n\n    &-header {\n        position: absolute;\n        top: 0;\n        left: 0;\n        z-index: 9;\n        width: 100%;\n        height: 52px;\n        display: flex;\n        justify-content: space-between;\n        align-items: center;\n        color: $imgWrapTextColor;\n\n        > div {\n            flex: 1;\n            overflow: hidden;\n            white-space: nowrap;\n            text-overflow: ellipsis;\n            font-size: 14px;\n            padding: 0 25px;\n        }\n\n        .quit-box {\n            display: flex;\n            align-items: center;\n            justify-content: flex-end;\n            height: 100%;\n            color: $tipsColor;\n        }\n    }\n\n    &-btn {\n        position: absolute;\n        z-index: 1;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        border-radius: 50%;\n        opacity: .8;\n        box-sizing: border-box;\n        background-color: rgba(0, 0, 0, .3);\n        color: #DCDEE5;\n        user-select: none;\n\n        &:hover {\n            background-color: rgba(0, 0, 0, .4);\n            color: $defaultColor;\n        }\n    }\n\n    &-close {\n        width: 80px;\n        height: 80px;\n        line-height: 80px;\n        text-align: center;\n        font-size: 50px;\n        color: $defaultLightColor;\n        cursor: pointer;\n    }\n\n    &-canvas {\n        width: 100%;\n        height: 100%;\n        display: flex;\n        justify-content: center;\n        align-items: center\n    }\n\n    &-has-header {\n        padding-top: 52px;\n    }\n\n    &-error {\n        text-align: center;\n        font-size: 14px;\n        color: $newBlackColor1;\n\n        .bk-icon {\n            font-size: 85px;\n            line-height: 1;\n            margin-bottom: 15px;\n        }\n    }\n\n    &-actions {\n        left: 50%;\n        bottom: 30px;\n        transform: translateX(-50%);\n        width: 282px;\n        height: 44px;\n        padding: 0 23px;\n        background-color: $newBlackColor4;\n        border-color: $defaultLightColor;\n        border-radius: 22px;\n        &:hover{\n            background: rgba(0,0,0,.5);\n        }\n\n        &-inner {\n            width: 100%;\n            height: 100%;\n            text-align: justify;\n            font-size: 23px;\n            color: $imgWrapTextColor;\n            display: flex;\n            align-items: center;\n            justify-content: space-around;\n\n            .bk-icon {\n                cursor: pointer;\n\n                &:hover {\n                    color: $defaultLightColor;\n                }\n            }\n\n        }\n    }\n\n    &-next, &-prev {\n        top: 50%;\n        width: 80px;\n        height: 80px;\n        font-size: 40px;\n        cursor: pointer;\n    //background: rgb(76,76,76);\n    }\n\n    &-prev {\n        -webkit-transform: translateY(-50%);\n        transform: translateY(-50%);\n        left: 40px\n    }\n\n    &-next {\n        -webkit-transform: translateY(-50%);\n        transform: translateY(-50%);\n        right: 40px;\n        text-indent: 2px\n    }\n}\n"]}

package/lib/ui/process.css

@@ -884,6 +884,11 @@
         font-size:22px;
     }
 
+.bk-process .bk-spin-loading.bk-spin-loading-mini{
+            width:14px;
+            height:14px;
+        }
+
 .bk-process .bk-process-toggle{
         position:relative;
         left:15px;
@@ -937,6 +942,14 @@
             display:none;
         }
 
+.bk-process li .bk-process-item{
+            display:inline-block;
+        }
+
+.bk-process li .bk-process-item > .bk-icon{
+                font-size:14px;
+            }
+
 .bk-process li:first-of-type{
             border-radius:13px 0 0 13px;
         }
@@ -1000,6 +1013,19 @@
                 top:-2px;
             }
 
+.bk-process li .bk-process-step .step-item.error{
+                    color:#ff5656;
+                }
+
+.bk-process li .bk-process-step .step-item.error .bk-icon{
+                        color:#ff5656;
+                        vertical-align:-2px;
+                    }
+
+.bk-process li .bk-process-step .step-item.done .bk-icon{
+                        color:#2dcb56;
+                    }
+
 .bk-process li.success{
             background:#2dcb56;
             color:#fff
@@ -1017,6 +1043,56 @@
                 display:inline-block;
             }
 
+.bk-process li.status-error{
+            background:#ff5656;
+            color:#fff
+        }
+
+.bk-process li.status-error::after{
+                border-color:transparent transparent transparent #ff5656;
+            }
+
+.bk-process li.status-error .bk-process-item > .bk-icon{
+                display:inline-block;
+            }
+
+.bk-process li.status-error .bk-process-step .bk-icon{
+                    display:inline-block;
+                }
+
+.bk-process li.status-done{
+            background:#2dcb56;
+            color:#fff
+        }
+
+.bk-process li.status-done::after{
+                border-color:transparent transparent transparent #2dcb56;
+            }
+
+.bk-process li.status-done .bk-process-item > .bk-icon{
+                display:inline-block;
+            }
+
+.bk-process li.status-done .bk-process-step .bk-icon{
+                    display:inline-block;
+                }
+
+.bk-process li.status-loading .bk-process-item > .bk-icon{
+                display:inline-block;
+            }
+
+.bk-process li.status-loading .bk-process-step .bk-icon{
+                    display:inline-block;
+                }
+
+.bk-process li.status-default .bk-process-item > .bk-icon{
+                display:inline-block;
+            }
+
+.bk-process li.status-default .bk-process-step .bk-icon{
+                    display:inline-block;
+                }
+
 .bk-process li.current{
             background:#3a84ff;
             color:#fff

package/lib/ui/process.min.css

@@ -1,2 +1,2 @@
-.bk-loading{width:100%;height:100%;position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;background-color:hsla(0,0%,100%,.9);z-index:100}.bk-loading .bk-loading-wrapper{text-align:center;line-height:1;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);-webkit-transform:translate(-50%,-50%)}.bk-loading-title{text-align:center;font-size:14px;color:#63656e;line-height:normal;margin-top:5px}.bk-loading .bk-loading1{position:relative;width:75px;height:14px;margin:auto;display:inline-block}.bk-loading .bk-loading1 .point{position:absolute;top:0;width:14px;height:14px;-webkit-animation-name:scale-animate;animation-name:scale-animate;-webkit-animation-duration:.8s;animation-duration:.8s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-direction:normal;animation-direction:normal;-webkit-transform:scale(.6);transform:scale(.6);border-radius:19px}.bk-loading .bk-loading1 .point1{background-color:#fd6154;left:0;-webkit-animation-delay:.1s;animation-delay:.1s}.bk-loading .bk-loading1 .point2{background-color:#ffb726;left:20px;-webkit-animation-delay:.25s;animation-delay:.25s}.bk-loading .bk-loading1 .point3{background-color:#4cd084;left:40px;-webkit-animation-delay:.4s;animation-delay:.4s}.bk-loading .bk-loading1 .point4{background-color:#57a3f1;left:60px;-webkit-animation-delay:.55s;animation-delay:.55s}.bk-loading .bk-loading1.bk-black .point1,.bk-loading .bk-loading1.bk-black .point2,.bk-loading .bk-loading1.bk-black .point3,.bk-loading .bk-loading1.bk-black .point4{background:#979ba5}.bk-dot-loading,.bk-loading1{position:relative;width:75px;height:14px;margin:auto;display:inline-block}.bk-dot-loading .point,.bk-loading1 .point{position:absolute;top:0;width:14px;height:14px;-webkit-animation-name:scale-animate;animation-name:scale-animate;-webkit-animation-duration:.8s;animation-duration:.8s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-direction:normal;animation-direction:normal;-webkit-transform:scale(.6);transform:scale(.6);border-radius:19px}.bk-dot-loading .point1,.bk-loading1 .point1{background-color:#fd6154;left:0;-webkit-animation-delay:.1s;animation-delay:.1s}.bk-dot-loading .point2,.bk-loading1 .point2{background-color:#ffb726;left:20px;-webkit-animation-delay:.25s;animation-delay:.25s}.bk-dot-loading .point3,.bk-loading1 .point3{background-color:#4cd084;left:40px;-webkit-animation-delay:.4s;animation-delay:.4s}.bk-dot-loading .point4,.bk-loading1 .point4{background-color:#57a3f1;left:60px;-webkit-animation-delay:.55s;animation-delay:.55s}.bk-dot-loading.bk-size-mini,.bk-loading1.bk-size-mini{width:30px}.bk-dot-loading.bk-size-mini .point,.bk-loading1.bk-size-mini .point{width:6px;height:6px}.bk-dot-loading.bk-size-mini .point1,.bk-loading1.bk-size-mini .point1{left:0}.bk-dot-loading.bk-size-mini .point2,.bk-loading1.bk-size-mini .point2{left:10px}.bk-dot-loading.bk-size-mini .point3,.bk-loading1.bk-size-mini .point3{left:20px}.bk-dot-loading.bk-size-mini .point4,.bk-loading1.bk-size-mini .point4{left:30px}.bk-dot-loading.bk-size-small,.bk-loading1.bk-size-small{width:45px}.bk-dot-loading.bk-size-small .point,.bk-loading1.bk-size-small .point{width:10px;height:10px}.bk-dot-loading.bk-size-small .point1,.bk-loading1.bk-size-small .point1{left:0}.bk-dot-loading.bk-size-small .point2,.bk-loading1.bk-size-small .point2{left:15px}.bk-dot-loading.bk-size-small .point3,.bk-loading1.bk-size-small .point3{left:30px}.bk-dot-loading.bk-size-small .point4,.bk-loading1.bk-size-small .point4{left:45px}.bk-dot-loading.bk-black .point1,.bk-dot-loading.bk-black .point2,.bk-dot-loading.bk-black .point3,.bk-dot-loading.bk-black .point4,.bk-loading1.bk-black .point1,.bk-loading1.bk-black .point2,.bk-loading1.bk-black .point3,.bk-loading1.bk-black .point4{background:#979ba5}.bk-dot-loading.bk-primary .point1,.bk-dot-loading.bk-primary .point2,.bk-dot-loading.bk-primary .point3,.bk-dot-loading.bk-primary .point4,.bk-loading1.bk-primary .point1,.bk-loading1.bk-primary .point2,.bk-loading1.bk-primary .point3,.bk-loading1.bk-primary .point4{background:#3c96ff}.bk-dot-loading.bk-danger .point1,.bk-dot-loading.bk-danger .point2,.bk-dot-loading.bk-danger .point3,.bk-dot-loading.bk-danger .point4,.bk-loading1.bk-danger .point1,.bk-loading1.bk-danger .point2,.bk-loading1.bk-danger .point3,.bk-loading1.bk-danger .point4{background:#ff5656}.bk-dot-loading.bk-warning .point1,.bk-dot-loading.bk-warning .point2,.bk-dot-loading.bk-warning .point3,.bk-dot-loading.bk-warning .point4,.bk-loading1.bk-warning .point1,.bk-loading1.bk-warning .point2,.bk-loading1.bk-warning .point3,.bk-loading1.bk-warning .point4{background:#ffb848}.bk-dot-loading.bk-default .point1,.bk-dot-loading.bk-default .point2,.bk-dot-loading.bk-default .point3,.bk-dot-loading.bk-default .point4,.bk-loading1.bk-default .point1,.bk-loading1.bk-default .point2,.bk-loading1.bk-default .point3,.bk-loading1.bk-default .point4{background:#979ba5}@keyframes scale-animate{0%{-webkit-transform:scale(1);transform:scale(1)}to{-webkit-transform:scale(.6);transform:scale(.6)}}@-webkit-keyframes scale-animate{0%{-webkit-transform:scale(1)}to{-webkit-transform:scale(.6)}}.bk-loading2,.bk-spin-loading{width:39px;height:39px;position:relative;margin:auto;display:inline-block;vertical-align:middle}.bk-loading2 .rotate,.bk-spin-loading .rotate{position:absolute;top:77%;right:43%;background-color:none;background-color:#39424e\9\0;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:fade;animation-name:fade;-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-loading2.bk-spin-loading-success .rotate,.bk-spin-loading.bk-spin-loading-success .rotate{background:#30d878\9\0;-webkit-animation-name:fadeSuccess;animation-name:fadeSuccess}.bk-loading2.bk-spin-loading-danger .rotate,.bk-spin-loading.bk-spin-loading-danger .rotate{background:#ff5656\9\0;-webkit-animation-name:fadeDanger;animation-name:fadeDanger}.bk-loading2.bk-spin-loading-warning .rotate,.bk-spin-loading.bk-spin-loading-warning .rotate{background:#ffb400\9\0;-webkit-animation-name:fadeWarning;animation-name:fadeWarning}.bk-loading2.bk-spin-loading-primary .rotate,.bk-spin-loading.bk-spin-loading-primary .rotate{background:#3c96ff\9\0;-webkit-animation-name:fadePrimary;animation-name:fadePrimary}.bk-loading2.bk-spin-loading-white .rotate,.bk-spin-loading.bk-spin-loading-white .rotate{background:#fff\9\0;-webkit-animation-name:fadeWhite;animation-name:fadeWhite}.bk-loading2 .rotate1,.bk-spin-loading .rotate1{-webkit-animation-delay:.45s;animation-delay:.45s;-webkit-transform:rotate(-90deg);transform:rotate(-90deg)}.bk-loading2 .rotate2,.bk-spin-loading .rotate2{-webkit-animation-delay:.6s;animation-delay:.6s;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.bk-loading2 .rotate3,.bk-spin-loading .rotate3{-webkit-animation-delay:.75s;animation-delay:.75s;-webkit-transform:rotate(0deg);transform:rotate(0deg)}.bk-loading2 .rotate4,.bk-spin-loading .rotate4{-webkit-animation-delay:.9s;animation-delay:.9s;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.bk-loading2 .rotate5,.bk-spin-loading .rotate5{-webkit-animation-delay:1.05s;animation-delay:1.05s;-webkit-transform:rotate(90deg);transform:rotate(90deg)}.bk-loading2 .rotate6,.bk-spin-loading .rotate6{-webkit-animation-delay:1.2s;animation-delay:1.2s;-webkit-transform:rotate(135deg);transform:rotate(135deg)}.bk-loading2 .rotate7,.bk-spin-loading .rotate7{-webkit-animation-delay:1.35s;animation-delay:1.35s;-webkit-transform:rotate(180deg);transform:rotate(180deg)}.bk-loading2 .rotate8,.bk-spin-loading .rotate8{-webkit-animation-delay:1.5s;animation-delay:1.5s;-webkit-transform:rotate(-135deg);transform:rotate(-135deg)}.bk-loading2.bk-spin-loading-large,.bk-spin-loading.bk-spin-loading-large{width:69px;height:69px}.bk-loading2.bk-spin-loading-large .rotate,.bk-spin-loading.bk-spin-loading-large .rotate{width:10px;height:14px;-webkit-transform-origin:50% -18px;transform-origin:50% -18px}.bk-loading2.bk-spin-loading-small,.bk-spin-loading.bk-spin-loading-small{width:27px;height:27px}.bk-loading2.bk-spin-loading-small .rotate,.bk-spin-loading.bk-spin-loading-small .rotate{width:4px;height:5px;-webkit-transform-origin:50% -7px;transform-origin:50% -7px}.bk-loading2.bk-spin-loading-mini,.bk-spin-loading.bk-spin-loading-mini{width:16px;height:16px}.bk-loading2.bk-spin-loading-mini .rotate,.bk-spin-loading.bk-spin-loading-mini .rotate{width:2px;height:3px;-webkit-transform-origin:50% -4px;transform-origin:50% -4px}@-webkit-keyframes fade{0%{background-color:#39424e}to{background-color:none}}@-webkit-keyframes fadeSuccess{0%{background-color:#2dcb56}to{background-color:none}}@-webkit-keyframes fadePrimary{0%{background-color:#3c96ff}to{background-color:none}}@-webkit-keyframes fadeDanger{0%{background-color:#ff5656}to{background-color:none}}@-webkit-keyframes fadeWarning{0%{background-color:#ffb848}to{background-color:none}}@-webkit-keyframes fadeWhite{0%{background-color:#fff}to{background-color:none}}.bk-loading,.bk-loading-box{width:100%;height:100%;position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;background-color:hsla(0,0%,100%,.9);z-index:100}.bk-loading-box .bk-loading-wrapper,.bk-loading .bk-loading-wrapper{text-align:center;line-height:1;position:absolute;left:50%;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.bk-loading-box-title,.bk-loading-title{text-align:center;font-size:14px;color:#63656e;line-height:normal;margin-top:5px}@keyframes fade{0%{background-color:#39424e}to{background-color:none}}@keyframes fadeSuccess{0%{background-color:#30d878}to{background-color:none}}@keyframes fadePrimary{0%{background-color:#3c96ff}to{background-color:none}}@keyframes fadeDanger{0%{background-color:#ff5656}to{background-color:none}}@keyframes fadeWarning{0%{background-color:#ffb400}to{background-color:none}}@keyframes fadeWhite{0%{background-color:#fff}to{background-color:none}}@-webkit-keyframes animate{0%{-webkit-transform:scale(.5);transform:scale(.5)}to{-webkit-transform:scale(.3);transform:scale(.3)}}@keyframes animate{0%{-webkit-transform:scale(.5);transform:scale(.5)}to{-webkit-transform:scale(.3);transform:scale(.3)}}.bk-default-loading{display:inline-block}.bk-default-loading .bk-loading-wrapper{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;position:absolute;width:100%;height:100%;left:unset;top:0;transform:unset;-webkit-transform:unset;background:inherit;padding:0 25%}.bk-default-loading .bk-loading-wrapper :first-child{margin:unset}.bk-process{display:-webkit-box;display:-ms-flexbox;display:flex;position:relative}.bk-process .bk-icon{font-size:22px}.bk-process .bk-process-toggle{position:relative;left:15px;width:24px;height:24px;line-height:24px;border-radius:50%;text-align:center;border:1px solid #c3cdd7;font-size:12px;color:#63656e;text-decoration:none}.bk-process .bk-process-toggle.active,.bk-process .bk-process-toggle:hover{color:#fff;background:#3a84ff;border-color:#3a84ff}.bk-process>ul{display:table;width:100%;display:-webkit-box;display:flex;-ms-display:flex;-moz-display:flex;-webkit-display:flex;margin:auto;padding:0}.bk-process li{background-color:#f0f1f5;display:table-cell;-webkit-box-flex:1;flex:1;-ms-flex:1;-moz-flex:1;-webkit-flex:1;text-align:center;height:24px;line-height:24px;position:relative;font-size:12px;color:#63656e}.bk-process li i{display:none}.bk-process li:first-of-type{border-radius:13px 0 0 13px}.bk-process li:last-of-type{border-radius:0 13px 13px 0}.bk-process li:last-of-type:before{display:none}.bk-process li:last-of-type:after{display:none}.bk-process li:before{content:"";width:0;height:0;border:12px solid transparent;border-left-color:#fff;position:absolute;right:-25px;top:0;z-index:1}.bk-process li:after{content:"";width:0;height:0;border:12px solid transparent;border-left-color:#f0f1f5;position:absolute;right:-23px;top:0;z-index:1}.bk-process li .bk-process-step{color:#63656e;font-size:12px}.bk-process li .bk-process-step dd{margin:0;line-height:32px}.bk-process li .bk-process-step i{display:none}.bk-process li .bk-process-step .success i{display:inline-block;color:#2dcb56}.bk-process li .bk-process-step .steps-loading{top:-2px}.bk-process li.success{background:#2dcb56;color:#fff}.bk-process li.success:after{border-color:transparent transparent transparent #2dcb56}.bk-process li.success .bk-process-step i{color:#2dcb56}.bk-process li.success i{display:inline-block}.bk-process li.current{background:#3a84ff;color:#fff}.bk-process li.current:after{border-color:transparent transparent transparent #3a84ff}.bk-process li.current>.bk-spin-loading{vertical-align:-3px}
+.bk-loading{width:100%;height:100%;position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;background-color:hsla(0,0%,100%,.9);z-index:100}.bk-loading .bk-loading-wrapper{text-align:center;line-height:1;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);-webkit-transform:translate(-50%,-50%)}.bk-loading-title{text-align:center;font-size:14px;color:#63656e;line-height:normal;margin-top:5px}.bk-loading .bk-loading1{position:relative;width:75px;height:14px;margin:auto;display:inline-block}.bk-loading .bk-loading1 .point{position:absolute;top:0;width:14px;height:14px;-webkit-animation-name:scale-animate;animation-name:scale-animate;-webkit-animation-duration:.8s;animation-duration:.8s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-direction:normal;animation-direction:normal;-webkit-transform:scale(.6);transform:scale(.6);border-radius:19px}.bk-loading .bk-loading1 .point1{background-color:#fd6154;left:0;-webkit-animation-delay:.1s;animation-delay:.1s}.bk-loading .bk-loading1 .point2{background-color:#ffb726;left:20px;-webkit-animation-delay:.25s;animation-delay:.25s}.bk-loading .bk-loading1 .point3{background-color:#4cd084;left:40px;-webkit-animation-delay:.4s;animation-delay:.4s}.bk-loading .bk-loading1 .point4{background-color:#57a3f1;left:60px;-webkit-animation-delay:.55s;animation-delay:.55s}.bk-loading .bk-loading1.bk-black .point1,.bk-loading .bk-loading1.bk-black .point2,.bk-loading .bk-loading1.bk-black .point3,.bk-loading .bk-loading1.bk-black .point4{background:#979ba5}.bk-dot-loading,.bk-loading1{position:relative;width:75px;height:14px;margin:auto;display:inline-block}.bk-dot-loading .point,.bk-loading1 .point{position:absolute;top:0;width:14px;height:14px;-webkit-animation-name:scale-animate;animation-name:scale-animate;-webkit-animation-duration:.8s;animation-duration:.8s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-direction:normal;animation-direction:normal;-webkit-transform:scale(.6);transform:scale(.6);border-radius:19px}.bk-dot-loading .point1,.bk-loading1 .point1{background-color:#fd6154;left:0;-webkit-animation-delay:.1s;animation-delay:.1s}.bk-dot-loading .point2,.bk-loading1 .point2{background-color:#ffb726;left:20px;-webkit-animation-delay:.25s;animation-delay:.25s}.bk-dot-loading .point3,.bk-loading1 .point3{background-color:#4cd084;left:40px;-webkit-animation-delay:.4s;animation-delay:.4s}.bk-dot-loading .point4,.bk-loading1 .point4{background-color:#57a3f1;left:60px;-webkit-animation-delay:.55s;animation-delay:.55s}.bk-dot-loading.bk-size-mini,.bk-loading1.bk-size-mini{width:30px}.bk-dot-loading.bk-size-mini .point,.bk-loading1.bk-size-mini .point{width:6px;height:6px}.bk-dot-loading.bk-size-mini .point1,.bk-loading1.bk-size-mini .point1{left:0}.bk-dot-loading.bk-size-mini .point2,.bk-loading1.bk-size-mini .point2{left:10px}.bk-dot-loading.bk-size-mini .point3,.bk-loading1.bk-size-mini .point3{left:20px}.bk-dot-loading.bk-size-mini .point4,.bk-loading1.bk-size-mini .point4{left:30px}.bk-dot-loading.bk-size-small,.bk-loading1.bk-size-small{width:45px}.bk-dot-loading.bk-size-small .point,.bk-loading1.bk-size-small .point{width:10px;height:10px}.bk-dot-loading.bk-size-small .point1,.bk-loading1.bk-size-small .point1{left:0}.bk-dot-loading.bk-size-small .point2,.bk-loading1.bk-size-small .point2{left:15px}.bk-dot-loading.bk-size-small .point3,.bk-loading1.bk-size-small .point3{left:30px}.bk-dot-loading.bk-size-small .point4,.bk-loading1.bk-size-small .point4{left:45px}.bk-dot-loading.bk-black .point1,.bk-dot-loading.bk-black .point2,.bk-dot-loading.bk-black .point3,.bk-dot-loading.bk-black .point4,.bk-loading1.bk-black .point1,.bk-loading1.bk-black .point2,.bk-loading1.bk-black .point3,.bk-loading1.bk-black .point4{background:#979ba5}.bk-dot-loading.bk-primary .point1,.bk-dot-loading.bk-primary .point2,.bk-dot-loading.bk-primary .point3,.bk-dot-loading.bk-primary .point4,.bk-loading1.bk-primary .point1,.bk-loading1.bk-primary .point2,.bk-loading1.bk-primary .point3,.bk-loading1.bk-primary .point4{background:#3c96ff}.bk-dot-loading.bk-danger .point1,.bk-dot-loading.bk-danger .point2,.bk-dot-loading.bk-danger .point3,.bk-dot-loading.bk-danger .point4,.bk-loading1.bk-danger .point1,.bk-loading1.bk-danger .point2,.bk-loading1.bk-danger .point3,.bk-loading1.bk-danger .point4{background:#ff5656}.bk-dot-loading.bk-warning .point1,.bk-dot-loading.bk-warning .point2,.bk-dot-loading.bk-warning .point3,.bk-dot-loading.bk-warning .point4,.bk-loading1.bk-warning .point1,.bk-loading1.bk-warning .point2,.bk-loading1.bk-warning .point3,.bk-loading1.bk-warning .point4{background:#ffb848}.bk-dot-loading.bk-default .point1,.bk-dot-loading.bk-default .point2,.bk-dot-loading.bk-default .point3,.bk-dot-loading.bk-default .point4,.bk-loading1.bk-default .point1,.bk-loading1.bk-default .point2,.bk-loading1.bk-default .point3,.bk-loading1.bk-default .point4{background:#979ba5}@keyframes scale-animate{0%{-webkit-transform:scale(1);transform:scale(1)}to{-webkit-transform:scale(.6);transform:scale(.6)}}@-webkit-keyframes scale-animate{0%{-webkit-transform:scale(1)}to{-webkit-transform:scale(.6)}}.bk-loading2,.bk-spin-loading{width:39px;height:39px;position:relative;margin:auto;display:inline-block;vertical-align:middle}.bk-loading2 .rotate,.bk-spin-loading .rotate{position:absolute;top:77%;right:43%;background-color:none;background-color:#39424e\9\0;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:fade;animation-name:fade;-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-loading2.bk-spin-loading-success .rotate,.bk-spin-loading.bk-spin-loading-success .rotate{background:#30d878\9\0;-webkit-animation-name:fadeSuccess;animation-name:fadeSuccess}.bk-loading2.bk-spin-loading-danger .rotate,.bk-spin-loading.bk-spin-loading-danger .rotate{background:#ff5656\9\0;-webkit-animation-name:fadeDanger;animation-name:fadeDanger}.bk-loading2.bk-spin-loading-warning .rotate,.bk-spin-loading.bk-spin-loading-warning .rotate{background:#ffb400\9\0;-webkit-animation-name:fadeWarning;animation-name:fadeWarning}.bk-loading2.bk-spin-loading-primary .rotate,.bk-spin-loading.bk-spin-loading-primary .rotate{background:#3c96ff\9\0;-webkit-animation-name:fadePrimary;animation-name:fadePrimary}.bk-loading2.bk-spin-loading-white .rotate,.bk-spin-loading.bk-spin-loading-white .rotate{background:#fff\9\0;-webkit-animation-name:fadeWhite;animation-name:fadeWhite}.bk-loading2 .rotate1,.bk-spin-loading .rotate1{-webkit-animation-delay:.45s;animation-delay:.45s;-webkit-transform:rotate(-90deg);transform:rotate(-90deg)}.bk-loading2 .rotate2,.bk-spin-loading .rotate2{-webkit-animation-delay:.6s;animation-delay:.6s;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.bk-loading2 .rotate3,.bk-spin-loading .rotate3{-webkit-animation-delay:.75s;animation-delay:.75s;-webkit-transform:rotate(0deg);transform:rotate(0deg)}.bk-loading2 .rotate4,.bk-spin-loading .rotate4{-webkit-animation-delay:.9s;animation-delay:.9s;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.bk-loading2 .rotate5,.bk-spin-loading .rotate5{-webkit-animation-delay:1.05s;animation-delay:1.05s;-webkit-transform:rotate(90deg);transform:rotate(90deg)}.bk-loading2 .rotate6,.bk-spin-loading .rotate6{-webkit-animation-delay:1.2s;animation-delay:1.2s;-webkit-transform:rotate(135deg);transform:rotate(135deg)}.bk-loading2 .rotate7,.bk-spin-loading .rotate7{-webkit-animation-delay:1.35s;animation-delay:1.35s;-webkit-transform:rotate(180deg);transform:rotate(180deg)}.bk-loading2 .rotate8,.bk-spin-loading .rotate8{-webkit-animation-delay:1.5s;animation-delay:1.5s;-webkit-transform:rotate(-135deg);transform:rotate(-135deg)}.bk-loading2.bk-spin-loading-large,.bk-spin-loading.bk-spin-loading-large{width:69px;height:69px}.bk-loading2.bk-spin-loading-large .rotate,.bk-spin-loading.bk-spin-loading-large .rotate{width:10px;height:14px;-webkit-transform-origin:50% -18px;transform-origin:50% -18px}.bk-loading2.bk-spin-loading-small,.bk-spin-loading.bk-spin-loading-small{width:27px;height:27px}.bk-loading2.bk-spin-loading-small .rotate,.bk-spin-loading.bk-spin-loading-small .rotate{width:4px;height:5px;-webkit-transform-origin:50% -7px;transform-origin:50% -7px}.bk-loading2.bk-spin-loading-mini,.bk-spin-loading.bk-spin-loading-mini{width:16px;height:16px}.bk-loading2.bk-spin-loading-mini .rotate,.bk-spin-loading.bk-spin-loading-mini .rotate{width:2px;height:3px;-webkit-transform-origin:50% -4px;transform-origin:50% -4px}@-webkit-keyframes fade{0%{background-color:#39424e}to{background-color:none}}@-webkit-keyframes fadeSuccess{0%{background-color:#2dcb56}to{background-color:none}}@-webkit-keyframes fadePrimary{0%{background-color:#3c96ff}to{background-color:none}}@-webkit-keyframes fadeDanger{0%{background-color:#ff5656}to{background-color:none}}@-webkit-keyframes fadeWarning{0%{background-color:#ffb848}to{background-color:none}}@-webkit-keyframes fadeWhite{0%{background-color:#fff}to{background-color:none}}.bk-loading,.bk-loading-box{width:100%;height:100%;position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;background-color:hsla(0,0%,100%,.9);z-index:100}.bk-loading-box .bk-loading-wrapper,.bk-loading .bk-loading-wrapper{text-align:center;line-height:1;position:absolute;left:50%;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.bk-loading-box-title,.bk-loading-title{text-align:center;font-size:14px;color:#63656e;line-height:normal;margin-top:5px}@keyframes fade{0%{background-color:#39424e}to{background-color:none}}@keyframes fadeSuccess{0%{background-color:#30d878}to{background-color:none}}@keyframes fadePrimary{0%{background-color:#3c96ff}to{background-color:none}}@keyframes fadeDanger{0%{background-color:#ff5656}to{background-color:none}}@keyframes fadeWarning{0%{background-color:#ffb400}to{background-color:none}}@keyframes fadeWhite{0%{background-color:#fff}to{background-color:none}}@-webkit-keyframes animate{0%{-webkit-transform:scale(.5);transform:scale(.5)}to{-webkit-transform:scale(.3);transform:scale(.3)}}@keyframes animate{0%{-webkit-transform:scale(.5);transform:scale(.5)}to{-webkit-transform:scale(.3);transform:scale(.3)}}.bk-default-loading{display:inline-block}.bk-default-loading .bk-loading-wrapper{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;position:absolute;width:100%;height:100%;left:unset;top:0;transform:unset;-webkit-transform:unset;background:inherit;padding:0 25%}.bk-default-loading .bk-loading-wrapper :first-child{margin:unset}.bk-process{display:-webkit-box;display:-ms-flexbox;display:flex;position:relative}.bk-process .bk-icon{font-size:22px}.bk-process .bk-spin-loading.bk-spin-loading-mini{width:14px;height:14px}.bk-process .bk-process-toggle{position:relative;left:15px;width:24px;height:24px;line-height:24px;border-radius:50%;text-align:center;border:1px solid #c3cdd7;font-size:12px;color:#63656e;text-decoration:none}.bk-process .bk-process-toggle.active,.bk-process .bk-process-toggle:hover{color:#fff;background:#3a84ff;border-color:#3a84ff}.bk-process>ul{display:table;width:100%;display:-webkit-box;display:flex;-ms-display:flex;-moz-display:flex;-webkit-display:flex;margin:auto;padding:0}.bk-process li{background-color:#f0f1f5;display:table-cell;-webkit-box-flex:1;flex:1;-ms-flex:1;-moz-flex:1;-webkit-flex:1;text-align:center;height:24px;line-height:24px;position:relative;font-size:12px;color:#63656e}.bk-process li i{display:none}.bk-process li .bk-process-item{display:inline-block}.bk-process li .bk-process-item>.bk-icon{font-size:14px}.bk-process li:first-of-type{border-radius:13px 0 0 13px}.bk-process li:last-of-type{border-radius:0 13px 13px 0}.bk-process li:last-of-type:before{display:none}.bk-process li:last-of-type:after{display:none}.bk-process li:before{content:"";width:0;height:0;border:12px solid transparent;border-left-color:#fff;position:absolute;right:-25px;top:0;z-index:1}.bk-process li:after{content:"";width:0;height:0;border:12px solid transparent;border-left-color:#f0f1f5;position:absolute;right:-23px;top:0;z-index:1}.bk-process li .bk-process-step{color:#63656e;font-size:12px}.bk-process li .bk-process-step dd{margin:0;line-height:32px}.bk-process li .bk-process-step i{display:none}.bk-process li .bk-process-step .success i{display:inline-block;color:#2dcb56}.bk-process li .bk-process-step .steps-loading{top:-2px}.bk-process li .bk-process-step .step-item.error{color:#ff5656}.bk-process li .bk-process-step .step-item.error .bk-icon{color:#ff5656;vertical-align:-2px}.bk-process li .bk-process-step .step-item.done .bk-icon{color:#2dcb56}.bk-process li.success{background:#2dcb56;color:#fff}.bk-process li.success:after{border-color:transparent transparent transparent #2dcb56}.bk-process li.success .bk-process-step i{color:#2dcb56}.bk-process li.success i{display:inline-block}.bk-process li.status-error{background:#ff5656;color:#fff}.bk-process li.status-error:after{border-color:transparent transparent transparent #ff5656}.bk-process li.status-error .bk-process-item>.bk-icon{display:inline-block}.bk-process li.status-error .bk-process-step .bk-icon{display:inline-block}.bk-process li.status-done{background:#2dcb56;color:#fff}.bk-process li.status-done:after{border-color:transparent transparent transparent #2dcb56}.bk-process li.status-done .bk-process-item>.bk-icon{display:inline-block}.bk-process li.status-done .bk-process-step .bk-icon{display:inline-block}.bk-process li.status-loading .bk-process-item>.bk-icon{display:inline-block}.bk-process li.status-loading .bk-process-step .bk-icon{display:inline-block}.bk-process li.status-default .bk-process-item>.bk-icon{display:inline-block}.bk-process li.status-default .bk-process-step .bk-icon{display:inline-block}.bk-process li.current{background:#3a84ff;color:#fff}.bk-process li.current:after{border-color:transparent transparent transparent #3a84ff}.bk-process li.current>.bk-spin-loading{vertical-align:-3px}
 /*# sourceMappingURL=process.min.css.map */

package/lib/ui/process.min.css.map

@@ -1 +1 @@
-{"version":3,"sources":["loading.css","process.css"],"names":[],"mappings":"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","file":"process.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}","@import './variable.css';\n@import \"./loading.css\";\n\n.bk-process {\n    display: flex;\n    position: relative;\n    .bk-icon {\n        font-size: $iconNormalSize;\n    }\n    .bk-process-toggle {\n        position: relative;\n        left: 15px;\n        width: 24px;\n        height: 24px;\n        line-height: 24px;\n        border-radius: 50%;\n        text-align: center;\n        border: 1px solid $borderColor;\n        font-size: 12px;\n        color: $fnMainColor;\n        text-decoration: none;\n        &.active,\n        &:hover {\n            color: #fff;\n            background: $newMainColor;\n            border-color: $newMainColor;\n        }\n    }\n    > ul {\n        display: table;\n        width: 100%;\n        display: flex;\n        -ms-display: flex;\n        -moz-display: flex;\n        -webkit-display: flex;\n        margin: auto;\n        padding: 0;\n    }\n    li {\n        background-color: $newGreyColor2;\n        display: table-cell;\n        flex: 1;\n        -ms-flex: 1;\n        -moz-flex: 1;\n        -webkit-flex: 1;\n        text-align: center;\n        height: 24px;\n        line-height: 24px;\n        position: relative;\n        font-size: 12px;\n        color: $fnMainColor;\n        i {\n            display: none;\n        }\n        &:first-of-type {\n            border-radius: 13px 0 0 13px;\n        }\n        &:last-of-type {\n            border-radius:  0 13px 13px 0;\n            &::before {\n                display:none;\n            }\n            &::after {\n                display:none;\n            }\n        }\n        &::before {\n            content:\"\";\n            width: 0;\n            height: 0;\n            border: 12px solid;\n            border-color: transparent transparent transparent #fff;\n            position: absolute;\n            right: -25px;\n            top: 0;\n            z-index: 1;\n        }\n        &::after {\n            content:\"\";\n            width: 0;\n            height: 0;\n            border: 12px solid;\n            border-color: transparent transparent transparent $newGreyColor2;\n            position: absolute;\n            right: -23px;\n            top: 0;\n            z-index: 1;\n        }\n        .bk-process-step {\n            color: $fnMainColor;\n            font-size: 12px;\n            dd {\n                margin: 0;\n                line-height: 32px;\n            }\n            i {\n                display: none;\n            }\n            .success {\n                i {\n                    display: inline-block;\n                    color: $newGreenColor;\n                }\n            }\n            .steps-loading {\n                top: -2px;\n            }\n        }\n\n        &.success {\n            background: $newGreenColor;\n            color: #fff;\n            &::after {\n                border-color: transparent transparent transparent $newGreenColor;\n            }\n            & .bk-process-step {\n                i {\n                    color: $newGreenColor;\n                }\n            }\n            i {\n                display: inline-block;\n            }\n        }\n        &.current {\n            background: $newMainColor;\n            color: #fff;\n            &::after {\n                border-color: transparent transparent transparent $newMainColor;\n            }\n            >.bk-spin-loading {\n                vertical-align: -3px;\n            }\n        }\n    }\n}\n"]}
+{"version":3,"sources":["loading.css","process.css"],"names":[],"mappings":"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","file":"process.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}","@import './variable.css';\n@import \"./loading.css\";\n\n.bk-process {\n    display: flex;\n    position: relative;\n    .bk-icon {\n        font-size: $iconNormalSize;\n    }\n    .bk-spin-loading {\n        &.bk-spin-loading-mini{\n            width: 14px;\n            height: 14px;\n        }\n    }\n    .bk-process-toggle {\n        position: relative;\n        left: 15px;\n        width: 24px;\n        height: 24px;\n        line-height: 24px;\n        border-radius: 50%;\n        text-align: center;\n        border: 1px solid $borderColor;\n        font-size: 12px;\n        color: $fnMainColor;\n        text-decoration: none;\n        &.active,\n        &:hover {\n            color: #fff;\n            background: $newMainColor;\n            border-color: $newMainColor;\n        }\n    }\n    > ul {\n        display: table;\n        width: 100%;\n        display: flex;\n        -ms-display: flex;\n        -moz-display: flex;\n        -webkit-display: flex;\n        margin: auto;\n        padding: 0;\n    }\n    li {\n        background-color: $newGreyColor2;\n        display: table-cell;\n        flex: 1;\n        -ms-flex: 1;\n        -moz-flex: 1;\n        -webkit-flex: 1;\n        text-align: center;\n        height: 24px;\n        line-height: 24px;\n        position: relative;\n        font-size: 12px;\n        color: $fnMainColor;\n        i {\n            display: none;\n        }\n        .bk-process-item {\n            display: inline-block;\n            > .bk-icon {\n                font-size: $iconSmallestSize;\n            }\n        }\n        &:first-of-type {\n            border-radius: 13px 0 0 13px;\n        }\n        &:last-of-type {\n            border-radius:  0 13px 13px 0;\n            &::before {\n                display:none;\n            }\n            &::after {\n                display:none;\n            }\n        }\n        &::before {\n            content:\"\";\n            width: 0;\n            height: 0;\n            border: 12px solid;\n            border-color: transparent transparent transparent #fff;\n            position: absolute;\n            right: -25px;\n            top: 0;\n            z-index: 1;\n        }\n        &::after {\n            content:\"\";\n            width: 0;\n            height: 0;\n            border: 12px solid;\n            border-color: transparent transparent transparent $newGreyColor2;\n            position: absolute;\n            right: -23px;\n            top: 0;\n            z-index: 1;\n        }\n        .bk-process-step {\n            color: $fnMainColor;\n            font-size: 12px;\n            dd {\n                margin: 0;\n                line-height: 32px;\n            }\n            i {\n                display: none;\n            }\n            .success {\n                i {\n                    display: inline-block;\n                    color: $newGreenColor;\n                }\n            }\n            .steps-loading {\n                top: -2px;\n            }\n            .step-item {\n                &.error {\n                    color: $newRedColor1;\n\n                    .bk-icon {\n                        color: $newRedColor1;\n                        vertical-align: -2px;\n                    }\n                }\n                &.done {\n                    .bk-icon {\n                        color: $newGreenColor;\n                    }\n                }\n            }\n        }\n\n        &.success {\n            background: $newGreenColor;\n            color: #fff;\n            &::after {\n                border-color: transparent transparent transparent $newGreenColor;\n            }\n            & .bk-process-step {\n                i {\n                    color: $newGreenColor;\n                }\n            }\n            i {\n                display: inline-block;\n            }\n        }\n\n        &.status-error {\n            background: $newRedColor1;\n            color: #fff;\n            &::after {\n                border-color: transparent transparent transparent $newRedColor1;\n            }\n            .bk-process-item > .bk-icon {\n                display: inline-block;\n            }\n            .bk-process-step {\n                .bk-icon {\n                    display: inline-block;\n                }\n            }\n        }\n        &.status-done {\n            background: $newGreenColor;\n            color: #fff;\n            &::after {\n                border-color: transparent transparent transparent $newGreenColor;\n            }\n            .bk-process-item > .bk-icon {\n                display: inline-block;\n            }\n            .bk-process-step {\n                .bk-icon {\n                    display: inline-block;\n                }\n            }\n        }\n        &.status-loading {\n            .bk-process-item > .bk-icon {\n                display: inline-block;\n            }\n            .bk-process-step {\n                .bk-icon {\n                    display: inline-block;\n                }\n            }\n        }\n        &.status-default {\n            .bk-process-item > .bk-icon {\n                display: inline-block;\n            }\n            .bk-process-step {\n                .bk-icon {\n                    display: inline-block;\n                }\n            }\n        }\n\n        &.current {\n            background: $newMainColor;\n            color: #fff;\n            &::after {\n                border-color: transparent transparent transparent $newMainColor;\n            }\n            >.bk-spin-loading {\n                vertical-align: -3px;\n            }\n        }\n    }\n}\n"]}

package/lib/ui/slider.css

@@ -43,7 +43,8 @@
         }
 
 .bk-slider .bk-slider-runway .bk-slider-labels{
-            position:relative
+            position:relative;
+            font-size:12px
         }
 
 .bk-slider .bk-slider-runway .bk-slider-labels.vertical{
@@ -227,7 +228,8 @@
                 align-items:center;
         -webkit-box-pack:center;
             -ms-flex-pack:center;
-                justify-content:center
+                justify-content:center;
+        font-size:12px
     }
 
 .bk-slider-button .slider-button-label.vertical{

package/lib/ui/slider.min.css

@@ -1,2 +1,2 @@
-.bk-slider{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.bk-slider .bk-slider-runway{width:100%;height:4px;background:#dcdee5;position:relative;cursor:pointer;vertical-align:middle;opacity:1;border-radius:2px}.bk-slider .bk-slider-runway .bk-slider-bar{height:4px;border-top-left-radius:3px;border-bottom-left-radius:3px;position:absolute;background:#3a84ff}.bk-slider .bk-slider-runway .bk-slider-bar.vertical{width:4px}.bk-slider .bk-slider-runway .bk-slider-bar.horizontal{height:4px}.bk-slider .bk-slider-runway .disable{background:#979ba5}.bk-slider .bk-slider-runway .bk-slider-labels{position:relative}.bk-slider .bk-slider-runway .bk-slider-labels.vertical{left:18px;height:100%;width:10px;-webkit-box-orient:vertical;-ms-flex-direction:column;flex-direction:column}.bk-slider .bk-slider-runway .bk-slider-labels.horizontal,.bk-slider .bk-slider-runway .bk-slider-labels.vertical{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-direction:normal;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.bk-slider .bk-slider-runway .bk-slider-labels.horizontal{top:10px;width:100%;height:10px;-webkit-box-orient:horizontal;-ms-flex-direction:row;flex-direction:row}.bk-slider .bk-slider-runway .bk-slider-labels .bk-slider-label{position:absolute;width:10px;height:10px;text-align:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;white-space:nowrap}.bk-slider .bk-slider-runway .bk-slider-labels .bk-slider-label.vertical{left:10px;-webkit-transform:translateY(50%);transform:translateY(50%)}.bk-slider .bk-slider-runway .bk-slider-labels .bk-slider-label.horizontal{top:10px;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.bk-slider .bk-slider-interval{position:absolute;height:4px;width:4px;border-radius:100%;background-color:#fff;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.bk-slider .bk-slider-interval.vertical{left:2px}.bk-slider-input{margin:0 0 0 28px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.bk-slider-input .input-item{width:56px}.bk-slider-input .input-center{margin:0 7px}.bk-slider-button{height:24px;width:24px;position:absolute;z-index:1001;background-color:transparent;text-align:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;line-height:normal;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.bk-slider-button:hover{cursor:-webkit-grab;cursor:grab}.bk-slider-button.grabbing{cursor:-webkit-grabbing;cursor:grabbing}.bk-slider-button.vertical{left:-10px;-webkit-transform:translateY(50%);transform:translateY(50%)}.bk-slider-button.horizontal{top:-10px;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.bk-slider-button .slider-button{width:12px;height:12px;border:2px solid #3a84ff;border-radius:50%;background-color:#fff;-webkit-transition:.2s;transition:.2s;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.bk-slider-button .slider-button-disable{border:2px solid #979ba5}.bk-slider-button .slider-button:hover{-webkit-box-shadow:0 0 0 4px rgba(58,132,255,.3);box-shadow:0 0 0 4px rgba(58,132,255,.3)}.bk-slider-button .slider-button:focus{-webkit-box-shadow:0 0 10px 0 rgba(58,132,255,.9);box-shadow:0 0 10px 0 rgba(58,132,255,.9)}.bk-slider-button .slider-button-label{position:absolute;text-align:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.bk-slider-button .slider-button-label.vertical{left:28px}.bk-slider-button .slider-button-label.horizontal{top:20px}
+.bk-slider{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.bk-slider .bk-slider-runway{width:100%;height:4px;background:#dcdee5;position:relative;cursor:pointer;vertical-align:middle;opacity:1;border-radius:2px}.bk-slider .bk-slider-runway .bk-slider-bar{height:4px;border-top-left-radius:3px;border-bottom-left-radius:3px;position:absolute;background:#3a84ff}.bk-slider .bk-slider-runway .bk-slider-bar.vertical{width:4px}.bk-slider .bk-slider-runway .bk-slider-bar.horizontal{height:4px}.bk-slider .bk-slider-runway .disable{background:#979ba5}.bk-slider .bk-slider-runway .bk-slider-labels{position:relative;font-size:12px}.bk-slider .bk-slider-runway .bk-slider-labels.vertical{left:18px;height:100%;width:10px;-webkit-box-orient:vertical;-ms-flex-direction:column;flex-direction:column}.bk-slider .bk-slider-runway .bk-slider-labels.horizontal,.bk-slider .bk-slider-runway .bk-slider-labels.vertical{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-direction:normal;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.bk-slider .bk-slider-runway .bk-slider-labels.horizontal{top:10px;width:100%;height:10px;-webkit-box-orient:horizontal;-ms-flex-direction:row;flex-direction:row}.bk-slider .bk-slider-runway .bk-slider-labels .bk-slider-label{position:absolute;width:10px;height:10px;text-align:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;white-space:nowrap}.bk-slider .bk-slider-runway .bk-slider-labels .bk-slider-label.vertical{left:10px;-webkit-transform:translateY(50%);transform:translateY(50%)}.bk-slider .bk-slider-runway .bk-slider-labels .bk-slider-label.horizontal{top:10px;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.bk-slider .bk-slider-interval{position:absolute;height:4px;width:4px;border-radius:100%;background-color:#fff;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.bk-slider .bk-slider-interval.vertical{left:2px}.bk-slider-input{margin:0 0 0 28px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.bk-slider-input .input-item{width:56px}.bk-slider-input .input-center{margin:0 7px}.bk-slider-button{height:24px;width:24px;position:absolute;z-index:1001;background-color:transparent;text-align:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;line-height:normal;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.bk-slider-button:hover{cursor:-webkit-grab;cursor:grab}.bk-slider-button.grabbing{cursor:-webkit-grabbing;cursor:grabbing}.bk-slider-button.vertical{left:-10px;-webkit-transform:translateY(50%);transform:translateY(50%)}.bk-slider-button.horizontal{top:-10px;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.bk-slider-button .slider-button{width:12px;height:12px;border:2px solid #3a84ff;border-radius:50%;background-color:#fff;-webkit-transition:.2s;transition:.2s;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.bk-slider-button .slider-button-disable{border:2px solid #979ba5}.bk-slider-button .slider-button:hover{-webkit-box-shadow:0 0 0 4px rgba(58,132,255,.3);box-shadow:0 0 0 4px rgba(58,132,255,.3)}.bk-slider-button .slider-button:focus{-webkit-box-shadow:0 0 10px 0 rgba(58,132,255,.9);box-shadow:0 0 10px 0 rgba(58,132,255,.9)}.bk-slider-button .slider-button-label{position:absolute;text-align:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;font-size:12px}.bk-slider-button .slider-button-label.vertical{left:28px}.bk-slider-button .slider-button-label.horizontal{top:20px}
 /*# sourceMappingURL=slider.min.css.map */

package/lib/ui/slider.min.css.map

@@ -1 +1 @@
-{"version":3,"sources":["slider.css"],"names":[],"mappings":"AAEA,WACI,mBAAa,CAAb,mBAAa,CAAb,YAAa,CACb,6BAAmB,CAAnB,4BAAmB,CAAnB,sBAAmB,CAAnB,kBAAmB,CACnB,wBAAmB,CAAnB,qBAAmB,CAAnB,kBAuFJ,CAtFI,6BACI,UAAW,CACX,UAAW,CACX,kBAAmB,CACnB,iBAAkB,CAClB,cAAe,CACf,qBAAsB,CACtB,SAAU,CACV,iBAsDJ,CArDI,4CACI,UAAW,CACX,0BAA2B,CAC3B,6BAA8B,CAC9B,iBAAkB,CAClB,kBAOJ,CANI,qDACI,SACJ,CACA,uDACI,UACJ,CAEJ,sCACI,kBACJ,CACA,+CACI,iBAmCJ,CAlCI,wDACI,SAAU,CACV,WAAY,CACZ,UAAW,CAEX,2BAAsB,CAAtB,yBAAsB,CAAtB,qBAEJ,CACA,kHAJI,mBAAa,CAAb,mBAAa,CAAb,YAAa,CACb,4BAAsB,CACtB,wBAA8B,CAA9B,qBAA8B,CAA9B,6BASJ,CAPA,0DACI,QAAS,CACT,UAAW,CACX,WAAY,CAEZ,6BAAmB,CAAnB,sBAAmB,CAAnB,kBAEJ,CACA,gEACI,iBAAkB,CAClB,UAAW,CACX,WAAY,CACZ,iBAAkB,CAClB,mBAAa,CAAb,mBAAa,CAAb,YAAa,CACb,wBAAmB,CAAnB,qBAAmB,CAAnB,kBAAmB,CACnB,uBAAuB,CAAvB,oBAAuB,CAAvB,sBAAuB,CACvB,kBASJ,CARI,yEACI,SAAU,CACV,iCAA0B,CAA1B,yBACJ,CACA,2EACI,QAAS,CACT,kCAA2B,CAA3B,0BACJ,CAIZ,+BACI,iBAAkB,CAClB,UAAW,CACX,SAAU,CACV,kBAAmB,CACnB,qBAAsB,CACtB,kCAA2B,CAA3B,0BAIJ,CAHI,wCACI,QACJ,CAEJ,iBACI,iBAAkB,CAClB,mBAAa,CAAb,mBAAa,CAAb,YAAa,CACb,6BAAmB,CAAnB,4BAAmB,CAAnB,sBAAmB,CAAnB,kBAAmB,CACnB,wBAAmB,CAAnB,qBAAmB,CAAnB,kBAOJ,CANI,6BACI,UACJ,CACA,+BACI,YACJ,CAGR,kBACI,WAAY,CACZ,UAAW,CACX,iBAAkB,CAClB,YAAa,CACb,4BAA6B,CAC7B,iBAAkB,CAClB,wBAAiB,CAAjB,qBAAiB,CAAjB,oBAAiB,CAAjB,gBAAiB,CACjB,kBAAmB,CACnB,mBAAa,CAAb,mBAAa,CAAb,YAAa,CACb,uBAAuB,CAAvB,oBAAuB,CAAvB,sBAAuB,CACvB,wBAAmB,CAAnB,qBAAmB,CAAnB,kBA8CJ,CA7CI,wBACI,mBAAY,CAAZ,WACJ,CACA,2BACI,uBAAgB,CAAhB,eACJ,CACA,2BACI,UAAW,CACX,iCAA0B,CAA1B,yBACJ,CACA,6BACI,SAAU,CACV,kCAA2B,CAA3B,0BACJ,CACA,iCACI,UAAW,CACX,WAAY,CACZ,wBAA+B,CAC/B,iBAAkB,CAClB,qBAAsB,CACtB,sBAAe,CAAf,cAAe,CACf,wBAAiB,CAAjB,qBAAiB,CAAjB,oBAAiB,CAAjB,gBAUJ,CATI,yCACI,wBACJ,CACA,uCACI,gDAAoD,CAApD,wCACJ,CACA,uCACI,iDAAoD,CAApD,yCACJ,CAEJ,uCACI,iBAAkB,CAClB,iBAAkB,CAClB,mBAAa,CAAb,mBAAa,CAAb,YAAa,CACb,wBAAmB,CAAnB,qBAAmB,CAAnB,kBAAmB,CACnB,uBAAuB,CAAvB,oBAAuB,CAAvB,sBAOJ,CANI,gDACI,SACJ,CACA,kDACI,QACJ","file":"slider.min.css","sourcesContent":["@import './variable.css';\n\n.bk-slider {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    .bk-slider-runway {\n        width: 100%;\n        height: 4px;\n        background: #dcdee5;\n        position: relative;\n        cursor: pointer;\n        vertical-align: middle;\n        opacity: 1;\n        border-radius: 2px;\n        .bk-slider-bar {\n            height: 4px;\n            border-top-left-radius: 3px;\n            border-bottom-left-radius: 3px;\n            position: absolute;\n            background: #3a84ff;\n            &.vertical {\n                width: 4px;\n            }\n            &.horizontal {\n                height: 4px;\n            }\n        }\n        .disable {\n            background: #979ba5;\n        }\n        .bk-slider-labels {\n            position: relative;\n            &.vertical {\n                left: 18px;\n                height: 100%;\n                width: 10px;\n                display: flex;\n                flex-direction: column;\n                justify-content: space-between;\n            }\n            &.horizontal {\n                top: 10px;\n                width: 100%;\n                height: 10px;\n                display: flex;\n                flex-direction: row;\n                justify-content: space-between;\n            }\n            .bk-slider-label {\n                position: absolute;\n                width: 10px;\n                height: 10px;\n                text-align: center;\n                display: flex;\n                align-items: center;\n                justify-content: center;\n                white-space: nowrap;\n                &.vertical {\n                    left: 10px;\n                    transform: translateY(50%);\n                }\n                &.horizontal {\n                    top: 10px;\n                    transform: translateX(-50%);\n                }\n            }\n        }\n    }\n    .bk-slider-interval {\n        position: absolute;\n        height: 4px;\n        width: 4px;\n        border-radius: 100%;\n        background-color: #fff;\n        transform: translateX(-50%);\n        &.vertical {\n            left: 2px;\n        }\n    }\n    &-input {\n        margin: 0 0 0 28px;\n        display: flex;\n        flex-direction: row;\n        align-items: center;\n        .input-item {\n            width: 56px;\n        }\n        .input-center {\n            margin: 0 7px;\n        }\n    }\n}\n.bk-slider-button {\n    height: 24px;\n    width: 24px;\n    position: absolute;\n    z-index: 1001;\n    background-color: transparent;\n    text-align: center;\n    user-select: none;\n    line-height: normal;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    &:hover {\n        cursor: grab;\n    }\n    &.grabbing {\n        cursor: grabbing;\n    }\n    &.vertical {\n        left: -10px;\n        transform: translateY(50%);\n    }\n    &.horizontal {\n        top: -10px;\n        transform: translateX(-50%);\n    }\n    .slider-button {\n        width: 12px;\n        height: 12px;\n        border: 2px solid $newMainColor;\n        border-radius: 50%;\n        background-color: #fff;\n        transition: .2s;\n        user-select: none;\n        &-disable {\n            border: 2px solid #979ba5;\n        }\n        &:hover {\n            box-shadow: 0px 0px 0px 4px rgba(58, 132, 255, 0.30);\n        }\n        &:focus {\n            box-shadow: 0px 0px 10px 0px rgba(58, 132, 255, 0.9);\n        }\n    }\n    .slider-button-label {\n        position: absolute;\n        text-align: center;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        &.vertical {\n            left: 28px;\n        }\n        &.horizontal {\n            top: 20px;\n        }\n    }\n}\n"]}
+{"version":3,"sources":["slider.css"],"names":[],"mappings":"AAEA,WACI,mBAAa,CAAb,mBAAa,CAAb,YAAa,CACb,6BAAmB,CAAnB,4BAAmB,CAAnB,sBAAmB,CAAnB,kBAAmB,CACnB,wBAAmB,CAAnB,qBAAmB,CAAnB,kBAwFJ,CAvFI,6BACI,UAAW,CACX,UAAW,CACX,kBAAmB,CACnB,iBAAkB,CAClB,cAAe,CACf,qBAAsB,CACtB,SAAU,CACV,iBAuDJ,CAtDI,4CACI,UAAW,CACX,0BAA2B,CAC3B,6BAA8B,CAC9B,iBAAkB,CAClB,kBAOJ,CANI,qDACI,SACJ,CACA,uDACI,UACJ,CAEJ,sCACI,kBACJ,CACA,+CACI,iBAAkB,CAClB,cAmCJ,CAlCI,wDACI,SAAU,CACV,WAAY,CACZ,UAAW,CAEX,2BAAsB,CAAtB,yBAAsB,CAAtB,qBAEJ,CACA,kHAJI,mBAAa,CAAb,mBAAa,CAAb,YAAa,CACb,4BAAsB,CACtB,wBAA8B,CAA9B,qBAA8B,CAA9B,6BASJ,CAPA,0DACI,QAAS,CACT,UAAW,CACX,WAAY,CAEZ,6BAAmB,CAAnB,sBAAmB,CAAnB,kBAEJ,CACA,gEACI,iBAAkB,CAClB,UAAW,CACX,WAAY,CACZ,iBAAkB,CAClB,mBAAa,CAAb,mBAAa,CAAb,YAAa,CACb,wBAAmB,CAAnB,qBAAmB,CAAnB,kBAAmB,CACnB,uBAAuB,CAAvB,oBAAuB,CAAvB,sBAAuB,CACvB,kBASJ,CARI,yEACI,SAAU,CACV,iCAA0B,CAA1B,yBACJ,CACA,2EACI,QAAS,CACT,kCAA2B,CAA3B,0BACJ,CAIZ,+BACI,iBAAkB,CAClB,UAAW,CACX,SAAU,CACV,kBAAmB,CACnB,qBAAsB,CACtB,kCAA2B,CAA3B,0BAIJ,CAHI,wCACI,QACJ,CAEJ,iBACI,iBAAkB,CAClB,mBAAa,CAAb,mBAAa,CAAb,YAAa,CACb,6BAAmB,CAAnB,4BAAmB,CAAnB,sBAAmB,CAAnB,kBAAmB,CACnB,wBAAmB,CAAnB,qBAAmB,CAAnB,kBAOJ,CANI,6BACI,UACJ,CACA,+BACI,YACJ,CAGR,kBACI,WAAY,CACZ,UAAW,CACX,iBAAkB,CAClB,YAAa,CACb,4BAA6B,CAC7B,iBAAkB,CAClB,wBAAiB,CAAjB,qBAAiB,CAAjB,oBAAiB,CAAjB,gBAAiB,CACjB,kBAAmB,CACnB,mBAAa,CAAb,mBAAa,CAAb,YAAa,CACb,uBAAuB,CAAvB,oBAAuB,CAAvB,sBAAuB,CACvB,wBAAmB,CAAnB,qBAAmB,CAAnB,kBA+CJ,CA9CI,wBACI,mBAAY,CAAZ,WACJ,CACA,2BACI,uBAAgB,CAAhB,eACJ,CACA,2BACI,UAAW,CACX,iCAA0B,CAA1B,yBACJ,CACA,6BACI,SAAU,CACV,kCAA2B,CAA3B,0BACJ,CACA,iCACI,UAAW,CACX,WAAY,CACZ,wBAA+B,CAC/B,iBAAkB,CAClB,qBAAsB,CACtB,sBAAe,CAAf,cAAe,CACf,wBAAiB,CAAjB,qBAAiB,CAAjB,oBAAiB,CAAjB,gBAUJ,CATI,yCACI,wBACJ,CACA,uCACI,gDAAoD,CAApD,wCACJ,CACA,uCACI,iDAAoD,CAApD,yCACJ,CAEJ,uCACI,iBAAkB,CAClB,iBAAkB,CAClB,mBAAa,CAAb,mBAAa,CAAb,YAAa,CACb,wBAAmB,CAAnB,qBAAmB,CAAnB,kBAAmB,CACnB,uBAAuB,CAAvB,oBAAuB,CAAvB,sBAAuB,CACvB,cAOJ,CANI,gDACI,SACJ,CACA,kDACI,QACJ","file":"slider.min.css","sourcesContent":["@import './variable.css';\n\n.bk-slider {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    .bk-slider-runway {\n        width: 100%;\n        height: 4px;\n        background: #dcdee5;\n        position: relative;\n        cursor: pointer;\n        vertical-align: middle;\n        opacity: 1;\n        border-radius: 2px;\n        .bk-slider-bar {\n            height: 4px;\n            border-top-left-radius: 3px;\n            border-bottom-left-radius: 3px;\n            position: absolute;\n            background: #3a84ff;\n            &.vertical {\n                width: 4px;\n            }\n            &.horizontal {\n                height: 4px;\n            }\n        }\n        .disable {\n            background: #979ba5;\n        }\n        .bk-slider-labels {\n            position: relative;\n            font-size: $fnSmallSize;\n            &.vertical {\n                left: 18px;\n                height: 100%;\n                width: 10px;\n                display: flex;\n                flex-direction: column;\n                justify-content: space-between;\n            }\n            &.horizontal {\n                top: 10px;\n                width: 100%;\n                height: 10px;\n                display: flex;\n                flex-direction: row;\n                justify-content: space-between;\n            }\n            .bk-slider-label {\n                position: absolute;\n                width: 10px;\n                height: 10px;\n                text-align: center;\n                display: flex;\n                align-items: center;\n                justify-content: center;\n                white-space: nowrap;\n                &.vertical {\n                    left: 10px;\n                    transform: translateY(50%);\n                }\n                &.horizontal {\n                    top: 10px;\n                    transform: translateX(-50%);\n                }\n            }\n        }\n    }\n    .bk-slider-interval {\n        position: absolute;\n        height: 4px;\n        width: 4px;\n        border-radius: 100%;\n        background-color: #fff;\n        transform: translateX(-50%);\n        &.vertical {\n            left: 2px;\n        }\n    }\n    &-input {\n        margin: 0 0 0 28px;\n        display: flex;\n        flex-direction: row;\n        align-items: center;\n        .input-item {\n            width: 56px;\n        }\n        .input-center {\n            margin: 0 7px;\n        }\n    }\n}\n.bk-slider-button {\n    height: 24px;\n    width: 24px;\n    position: absolute;\n    z-index: 1001;\n    background-color: transparent;\n    text-align: center;\n    user-select: none;\n    line-height: normal;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    &:hover {\n        cursor: grab;\n    }\n    &.grabbing {\n        cursor: grabbing;\n    }\n    &.vertical {\n        left: -10px;\n        transform: translateY(50%);\n    }\n    &.horizontal {\n        top: -10px;\n        transform: translateX(-50%);\n    }\n    .slider-button {\n        width: 12px;\n        height: 12px;\n        border: 2px solid $newMainColor;\n        border-radius: 50%;\n        background-color: #fff;\n        transition: .2s;\n        user-select: none;\n        &-disable {\n            border: 2px solid #979ba5;\n        }\n        &:hover {\n            box-shadow: 0px 0px 0px 4px rgba(58, 132, 255, 0.30);\n        }\n        &:focus {\n            box-shadow: 0px 0px 10px 0px rgba(58, 132, 255, 0.9);\n        }\n    }\n    .slider-button-label {\n        position: absolute;\n        text-align: center;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        font-size: $fnSmallSize;\n        &.vertical {\n            left: 28px;\n        }\n        &.horizontal {\n            top: 20px;\n        }\n    }\n}\n"]}

package/lib/ui/spin.css

@@ -72,7 +72,7 @@
             }
 
 .bk-spin .bk-spin-rotation.bk-spin-rotation-info-wait .rotate{
-                background-color:#979ba5;
+                background-color:#63656e;
             }
 
 .bk-spin .bk-spin-rotation .rotate1{
@@ -223,6 +223,10 @@
         color:#ff5656
     }
 
+.bk-spin .bk-spin-icon-info{
+    	color:#979ba5;
+    }
+
 .bk-spin .bk-spin-icon-large i{
             font-size:69px;
         }

package/lib/ui/spin.min.css

@@ -1,2 +1,2 @@
-.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-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-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:#979ba5}.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-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-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 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)}}
+.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-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-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-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 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 */

package/lib/ui/spin.min.css.map

@@ -1 +1 @@
-{"version":3,"sources":["spin.css"],"names":[],"mappings":"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","file":"spin.min.css","sourcesContent":["@import './variable.css';\n\n.bk-spin {\n    display: inline-block;\n    position: relative;\n    text-align: center;\n    vertical-align: middle;\n    .bk-spin-rotation {\n        position: relative;\n        .rotate {\n            position: absolute;\n            top: 77%;\n            right: 43%;\n            width: 6px;\n            height: 8px;\n            transform-origin: 50% -10px;\n            border-radius: 8px;\n            transform: scale(0.4);\n            animation-name: fadePrimary;\n            animation-duration: 1.2s;\n            animation-iteration-count: infinite;\n            animation-direction: normal;\n        }\n        &.bk-spin-rotation-primary {\n            .rotate {\n                animation-name: fadePrimary;\n            }\n        }\n        &.bk-spin-rotation-success {\n            .rotate {\n                animation-name: fadeSuccess;\n            }\n        }\n        &.bk-spin-rotation-danger {\n            .rotate {\n                animation-name: fadeDanger;\n            }\n        }\n        &.bk-spin-rotation-warning {\n            .rotate {\n                animation-name: fadeWarning;\n            }\n        }\n        &.bk-spin-rotation-info {\n            .rotate {\n                animation-name: fadeInfo;\n            }\n        }\n        &.bk-spin-rotation-primary-wait {\n            .rotate {\n                background-color: $primaryColor;\n            }\n        }\n        &.bk-spin-rotation-success-wait {\n            .rotate {\n                background-color: $successColor;\n            }\n        }\n        &.bk-spin-rotation-danger-wait {\n            .rotate {\n                background-color: $dangerColor;\n            }\n        }\n        &.bk-spin-rotation-warning-wait {\n            .rotate {\n                background-color: $warningColor;\n            }\n        }\n        &.bk-spin-rotation-info-wait {\n            .rotate {\n                background-color: #979ba5;\n            }\n        }\n        .rotate1 {\n            animation-delay: 0.45s;\n            transform: rotate(-90deg);\n        }\n        .rotate2 {\n            animation-delay: 0.6s;\n            transform: rotate(-45deg);\n        }\n        .rotate3 {\n            animation-delay: 0.75s;\n            transform: rotate(0deg);\n        }\n        .rotate4 {\n            animation-delay: 0.9s;\n            transform: rotate(45deg);\n        }\n        .rotate5 {\n            animation-delay: 1.05s;\n            transform: rotate(90deg);\n        }\n        .rotate6 {\n            animation-delay: 1.2s;\n            transform: rotate(135deg);\n        }\n        .rotate7 {\n            animation-delay: 1.35s;\n            transform: rotate(180deg);\n        }\n        .rotate8 {\n            animation-delay: 1.5s;\n            transform: rotate(-135deg);\n        }\n    }\n    .bk-spin-rotation-flex {\n        display: flex;\n        flex-shrink: 0;\n    }\n    .bk-spin-rotation-margin {\n        margin: 0 auto;\n    }\n    .bk-spin-rotation-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-rotation-normal {\n        width: 49px;\n        height: 49px;\n        .rotate {\n            width: 6px;\n            height: 9px;\n            transform-origin: 50% -13px;\n        }\n    }\n    .bk-spin-rotation-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-rotation-mini {\n        width: 16px;\n        height: 16px;\n        .rotate {\n            width: 2px;\n            height: 3px;\n            transform-origin: 50% -4px;\n        }\n    }\n    .bk-spin-icon {\n        color: $primaryColor;\n        font-size: 16px;\n        animation: icon-loading 1.2s linear infinite;\n        i {\n            vertical-align: middle\n        }\n    }\n    .bk-spin-icon-wait {\n        animation: none\n    }\n    .bk-spin-icon-primary {\n        color: $primaryColor\n    }\n    .bk-spin-icon-success {\n        color: $successColor\n    }\n    .bk-spin-icon-warning {\n        color: $warningColor\n    }\n    .bk-spin-icon-danger {\n        color: $dangerColor\n    }\n    .bk-spin-icon-large {\n        i {\n            font-size: 69px;\n        }\n    }\n    .bk-spin-icon-normal {\n        i {\n            font-size: 49px;\n        }\n    }\n    .bk-spin-icon-small {\n        i {\n            font-size: 27px;\n        }\n    }\n    .bk-spin-icon-nimi {\n        i {\n            font-size: 16px;\n        }\n    }\n    .bk-spin-title {\n        text-align: center;\n        font-size: 14px;\n        color: $fnMainColor;\n        line-height: initial;\n        max-width: 100%;\n    }\n    .bk-spin-title-right {\n        display: inline-block;\n        padding-left: 8px;\n    }\n    .bk-spin-title-bottom {\n        margin-top: 8px;\n    }\n    .bk-spin-title-large {\n        height: 69px;\n    }\n    .bk-spin-title-normal {\n        height: 49px;\n    }\n    .bk-spin-title-small {\n        height: 27px;\n    }\n    .bk-spin-title-mini {\n        height: 16px;\n    }\n    .bk-display-flex {\n        display: flex;\n        align-items: center;\n    }\n}\n\n@keyframes fadePrimary {\n    0% {\n        background-color: $primaryColor;\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@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@keyframes fadeInfo {\n    0% {\n        background-color: #979ba5;\n    }\n\n    100% {\n        background-color: none;\n    }\n}\n\n@keyframes icon-loading {\n    0% {\n        transform: rotate(0deg);\n    }\n    100% {\n        transform: rotate(360deg);\n    }\n}"]}
+{"version":3,"sources":["spin.css"],"names":[],"mappings":"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","file":"spin.min.css","sourcesContent":["@import './variable.css';\n\n.bk-spin {\n    display: inline-block;\n    position: relative;\n    text-align: center;\n    vertical-align: middle;\n    .bk-spin-rotation {\n        position: relative;\n        .rotate {\n            position: absolute;\n            top: 77%;\n            right: 43%;\n            width: 6px;\n            height: 8px;\n            transform-origin: 50% -10px;\n            border-radius: 8px;\n            transform: scale(0.4);\n            animation-name: fadePrimary;\n            animation-duration: 1.2s;\n            animation-iteration-count: infinite;\n            animation-direction: normal;\n        }\n        &.bk-spin-rotation-primary {\n            .rotate {\n                animation-name: fadePrimary;\n            }\n        }\n        &.bk-spin-rotation-success {\n            .rotate {\n                animation-name: fadeSuccess;\n            }\n        }\n        &.bk-spin-rotation-danger {\n            .rotate {\n                animation-name: fadeDanger;\n            }\n        }\n        &.bk-spin-rotation-warning {\n            .rotate {\n                animation-name: fadeWarning;\n            }\n        }\n        &.bk-spin-rotation-info {\n            .rotate {\n                animation-name: fadeInfo;\n            }\n        }\n        &.bk-spin-rotation-primary-wait {\n            .rotate {\n                background-color: $primaryColor;\n            }\n        }\n        &.bk-spin-rotation-success-wait {\n            .rotate {\n                background-color: $successColor;\n            }\n        }\n        &.bk-spin-rotation-danger-wait {\n            .rotate {\n                background-color: $dangerColor;\n            }\n        }\n        &.bk-spin-rotation-warning-wait {\n            .rotate {\n                background-color: $warningColor;\n            }\n        }\n        &.bk-spin-rotation-info-wait {\n            .rotate {\n                background-color: #63656e;\n            }\n        }\n        .rotate1 {\n            animation-delay: 0.45s;\n            transform: rotate(-90deg);\n        }\n        .rotate2 {\n            animation-delay: 0.6s;\n            transform: rotate(-45deg);\n        }\n        .rotate3 {\n            animation-delay: 0.75s;\n            transform: rotate(0deg);\n        }\n        .rotate4 {\n            animation-delay: 0.9s;\n            transform: rotate(45deg);\n        }\n        .rotate5 {\n            animation-delay: 1.05s;\n            transform: rotate(90deg);\n        }\n        .rotate6 {\n            animation-delay: 1.2s;\n            transform: rotate(135deg);\n        }\n        .rotate7 {\n            animation-delay: 1.35s;\n            transform: rotate(180deg);\n        }\n        .rotate8 {\n            animation-delay: 1.5s;\n            transform: rotate(-135deg);\n        }\n    }\n    .bk-spin-rotation-flex {\n        display: flex;\n        flex-shrink: 0;\n    }\n    .bk-spin-rotation-margin {\n        margin: 0 auto;\n    }\n    .bk-spin-rotation-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-rotation-normal {\n        width: 49px;\n        height: 49px;\n        .rotate {\n            width: 6px;\n            height: 9px;\n            transform-origin: 50% -13px;\n        }\n    }\n    .bk-spin-rotation-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-rotation-mini {\n        width: 16px;\n        height: 16px;\n        .rotate {\n            width: 2px;\n            height: 3px;\n            transform-origin: 50% -4px;\n        }\n    }\n    .bk-spin-icon {\n        color: $primaryColor;\n        font-size: 16px;\n        animation: icon-loading 1.2s linear infinite;\n        i {\n            vertical-align: middle\n        }\n    }\n    .bk-spin-icon-wait {\n        animation: none\n    }\n    .bk-spin-icon-primary {\n        color: $primaryColor\n    }\n    .bk-spin-icon-success {\n        color: $successColor\n    }\n    .bk-spin-icon-warning {\n        color: $warningColor\n    }\n    .bk-spin-icon-danger {\n        color: $dangerColor\n    }\n    .bk-spin-icon-info {\n    \tcolor: #979ba5;\n    }\n    .bk-spin-icon-large {\n        i {\n            font-size: 69px;\n        }\n    }\n    .bk-spin-icon-normal {\n        i {\n            font-size: 49px;\n        }\n    }\n    .bk-spin-icon-small {\n        i {\n            font-size: 27px;\n        }\n    }\n    .bk-spin-icon-nimi {\n        i {\n            font-size: 16px;\n        }\n    }\n    .bk-spin-title {\n        text-align: center;\n        font-size: 14px;\n        color: $fnMainColor;\n        line-height: initial;\n        max-width: 100%;\n    }\n    .bk-spin-title-right {\n        display: inline-block;\n        padding-left: 8px;\n    }\n    .bk-spin-title-bottom {\n        margin-top: 8px;\n    }\n    .bk-spin-title-large {\n        height: 69px;\n    }\n    .bk-spin-title-normal {\n        height: 49px;\n    }\n    .bk-spin-title-small {\n        height: 27px;\n    }\n    .bk-spin-title-mini {\n        height: 16px;\n    }\n    .bk-display-flex {\n        display: flex;\n        align-items: center;\n    }\n}\n\n@keyframes fadePrimary {\n    0% {\n        background-color: $primaryColor;\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@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@keyframes fadeInfo {\n    0% {\n        background-color: #979ba5;\n    }\n\n    100% {\n        background-color: none;\n    }\n}\n\n@keyframes icon-loading {\n    0% {\n        transform: rotate(0deg);\n    }\n    100% {\n        transform: rotate(360deg);\n    }\n}"]}