@extends('layout.frontend.master')

@section('meta-title', 'LEREVE')

@push('asset-top')
    
@endpush

@section('content')
   <section class="page-content home-block">
      <section class="banner-area">
         <div class="hero-slider">
            <div class="single-slider">
               <div class="banner-image">
                  <a href="{{route('products')}}">
                  <img src="{{ asset('images/banner/banner-1.jpg') }}"></a>
               </div>
            </div>
            <div class="single-slider">
               <div class="banner-image"><a href="{{route('products')}}">
                  <img src="{{ asset('images/banner/banner-2.jpg') }}"></a>
               </div>
            </div>
         </div>
      </section>
      <section class="top-categories ">
         <div class="container-fluid">
            <div class="home-grid">
               @foreach($categories as $key=>$category)
                  <div class="item item-{{$key+1}}">
                     <div class="cat-block">
                        <a href="{{route('product_cat',['slug'=>$category->slug])}}">
                           <div class="category-img">
                              <img src="/gallery/category/{{$category->thumbnail}}" alt="{{$category->slug}}">
                           </div>
                           <div class="cate-head">
                              <h3>  {{app()->getLocale()=='en'?$category->name_en:$category->name_ar}} </h3>
                              <div class="more-btn">{{__('Shop Now')}}</div>
                           </div>
                        </a>
                     </div>
                  </div>
               @endforeach
            </div>
         </div>
      </section>
      <section class="product-block">
         <div class="page-head">
         <h2>{{ __('Our Customers') }}<br/> {{ __('Favourites') }} </h2></div>
         <div class="product-listing">
            <div class="container-fluid">
               <div class="product-slider main-slider row">
                  @foreach($products as $product)
                     @if($product->dsale_price)
                        @php
                           $percent = (($product->dprice-$product->dsale_price)/$product->dprice) * 100;
                           $percent = ceil($percent);
                        @endphp
                     @endif
                     @php
                        $weights = json_decode($product->measurements, true);
                     @endphp
                     <div class="col-lg-6 product-col">
                        <div class="product">
                           <div class="product-image">
                              @if($percent)
                              <div class="ribbon offer">{{$percent}}% {{__('OFF')}}</div>
                              @endif
                              <a  href="{{route('single.product', ['slug'=>$product->slug])}}"><img class="img-fluid" src="/gallery/products/images/{{$product->thumbnail}}" alt="product"></a>
                           </div>
                           <div class="product-content">
                              <h4> 
                                 <a  href="{{route('single.product', ['slug'=>$product->slug])}}">{{ (app()->getlocale()=='en') ? $product->name_en : $product->name_ar }}</a>
                              </h4>
                              @if($product->dsale_price)
                                 <div class="price">{{$product->dsale_price}} {{__('KWD')}} <span class="offer-price">{{$product->dprice}} {{__('KWD')}}</span></div>
                              @else
                                 <div class="price">{{$product->dprice}} {{__('KWD')}}</div>
                              @endif                           
                              <div class="add-cart">
                                 @if(count($weights)>1)
                                    <a href="{{route('single.product', ['slug'=>$product->slug])}}" class="primery-btn"> <span class="cart-icon"></span>{{__('Select Options')}}</a>
                                 @else
                                    <a href="{{route('single.product', ['slug'=>$product->slug])}}" class="primery-btn"> <span class="cart-icon"></span>{{__('Add To Cart')}}</a>
                                 @endif
                              </div>
                           </div>
                        </div>
                     </div>
                  @endforeach
               </div>
            </div>
         </div>
      </section>
      <section class="blog-block">
         <div class="page-head">
         <h2>More ways to enjoy </h2></div>
         <section class="blog-grid-v3 ">
            <div class="container">
               <div class="row blog-slider-three main-slider">
                  <div class="col-lg-3">
                     <div class="blog-post-item mb-30">
                        <a href="#">
                           <div class="post-thumbnail">
                              <img src="{{ asset('images/news/1.jpg') }}" alt="news">
                           </div>
                           <div class="entry-content">
                              <h3 class="title">   Treats for any Occasion  </h3>
                              <p> We’ve got you covered for any holiday, special occasion, or cause for 
                                 celebration. 
                              </p>
                              <div class="more-btn">{{__('Shop Now')}} </div>
                           </div>
                        </a>
                     </div>
                  </div>
                  <div class="col-lg-3">
                     <div class="blog-post-item mb-30">
                        <a href="#">
                           <div class="post-thumbnail">
                              <img src="{{ asset('images/news/2.jpg') }}" alt="news">
                           </div>
                           <div class="entry-content">
                              <h3 class="title">Create Your Own Box</h3>
                              <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque ac blandit nisi. Suspendisse in varius velit.</p>
                              <div class="more-btn">{{__('Shop Now')}} </div>
                           </div>
                        </a>
                     </div>
                  </div>
                  <div class="col-lg-3">
                     <div class="blog-post-item mb-30">
                        <a href="#">
                           <div class="post-thumbnail">
                              <img src="{{ asset('images/news/3.jpg') }}" alt="news">
                           </div>
                           <div class="entry-content">
                              <h3 class="title">Corporate Gifts</h3>
                              <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque ac blandit nisi. Suspendisse in varius velit.</p>
                              <div class="more-btn">{{__('Shop Now')}} </div>
                           </div>
                        </a>
                     </div>
                  </div>
                  <div class="col-lg-3">
                     <div class="blog-post-item mb-30">
                        <a href="#">
                           <div class="post-thumbnail">
                              <img src="{{ asset('images/news/4.jpg') }}" alt="news">
                           </div>
                           <div class="entry-content">
                              <h3 class="title">Bookable Afternoon Tea</h3>
                              <p>Bookable Afternoon Tea is served in our beautiful Imperial Room, Harrogate and Belmont Room, York.</p>
                              <div class="more-btn">{{__('Shop Now')}} </div>
                           </div>
                        </a>
                     </div>
                  </div>
               </div>
            </div>
         </section>
      </section>

      <section class="product-block">
         <div class="page-head"><h2>Our bestsellers</h2></div>
         <div class="product-listing">
            <div class="container-fluid">
               <div class="product-slider main-slider row">
                  @foreach($products as $product)
                     @if($product->dsale_price)
                        @php
                           $percent = (($product->dprice-$product->dsale_price)/$product->dprice) * 100;
                           $percent = ceil($percent);
                        @endphp
                     @endif
                     @php
                        $weights = json_decode($product->measurements, true);
                     @endphp
                     <div class="col-lg-6 product-col">
                        <div class="product">
                           <div class="product-image">
                              @if($percent)
                              <div class="ribbon offer">{{$percent}}% {{__('OFF')}}</div>
                              @endif
                              <a  href="{{route('single.product', ['slug'=>$product->slug])}}"><img class="img-fluid" src="/gallery/products/images/{{$product->thumbnail}}" alt="product"></a>
                           </div>
                           <div class="product-content">
                              <h4> 
                                 <a  href="{{route('single.product', ['slug'=>$product->slug])}}">{{ (app()->getlocale()=='en') ? $product->name_en : $product->name_ar }}</a>
                              </h4>
                              @if($product->dsale_price)
                                 <div class="price">{{$product->dsale_price}} {{__('KWD')}} <span class="offer-price">{{$product->dprice}} {{__('KWD')}}</span></div>
                              @else
                                 <div class="price">{{$product->dprice}} {{__('KWD')}}</div>
                              @endif                           
                              <div class="add-cart">
                                 @if(count($weights)>1)
                                    <a href="{{route('single.product', ['slug'=>$product->slug])}}" class="primery-btn"> <span class="cart-icon"></span>{{__('Select Options')}}</a>
                                 @else
                                    <a href="{{route('single.product', ['slug'=>$product->slug])}}" class="primery-btn"> <span class="cart-icon"></span>{{__('Add To Cart')}}</a>
                                 @endif
                              </div>
                           </div>
                        </div>
                     </div>
                  @endforeach
               </div>
            </div>
         </div>
      </section>
      <section class="news-block main-slider">
         <div class="page-head">
         <h2>About Lereve</h2></div>
         <div class="container-fluid">
            <div class="row">              
               <div class="news-col col-lg-6 col-12 ">
                  <a href="{{route('about')}}">
                     <div class="news-area">
                        <div class="news-img">
                           <img src="{{ asset('images/news/about-1.jpg') }}">
                        </div>
                        <div class="news-bottom">
                           <h3>The Story of Lereve</h3>
                           <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque ac blandit nisi. Suspendisse in varius velit.</p>
                        </div>
                     </div>
                  </a>
               </div>
               <div class="news-col col-lg-6 col-12 ">
                  <a href="{{route('contact')}}">
                     <div class="news-area">
                        <div class="news-img">
                           <img src="{{ asset('images/news/about-2.jpg') }}">
                        </div>
                        <div class="news-bottom">
                           <h3>Contact Us
                           </h3>
                           <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque ac blandit nisi. Suspendisse in varius velit.</p>
                        </div>
                     </div>
                  </a>
               </div>
            </div>
         </div>
      </section>
      <section class="testimonials main-slider">
         <div class="container-fluid">
            <div class="page-head"> <h2>sweet talk</h2></div>
            <div class="testimonial-slider">
               <div class="testimonial-list">
                  <div class="testi-area">
                     <div class="testi-content">
                        <p>
                           Hands down, the most moist & delicious chocolate cake you'll ever eat in NYC. They are my hidden gem in Manhattan!                              
                        </p>
                     </div>
                     <div class="testi-bottom">
                        <h3>Loram Ipsam</h3>
                     </div>
                  </div>
               </div>
               <div class="testimonial-list">
                  <div class="testi-area">
                     <div class="testi-content">
                        <p>
                           Lorem ipsum dolor sit amet, consectetur adipiscing elit.Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.
                        </p>
                     </div>
                     <div class="testi-bottom">
                        <h3>Loram Ipsam</h3>
                     </div>
                  </div>
               </div>
               <div class="testimonial-list">
                  <div class="testi-area">
                     <div class="testi-content">
                        <p>
                           Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus iaculis tincidunt nulla quis volutpat.  turpis egestas.
                        </p>
                     </div>
                     <div class="testi-bottom">
                        <h3>Loram Ipsam</h3>
                     </div>
                  </div>
               </div>
               <div class="testimonial-list">
                  <div class="testi-area">
                     <div class="testi-content">
                        <p>
                           Vivamus iaculis tincidunt nulla quis volutpat. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.
                        </p>
                     </div>
                     <div class="testi-bottom">
                        <h3>Loram Ipsam</h3>
                     </div>
                  </div>
               </div>
               <div class="testimonial-list">
                  <div class="testi-area">
                     <div class="testi-content">
                        <p>
                           Lorem ipsum dolor sit amet, Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.
                        </p>
                     </div>
                     <div class="testi-bottom">
                        <h3>Loram Ipsam</h3>
                     </div>
                  </div>
               </div>
            </div>
         </div>
      </section>    

      <section class="instagram-block">
         <div class="page-head">
         <h2>Find us on Instagram</h2>
         </div>
         <div class="instagrm-gallery">
            <ul class="gallery-list instagram-slider">
               <li>
                  <div class="gallery-img">
                     <img src="{{ asset('images/instagram/1.jpg') }}" alt="instagram">
                  </div>
               </li>
               <li>
                  <div class="gallery-img">
                     <img src="{{ asset('images/instagram/2.jpg') }}" alt="instagram">
                  </div>
               </li>
               <li>
                  <div class="gallery-img">
                     <img src="{{ asset('images/instagram/3.jpg') }}" alt="instagram">
                  </div>
               </li>
               <li>
                  <div class="gallery-img">
                     <img src="{{ asset('images/instagram/4.jpg') }}" alt="instagram">
                  </div>
               </li>
               <li>
                  <div class="gallery-img">
                     <img src="{{ asset('images/instagram/5.jpg') }}" alt="instagram">
                  </div>
               </li>
               <li>
                  <div class="gallery-img">
                     <img src="{{ asset('images/instagram/6.jpg') }}" alt="instagram">
                  </div>
               </li>
               <li>
                  <div class="gallery-img">
                     <img src="{{ asset('images/instagram/7.jpg') }}" alt="instagram">
                  </div>
               </li>
            </ul>
         </div>
      </section>
      <section class="page-bottom">
         <div class="container-fluid">
            <div class="row">
               <div class="col-lg-3 col-md-3 col-6">
                  <div class="delivery-block">
                     <img src="{{ asset('images/vehicle.svg') }}" alt="Vehicle">
                     <h3>Home delivery</h3>
                  </div>
               </div>
               <div class="col-lg-3 col-md-3 col-6">
                  <div class="delivery-block">
                     <img src="{{ asset('images/take-way.svg') }}" alt="take way">
                     <h3>
                        Take Away
                     </h3>
                  </div>
               </div>
               <div class="col-lg-3 col-md-3 col-6">
                  <div class="delivery-block">
                     <img src="{{ asset('images/dining.svg') }}" alt="Dining">
                     <h3>Dine-In </h3>
                  </div>
               </div>
               <div class="col-lg-3 col-md-3 col-6">
                  <div class="delivery-block">
                     <img src="{{ asset('images/gift.svg') }}" alt="Dining">
                     <h3>Gift </h3>
                  </div>
               </div>
            </div>
         </div>
      </section>
   </section>
@endsection

@push('asset-bottom')
@endpush