@extends('website.layout.layout')
@section('content')
<!-- hero -->
<header id="head-slider" class=" mt-3 container">
<div class=" text-center " id="header">
<div class="row m-0">
<div class="hero-carousel col-md-12 my-2 order-md-last order-first mt-3">
<div id="carouselExampleDark" class="carousel carousel-dark slide container-sm"
data-bs-ride="carousel">
<div class="carousel-indicators">
<button type="button" data-bs-target="#carouselExampleDark" data-bs-slide-to="0"
class="active"
aria-current="true" aria-label="Slide 1"></button>
<button type="button" data-bs-target="#carouselExampleDark" data-bs-slide-to="1"
aria-label="Slide 2"></button>
<button type="button" data-bs-target="#carouselExampleDark" data-bs-slide-to="2"
aria-label="Slide 3"></button>
<button type="button" data-bs-target="#carouselExampleDark" data-bs-slide-to="3"
aria-label="Slide 4"></button>
<button type="button" data-bs-target="#carouselExampleDark" data-bs-slide-to="4"
aria-label="Slide 5"></button>
</div>
<div class="carousel-inner">
<div class="carousel-item active" data-bs-interval="3000">
<a href="{{\App\Helpers\getSetting('carousel-1-link')}}">
<img src="{{asset('images/carousel/carousel-1.jpg')}}"
class="d-block w-100 "
alt="..."></a>
</div>
<div class="carousel-item" data-bs-interval="3000">
<a href="{{\App\Helpers\getSetting('carousel-2-link')}}">
<img src="{{asset('images/carousel/carousel-2.jpg')}}"
class="d-block w-100"
alt="..."></a>
</div>
<div class="carousel-item" data-bs-interval="3000">
<a href="{{\App\Helpers\getSetting('carousel-3-link')}}">
<img src="{{asset('images/carousel/carousel-3.jpg')}}"
class="d-block w-100"
alt="..."></a>
</div>
<div class="carousel-item" data-bs-interval="3000">
<a href="{{\App\Helpers\getSetting('carousel-4-link')}}">
<img src="{{asset('images/carousel/carousel-4.jpg')}}"
class="d-block w-100"
alt="..."></a>
</div>
<div class="carousel-item" data-bs-interval="3000">
<a href="{{\App\Helpers\getSetting('carousel-5-link')}}">
<img src="{{asset('images/carousel/carousel-5.jpg')}}"
class="d-block w-100 "
alt="..."></a>
</div>
</div>
<button class="carousel-control-next" type="button" data-bs-target="#carouselExampleDark"
data-bs-slide="prev">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span>
</button>
<button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleDark"
data-bs-slide="next">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span>
</button>
</div>
</div>
<div class="row m-0">
<div class="col-6">
<a href="{{\App\Helpers\getSetting('banner1-link')}}"><img src="{{asset('images/banner1.png')}}" alt=""></a>
</div>
<div class="col-6">
<a href="{{\App\Helpers\getSetting('banner2-link')}}"><img src="{{asset('images/banner2.png')}}" alt=""></a>
</div>
</div>
</div>
</div>
</header>
<!-- hero -->
<!-- banners-->
<section class="banners container mt-3">
<div class="row m-0">
<div class="col-12 col-sm-12 col-md-6 col-lg-6 col-xl-6 mt-3 mt-sm-3 mt-md-0 ">
<a href="{{\App\Helpers\getSetting('banner3-link')}}"><img src="{{asset('images/banner3.png')}}" alt=""></a>
</div>
<div class="col-12 col-sm-12 col-md-6 col-lg-6 col-xl-6 mt-3 mt-sm-3 mt-md-0 ">
<a href="{{\App\Helpers\getSetting('banner4-link')}}"><img src="{{asset('images/banner4.png')}}" alt=""></a>
</div>
</div>
</section>
<!-- banners-->
<!-- services-->
<div class="head-services container mt-3">
<div class="row m-0">
@if(\App\Helpers\getSettingCategory('supports') != null)
@foreach(\App\Helpers\getSettingCategory('supports')->posts as $p)
<div class="serv-box col-6 col-sm-6 col-md-6 col-lg-3 col-xl-3">
<a href="{{route('n.show',$p->slug)}}">
<div class="row m-0">
<div class="col-4">
<img src="{{$p->imgUrl()}}" style="max-height: 58px;" alt="">
</div>
<div class="col-8">
<h4>
{{$p->title}}
</h4>
<span>
{{$p->subtitle}}
</span>
</div>
</div>
</a>
</div>
@endforeach
@endif
</div>
</div>
<!-- services-->
<!-- slider 1-->
<div class="slider-title container mt-4">
<h5>
محصولات آرایشی
</h5>
</div>
<section class="slider container ">
<div class="main-content">
<div class="owl-carousel owl-theme">
@foreach($disPros as $pro)
<div class="item">
<a href="{{route('product',$pro->slug)}}">
<div class="slider-box">
<img src="{{$pro->thumburl()}}" alt="Picture 1">
<h5>
{{$pro->name}}
</h5>
<del>
{{$pro->getOldPrice()}}
</del>
<h6>
{{$pro->getPurePrice()}}
</h6>
<img src="{{asset('images/sale.svg')}}" class="sale-off" alt="">
</div>
</a>
</div>
@endforeach
</div>
<div class="owl-theme">
<div class="owl-controls">
<div class="custom-nav owl-nav"></div>
</div>
</div>
</div>
</section>
<!-- slider 1-->
<!-- offer banners mid-->
<div class="offer-mid-banner mt-3 container">
<div class="row m-0">
<div class="col-6">
<a href="{{\App\Helpers\getSetting('offer1-link')}}"><img src="{{asset('images/offer1.png')}}" alt=""></a>
</div>
<div class="col-6">
<a href="{{\App\Helpers\getSetting('offer2-link')}}"><img src="{{asset('images/offer2.png')}}" alt=""></a>
</div>
</div>
</div>
<!-- offer banners mid-->
<!-- slider 2-->
<div class="slider-title container mt-4">
<h5>
محصولات بهداشتی
</h5>
</div>
<section class="slider container ">
<div class="main-content">
<div class="owl-carousel owl-theme">
<div class="item">
<a href="product.html">
<div class="slider-box">
<img src="assets/img/index/products/p-2.jpeg" alt="Picture 1">
<h5>
نام محصول
</h5>
<del>185.000</del>
<h6>165.200</h6>
<img src="assets/img/sale.svg" class="sale-off" alt="">
</div>
</a>
</div>
<div class="item">
<a href="product.html">
<div class="slider-box">
<img src="assets/img/index/products/p-1.jpeg" alt="Picture 1">
<h5>
نام محصول
</h5>
<del>185.000</del>
<h6>165.200</h6>
<img src="assets/img/sale.svg" class="sale-off" alt="">
</div>
</a>
</div>
<div class="item">
<a href="product.html">
<div class="slider-box">
<img src="assets/img/index/products/p-3.jpeg" alt="Picture 1">
<h5>
نام محصول
</h5>
<del>185.000</del>
<h6>165.200</h6>
<img src="assets/img/sale.svg" class="sale-off" alt="">
</div>
</a>
</div>
<div class="item">
<a href="product.html">
<div class="slider-box">
<img src="assets/img/index/products/p-4.jpeg" alt="Picture 1">
<h5>
نام محصول
</h5>
<del>185.000</del>
<h6>165.200</h6>
<img src="assets/img/sale.svg" class="sale-off" alt="">
</div>
</a>
</div>
</div>
<div class="owl-theme">
<div class="owl-controls">
<div class="custom-nav owl-nav"></div>
</div>
</div>
</div>
</section>
<!-- slider 2-->
<!-- slider 3-->
<div class="slider-title container mt-4">
<h5>
محصولات بهداشت بدن
</h5>
</div>
<section class="slider container ">
<div class="main-content">
<div class="owl-carousel owl-theme">
<div class="item">
<a href="product.html">
<div class="slider-box">
<img src="assets/img/index/products/p-2.jpeg" alt="Picture 1">
<h5>
نام محصول
</h5>
<del>185.000</del>
<h6>165.200</h6>
<img src="assets/img/sale.svg" class="sale-off" alt="">
</div>
</a>
</div>
<div class="item">
<a href="product.html">
<div class="slider-box">
<img src="assets/img/index/products/p-1.jpeg" alt="Picture 1">
<h5>
نام محصول
</h5>
<del>185.000</del>
<h6>165.200</h6>
<img src="assets/img/sale.svg" class="sale-off" alt="">
</div>
</a>
</div>
<div class="item">
<a href="product.html">
<div class="slider-box">
<img src="assets/img/index/products/p-3.jpeg" alt="Picture 1">
<h5>
نام محصول
</h5>
<del>185.000</del>
<h6>165.200</h6>
<img src="assets/img/sale.svg" class="sale-off" alt="">
</div>
</a>
</div>
<div class="item">
<a href="product.html">
<div class="slider-box">
<img src="assets/img/index/products/p-4.jpeg" alt="Picture 1">
<h5>
نام محصول
</h5>
<del>185.000</del>
<h6>165.200</h6>
<img src="assets/img/sale.svg" class="sale-off" alt="">
</div>
</a>
</div>
</div>
<div class="owl-theme">
<div class="owl-controls">
<div class="custom-nav owl-nav"></div>
</div>
</div>
</div>
</section>
<!-- slider 3-->
@endsection