yonui-ys/lib/style/button.less

yonui ys

@btn-color: #535a69;
// default 按钮的背景色
@btn-default-bg: #eef1f3;
@btn-default-bg-hover: #d5d8da;
// btn-group-bottom 中按钮背景色
@btn-group-bottom-bg: #E5E9EC;

.u-input-group-btn {
  font-size: 14px;
}

.u-button-default {
  background: @btn-default-bg;
  border: none;
  color: #555c6a;
}

.u-button-default.active,
.u-button-default:active,
.u-button-default:focus,
.u-button-default:hover {
  background: @btn-default-bg-hover;
  border: none;
  color: @btn-color;
}

.filter-btn-fixed .filter-btn-1 .ant-btn {
  padding: 0 12px;
}

/*自定义页面样式*/
.userDefinedArchives {
  .col-all {
    width: 100%;
  }

  .ant-btn-ghost:hover {
    color: @primary-color-hover !important;
  }

  .button-selected-true {
    color: @primary-color-hover !important;
  }
}

// ========== from adapter start ====================
.u-popover .u-button {
  min-width: auto;
}

.u-input-group.simple .u-form-control:not(:last-child) {
  // padding-right: 0;影响参照控件文字多长时显示
}
// ========== from adapter end ====================

// ========== from form.less start ====================

.button-group {
  padding: 10px 15px;
}

.btn-group-bottom .u-button {
  background: #E5E9EC;
  border: none;
}

.btn-group-bottom .u-button:hover {
  background: #DBE0E5;
  border: none;
}

.btn-group-bottom .u-button:active,
.btn-group-bottom .u-button:visited {
  background: #DBE0E5;
  border: none;
}

.u-button-primary:hover,
.u-button-primary:focus,
.btn-group-bottom .u-button-primary:hover {
  color: #fff;
  background: linear-gradient(-225deg, #fc4c2f, #ee2223);
  border: none;
}

.u-button-primary,
.btn-group-bottom .u-button-primary {
  color: #fff;
  background: linear-gradient(-45deg, #FC4C2F 0%, #EE2223 100%);
  border: none;
}

.listheadRow .btn-toolbar-bottom {
  .u-button-primary {
    svg {
      width: 13px;
      height: 13px;
    }
  }
}

.Toolbar_Group_Length1 {

  .u-button.u-button-uppage,
  .u-button.u-button-downpage {
    min-width: 32px;
    width: 32px;
    // padding: 6px 7px;
    padding: 0 7px;
  }
}

.btn-toolbar-bottom .Toolbar_Group .u-button {
  margin-left: -1px;
}

.Toolbar_Group .u-button-group {
  span.dropdown-btn-icon {
    width: 20px;
    text-align: center;
    & > i.uf-arrow-down {
      padding: 0;
    }
  }
}

// 不带分割线的下拉按钮
.Toolbar_Group_Length1 .u-button.Toolbar_Common_Btn {
  padding: 0 10px 0 12px;
}

// ========== from form.less end ====================

// ========== from home.less start ====================
.tab-list .u-tabs-content .p-l-20 .u-button {
  font-size: 14px;
  padding: 0;
  height: 38px;
  width: 140px;
  margin-top: 10px;
}

// ========== from home.less end ====================

// ========== from modal.less start ====================
.btn-toolbar-bottom {
  button+button {
    margin-left: 8px;
  }
}

.uretail_confirm .u-modal-footer button + button {
  margin-left: 0;
}

.u-confirm-btns,
.u-modal-footer {
  button {
    padding: 0px 20px;
    height: @base-input-height;
    // font-size: 14px !important;
    border-radius: 4px;
    border: none;
    background: #EEF1F3;
    color: #505766;
  }

  button.u-button-primary {
    background: @primary-color;
    color: #fff !important;
  }

  button:hover {
    background: rgba(0, 0, 0, 0.1);
  }

  button.u-button-primary:hover {
    background: @primary-color-hover;
    // border-color: #FC4C2F;
    color: #333;
  }

  button+button {
    margin-left: 8px;
  }
}

.list-top-toolbar {

  .u-button-uppage .icon,
  .u-button-downpage .icon {
    height: 12px;
  }
}

.list-top-toolbar .ant-row-flex .u-button:first-child {
  margin-left: 0 !important;
}

.u-modal-footer .u-button {
  font-size: 12px;
  padding: 0 18px;
}


//底部toolbar按钮第一个为红色 最后一个为灰色中间都为蓝灰色 .btn-toolbar-bottom .ant-btn-primary:nth-child(2){background: #505766;}
// .btn-toolbar-bottom .ant-btn-primary:nth-child(2):hover{background:#616875}
.bottom-toolbar .u-button {
  background: #505766;
  color: #fff;
}

.bottom-toolbar .u-button:hover {
  background: #616875;
  color: #fff;
}

.bottom-toolbar .u-button:last-child:not(.u-button-primary) {
  background: #dbe0e5;
  border: none;
  color: #535a69;
  &:hover {
    background: #e5e9ec;
  }
}

.testBtn {
  background: #505766 !important;
}

.testBtn:hover {
  background: #616875 !important;
}

.u-modal-body {
  .bottom-toolbar .u-button {
    &:first-child {
      background: #e5e9ec;
      border: none;
      color: #535a69 !important;

      &:active,
      &:hover,
      &:visited {
        background: #dbe0e5;
        border: none;
      }
    }
    &:last-child {
      margin-left: 0;
      color: #fff !important;
      background: @primary-color;
      border: none;

      &:hover {
        background: @primary-color-hover;
        color: #fff;
      }
    }
  }

}

// ========== from modal.less end ====================

// 部分modal 底部按钮父样式为 btn-toolbar-bottom
.u-modal-dialog .btn-toolbar-bottom {
  .u-button:not(:first-child):not(:last-child) {
    background: @custom-color  !important;
    border: none;
    padding: 0 20px;
    min-width: 68px;
    color: #fff !important;

    &:hover {
      background: @custom-color-hover  !important;
      color: #fff;
    }
  }
}

// 工程侧使用的 ant 适配
.ant-btn-primary:hover,
.ant-btn-primary:focus,
.btn-group-bottom .ant-btn-primary:hover {
  color: #fff;
  background: linear-gradient(-225deg, #fc4c2f, #ee2223);
  border: none;
}

.ant-btn-primary,
.btn-group-bottom .ant-btn-primary {
  color: #fff;
  background: linear-gradient(-45deg, #FC4C2F 0%, #EE2223 100%);
  border: none;
}

.ant-btn-lg {
  height: @base-input-height;
}

.ant-modal-footer > .ant-btn:first-child {
  background: #e5e9ec;
  border: none;
  color: #535a69;
}

.ant-modal-footer {
  .u-button.u-button-border {
    background-color: #eceff1;
    border: none;
    color: #505766;
    &:hover {
      background-color: #dfe1e6;
      border: none;
    }
  }
}