hy-checkbox/lib/DatePicker/datePicker.less

checkbox & radio ui components for react

/*
 * @Author: SiMeiyu 
 * @Date: 2017-07-04 09:59:42 
 */ 
@import "../../app/variables.less";

.@{ult-prefix}-datePicker {
  // display: inline-block;
  &-calendar {
    margin: 34px 0;
  }
}
.@{ult-prefix}-rangePicker {
  &-input {
    padding: 0;
    position: relative;
    &.@{ult-prefix}-input-icon {
      padding-left: @base-space + 12px;
    }
    &.@{ult-prefix}-input-icon-right {
      padding-left: 0;
      padding-right: @base-space + 12px;
    }
    &-start, &-end {
      width: 50%;
      border: none;
      box-shadow: none;
      padding: @base-space / 2 @base-space;
      line-height: @base-space * 3 - 2px;
      color: @input-color;
      font-size: @font-size-base;
    }
    &::after {
      content: "~";
      position: absolute;
      left: 50%;
      top: 0;
      font-size: 14px;
      line-height: @base-space * 4;;
      color: @input-disable-color;
      margin-left: -7px;
    }
    &.@{ult-prefix}-input-icon {
      &::after {
        margin-left: 3px;
      }
    }
    &.@{ult-prefix}-input-icon-right {
      &::after {
        margin-left: -17px;
      }
    }
    &-disabled {
      cursor: not-allowed;
      border-color: @input-disable-border;
      .@{ult-prefix}-rangePicker-input-start, .@{ult-prefix}-rangePicker-input-end {
        background-color: @input-disable-bg;
        color: @input-disable-color;
      }
    }
  }
}