captain-ui/es/ump-seckill/styles/base.css

有赞vue wap业务组件库

@import '../../common/var.css';

.cap-ump-seckill {
  margin-bottom: 10px;
}

.cap-ump-seckill-goods {
  display: block;

  &__countdown-text {
    margin-right: 8px;
  }

  .cap-countdown {

    .cap-countdown {

      &__day,
      &__hour,
      &__minute,
      &__second,
      &__time-text {
        margin: 0;
        padding: 0;
        width: 14px;
        height: 14px;
        line-height: 14px;
        font-size: 10px;
        text-align: center;
      }

      &__day {
        width: auto;
        min-width: 14px;
        color: $white;
        background: transparent;

        & + .cap-countdown__time-text {
          padding: 0 4px 0 0;
        }
      }

      &__hour,
      &__minute,
      &__second {
        background-image: linear-gradient(180deg, #fff 0%, #fff 45%, #f0f0f0 55%);
      }

      &__time-text {
        padding: 0 2px;
      }

      &__time-text:last-child {
        display: none;
      }
    }
  }

  &__title {
    color: $text-color;
    font-size: 14px;
    word-break: break-all;

    @mixin multi-ellipsis 2;

    .cap-ump-seckill-goods__discount {
      display: none;
    }
  }

  &__info {
    display: inline-block;
    margin-top: 6px;
    line-height: 14px;
    background-color: $white;
    border: 1px solid rgba(255, 68, 68, .1);
    border-radius: 2px;
    font-size: 0;

    > span {
      display: inline-block;
      vertical-align: middle;
      height: 14px;
      line-height: 14px;
      padding: 0 5px;
      border-radius: 2px;
      color: $red;
      font-size: 10px;
      text-align: center;

      &:first-child {
        background-color: rgba(255, 68, 68, .1);
        border-radius: 0;
      }
    }
  }

  &__stock--hide {

    > span:first-child {
      border-radius: 2px;
    }
  }

  &__discount {
    display: inline-block;
    vertical-align: middle;
    height: 14px;
    line-height: 14px;
    padding: 0 5px;
    border-radius: 2px;
    background-color: rgba(255, 68, 68, .1);
    color: $red;
    font-size: 10px;
    text-align: center;
  }

  &__header {
    position: relative;
  }

  &__tag-info {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
  }

  &__content {
    position: relative;
  }

  &__price {
    color: $red;

    &-symbol {
      margin-right: 3px;
    }
  }

  &__origin-price {
    color: $gray-dark;
    font-size: 10px;

    &-symbol {
      margin-right: 2px;
    }
  }

  &--soldout,
  &--end {
    .cap-ump-seckill-goods__mask {
      &::after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        margin: auto;
        background-image: url('https://img.yzcdn.cn/v2/image/wsc-wap/showcase/end.png');
        background-size: contain;
      }
    }
  }

  &--soldout {

    .cap-ump-seckill-goods__mask {

      &::after {
        background-image: url('https://img.yzcdn.cn/v2/image/wsc-wap/showcase/soldout.png');
      }
    }
  }
}