#goods-wrap.goodsBox {
  &.single-row {
    max-height: 800px;
    overflow-y: auto;
    padding-top: 4px;
    flex-basis: 100%;
    .good-item.rich-item {
      &.with-pic,
      &.with-attr,
      &.with-attr.with-pic {
        flex-basis: 100%;
      }

      .good-attrs {
        flex-grow: 1;
        flex-shrink: 1;
        .good-item-attr {
          flex-grow: 1;
          flex-shrink: 1;
          max-width: 80px;
          width: 20px;
          flex-basis: 20px;
        }
        .ant-input {
          flex-shrink: 1;
          flex-grow: 1;
          width: 20px;
          flex-basis: 40px;
        }
      }
    }
  }
}
#goods-wrap .good-item {
  &.rich-item {
    position: relative;
    border: 1px solid #ccc;
    display: flex;
    flex-basis: 80px;
    flex-wrap: nowrap;
    margin: 0 10px 10px 0;
    padding: 4px;

    &.with-pic {
      flex-basis: 90px;
    }
    &.with-attr {
      flex-basis: 150px;
    }
    &.with-attr.with-pic {
      flex-basis: 238px;
      .goods-imgBox {
        margin-right: 8px;
      }
    }

    .good-item-attr {
      margin-right: 6px;
      width: 52px;
      flex-basis: 52px;
    }

    .good-img {
      position: relative;
      width: 80px;
      height: 80px;
      border-radius: 4px;
      border: 1px solid #f2f3f5;
      margin: 0 10px 0 0;
      text-align: center;
      background-color: #f2f3f5;
    }

    .good-attrs {
      display: flex;
      flex-direction: column;
      font-size: 12px;

      .ant-input {
        font-size: 12px;
        width: 80px;
        height: 20px;
        padding-left: 5px;
        padding-right: 5px;

        &.id-textarea {
          width: 80px;
          resize: none;
          height: 45px;
        }
      }
      div {
        display: flex;
        &:not(:first-child) {
          margin-top: 4px;
        }
      }
    }
  }
}
