weex-amui-mod/theme/am-list/item.less

Ant Design Mobile of Weex

@import "../base/common.less";
@import "./extra.less";

.am-list {
  &-item {
    position: relative;
    // padding-left: @h-spacing-lg;
    // height: @list-item-height;
    // min-height: @list-item-height;
    background-color: @fill-base;
    flex-direction: row;
    align-items: center;
    border-color: @border-color-base;
    border-bottom-width: @border-width-sm;
    &-tap:active {
      background-color: @fill-tap;
    }
    &-first {
      border-color: @border-color-base;
      border-top-width: @border-width-sm;
    }
    &-last {
      border-color: @border-color-base;
      border-bottom-width: @border-width-sm;
    }
  }
  &-line {
    flex-direction: row;
    align-items: center;
    flex: 1;
    // padding-right: @h-spacing-lg;
    padding-top: 10 * @hd;
    padding-bottom: 9 * @hd;
    min-height: @list-item-height;
    // &-multiple{
    //   padding-top: 10 * @hd;
    //   padding-bottom: 9 * @hd;
    // }
    &-border {
      border-bottom-color: @border-color-base;
      // border-bottom-width: @border-width-sm;
    }
    &-last {
      border-bottom-width: 0;
    }
    &-align {
      &-top {
        align-items: flex-start;
      }
      &-middle {
        align-items: center;
      }
      &-bottom {
        align-items: flex-end;
      }
    }
    // align-self: stretch;
  }
  &-thumb {
    margin-right: @h-spacing-lg;
    width: @icon-size-md;
    height: @icon-size-md;
  }
  &-content {
    // flex: 1;
    margin-right: @h-spacing-sm;
    &-text {
      color: @color-text-base;
      font-size: @font-size-heading;
      line-height: @line-height-paragraph * @font-size-heading;
      &-disabled {
        color: @color-text-disabled;
      }
      &-0 {
        flex: 1;
      }
      &-2 {
        width: 2 * @font-size-heading;
      }
  
      &-3 {
        width: 3 * @font-size-heading;
      }
  
      &-4 {
        width: 4 * @font-size-heading;
      }
  
      &-5 {
        width: 5 * @font-size-heading;
      }
  
      &-6 {
        width: 6 * @font-size-heading;
      }
  
      &-7 {
        width: 7 * @font-size-heading;
      }
    }
    &-brief {
      color: @color-text-caption;
      font-size: @font-size-subhead;
      line-height: @line-height-paragraph * @font-size-heading;
      // margin-top: @v-spacing-sm;
    }
  }

  &-arrow {
    // width: @icon-size-xxs;
    // height: @icon-size-xxs;
    margin-left: @h-spacing-md;
    color: #C7C7CC;
    // font-size: @icon-size-xxs;

    // &-vertical {
    //   transform: rotate(90deg);
    // }

    // &-vertical-up {
    //   transform: rotate(270deg);
    // }
  }
}