@cw-devops/bk-magic-vue
Version:
基于蓝鲸 Magicbox 和 Vue 的前端组件库
3 lines (2 loc) • 3.5 kB
CSS
.bk-transfer{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-pack:center;-ms-flex-pack:center;justify-content:center;position:relative;font-size:14px}.bk-transfer .transfer{width:30px;height:30px;position:absolute;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);top:50%;left:50%;background:url(images/transfer.png) no-repeat 50%}.bk-transfer .source-list,.bk-transfer .target-list{-webkit-box-flex:1;-ms-flex:1;flex:1;min-width:200px;height:400px;background-color:#fff;border-radius:2px;border:1px solid #dde4eb;overflow:hidden}.bk-transfer .source-list .slot-header,.bk-transfer .target-list .slot-header{height:43px;line-height:43px;background-color:#fafbfd;border-bottom:1px solid #dde4eb;padding:0 20px;position:relative}.bk-transfer .source-list .slot-header .slot-content,.bk-transfer .target-list .slot-header .slot-content{position:relative}.bk-transfer .source-list .header,.bk-transfer .target-list .header{height:43px;line-height:43px;background-color:#fafbfd;border-bottom:1px solid #dde4eb;padding:0 20px;position:relative}.bk-transfer .source-list .header span,.bk-transfer .target-list .header span{position:absolute;right:10px;font-size:12px;color:#3a84ff;cursor:pointer}.bk-transfer .source-list .header span.disabled,.bk-transfer .target-list .header span.disabled{color:#c4c6cc;cursor:not-allowed}.bk-transfer .source-list .empty,.bk-transfer .target-list .empty{width:100%;position:relative;top:40%;text-align:center;color:#c4c6cc;cursor:default}.bk-transfer .source-list .content,.bk-transfer .target-list .content{max-height:82%;overflow-y:auto;position:relative;padding:0;margin:6px 0}.bk-transfer .source-list .content li,.bk-transfer .target-list .content li{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:40px;line-height:40px;padding:0 20px;list-style:none;cursor:pointer;position:relative}.bk-transfer .source-list .content li:hover,.bk-transfer .target-list .content li:hover{background-color:#eef6fe;color:#3a84ff}.bk-transfer .source-list .content li.is-disabled,.bk-transfer .target-list .content li.is-disabled{cursor:not-allowed;color:#c4c6cc;background-color:#fff}.bk-transfer .source-list .content li .content-text,.bk-transfer .target-list .content li .content-text{-webkit-box-flex:1;-ms-flex:1;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bk-transfer .source-list .content li .icon-wrapper,.bk-transfer .target-list .content li .icon-wrapper{-webkit-box-flex:22px;-ms-flex:22px 0 0px;flex:22px 0 0;display:none}.bk-transfer .source-list .content li .icon-wrapper.hover,.bk-transfer .target-list .content li .icon-wrapper.hover{display:inline-block}.bk-transfer .source-list .content::-webkit-scrollbar,.bk-transfer .target-list .content::-webkit-scrollbar{width:4px;background-color:hsla(0,0%,80%,0)}.bk-transfer .source-list .content::-webkit-scrollbar-thumb,.bk-transfer .target-list .content::-webkit-scrollbar-thumb{height:5px;border-radius:2px;background-color:#e6e9ea}.bk-transfer .source-list .content .bk-icon,.bk-transfer .target-list .content .bk-icon{font-size:22px}.bk-transfer .target-list{margin-left:33px}.bk-transfer .transfer-search-input{border-bottom:1px solid #f0f1f5}.bk-transfer .transfer-search-input .bk-form-input{height:36px;line-height:34px;border:none}
/*# sourceMappingURL=transfer.min.css.map */