@chatui/core/es/components/Price/style.less

The React library for Chatbot UI

.Price {
  display: inline;
  font-size: @price-font-size;
  font-weight: 500;
  font-family: 'AlibabaSans', -apple-system, 'Helvetica Neue', Arial, sans-serif;

  &--original {
    color: var(--color-text-3);
    text-decoration: line-through;
  }
  &[data-size] {
    font-weight: 700;

    .Price-currency,
    .Price-decimal,
    .Price-fraction {
      font-size: 0.6em; // 不支持 max 的兜底处理
    }
    .Price-currency {
      margin-right: 2px;
      vertical-align: 1px;
      font-size: max(0.6em, 11px);
    }
    .Price-decimal,
    .Price-fraction {
      font-size: max(0.6em, 14px);
    }
  }
  &[data-size="xl"] {
    font-size: 30px;
  }
  &[data-size="lg"] {
    font-size: 24px;
  }
  &[data-size="md"] {
    font-size: 18px;
  }
  &[data-size="sm"] {
    font-size: 14px;
  }
}

.Price-currency {
  font-size: 0.8em;
}

.Coupon,
.RedPacket {
  .Price {
    &[data-size="xl"] {
      font-size: 30Px;
    }
    &[data-size="lg"] {
      font-size: 24Px;
    }
    &[data-size="md"] {
      font-size: 18Px;
    }
    &[data-size="sm"] {
      font-size: 14Px;
    }
  }
}