@lxlib/theme/styles/app/lxlib/_sf.less

This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 9.1.1.

@sf-prefix: ~'.sf';
@sf-title-text-align: left;

@{sf-prefix} {
  display: block;
  &__optional {
    color: rgba(0, 0, 0, 0.45);
  }
  // 固定 label
  &__fixed {
    display: flex !important;
    nz-form-control,
    .@{ant-prefix}-form-item-control-wrapper {
      flex: 1;
    }
  }
  &__title {
    margin-bottom: 8px;
    padding: 0 16px;
    font-weight: 700;
    text-align: @sf-title-text-align;
  }
  // Array
  &__array {
    &-add {
      margin-right: 16px;
    }
    &-container {
      nz-card {
        margin: 0 16px 0 0;
        @{sf-prefix}__array-remove {
          position: absolute;
          top: -16px;
          right: -16px;
          display: none;
          width: 32px;
          height: 32px;
          font-size: 20px;
          line-height: 32px;
          text-align: center;
          background: rgba(0, 0, 0, 0.26);
          border-radius: 50%;
          cursor: pointer;
          i {
            color: #fff;
          }
        }
        &:hover {
          @{sf-prefix}__array-remove {
            display: block;
          }
        }
      }
    }
  }
  &__checkbox-list {
    display: block;
    width: 100%;
    @media (min-width: @mobile-min) {
      nz-col {
        margin-top: 8px;
      }
    }
  }
  // upload
  .@{ant-prefix}-upload-select-picture-card i {
    color: #999;
    font-size: 32px;
  }
  .@{ant-prefix}-upload.@{ant-prefix}-upload-drag {
    height: 180px;
  }
  // transfer
  .@{ant-prefix}-transfer {
    &-list {
      background: #fff;
      &-header {
        label {
          position: unset;
        }
      }
    }
    .@{ant-prefix}-btn + .@{ant-prefix}-btn {
      margin-left: 0;
    }
  }
  // fix select width when inline mode
  .@{ant-prefix}-form-inline {
    sf-select {
      .@{ant-prefix}-form-item {
        display: inline-flex;
        > .@{ant-prefix}-form-item-control-wrapper {
          flex: 1 0 0;
        }
      }
    }
  }
  &__no-error {
    .@{ant-prefix}-form-item {
      margin-bottom: 8px;
    }
  }
  &__inline {
    sf-item-wrap {
      .@{ant-prefix}-form-item {
        display: inline-flex;
        .@{ant-prefix}-form-item-control-wrapper {
          flex: 1;
        }
      }
    }
    .sf-btns {
      margin-right: 0;
    }
    @media (max-width: @mobile-max) {
      sf-item-wrap {
        .@{ant-prefix}-form-item {
          display: block !important;
          width: initial !important;
          margin-right: 0;
        }
      }
      .@{ant-prefix}-form-item-label,
      .@{ant-prefix}-form-item-control-wrapper {
        display: block !important;
        width: 100% !important;
        padding: inherit;
        line-height: @line-height-base;
        text-align: left;
      }
    }
  }
  &__no-colon {
    .@{ant-prefix}-form-item-label {
      label {
        &::after {
          content: ' ';
        }
      }
    }
  }
}