Star Rating

<div class="preview-item">
  <h2 class="u-title-secondary u-mb-md">5 stars</h2>

  <div class="c-stars" style="width: 8rem">
    <div class="c-stars__value" style="width: 0"></div>
  </div>

  <div class="c-stars" style="width: 8rem">
    <div class="c-stars__value" style="width: 20%"></div>
  </div>

  <div class="c-stars" style="width: 8rem">
    <div class="c-stars__value" style="width: 40%"></div>
  </div>

  <div class="c-stars" style="width: 8rem">
    <div class="c-stars__value" style="width: 60%"></div>
  </div>

  <div class="c-stars" style="width: 8rem">
    <div class="c-stars__value" style="width: 80%"></div>
  </div>

  <div class="c-stars" style="width: 8rem">
    <div class="c-stars__value" style="width: 100%"></div>
  </div>
</div>

<div class="preview-item">
  <h2 class="u-title-secondary u-mb-md">4 stars</h2>

  <div class="c-stars" style="width: 6.4rem">
    <div class="c-stars__value" style="width: 0"></div>
  </div>

  <div class="c-stars" style="width: 6.4rem">
    <div class="c-stars__value" style="width: 25%"></div>
  </div>

  <div class="c-stars" style="width: 6.4rem">
    <div class="c-stars__value" style="width: 50%"></div>
  </div>

  <div class="c-stars" style="width: 6.4rem">
    <div class="c-stars__value" style="width: 75%"></div>
  </div>

  <div class="c-stars" style="width: 6.4rem">
    <div class="c-stars__value" style="width: 100%"></div>
  </div>
</div>