306 lines
15 KiB
HTML
306 lines
15 KiB
HTML
|
{% load static %}
|
||
|
<!doctype html>
|
||
|
<html class="no-js" lang="">
|
||
|
|
||
|
<head>
|
||
|
<meta charset="utf-8">
|
||
|
<meta http-equiv="x-ua-compatible" content="ie=edge">
|
||
|
<title>{% block title %}E - S H O P{% endblock title %}</title>
|
||
|
<meta name="description" content="">
|
||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
|
<!-- favicon -->
|
||
|
<link rel="shortcut icon" type="image/x-icon" href="{% static 'img/logo.jpg' %}">
|
||
|
|
||
|
<link rel="apple-touch-icon" href="apple-touch-icon.png' %}">
|
||
|
<!-- Place favicon.ico in the root directory -->
|
||
|
<!-- google fonts -->
|
||
|
<!-- CSS only -->
|
||
|
|
||
|
<link href='https://fonts.googleapis.com/css?family=Lato:400,900,700,300' rel='stylesheet' type='text/css'>
|
||
|
<link href='https://fonts.googleapis.com/css?family=Bree+Serif' rel='stylesheet' type='text/css'>
|
||
|
<!-- all css here -->
|
||
|
<!-- bootstrap v3.3.6 css -->
|
||
|
<link rel="stylesheet" href="{% static 'css/bootstrap.min.css' %}">
|
||
|
<!-- animate css -->
|
||
|
<link rel="stylesheet" href="{% static 'css/animate.css' %}">
|
||
|
<!-- pe-icon-7-stroke -->
|
||
|
<link rel="stylesheet" href="{% static 'css/materialdesignicons.min.css' %}">
|
||
|
<!-- pe-icon-7-stroke -->
|
||
|
<link rel="stylesheet" href="{% static 'css/jquery.simpleLens.css' %}">
|
||
|
<!-- jquery-ui.min css -->
|
||
|
<link rel="stylesheet" href="{% static 'css/jquery-ui.min.css' %}">
|
||
|
<!-- meanmenu css -->
|
||
|
<link rel="stylesheet" href="{% static 'css/meanmenu.min.css' %}">
|
||
|
<!-- nivo.slider css -->
|
||
|
<link rel="stylesheet" href="{% static 'css/nivo-slider.css' %}">
|
||
|
<!-- owl.carousel css -->
|
||
|
<link rel="stylesheet" href="{% static 'css/owl.carousel.css' %}">
|
||
|
<!-- style css -->
|
||
|
<link rel="stylesheet" href="{% static 'css/style.css' %}">
|
||
|
<!-- responsive css -->
|
||
|
<link rel="stylesheet" href="{% static 'css/responsive.css' %}">
|
||
|
<!-- modernizr js -->
|
||
|
|
||
|
|
||
|
|
||
|
<style>
|
||
|
#searchh input[type=text] {
|
||
|
width: 150px;
|
||
|
margin-top:10px;
|
||
|
margin-bottom:10px;
|
||
|
box-sizing: border-box;
|
||
|
border: 2px solid #f4cca4;
|
||
|
border-radius: 4px;
|
||
|
font-size: 16px;
|
||
|
color:#1c1427;
|
||
|
background-color: #fff;
|
||
|
background-position: 10px 10px;
|
||
|
background-repeat: no-repeat;
|
||
|
padding: 12px 20px 12px 40px;
|
||
|
-webkit-transition: width 0.4s ease-in-out;
|
||
|
transition: width 0.4s ease-in-out;
|
||
|
}
|
||
|
|
||
|
#searchh input[type=text]:focus {
|
||
|
width: 80%;
|
||
|
}
|
||
|
</style>
|
||
|
|
||
|
<!--<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">-->
|
||
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
|
||
|
<script src="{% static 'js/vendor/modernizr-2.8.3.min.js' %}"></script>
|
||
|
|
||
|
<script src="https://www.paypal.com/sdk/js?client-id=ATDakGEFESlSq0xbOzxw0W-dZUWrKfiedaKAFHEk0QKfsUeeR_9j6G1A78TUmvFJuMvz3ArZroEobPHY¤cy=USD"></script>
|
||
|
|
||
|
</head>
|
||
|
|
||
|
<body style="background:#40394a">
|
||
|
|
||
|
<!-- header section start -->
|
||
|
<header style="background:#1c1427" class="header-one header-two">
|
||
|
<div style="background:#1c1427" class="header-top-two">
|
||
|
<div class="container text-center">
|
||
|
<div class="row">
|
||
|
<div class="col-sm-12">
|
||
|
<div class="middel-top">
|
||
|
{% if user.id is None %}
|
||
|
<div class="left floatleft">
|
||
|
<p style="color:#f4cca4"><b>Welcome Guest!</b></p>
|
||
|
</div>
|
||
|
{% else %}
|
||
|
<div class="left floatleft">
|
||
|
<p style="color:#f4cca4"><b>Welcome {{user.first_name | capfirst}}!</b></p>
|
||
|
</div>
|
||
|
{% endif %}
|
||
|
</div>
|
||
|
<div class="middel-top clearfix">
|
||
|
<ul class="clearfix right floatright">
|
||
|
<li>
|
||
|
<a style="color:#f4cca4" href="#"><i class="mdi mdi-account"></i></a>
|
||
|
{% if user.id is None %}
|
||
|
<ul style="background:#1c1427">
|
||
|
<li><a href="{% url 'accounts:login' %}">Login</a></li>
|
||
|
<li><a href="{% url 'accounts:register' %}">Registar</a></li>
|
||
|
</ul>
|
||
|
{% else %}
|
||
|
<ul style="background:#1c1427">
|
||
|
<li><a href="{% url 'accounts:dashboard' %}">Dashboard</a></li>
|
||
|
<li><a href="{% url 'accounts:logout' %}">Logout</a></li>
|
||
|
</ul>
|
||
|
{% endif %}
|
||
|
</li>
|
||
|
<li>
|
||
|
<a style="color:#f4cca4" href="#"><i class="mdi mdi-settings"></i></a>
|
||
|
<ul style="background:#1c1427">
|
||
|
<li><a href="my-account.html">My account</a></li>
|
||
|
<li><a href="cart.html">My cart</a></li>
|
||
|
<li><a href="wishlist.html">My wishlist</a></li>
|
||
|
<li><a href="checkout.html">Check out</a></li>
|
||
|
</ul>
|
||
|
</li>
|
||
|
</ul>
|
||
|
<!--
|
||
|
<div class="right floatright">
|
||
|
|
||
|
<form action="{% url 'shop:search' %}" method="GET" >
|
||
|
<button style="color:#d99879" type="submit"><i class="mdi mdi-magnify"></i></button>
|
||
|
<input type="text" placeholder="Search..." name="keyword"/>
|
||
|
</form>
|
||
|
-->
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
<div style="background:#40394a">
|
||
|
<div class="container text-center">
|
||
|
<div class="row">
|
||
|
<div class="col-sm-12">
|
||
|
<form id="searchh" action={% url 'shop:search' %} method="GET">
|
||
|
<input type="text" name="keyword" placeholder="Search...">
|
||
|
<button style="height:49px; margin-bottom:6px; background:#f4cca4;margin-left:-1px;border:None " class="btn btn-warning" type="submit">
|
||
|
<i style="color:#d99879" class="fa fa-search"></i>
|
||
|
</button>
|
||
|
</form>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
<div class="container text-center">
|
||
|
<div class="row">
|
||
|
<div class="col-sm-2">
|
||
|
<div class="logo">
|
||
|
<a style="color:#f4cca4;font-weight: 800;" href="\"><span
|
||
|
style="color:#d99879">E-</span>shop</a>
|
||
|
</div>
|
||
|
</div>
|
||
|
<div class="col-sm-8">
|
||
|
<div class="header-middel">
|
||
|
<div class="mainmenu">
|
||
|
<nav >
|
||
|
<ul>
|
||
|
<li ><a href="\">Home</a></li>
|
||
|
<li><a href="{% url 'shop:shop' %}">Shop</a></li>
|
||
|
<li><a href="#">Category <i class="mdi mdi-arrow-down"></i></a>
|
||
|
<ul class="dropdown">
|
||
|
<li><a href="{% url 'shop:shop' %}">All</a></li>
|
||
|
{% for category in categories %}
|
||
|
<li><a href="{{ category.get_category_slug_url }}">{{category.name}}</a></li>
|
||
|
{% endfor %}
|
||
|
</ul>
|
||
|
</li>
|
||
|
<li><a href="blog.html">Blog</a></li>
|
||
|
<li><a href="about.html">About</a></li>
|
||
|
<li><a href="contact.html">Contact</a></li>
|
||
|
</ul>
|
||
|
</nav>
|
||
|
</div>
|
||
|
<!-- mobile menu start -->
|
||
|
<div class="mobile-menu-area">
|
||
|
<div class="mobile-menu">
|
||
|
<nav id="dropdown">
|
||
|
<ul >
|
||
|
<li><a style="color:#1c1427" href="\">Home</a></li>
|
||
|
<li><a style="color:#1c1427" href="{% url 'shop:shop' %}">Shop</a></li>
|
||
|
<li><a style="color:#1c1427" href="{% url 'shop:shop' %}">Category</a>
|
||
|
<ul class="dropdown">
|
||
|
<li><a style="color:#1c1427" href="{% url 'shop:shop' %}">All</a></li>
|
||
|
{% for category in categories %}
|
||
|
<li><a style="color:#1c1427" href="{{ category.get_category_slug_url }}">{{category.name}}</a></li>
|
||
|
{% endfor %}
|
||
|
</ul>
|
||
|
</li>
|
||
|
<li><a style="color:#1c1427" href="blog.html">Blog</a></li>
|
||
|
<li><a style="color:#1c1427" href="about.html">About</a></li>
|
||
|
<li><a style="color:#1c1427" href="contact.html">Contact</a></li>
|
||
|
</ul>
|
||
|
</nav>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
<div class="col-sm-2">
|
||
|
<div class="cart-itmes">
|
||
|
<a class="cart-itme-a" href="{% url 'cart:cart' %}">
|
||
|
|
||
|
<i class="mdi mdi-cart"></i>
|
||
|
{{quantityyy}} items : <strong>${{totalll}}</strong>
|
||
|
</a>
|
||
|
<div class="cartdrop">
|
||
|
{% for x in cart_itemsss %}
|
||
|
<div class="sin-itme clearfix">
|
||
|
<a style="color:#f4cca4" href="{% url 'cart:remove_cart_item' x.product.id x.id %}" onclick="return confirm('Are you really want delete this?')"><i style="background:#ba135d" class="mdi mdi-close"></i></a>
|
||
|
<a class="cart-img" href="{{x.product.get_prodcut_details_url}}"><img style="height:108px;width:100%" src="{{x.product.image.url}}" alt="" /></a>
|
||
|
<div class="menu-cart-text floatright">
|
||
|
<a href="{{x.product.get_prodcut_details_url}}">
|
||
|
<h5>{{x.product.name}}</h5>
|
||
|
</a>
|
||
|
|
||
|
{% if x.variation.all %}
|
||
|
{% for item in x.variation.all %}
|
||
|
<span>{{item.variation_category | capfirst}} : {{item.variation_value | capfirst}}</span>
|
||
|
{% endfor %}
|
||
|
{% endif %}
|
||
|
<span>Price for each : ${{x.product.price}}</span>
|
||
|
<span>Quantity : {{x.quantity}}</span>
|
||
|
<strong>${{x.sub_total}}</strong>
|
||
|
</div>
|
||
|
</div>
|
||
|
|
||
|
{% endfor %}
|
||
|
|
||
|
<div class="total">
|
||
|
<span>total <strong>= ${{totalll}}</strong></span>
|
||
|
</div><br>
|
||
|
{% if '/cart/' not in request.path %}
|
||
|
<a style="background:#40394a;color:#f4cca4" class="out-menu" href="{% url 'cart:cart' %}">Go To Cart</a>
|
||
|
{% endif %}
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</header>
|
||
|
<br>
|
||
|
<!--===================== Content ====================-->
|
||
|
{% block content %}
|
||
|
|
||
|
{% endblock content %}
|
||
|
|
||
|
|
||
|
<footer>
|
||
|
<div style="background:#3f3350" class="footer-bottom">
|
||
|
<div class="container">
|
||
|
<div class="row">
|
||
|
<div class="col-xs-12 col-sm-6">
|
||
|
<p style="color:#d99879">Created By <span style="color:#f4cca4"><b>Omar Reda</b></span> 2021 &
|
||
|
All Rights Reserved.</p>
|
||
|
</div>
|
||
|
<div class="col-xs-12 col-sm-6 text-right">
|
||
|
<a href="#"><img src="{% static 'img/footer/payment.png' %}" alt="" /></a>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
<!-- footer-bottom area end -->
|
||
|
</footer>
|
||
|
<!-- footer section end -->
|
||
|
|
||
|
<!-- all js here -->
|
||
|
<!-- jquery latest version -->
|
||
|
<script src="{% static 'js/vendor/jquery-1.12.3.min.js' %}"></script>
|
||
|
<!-- bootstrap js -->
|
||
|
<script src="{% static 'js/bootstrap.min.js' %}"></script>
|
||
|
<!-- owl.carousel js -->
|
||
|
<script src="{% static 'js/owl.carousel.min.js' %}"></script>
|
||
|
<!-- meanmenu js -->
|
||
|
<script src="{% static 'js/jquery.meanmenu.js' %}"></script>
|
||
|
<!-- countdown JS -->
|
||
|
<script src="{% static 'js/countdown.js' %}"></script>
|
||
|
<!-- nivo.slider JS -->
|
||
|
<script src="{% static 'js/jquery.nivo.slider.pack.js' %}"></script>
|
||
|
<!-- simpleLens JS -->
|
||
|
<script src="{% static 'js/jquery.simpleLens.min.js' %}"></script>
|
||
|
<!-- jquery-ui js -->
|
||
|
<script src="{% static 'js/jquery-ui.min.js' %}"></script>
|
||
|
<!-- load-more js -->
|
||
|
<script src="{% static 'js/load-more.js' %}"></script>
|
||
|
<!-- plugins js -->
|
||
|
<script src="{% static 'js/plugins.js' %}"></script>
|
||
|
<!-- main js -->
|
||
|
<script src="{% static 'js/main.js' %}"></script>
|
||
|
|
||
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
|
||
|
<script>
|
||
|
$(document).ready(function(){
|
||
|
$('.thumb a').click(function(e){
|
||
|
e.preventDefault();
|
||
|
$('.mainImage img').attr('src', $(this).attr("href"));
|
||
|
$('.mainImage a').attr('data-lens-image', $(this).attr("data-lens-image"));
|
||
|
})
|
||
|
})
|
||
|
</script>
|
||
|
</body>
|
||
|
|
||
|
</html>
|