import randomId from "random-id";
const customId = "dc-card-" + randomId(8, "");

// Card  Block Code
export const card01 = `<div id="${customId}" class="card" data-gjs-type="card">
<div class="card-body" data-gjs-type="card-body">
  <h5 class="card-title">Card title</h5>
  <h6 class="card-subtitle mb-2 text-muted">Card subtitle</h6>
  <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
  <a href="#" class="card-link">Card link</a>
  <a href="#" class="card-link">Another link</a>
</div>
</div>`;
export const card02 = `<div id="${customId}" class="card text-center card-full"  data-gjs-type="card" data-gjs-custom-name="Full Card">
  <div class="card-header" data-gjs-type="card-header">
    Featured
  </div>
  <div class="card-body" data-gjs-type="card-body">
    <h5 class="card-title">Special title treatment</h5>
    <p class="card-text">With supporting text below as a natural lead-in to additional content.</p>
    <a href="#" class="btn btn-primary">Go somewhere</a>
  </div>
  <div class="card-footer text-muted" data-gjs-type="card-footer">
    2 days ago
  </div>
</div>`;
export const card03 = `<div id="${customId}" class="card card-image"  data-gjs-type="card" data-gjs-custom-name="Image Card">
  <img class="card-img-top" src="https://picsum.photos/831/450" alt="Card Image">
  <div class="card-body" data-gjs-type="card-body">
    <h5 class="card-title">Card title</h5>
    <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
    <p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
    <a href="#" class="btn btn-primary">Go somewhere</a>
  </div>
</div>`;

export const card004 = `
<div id="${customId}" class="card card-004 profile-card"  data-gjs-type="card" data-gjs-custom-name="Card 004">
<div class="profile-card-1" data-gjs-type="card-body">
  <img src="https://images.pexels.com/photos/946351/pexels-photo-946351.jpeg?w=500&h=650&auto=compress&cs=tinysrgb" alt="profile-sample1" class="background"/>
  <img src="https://randomuser.me/api/portraits/women/20.jpg" alt="profile-image" class="profile"/>
      <div class="card-content">
        <h2>Savannah Fields<small>Engineer</small></h3>
        <div class="icon-block"><a href="#">
          <i data-gjs-type="drapcode-icons" draggable="true" data-js="drapcode-icons" class="drapcode-icons"><svg data-gjs-type="svg" draggable="false" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-gjs="drapcode-icons-svg" class="feather feather-facebook gjs-selected"><path data-gjs-type="svg-in" draggable="true" d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z" id="i1yg3" class="">
          </path></svg></i></a>
          <a href="#">
          <i data-gjs-type="drapcode-icons" draggable="true" data-highlightable="1" data-js="drapcode-icons" class="drapcode-icons gjs-selected"><svg data-gjs-type="svg" draggable="false" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-gjs="drapcode-icons-svg" class="feather feather-twitter"><path data-gjs-type="svg-in" draggable="true" d="M23 3a10.9 10.9 0 0 1-3.14 1.53 4.48 4.48 0 0 0-7.86 3v1A10.66 10.66 0 0 1 3 4s-4 9 5 13a11.64 11.64 0 0 1-7 2c9 5 20 0 20-11.5a4.5 4.5 0 0 0-.08-.83A7.72 7.72 0 0 0 23 3z" id="ildh4">
          </path></svg></i></a>
          <a href="#"><i data-gjs-type="drapcode-icons" draggable="true" data-highlightable="1" data-js="drapcode-icons" class="drapcode-icons gjs-selected"><svg data-gjs-type="svg" draggable="false" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-gjs="drapcode-icons-svg" class="feather feather-linkedin"><path data-gjs-type="svg-in" draggable="true" d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z" id="iwnqx">
          </path><rect data-gjs-type="svg-in" draggable="true" x="2" y="9" width="4" height="12" id="iqbsb">
          </rect><circle data-gjs-type="svg-in" draggable="true" cx="4" cy="4" r="2" id="i6x2d">
          </circle></svg></i></a>
        </div>
      </div>
  </div>
</div>`;
export const card005 = `
<div id="${customId}" class="card card-005 profile-card"  data-gjs-type="card" data-gjs-custom-name="Card 005">
  <div class="profile-card-3" data-gjs-type="card-body">
    <div class="background-block"  data-gjs-type="image-block">
        <img src="https://images.pexels.com/photos/459225/pexels-photo-459225.jpeg?auto=compress&cs=tinysrgb&h=650&w=940" alt="profile-sample1" class="background"/>
    </div>
    <div class="profile-thumb-block">
        <img src="https://randomuser.me/api/portraits/men/41.jpg" alt="profile-image" class="profile"/>
    </div>
    <div class="card-content">
        <h2>Justin Mccoy<small>Designer</small></h3>
        <div class="icon-block"><a href="#">
          <i data-gjs-type="drapcode-icons" draggable="true" data-js="drapcode-icons" class="drapcode-icons"><svg data-gjs-type="svg" draggable="false" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-gjs="drapcode-icons-svg" class="feather feather-facebook gjs-selected"><path data-gjs-type="svg-in" draggable="true" d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z" id="i1yg3" class="">
          </path></svg></i></a>
          <a href="#">
          <i data-gjs-type="drapcode-icons" draggable="true" data-highlightable="1" data-js="drapcode-icons" class="drapcode-icons gjs-selected"><svg data-gjs-type="svg" draggable="false" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-gjs="drapcode-icons-svg" class="feather feather-twitter"><path data-gjs-type="svg-in" draggable="true" d="M23 3a10.9 10.9 0 0 1-3.14 1.53 4.48 4.48 0 0 0-7.86 3v1A10.66 10.66 0 0 1 3 4s-4 9 5 13a11.64 11.64 0 0 1-7 2c9 5 20 0 20-11.5a4.5 4.5 0 0 0-.08-.83A7.72 7.72 0 0 0 23 3z" id="ildh4">
          </path></svg></i></a>
          <a href="#"><i data-gjs-type="drapcode-icons" draggable="true" data-highlightable="1" data-js="drapcode-icons" class="drapcode-icons gjs-selected"><svg data-gjs-type="svg" draggable="false" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-gjs="drapcode-icons-svg" class="feather feather-linkedin"><path data-gjs-type="svg-in" draggable="true" d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z" id="iwnqx">
          </path><rect data-gjs-type="svg-in" draggable="true" x="2" y="9" width="4" height="12" id="iqbsb">
          </rect><circle data-gjs-type="svg-in" draggable="true" cx="4" cy="4" r="2" id="i6x2d">
          </circle></svg></i></a>
        </div>
    </div>
  </div>
</div>`;

