Deal Card Revised

deal-card.html

<figure class="gds-flex-item">
  <img src="{{ metadata.url }}/img/wateriders.jpg" alt="Wateriders" class="gds-stack-8 gds-radius-medium">
  <figcaption class="gds-text-subdued gds-text-medium">
    <p><strong class="gds-text-large">Wateriders Kayak Tours</strong><br>
      Near North Side, Chicago</p>
    <div class="gds-flex-row gds-stack-8">
      <span>4.8</span>
      <span class="gds-star-rating">
        <svg class="gds-icon-small">
          <use xlink:href="#icon-star-filled">
        </svg>
        <svg class="gds-icon-small">
          <use xlink:href="#icon-star-filled">
        </svg>
        <svg class="gds-icon-small">
          <use xlink:href="#icon-star-filled">
        </svg>
        <svg class="gds-icon-small">
          <use xlink:href="#icon-star-filled">
        </svg>
        <svg class="gds-icon-small">
          <use xlink:href="#icon-star-filled">
        </svg>
      </span>
      <span>(710)</span>
    </div>
    <p class="gds-text-large"><s class="gds-text-subdued">$40</s> <strong class="gds-text-price">$26</strong> <span class="gds-badge-discount">35% off</span></p>
    <p class="gds-text-small">Single or Double Kayak Rental</p>
  </figcaption>
</figure>