{% extends 'site/base.html' %}
{% load static %}


{% block title %}
{% endblock title %}


{% block css %}
<link rel="stylesheet" href="{% static 'css/wishlist.css' %}" />
{% endblock css %}


{% block content %}
<div class="modal fade" id="product-view">
    <div class="modal-dialog">
      <div class="modal-content">
        <button
          class="modal-close icofont-close"
          data-bs-dismiss="modal"
        ></button>
        <div class="product-view">
          <div class="row">
            <div class="col-md-6 col-lg-6">
              <div class="view-gallery">
                <div class="view-label-group">
                  <label class="view-label new">new</label
                  ><label class="view-label off">-10%</label>
                </div>
                <ul class="preview-slider slider-arrow">
                  <li><img src="{% static 'images/product/01.jpg' %}" alt="product" /></li>
                  <li><img src="{% static 'images/product/01.jpg' %}" alt="product" /></li>
                  <li><img src="{% static 'images/product/01.jpg' %}" alt="product" /></li>
                  <li><img src="{% static 'images/product/01.jpg' %}" alt="product" /></li>
                  <li><img src="{% static 'images/product/01.jpg' %}" alt="product" /></li>
                  <li><img src="{% static 'images/product/01.jpg' %}" alt="product" /></li>
                  <li><img src="{% static 'images/product/01.jpg' %}" alt="product" /></li>
                </ul>
                <ul class="thumb-slider">
                  <li><img src="{% static 'images/product/01.jpg' %}" alt="product" /></li>
                  <li><img src="{% static 'images/product/01.jpg' %}" alt="product" /></li>
                  <li><img src="{% static 'images/product/01.jpg' %}" alt="product" /></li>
                  <li><img src="{% static 'images/product/01.jpg' %}" alt="product" /></li>
                  <li><img src="{% static 'images/product/01.jpg' %}" alt="product" /></li>
                  <li><img src="{% static 'images/product/01.jpg' %}" alt="product" /></li>
                  <li><img src="{% static 'images/product/01.jpg' %}" alt="product" /></li>
                </ul>
              </div>
            </div>
            <div class="col-md-6 col-lg-6">
              <div class="view-details">
                <h3 class="view-name">
                  <a href="product-video.html">existing product name</a>
                </h3>
                <div class="view-meta">
                  <p>SKU:<span>1234567</span></p>
                  <p>BRAND:<a href="#">radhuni</a></p>
                </div>
                <div class="view-rating">
                  <i class="active icofont-star"></i
                  ><i class="active icofont-star"></i
                  ><i class="active icofont-star"></i
                  ><i class="active icofont-star"></i
                  ><i class="icofont-star"></i
                  ><a href="product-video.html">(3 reviews)</a>
                </div>
                <h3 class="view-price">
                  <del>$38.00</del><span>$24.00<small>/per kilo</small></span>
                </h3>
                <p class="view-desc">
                  Lorem ipsum dolor sit amet consectetur adipisicing elit non
                  tempora magni repudiandae sint suscipit tempore quis maxime
                  explicabo veniam eos reprehenderit fuga
                </p>
                <div class="view-list-group">
                  <label class="view-list-title">tags:</label>
                  <ul class="view-tag-list">
                    <li><a href="#">organic</a></li>
                    <li><a href="#">vegetable</a></li>
                    <li><a href="#">chilis</a></li>
                  </ul>
                </div>
                <div class="view-list-group">
                  <label class="view-list-title">Share:</label>
                  <ul class="view-share-list">
                    <li>
                      <a
                        href="#"
                        class="icofont-facebook"
                        title="Facebook"
                      ></a>
                    </li>
                    <li>
                      <a href="#" class="icofont-twitter" title="Twitter"></a>
                    </li>
                    <li>
                      <a
                        href="#"
                        class="icofont-linkedin"
                        title="Linkedin"
                      ></a>
                    </li>
                    <li>
                      <a
                        href="#"
                        class="icofont-instagram"
                        title="Instagram"
                      ></a>
                    </li>
                  </ul>
                </div>
                <div class="view-add-group">
                  <button class="product-add" title="Add to Cart">
                    <i class="fas fa-shopping-basket"></i
                    ><span>add to cart</span>
                  </button>
                  <div class="product-action">
                    <button class="action-minus" title="Quantity Minus">
                      <i class="icofont-minus"></i></button
                    ><input
                      class="action-input"
                      title="Quantity Number"
                      type="text"
                      name="quantity"
                      value="1"
                    /><button class="action-plus" title="Quantity Plus">
                      <i class="icofont-plus"></i>
                    </button>
                  </div>
                </div>
                <div class="view-action-group">
                  <a class="view-wish wish" href="#" title="Add Your Wishlist"
                    ><i class="icofont-heart"></i><span>add to wish</span></a
                  ><a
                    class="view-compare"
                    href="compare.html"
                    title="Compare This Item"
                    ><i class="fas fa-random"></i><span>Compare This</span></a
                  >
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

  
  <section class="inner-section single-banner" style="background: url({% static 'images/single-banner.jpg' %}) no-repeat center">
    <div class="container">
      <h2>wishlist</h2>
      <ol class="breadcrumb">
        <li class="breadcrumb-item"><a href="#">Home</a></li>
        <li class="breadcrumb-item">
          <a href="shop-4column.html">shop grid</a>
        </li>
        <li class="breadcrumb-item active" aria-current="page">wishlist</li>
      </ol>
    </div>
  </section>


  <section class="inner-section wishlist-part">
    <div class="container">
      <div class="row">
        <div class="col-lg-12">
          <div class="table-scroll">
            <table class="table-list">
              <thead>
                <tr>
                  <th scope="col">Serial</th>
                  <th scope="col">Product</th>
                  <th scope="col">Name</th>
                  <th scope="col">Price</th>
                  <th scope="col">description</th>
                  <th scope="col">status</th>
                  <th scope="col">shopping</th>
                  <th scope="col">action</th>
                </tr>
              </thead>
              <tbody>
                <tr>
                  <td class="table-serial"><h6>01</h6></td>
                  <td class="table-image">
                    <img src="{% static 'images/product/01.jpg' %}" alt="product" />
                  </td>
                  <td class="table-name"><h6>product name</h6></td>
                  <td class="table-price">
                    <h6>$19<small>/kilo</small></h6>
                  </td>
                  <td class="table-desc">
                    <p>
                      Lorem ipsum nobis eaque excepturi nisi eveniet...<a
                        href="product-video.html"
                        >read more</a
                      >
                    </p>
                  </td>
                  <td class="table-status">
                    <h6 class="stock-out">stock out</h6>
                  </td>
                  <td class="table-shop">
                    <button class="product-add" title="Add to Cart">
                      add to cart
                    </button>
                    <div class="product-action">
                      <button class="action-minus" title="Quantity Minus">
                        <i class="icofont-minus"></i></button
                      ><input
                        class="action-input"
                        title="Quantity Number"
                        type="text"
                        name="quantity"
                        value="1"
                      /><button class="action-plus" title="Quantity Plus">
                        <i class="icofont-plus"></i>
                      </button>
                    </div>
                  </td>
                  <td class="table-action">
                    <a
                      class="view"
                      href="#"
                      title="Quick View"
                      data-bs-toggle="modal"
                      data-bs-target="#product-view"
                      ><i class="fas fa-eye"></i></a
                    ><a class="trash" href="#" title="Remove Wishlist"
                      ><i class="icofont-trash"></i
                    ></a>
                  </td>
                </tr>
                <tr>
                  <td class="table-serial"><h6>02</h6></td>
                  <td class="table-image">
                    <img src="{% static 'images/product/02.jpg' %}" alt="product" />
                  </td>
                  <td class="table-name"><h6>product name</h6></td>
                  <td class="table-price">
                    <h6>$78<small>/kilo</small></h6>
                  </td>
                  <td class="table-desc">
                    <p>
                      Lorem ipsum nobis eaque excepturi nisi eveniet...<a
                        href="product-video.html"
                        >read more</a
                      >
                    </p>
                  </td>
                  <td class="table-status">
                    <h6 class="stock-in">stock in</h6>
                  </td>
                  <td class="table-shop">
                    <button class="product-add" title="Add to Cart">
                      add to cart
                    </button>
                    <div class="product-action">
                      <button class="action-minus" title="Quantity Minus">
                        <i class="icofont-minus"></i></button
                      ><input
                        class="action-input"
                        title="Quantity Number"
                        type="text"
                        name="quantity"
                        value="1"
                      /><button class="action-plus" title="Quantity Plus">
                        <i class="icofont-plus"></i>
                      </button>
                    </div>
                  </td>
                  <td class="table-action">
                    <a
                      class="view"
                      href="#"
                      title="Quick View"
                      data-bs-toggle="modal"
                      data-bs-target="#product-view"
                      ><i class="fas fa-eye"></i></a
                    ><a class="trash" href="#" title="Remove Wishlist"
                      ><i class="icofont-trash"></i
                    ></a>
                  </td>
                </tr>
                <tr>
                  <td class="table-serial"><h6>03</h6></td>
                  <td class="table-image">
                    <img src="{% static 'images/product/03.jpg' %}" alt="product" />
                  </td>
                  <td class="table-name"><h6>product name</h6></td>
                  <td class="table-price">
                    <h6>$68<small>/kilo</small></h6>
                  </td>
                  <td class="table-desc">
                    <p>
                      Lorem ipsum nobis eaque excepturi nisi eveniet...<a
                        href="product-video.html"
                        >read more</a
                      >
                    </p>
                  </td>
                  <td class="table-status">
                    <h6 class="stock-out">stock out</h6>
                  </td>
                  <td class="table-shop">
                    <button class="product-add" title="Add to Cart">
                      add to cart
                    </button>
                    <div class="product-action">
                      <button class="action-minus" title="Quantity Minus">
                        <i class="icofont-minus"></i></button
                      ><input
                        class="action-input"
                        title="Quantity Number"
                        type="text"
                        name="quantity"
                        value="1"
                      /><button class="action-plus" title="Quantity Plus">
                        <i class="icofont-plus"></i>
                      </button>
                    </div>
                  </td>
                  <td class="table-action">
                    <a
                      class="view"
                      href="#"
                      title="Quick View"
                      data-bs-toggle="modal"
                      data-bs-target="#product-view"
                      ><i class="fas fa-eye"></i></a
                    ><a class="trash" href="#" title="Remove Wishlist"
                      ><i class="icofont-trash"></i
                    ></a>
                  </td>
                </tr>
                <tr>
                  <td class="table-serial"><h6>04</h6></td>
                  <td class="table-image">
                    <img src="{% static 'images/product/04.jpg' %}" alt="product" />
                  </td>
                  <td class="table-name"><h6>product name</h6></td>
                  <td class="table-price">
                    <h6>$24<small>/kilo</small></h6>
                  </td>
                  <td class="table-desc">
                    <p>
                      Lorem ipsum nobis eaque excepturi nisi eveniet...<a
                        href="product-video.html"
                        >read more</a
                      >
                    </p>
                  </td>
                  <td class="table-status">
                    <h6 class="stock-in">stock in</h6>
                  </td>
                  <td class="table-shop">
                    <button class="product-add" title="Add to Cart">
                      add to cart
                    </button>
                    <div class="product-action">
                      <button class="action-minus" title="Quantity Minus">
                        <i class="icofont-minus"></i></button
                      ><input
                        class="action-input"
                        title="Quantity Number"
                        type="text"
                        name="quantity"
                        value="1"
                      /><button class="action-plus" title="Quantity Plus">
                        <i class="icofont-plus"></i>
                      </button>
                    </div>
                  </td>
                  <td class="table-action">
                    <a
                      class="view"
                      href="#"
                      title="Quick View"
                      data-bs-toggle="modal"
                      data-bs-target="#product-view"
                      ><i class="fas fa-eye"></i></a
                    ><a class="trash" href="#" title="Remove Wishlist"
                      ><i class="icofont-trash"></i
                    ></a>
                  </td>
                </tr>
                <tr>
                  <td class="table-serial"><h6>05</h6></td>
                  <td class="table-image">
                    <img src="{% static 'images/product/05.jpg' %}" alt="product" />
                  </td>
                  <td class="table-name"><h6>product name</h6></td>
                  <td class="table-price">
                    <h6>$34<small>/kilo</small></h6>
                  </td>
                  <td class="table-desc">
                    <p>
                      Lorem ipsum nobis eaque excepturi nisi eveniet...<a
                        href="product-video.html"
                        >read more</a
                      >
                    </p>
                  </td>
                  <td class="table-status">
                    <h6 class="stock-out">stock out</h6>
                  </td>
                  <td class="table-shop">
                    <button class="product-add" title="Add to Cart">
                      add to cart
                    </button>
                    <div class="product-action">
                      <button class="action-minus" title="Quantity Minus">
                        <i class="icofont-minus"></i></button
                      ><input
                        class="action-input"
                        title="Quantity Number"
                        type="text"
                        name="quantity"
                        value="1"
                      /><button class="action-plus" title="Quantity Plus">
                        <i class="icofont-plus"></i>
                      </button>
                    </div>
                  </td>
                  <td class="table-action">
                    <a
                      class="view"
                      href="#"
                      title="Quick View"
                      data-bs-toggle="modal"
                      data-bs-target="#product-view"
                      ><i class="fas fa-eye"></i></a
                    ><a class="trash" href="#" title="Remove Wishlist"
                      ><i class="icofont-trash"></i
                    ></a>
                  </td>
                </tr>
              </tbody>
            </table>
          </div>
        </div>
      </div>
      <div class="row">
        <div class="col-lg-12">
          <div class="text-center mt-5">
            <button class="btn btn-outline">Load more items</button>
          </div>
        </div>
      </div>
    </div>
  </section>

  {% include 'includes/newsletter.html' %}
  {% include 'includes/intro.html' %}

{% endblock content %}


{% block js %}

{% endblock js %}