export const card006 = `
<div id="${customId}" class="card-006 profile-card"  data-gjs-type="card" data-gjs-custom-name="Card 006">
  <div class="card profile-card-5" data-gjs-type="profile-card">
  <div class="card-img-block">
      <img class="card-img-top" src="https://images.unsplash.com/photo-1517832207067-4db24a2ae47c" alt="Card image cap">
  </div>
      <div class="card-body pt-0" data-gjs-type="card-body">
      <h5 class="card-title">Florence Garza</h5>
      <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
    </div>
  </div>
</div>`;
export const card007 = `
<div id="${customId}" class="card card-007 product-card"  data-gjs-type="card" data-gjs-custom-name="Card 007">
<!-- List group-->
<ul class="list-group">

  <!-- list group item-->
  <li class="list-group-item">
    <!-- Custom content-->
    <div class="media align-items-lg-center flex-column flex-lg-row p-3">
      <div class="media-body order-2 order-lg-1">
        <h5 class="mt-0 font-weight-bold mb-2">Awesome product</h5>
        <p class="font-italic text-muted mb-0 small">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Suscipit fuga autem maiores necessitatibus.</p>
        <div class="d-flex align-items-center justify-content-between mt-1">
          <h6 class="font-weight-bold my-2">$120.00</h6>
          <ul class="list-inline small">
            <li class="list-inline-item m-0">
              <i data-gjs-type="drapcode-icons" draggable="true" data-highlightable="1" data-js="drapcode-icons" class="drapcode-icons text-success">
              <svg data-gjs-type="svg" draggable="false" xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="#28a745 " stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-gjs="drapcode-icons-svg" class="feather feather-star"><polygon data-gjs-type="svg-in" draggable="true" points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2">
              </polygon></svg></i><i data-gjs-type="drapcode-icons" draggable="true" data-highlightable="1" data-js="drapcode-icons" class="drapcode-icons text-success">
              <svg data-gjs-type="svg" draggable="false" xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="#28a745 " stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-gjs="drapcode-icons-svg" class="feather feather-star"><polygon data-gjs-type="svg-in" draggable="true" points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2">
              </polygon></svg></i><i data-gjs-type="drapcode-icons" draggable="true" data-highlightable="1" data-js="drapcode-icons" class="drapcode-icons text-success">
              <svg data-gjs-type="svg" draggable="false" xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="#28a745 " stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-gjs="drapcode-icons-svg" class="feather feather-star"><polygon data-gjs-type="svg-in" draggable="true" points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2">
              </polygon></svg></i><i data-gjs-type="drapcode-icons" draggable="true" data-highlightable="1" data-js="drapcode-icons" class="drapcode-icons text-success">
              <svg data-gjs-type="svg" draggable="false" xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="#28a745 " stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-gjs="drapcode-icons-svg" class="feather feather-star"><polygon data-gjs-type="svg-in" draggable="true" points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2">
              </polygon></svg></i><i data-gjs-type="drapcode-icons" draggable="true" data-highlightable="1" data-js="drapcode-icons" class="drapcode-icons text-gray">
              <svg data-gjs-type="svg" draggable="false" xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-gjs="drapcode-icons-svg" class="feather feather-star"><polygon data-gjs-type="svg-in" draggable="true" points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2">
              </polygon></svg></i>
            </li>
          </ul>
        </div>
      </div><img src="https://i.imgur.com/JvPeqEF.jpg" alt="Generic placeholder image" width="200" class="ml-lg-5 order-1 order-lg-2">
    </div>
    <!-- End -->
  </li>
  <!-- End -->
  </ul>
  <!-- End -->
</div>`;
export const card008 = `
<div id="${customId}" class="card card-008"  data-gjs-type="card" data-gjs-custom-name="Card 008">
  <div class="row p-2 bg-white border rounded">
  <div class="col-md-3 mt-1"><img class="img-fluid img-responsive rounded product-image" src="https://i.imgur.com/QpjAiHq.jpg"></div>
  <div class="col-md-6 mt-1">
      <h5>Quant olap shirts</h5>
      <div class="d-flex flex-row">
          <div class="ratings mr-2">
            <i data-gjs-type="drapcode-icons" draggable="true" data-highlightable="1" data-js="drapcode-icons" class="drapcode-icons">
          <svg data-gjs-type="svg" draggable="false" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="red" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-gjs="drapcode-icons-svg" class="feather feather-star"><polygon data-gjs-type="svg-in" draggable="true" points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"></polygon></svg></i><i data-gjs-type="drapcode-icons" draggable="true" data-highlightable="1" data-js="drapcode-icons" class="drapcode-icons">
          <svg data-gjs-type="svg" draggable="false" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="red" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-gjs="drapcode-icons-svg" class="feather feather-star"><polygon data-gjs-type="svg-in" draggable="true" points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"></polygon></svg></i><i data-gjs-type="drapcode-icons" draggable="true" data-highlightable="1" data-js="drapcode-icons" class="drapcode-icons">
          <svg data-gjs-type="svg" draggable="false" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="red" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-gjs="drapcode-icons-svg" class="feather feather-star"><polygon data-gjs-type="svg-in" draggable="true" points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"></polygon></svg></i><i data-gjs-type="drapcode-icons" draggable="true" data-highlightable="1" data-js="drapcode-icons" class="drapcode-icons">
          <svg data-gjs-type="svg" draggable="false" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="red" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-gjs="drapcode-icons-svg" class="feather feather-star"><polygon data-gjs-type="svg-in" draggable="true" points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"></polygon></svg></i>
          </div><span>310</span>
      </div>
      <div class="mt-1 mb-1 spec-1"><span>100% cotton</span><span class="dot"></span><span>Light weight</span><span class="dot"></span><span>Best finish<br></span></div>
      <div class="mt-1 mb-1 spec-1"><span>Unique design</span><span class="dot"></span><span>For men</span><span class="dot"></span><span>Casual<br></span></div>
      <p class="text-justify text-truncate para mb-0">There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable.<br><br></p>
  </div>
  <div class="align-items-center align-content-center col-md-3 border-left mt-1">
      <div class="d-flex flex-row align-items-center">
          <h5 class="mr-1">$13.99</h5><span class="strike-text">$20.99</span>
      </div>
      <h6 class="text-success">Free shipping</h6>
      <div class="d-flex flex-column mt-4"><button class="btn btn-primary btn-sm" type="button">Details</button><button class="btn btn-outline-primary btn-sm mt-2" type="button">Add to wishlist</button></div>
  </div>
  </div>
</div>
`;
export const card009 = `
<div id="${customId}" class="card card-009 product-card"  data-gjs-type="card" data-gjs-custom-name="Card 009">
  <div class="card-body" data-gjs-type="card-body">
    <div class="media align-items-center align-items-lg-start text-center text-lg-left flex-column flex-lg-row">
        <div class="mr-2 mb-3 mb-lg-0"> <img src="https://i.imgur.com/5Aqgz7o.jpg" width="150" height="150" alt=""> </div>
        <div class="media-body">
            <h6 class="media-title font-weight-semibold"> <a href="#" data-abc="true">Apple iPhone XR (Red, 128 GB)</a> </h6>
            <ul class="list-inline list-inline-dotted mb-3 mb-lg-2">
                <li class="list-inline-item"><a href="#" class="text-muted" data-abc="true">Phones</a></li>
                <li class="list-inline-item"><a href="#" class="text-muted" data-abc="true">Mobiles</a></li>
            </ul>
            <p class="mb-3">128 GB ROM | 15.49 cm (6.1 inch) Display 12MP Rear Camera | 7MP Front Camera A12 Bionic Chip Processor | Gorilla Glass with high quality display </p>
            <ul class="list-inline list-inline-dotted mb-0">
                <li class="list-inline-item">All items from <a href="#" data-abc="true">Mobile point</a></li>
                <li class="list-inline-item">Add to <a href="#" data-abc="true">wishlist</a></li>
            </ul>
        </div>
        <div class="mt-3 mt-lg-0 ml-lg-3 text-center">
            <h3 class="mb-0 font-weight-semibold">$459.99</h3>
            <div>
              <i data-gjs-type="drapcode-icons" draggable="true" data-highlightable="1" data-js="drapcode-icons" class="drapcode-icons gjs-selected"><svg data-gjs-type="svg" draggable="false" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="#1e1e1e" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-gjs="drapcode-icons-svg" class="feather feather-star"><polygon data-gjs-type="svg-in" draggable="true" points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2">
              </polygon></svg></i>
              <i data-gjs-type="drapcode-icons" draggable="true" data-highlightable="1" data-js="drapcode-icons" class="drapcode-icons gjs-selected"><svg data-gjs-type="svg" draggable="false" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="#1e1e1e" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-gjs="drapcode-icons-svg" class="feather feather-star"><polygon data-gjs-type="svg-in" draggable="true" points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2">
              </polygon></svg></i>
              <i data-gjs-type="drapcode-icons" draggable="true" data-highlightable="1" data-js="drapcode-icons" class="drapcode-icons gjs-selected"><svg data-gjs-type="svg" draggable="false" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="#1e1e1e" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-gjs="drapcode-icons-svg" class="feather feather-star"><polygon data-gjs-type="svg-in" draggable="true" points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2">
              </polygon></svg></i>
              <i data-gjs-type="drapcode-icons" draggable="true" data-highlightable="1" data-js="drapcode-icons" class="drapcode-icons gjs-selected"><svg data-gjs-type="svg" draggable="false" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="#1e1e1e" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-gjs="drapcode-icons-svg" class="feather feather-star"><polygon data-gjs-type="svg-in" draggable="true" points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2">
              </polygon></svg></i>
            </div>
            <div class="text-muted">1985 reviews</div> <button type="button" class="btn btn-warning mt-4 text-white"><i class="icon-cart-add mr-2"></i> Add to cart</button>
        </div>
    </div>
  </div>
</div>
`;
export const card010 = `
<div id="${customId}" class="card p-3 card-010 product-card"  data-gjs-type="card" data-gjs-custom-name="Card 010">
<div class="card-body" data-gjs-type="card-body">
<div></div>
<div class="about-product text-center mt-2">
<img src="https://i.imgur.com/3VTaSeb.png" width="300">
    <div>
        <h4>Believing is seeing</h4>
        <h6 class="mt-0 text-black-50">Apple pro display XDR</h6>
    </div>
</div>
<div class="stats mt-2">
    <div class="d-flex justify-content-between p-price"><span>Pro Display XDR</span><span>₹5,999</span></div>
    <div class="d-flex justify-content-between p-price"><span>Pro stand</span><span>₹999</span></div>
    <div class="d-flex justify-content-between p-price"><span>Vesa Mount Adapter</span><span>₹199</span></div>
</div>
<div class="d-flex justify-content-between total font-weight-bold mt-4"><span>Total</span><span>₹7,197.00</span></div>
</div>
</div>
`;
export const card011 = `
<div id="${customId}" class="card card-011"  data-gjs-type="card" data-gjs-custom-name="Card 011">
  <div class="product-grid">
    <div class="product-image">
        <a href="#" class="image">
            <img class="pic-1" src="https://public-webconnect.s3.amazonaws.com/static/image/Card-011-img.jpg">
        </a>
        <span class="product-sale-label">Sale!</span>
        <ul class="product-links">
            <li><a href="#">
                <i data-js="drapcode-icons" class="drapcode-icons">
                <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-gjs="drapcode-icons-svg" draggable="false" class="feather feather-shopping-cart"><circle cx="9" cy="21" r="1">
                </circle><circle cx="20" cy="21" r="1">
                </circle><path d="M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6">
                </path></svg></i>
            Add to cart</a></li>
            <li><a href="#">
                <i data-js="drapcode-icons" class="drapcode-icons">
                <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-gjs="drapcode-icons-svg" draggable="false" class="feather feather-search"><circle cx="11" cy="11" r="8">
                </circle><line x1="21" y1="21" x2="16.65" y2="16.65">
                </line></svg></i>
            Quick View</a></li>
        </ul>
    </div>
    <div class="product-content">
        <h3 class="title"><a href="#">Women's T-Shirt</a></h3>
        <div class="price"><span>$85.55</span> $71.11</div>
    </div>
  </div>
</div>
`;
export const card012 = `
<div id="${customId}" class="card-012"  data-gjs-type="card" data-gjs-custom-name="Card 012">
    <div class="product-grid">
        <div class="product-image">
            <a href="#" class="image">
                <img class="pic-1" src="https://public-webconnect.s3.amazonaws.com/static/image/Card-012-img.jpg">
            </a>
            <span class="product-discount-label">-33%</span>
        </div>
        <div class="product-content" data-gjs-custom-name="Product Content">
            <ul class="rating" data-gjs-custom-name="Rating">
                <li>
                    <i data-gjs-type="drapcode-icons" draggable="true" data-highlightable="1" data-js="drapcode-icons" class="drapcode-icons text-success">
                    <svg data-gjs-type="svg" draggable="false" xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="#28a745 " stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-gjs="drapcode-icons-svg" class="feather feather-star"><polygon data-gjs-type="svg-in" draggable="true" points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2">
                    </polygon></svg></i><i data-gjs-type="drapcode-icons" draggable="true" data-highlightable="1" data-js="drapcode-icons" class="drapcode-icons text-success">
                    <svg data-gjs-type="svg" draggable="false" xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="#28a745 " stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-gjs="drapcode-icons-svg" class="feather feather-star"><polygon data-gjs-type="svg-in" draggable="true" points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2">
                    </polygon></svg></i><i data-gjs-type="drapcode-icons" draggable="true" data-highlightable="1" data-js="drapcode-icons" class="drapcode-icons text-success">
                    <svg data-gjs-type="svg" draggable="false" xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="#28a745 " stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-gjs="drapcode-icons-svg" class="feather feather-star"><polygon data-gjs-type="svg-in" draggable="true" points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2">
                    </polygon></svg></i><i data-gjs-type="drapcode-icons" draggable="true" data-highlightable="1" data-js="drapcode-icons" class="drapcode-icons text-success">
                    <svg data-gjs-type="svg" draggable="false" xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="#28a745 " stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-gjs="drapcode-icons-svg" class="feather feather-star"><polygon data-gjs-type="svg-in" draggable="true" points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2">
                    </polygon></svg></i><i data-gjs-type="drapcode-icons" draggable="true" data-highlightable="1" data-js="drapcode-icons" class="drapcode-icons text-gray">
                    <svg data-gjs-type="svg" draggable="false" xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-gjs="drapcode-icons-svg" class="feather feather-star"><polygon data-gjs-type="svg-in" draggable="true" points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2">
                    </polygon></svg></i>
                </li>
            </ul>
            <h3 class="title"><a href="#">Men's Blazer</a></h3>
            <div class="price"><span>$90.00</span> $66.00</div>
            <a class="add-to-cart" href="#">add to cart</a>
        </div>
    </div>
</div>
`;
