card with dismiss

PHOTO EMBED

Mon Feb 07 2022 12:44:58 GMT+0000 (UTC)

Saved by @viresh #html

<button
      type="button"
      class="btn rounded-sm text-sm p-3 btn-primary reset-dismissed-card"
    >
      Reset
    </button>
    <div class="card-wrapper dismiss-card-wrapper product-card">
      <div class="close-icon-wrapper">
        <i class="fas fa-times-circle p-2 fa-3x"></i>
      </div>
      <div class="px-4">
        <img
          class="img-responsive d-block m-auto pt-4 product-card-img"
          src="../../assets/monitor.png"
          alt="headphone"
        />
      </div>
      <div class="p-2">
        <p class="font-wt-bold text-center text-sm">
          Redgear Wired Gaming Headphones with RGB LED Effect
        </p>
      </div>
      <div class="px-8 py-2">
        <div class="product-price-wrapper">
          <span class="product-discount-price text-sm font-wt-bold"
            >Rs. 1,790.00</span
          >
          <span class="product-original-price text-sm ml-6">Rs. 2,999.00</span>
        </div>
        <span class="product-discount font-wt-bold text-sm">Save 40%</span>
      </div>
      <div class="card-btns-wrapper p-3 d-flex flex-col">
        <button
          type="button"
          class="btn btn-primary rounded-sm text-sm p-5 mx-4"
        >
          <i class="fas fa-shopping-cart mr-3"></i>
          Add to Cart
        </button>
        <button
          type="button"
          class="btn btn-outline btn-primary-outline rounded-sm text-sm p-3 mx-4"
        >
          <i class="fas fa-heart mr-3"></i>
          Add to Wishlist
        </button>
      </div>
    </div>
content_copyCOPY