cip-components/cip-form/index.less

.el-form--inline.cip-form{
  //width: 100%;
  display: flex;
  flex-wrap: wrap;
}
.cip-form--grid{
  display: grid !important;
  grid-column-gap: 12px;
}
.cip-form--border{
  grid-gap: 0;
  position: relative;
  @border-color: var(--el-border-color-lighter);
  .cip-form-item{
    width: 100%;
    margin-top: -1px;
    border: 1px solid @border-color;
    .el-form-item{
      margin-bottom: 0;
    }
    .el-form-item__label{
      background: #FAFAFA;
      padding: 8px;
      border-right: 1px solid @border-color;
      font-weight: 500;
      text-align: left;
      justify-content: flex-start; // el-form-item__label默认开启flex导致text-align无效
      height: 100%;
    }
    .el-form-item__content{
      padding: 8px;
      .cip-form-item__input{
        word-break: break-all;
      }
    }
  }
}
// only模式下去除form-item的margin-bottom
.cip-form--readonly{
  .cip-form-item{
    .el-form-item{
      margin-bottom: unset;
    }
  }
}
.cip-form.cip-form--mobile{
  border-radius: 12px;
  background: #fff;
  padding: 12px;
  box-sizing: border-box;
  .cip-form-item {
    padding: 10px 0;
    box-sizing: border-box;
    .van-cell{
      padding: 0;
      --van-cell-line-height: @formItemLineHeight;
      &:after{
        border: none;
      }
    }
    &+.cip-form-item{
      border-top: 1px solid #ddd;
    }
    .el-form-item{
      margin-bottom: 0;
    }
  }
}