{% extends "@Flexy/FrontBundle/templates/layout.html.twig" %}
{% block stylesheets %}
{{ parent() }}
<link rel="stylesheet" href="{{ asset('bundles/easyadmin/style.css') }}" />
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css" />
<!-- nice select -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-nice-select/1.1.0/css/nice-select.min.css" integrity="sha512-CruCP+TD3yXzlvvijET8wV5WxxEh5H8P4cmz0RFbKK6FlZ2sYl3AEsKlLPHbniXKSrDdFewhbmBK5skbdsASbQ==" crossorigin="anonymous" />
<link rel="stylesheet" href="{{ asset('bundles/easyadmin/responsive.css') }}" />
<link rel="stylesheet" href="{{ asset('bundles/easyadmin/font-awesome.min.css') }}" />
{% endblock %}
{% block body %}
<div class="body-wrapper">
<!-- Li's Breadcrumb Area End Here -->
<!-- Begin Li's Content Wraper Area -->
<div class="content-wraper pt-60 pb-60">
<div class="container">
<div class="row">
{% set colBody = "col-lg-9" %}
{% if categoryProduct.id == 75 %}
{% set colBody = "col-lg-12" %}
{% endif %}
<div class="{{colBody}} order-2 order-lg-1">
<!-- Begin Li's Banner Area -->
{% if categoryProduct.id == 75 %}
<div class="text-center p-3" >
<h2><i class="fa fa-hamburger"></i> O'MALL FOOD</h2>
</div>
{% endif %}
{% if categoryProduct.image %}
<div class="single-banner shop-page-banner">
<a href="#">
<img src="/uploads/{{asset(categoryProduct.image)}}" alt="">
</a>
</div>
{% endif %}
<div class="shop-products-wrapper">
<div class="tab-content">
<div id="grid-view" class="tab-pane fade " role="tabpanel">
<div class="product-area shop-product-area">
<div class="row">
</div>
</div>
</div>
<div id="list-view" class="tab-pane fade product-list-view active show" role="tabpanel">
<div class="row">
<div class="col">
<div class="filters-content">
<section class="food_section layout_padding">
<div class="container">
<ul class="filters_menu">
<li class="active" data-filter="*">Tout</li>
<li data-filter=".burger">Fast food</li>
<li data-filter=".pizza">Pizza</li>
<li data-filter=".cafe">café</li>
<li data-filter=".super">Super marché</li>
</ul>
<div class="filters-content">
<div class="row grid">
<div class="col-sm-6 col-lg-4 all burger">
<div class="box">
<div>
<div class="img-box">
<img src="{{asset('food/macd.webp')}}" alt="">
</div>
<div class="detail-box">
<h5>
McDonald's
</h5>
<p style="color: #ffffff;">
<i class="fa fa-map-marker" aria-hidden="true"></i>
53, rond Rond-point Mers Sultan
</p>
<p style="color: #ffffff;">
<i class="fa fa-phone" aria-hidden="true"></i> 05222-26459
</p>
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-4 all burger">
<div class="box">
<div>
<div class="img-box">
<img src="{{asset('food/logo-77.png')}}" alt="">
</div>
<div class="detail-box">
<h5>
Tacos de Lyon
</h5>
<p style="color: #ffffff;">
<i class="fa fa-map-marker" aria-hidden="true"></i>
52 Bd Mohamed Zerktouni, Casablanca
</p>
<p style="color: #ffffff;">
<i class="fa fa-phone" aria-hidden="true"></i> 0625-000069
</p>
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-4 all burger">
<div class="box">
<div>
<div class="img-box">
<img src="{{asset('food/KFC.png')}}" alt="">
</div>
<div class="detail-box">
<h5>
KFC
</h5>
<p style="color: #ffffff;">
<i class="fa fa-map-marker" aria-hidden="true"></i>
34 Bd Mohammed V, Casablanca
</p>
<p style="color: #ffffff;">
<i class="fa fa-phone" aria-hidden="true"></i> 0618-148358
</p>
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-4 all burger">
<div class="box">
<div>
<div class="img-box">
<img src="{{asset('food/burger-king.jpeg')}}" alt="">
</div>
<div class="detail-box">
<h5>
Burger King
</h5>
<p style="color: #ffffff;">
<i class="fa fa-map-marker" aria-hidden="true"></i>
Rue Abou Salt Andaloussi, Casablanca
</p>
<p style="color: #ffffff;">
<i class="fa fa-phone" aria-hidden="true"></i> 05222-53934
</p>
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-4 all burger">
<div class="box">
<div>
<div class="img-box">
<img src="{{asset('food/quick.png')}}" alt="">
</div>
<div class="detail-box">
<h5>
Quick
</h5>
<p style="color: #ffffff;">
<i class="fa fa-map-marker" aria-hidden="true"></i>
6 Rue El Kadi Iass, Casablanca
</p>
<p style="color: #ffffff;">
<i class="fa fa-phone" aria-hidden="true"></i> 05222-26459
</p>
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-4 all cafe">
<div class="box">
<div>
<div class="img-box">
<img src="{{asset('food/starbucks.jpg')}}" alt="">
</div>
<div class="detail-box">
<h5>
Starbucks
</h5>
<p style="color: #ffffff;">
<i class="fa fa-map-marker" aria-hidden="true"></i>
Massira Alkhadra Building, Casablanca
</p>
<p style="color: #ffffff;">
<i class="fa fa-phone" aria-hidden="true"></i> 05224-93665
</p>
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-4 all pizza">
<div class="box">
<div>
<div class="img-box">
<img src="{{asset('food/pizza.jpg')}}" alt="">
</div>
<div class="detail-box">
<h5>
Pizza Hut
</h5>
<p style="color: #ffffff;">
<i class="fa fa-map-marker" aria-hidden="true"></i>
67 Bd Moulay Youssef, Casablanca
</p>
<p style="color: #ffffff;">
<i class="fa fa-phone" aria-hidden="true"></i> 05224-73626
</p>
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-4 all super">
<div class="box">
<div>
<div class="img-box">
<img src="{{asset('food/Marjane.webp')}}" alt="">
</div>
<div class="detail-box">
<h5>
Marjane
</h5>
<p style="color: #ffffff;">
<i class="fa fa-map-marker" aria-hidden="true"></i>
Angle Bd Abou Chouaib Doukkali
</p>
<p style="color: #ffffff;">
<i class="fa fa-phone" aria-hidden="true"></i> 080-2022050
</p>
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-4 all burger">
<div class="box">
<div>
<div class="img-box">
<img src="{{asset('food/unnamed.png')}}" alt="">
</div>
<div class="detail-box">
<h5>
Tazaj
</h5>
<p style="color: #ffffff;">
<i class="fa fa-map-marker" aria-hidden="true"></i>
Cornich Ain Diab
</p>
<p style="color: #ffffff;">
<i class="fa fa-phone" aria-hidden="true"></i> 05227-98091
</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- shop-products-wrapper end -->
</div>
{% if categoryProduct.id != 75 %}
<div class="col-lg-3 order-1 order-lg-2">
{{render(path('front_sideBarFilter',{filter:app.request.get("filter")}))}}
</div>
{% endif %}
</div>
</div>
</div>
<!-- Content Wraper Area End Here -->
</div>
{% endblock %}
{% block javascripts %}
{{parent()}}
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous">
</script>
<script src="https://unpkg.com/isotope-layout@3.0.4/dist/isotope.pkgd.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js">
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-nice-select/1.1.0/js/jquery.nice-select.min.js"></script>
<script src="{{ asset('bundles/easyadmin/custom.js') }}"></script>
<script src="{{ asset('bundles/easyadmin/bootstrap.js') }}"></script>
<script>
$(".shop-item-filter-list a").click(function(){
var cible = $(this).attr("aria-controls");
$(".tab-pane").removeClass("active show");
$("#"+cible).addClass("active show");
});
</script>
{% endblock %}