{% extends 'base.html' %}
{% load static %}
{% block content %}

<main>
  
    <!--/.Navbar-->
    <!--div class="container">
    <!--Section: Products v.3-->
    <section class="text-center mb-4">
      <!--Grid row-->
      <div><h1>All Gifts</h1></div>
      <div class="row wow fadeIn">
        <!--Grid column-->
        <div class="col-md-3"><h2>Categories</h2></div>
          <div class="col-md-9">
            <div class="row wow fadeIn">
              
                  {% for item in object_list %}
              <!--Grid column-->
                  <div class="col-md-4 mb-4">
                    <!--Card-->
                    <div class="card">
                      
                      <!--Card image-->
                      <div class="view overlay">
                        <img
                          src="https://mdbootstrap.com/img/Photos/Horizontal/E-commerce/Vertical/12.jpg"
                          class="card-img-top"
                          alt=""
                        />
                        <a href="{{item.get_absolute_url}}">
                          <div class="mask rgba-white-slight"></div>
                        </a>
                      </div>
                      <!--Card image-->
                      <hr>
                      <!--Card content-->
                      <div class="card-body text-center">
                        <!--Category & Title-->
                        <a href="" class="grey-text">
                          <h5>{{ item.get_category_display }}</h5>
                        </a>
                        <h5>
                          <strong>
                            <a href="{{item.get_absolute_url}}" class="dark-grey-text">
                              {{ item.title }}
                              <span
                                class="badge badge-pill {{ item.get_label_display }}-color"
                                >NEW</span
                              >
                            </a>
                          </strong>
                        </h5>

                        <p class="font-weight-lighter black-text">
                          <strong>
                            {% if item.discount_price %}
                          <span> {{item.discount_price}}</span>
                          <del>${{item.price}}</del> 
                            {%else%}
                            {{ item.price }} 
                            {% endif %}
                          </strong>
                        </p>
                        <a href="{% url 'core:add-to-cart-home' item.slug %}" class="btn btn-primary btn-lg my-0 p"> Add to cart </a>
                      </div>
                      
                    
                      <!--Card content-->
                    </div>
                    <!--Card-->
                  </div>
                  <!--Grid column-->
                  <!--Grid column-->
                  {% endfor %}
              
            </div>
          </div
        </div>
      </div>
    </section>
{% endblock content %}