bk-vue-cec/lib/ui/resize-layout.min.css.map

一个为运维业务场景而生，好看易用的Vue2原创组件库，由T-inside Design进行托管社区化运作

{"version":3,"sources":["resize-layout.css"],"names":[],"mappings":"AAMA,kBACI,mBAAa,CAAb,mBAAa,CAAb,YAgNJ,CA/MI,yBACI,wBACJ,CAGQ,oFACI,eACJ,CACA,+EACI,oBAAqB,CACrB,gCAAyB,CAAzB,wBACJ,CAIR,uBACI,6BAAmB,CAAnB,4BAAmB,CAAnB,sBAAmB,CAAnB,kBAyBJ,CAvBI,+CACI,8BAqBJ,CApBI,qDACI,SAAU,CACV,OAAQ,CACR,uCAAkC,CAAlC,+BACJ,CACA,kEACI,KAAM,CACN,SAAU,CACV,SAAU,CACV,WAAY,CACZ,iBAIJ,CAHI,wEApCZ,oHAsCY,CAEJ,mEACI,SAAU,CACV,OAAQ,CACR,kCAA2B,CAA3B,0BACJ,CAIR,wBACI,6BAA2B,CAA3B,6BAA2B,CAA3B,8BAA2B,CAA3B,0BA0BJ,CAxBI,gDACI,6BAsBJ,CArBI,sDACI,QAAS,CACT,OAAQ,CACR,uCAAkC,CAAlC,+BACJ,CACA,mEACI,KAAM,CACN,UAAW,CACX,SAAU,CACV,WAAY,CACZ,iBAKJ,CAHI,yEAjEZ,mHAmEY,CAEJ,oEACI,UAAW,CACX,OAAQ,CACR,iDAA0C,CAA1C,yCACJ,CAIR,sBACI,2BAAsB,CAAtB,4BAAsB,CAAtB,yBAAsB,CAAtB,qBA2BJ,CAzBI,8CACI,+BAuBJ,CAtBI,oDACI,UAAW,CACX,QAAS,CACT,qDAAgD,CAAhD,6CACJ,CACA,iEACI,MAAO,CACP,QAAS,CACT,UAAW,CACX,UAAW,CACX,iBAKJ,CAHI,uEA9FZ,kHAgGY,CAEJ,kEACI,QAAS,CACT,QAAS,CACT,cAAe,CACf,wDAAmD,CAAnD,gDACJ,CAIR,yBACI,2BAA8B,CAA9B,6BAA8B,CAA9B,iCAA8B,CAA9B,6BA2BJ,CAzBI,iDACI,4BAuBJ,CAtBI,uDACI,OAAQ,CACR,QAAS,CACT,qDAAgD,CAAhD,6CACJ,CACA,oEACI,MAAO,CACP,WAAY,CACZ,UAAW,CACX,UAAW,CACX,iBAKJ,CAHI,0EA5HZ,oHA8HY,CAEJ,qEACI,WAAY,CACZ,QAAS,CACT,iBAAkB,CAClB,uDAAkD,CAAlD,+CACJ,CAIR,0CACI,iBA0DJ,CAzDI,gDACI,UAAW,CACX,iBAAkB,CAClB,SAAU,CACV,UAAW,CACX,aAAc,CACd,uBAAwB,CACxB,gHAA4G,CAA5G,wGACJ,CACA,0EACI,UAAW,CACX,WAAY,CACZ,eACJ,CACA,6DACI,iBAAkB,CAClB,4BAA6B,CAC7B,SACJ,CAEA,2DACI,iBAAkB,CAClB,iBAAkB,CAClB,mBAAoB,CACpB,YAeJ,CAbI,iIAEI,KAAM,CACN,WAAY,CACZ,8BACJ,CAEA,iIAEI,MAAO,CACP,UAAW,CACX,6BACJ,CAEJ,8DACI,iBAAkB,CAClB,UAAW,CACX,WAAY,CACZ,gBAAiB,CACjB,2BAAgC,CAChC,kBAAmB,CACnB,iBAAkB,CAClB,cAAe,CACf,UAAW,CACX,cAAe,CACf,gBAAiB,CACjB,SAIJ,CAHI,oEACI,kBACJ,CAIR,yCACI,kBAAO,CAAP,UAAO,CAAP,MAAO,CACP,eACJ,CAEA,kCACI,YAAa,CACb,cAAe,CACf,MAAO,CACP,OAAQ,CACR,KAAM,CACN,QAAS,CACT,YACJ","file":"resize-layout.min.css","sourcesContent":["@import './variable.css';\r\n\r\n@define-mixin linear-gradient $direction {\r\n    background-image: linear-gradient(to $direction, transparent, transparent 2px, $newMainColor 2px, $newMainColor 3px, transparent 3px, transparent);\r\n}\r\n\r\n.bk-resize-layout {\r\n    display: flex;\r\n    &-border {\r\n        border: 1px solid $newGreyColor1;\r\n    }\r\n    &-collapsed {\r\n        & > .bk-resize-layout-aside {\r\n            .bk-resize-layout-aside-content {\r\n                overflow: hidden;\r\n            }\r\n            .bk-resize-collapse:before {\r\n                display: inline-block;\r\n                transform: rotate(180deg);\r\n            }\r\n        }\r\n    }\r\n\r\n    &-left {\r\n        flex-direction: row;\r\n\r\n        & > .bk-resize-layout-aside {\r\n            border-right: 1px solid $newGreyColor1;\r\n            &:after {\r\n                right: 1px;\r\n                top: 50%;\r\n                transform: translate3d(0, -50%, 0);\r\n            }\r\n            .bk-resize-trigger {\r\n                top: 0;\r\n                left: 100%;\r\n                width: 5px;\r\n                height: 100%;\r\n                cursor: col-resize;\r\n                &:hover {\r\n                    @mixin linear-gradient left;\r\n                }\r\n            }\r\n            .bk-resize-collapse {\r\n                left: 100%;\r\n                top: 50%;\r\n                transform: translateY(-50%);\r\n            }\r\n        }\r\n    }\r\n\r\n    &-right {\r\n        flex-direction: row-reverse;\r\n\r\n        & > .bk-resize-layout-aside {\r\n            border-left: 1px solid $newGreyColor1;\r\n            &:after {\r\n                left: 1px;\r\n                top: 50%;\r\n                transform: translate3d(0, -50%, 0);\r\n            }\r\n            .bk-resize-trigger {\r\n                top: 0;\r\n                right: 100%;\r\n                width: 5px;\r\n                height: 100%;\r\n                cursor: col-resize;\r\n\r\n                &:hover {\r\n                    @mixin linear-gradient right;\r\n                }\r\n            }\r\n            .bk-resize-collapse {\r\n                right: 100%;\r\n                top: 50%;\r\n                transform: translateY(-50%) rotate(180deg);\r\n            }\r\n        }\r\n    }\r\n\r\n    &-top {\r\n        flex-direction: column;\r\n\r\n        & > .bk-resize-layout-aside {\r\n            border-bottom: 1px solid $newGreyColor1;\r\n            &:after {\r\n                bottom: 1px;\r\n                left: 50%;\r\n                transform: translate3d(-50%, 0, 0) rotate(90deg);\r\n            }\r\n            .bk-resize-trigger {\r\n                left: 0;\r\n                top: 100%;\r\n                width: 100%;\r\n                height: 5px;\r\n                cursor: row-resize;\r\n\r\n                &:hover {\r\n                    @mixin linear-gradient top;\r\n                }\r\n            }\r\n            .bk-resize-collapse {\r\n                top: 100%;\r\n                left: 50%;\r\n                margin-top: 8px;\r\n                transform: translate3d(-50%, -50%, 0) rotate(90deg);\r\n            }\r\n        }\r\n    }\r\n\r\n    &-bottom {\r\n        flex-direction: column-reverse;\r\n\r\n        & > .bk-resize-layout-aside {\r\n            border-top: 1px solid $newGreyColor1;\r\n            &:after {\r\n                top: 1px;\r\n                left: 50%;\r\n                transform: translate3d(-50%, 0, 0) rotate(90deg);\r\n            }\r\n            .bk-resize-trigger {\r\n                left: 0;\r\n                bottom: 100%;\r\n                width: 100%;\r\n                height: 5px;\r\n                cursor: row-resize;\r\n\r\n                &:hover {\r\n                    @mixin linear-gradient bottom;\r\n                }\r\n            }\r\n            .bk-resize-collapse {\r\n                bottom: 100%;\r\n                left: 50%;\r\n                margin-bottom: 8px;\r\n                transform: translate3d(50%, 50%, 0) rotate(-90deg);\r\n            }\r\n        }\r\n    }\r\n\r\n    & > .bk-resize-layout-aside {\r\n        position: relative;\r\n        &:after {\r\n            content: '';\r\n            position: absolute;\r\n            width: 2px;\r\n            height: 2px;\r\n            color: #c4c6cc;\r\n            background: currentColor;\r\n            box-shadow: 0 4px 0 0 currentColor, 0 8px 0 0 currentColor, 0 -4px 0 0 currentColor, 0 -8px 0 0 currentColor;\r\n        }\r\n        .bk-resize-layout-aside-content {\r\n            width: 100%;\r\n            height: 100%;\r\n            overflow: hidden;\r\n        }\r\n        .bk-resize-trigger {\r\n            position: absolute;\r\n            background-color: transparent;\r\n            z-index: 3;\r\n        }\r\n\r\n        .bk-resize-proxy {\r\n            visibility: hidden;\r\n            position: absolute;\r\n            pointer-events: none;\r\n            z-index: 9999;\r\n\r\n            &.left,\r\n            &.right {\r\n                top: 0;\r\n                height: 100%;\r\n                border-left: 1px dashed $newMainColor;\r\n            }\r\n\r\n            &.top,\r\n            &.bottom {\r\n                left: 0;\r\n                width: 100%;\r\n                border-top: 1px dashed $newMainColor;\r\n            }\r\n        }\r\n        .bk-resize-collapse {\r\n            position: absolute;\r\n            width: 16px;\r\n            height: 50px;\r\n            line-height: 50px;\r\n            border-radius: 0px 12px 12px 0px;\r\n            background: #dcdee5;\r\n            text-align: center;\r\n            font-size: 20px;\r\n            color: #fff;\r\n            cursor: pointer;\r\n            text-indent: -2px;\r\n            z-index: 2;\r\n            &:hover {\r\n                background: $newMainColor;\r\n            }\r\n        }\r\n    }\r\n\r\n    & > .bk-resize-layout-main {\r\n        flex: 1;\r\n        overflow: hidden;\r\n    }\r\n\r\n    .bk-resize-mask {\r\n        display: none;\r\n        position: fixed;\r\n        left: 0;\r\n        right: 0;\r\n        top: 0;\r\n        bottom: 0;\r\n        z-index: 9999;\r\n    }\r\n}\r\n"]}