zarm-web/lib/transfer/style/index.css

基于 React 的桌面端UI库

/* border */
/* box shadow */
/* btn */
.ui-transfer {
  width: 400px;
  height: 250px;
  max-height: 250px;
}
.ui-transfer > .ui-transfer-panel {
  display: inline-block;
  width: 40%;
  height: 100%;
}
.ui-transfer > .ui-transfer-panel > .ui-transfer-panel-title {
  margin-bottom: 10px;
  height: 20px;
}
.ui-transfer > .ui-transfer-panel > .ui-select {
  width: 100%;
  height: calc(100% - 30px);
  vertical-align: initial;
}
.ui-transfer > .ui-transfer-panel > .ui-select > .ui-select-selection {
  width: 100%;
  height: 100%;
  text-align: left;
}
.ui-transfer > .ui-transfer-panel > .ui-select > .ui-select-selection .ui-menu-item:hover {
  background: #eaf8fe !important;
}
.ui-transfer > .ui-transfer-panel > .ui-select > .ui-select-selection .ui-menu-item.active {
  color: inherit;
  background: inherit;
}
.ui-transfer > .ui-transfer-panel > .ui-select > .ui-select-selection .ui-menu-item.selected {
  background: #d5f1fd !important;
}
.ui-transfer > .ui-transfer-action-bar {
  width: 36px;
  height: 100%;
  margin-left: 4%;
  margin-right: 4%;
  display: inline-block;
  position: relative;
}
.ui-transfer > .ui-transfer-action-bar > .button-wrapper {
  width: 100%;
  height: 84px;
  position: absolute;
  top: 15px;
  bottom: 15px;
  margin-top: auto;
  margin-bottom: auto;
}
.ui-transfer > .ui-transfer-action-bar > .button-wrapper > button:last-child {
  margin-top: 20px;
}