reupload
This commit is contained in:
@@ -0,0 +1,26 @@
|
||||
<div class="col-12 col-md-6 mt-0 mb-15">
|
||||
<div class="promobox promobox--type-04 position-relative d-flex flex-column align-items-center text-center">
|
||||
<div class="image-animation-trigger w-100">
|
||||
<a href="{{ $banner->link }}" class="w-100">
|
||||
|
||||
<div class="image-animation image-animation--from-center image-animation--to-right">
|
||||
<div class="rimage" style="padding-top:72.98245614035088%; min-height: 400px;">
|
||||
<img src="data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=" class="rimage__img rimage__img--cover rimage__img--fade-in lazyload"
|
||||
data-master="{{ $banner->image() }}"
|
||||
data-aspect-ratio="1.3701923076923077"
|
||||
|
||||
data-srcset="{{ $banner->image() }} 1x, {{ $banner->image() }} 2x"
|
||||
data-scale-perspective="1.1"
|
||||
alt="">
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
<div class="promobox__content absolute-stretch d-flex flex-column flex-center px-15 py-7 overflow-hidden pointer-events-none">
|
||||
{{-- <p class="promobox__text-line-01 h5 mb-5">NEW ARRIVALS</p> --}}
|
||||
<p class="promobox__text-line-02 h2 mt-5 mb-0" style="color: {{ $banner->textColor() }};">{{ $banner->title }}</p>
|
||||
<p class="promobox__text-line-03 h6 mt-10 mb-0" style="color: {{ $banner->textColor() }};">{{ $banner->description }}</p>
|
||||
<a href="{{ $banner->link }}" class="promobox__btn btn px-20 mt-25 pointer-events-all btn--secondary">{{ __('DISCOVER MORE') }}</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,25 @@
|
||||
@php
|
||||
$homepage_two_grid_banners = App\Models\CMS\Media\Banner::with('media')->where('place', 'homepage_2_grid')->get();
|
||||
@endphp
|
||||
|
||||
<div id="theme-section-two-grid-banners" class="theme-section">
|
||||
<div data-section-id="two-grid-banners" data-section-type="home-builder" class="container"
|
||||
>
|
||||
|
||||
<div class="overflow-x-hidden">
|
||||
<div class="row mt-0 mb-45 justify-content-start align-items-start">
|
||||
@foreach($homepage_two_grid_banners as $banner)
|
||||
@include('web.themes.shella.components.banners.2-grid-banner-item', ['banner' => $banner])
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
Loader.require({
|
||||
type: "script",
|
||||
name: "home_builder"
|
||||
});
|
||||
</script>
|
||||
|
||||
</div>
|
||||
@@ -0,0 +1,24 @@
|
||||
@php
|
||||
$homepage_three_main_banners = App\Models\CMS\Media\Banner::with('media')->where('place', 'homepage_categories')->where('is_visible', true)->get();
|
||||
@endphp
|
||||
|
||||
<div id="theme-section-1537197792650" class="theme-section">
|
||||
<div data-section-id="1537197792650" data-section-type="home-builder" class="container" style="max-width: 90%;">
|
||||
|
||||
<div class="overflow-x-hidden">
|
||||
<div class="row mt-0 mb-40 justify-content-start align-items-start">
|
||||
@foreach($homepage_three_main_banners as $banner)
|
||||
@include('web.themes.shella.components.banners.three-main-category-item', ['banner' => $banner])
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
Loader.require({
|
||||
type: "script",
|
||||
name: "home_builder"
|
||||
});
|
||||
</script>
|
||||
|
||||
</div>
|
||||
@@ -0,0 +1,36 @@
|
||||
<div class="col-12 col-md-4 mt-0 mb-10 mb-sm-15 mb-md-15 mb-lg-15 mb-xl-15">
|
||||
<div class="promobox promobox--type-05 image-animation-trigger position-relative d-flex flex-column align-items-center text-center">
|
||||
<a href="{{ $banner->category?->productsPage() }}" class="w-100">
|
||||
|
||||
<div class="image-animation image-animation--from-default image-animation--to-center image-animation--to-opacity">
|
||||
<div class="rimage" style="padding-top:72.97297297297297%;">
|
||||
<img src="data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs="
|
||||
class="rimage__img rimage__img--fade-in lazyload"
|
||||
data-master="{{ $banner->image() }}"
|
||||
data-aspect-ratio="1.3703703703703705"
|
||||
data-srcset="{{ $banner->image() }} 1x, {{ $banner->image() }} 2x"
|
||||
data-scale-perspective="1.1"
|
||||
alt="">
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
<div class="promobox__plate promobox__plate--hovered position-absolute d-flex flex-column flex-center px-10 py-7 pointer-events-none">
|
||||
<a href="{{ $banner->category?->productsPage() }}" class="pointer-events-all">
|
||||
<p class="promobox__text-line-01 h5 position-relative m-0">{{ $banner->category?->name }}</p>
|
||||
</a>
|
||||
</div>
|
||||
<div class="promobox__content-scale position-absolute d-none d-lg-flex flex-column flex-center px-15 py-7 pointer-events-none">
|
||||
<a href="{{ $banner->category?->productsPage() }}" class="pointer-events-all">
|
||||
<p class="promobox__text-line-01 h5 position-relative m-0">{{ $banner->category?->name }}</p>
|
||||
</a>
|
||||
<ul class="promobox__list list-unstyled position-relative mt-5 overflow-hidden pointer-events-all">
|
||||
@if($banner->category)
|
||||
@foreach($banner->category->children->take(4) as $category_child)
|
||||
<li><a href="{{ $category_child->productsPage() }}">{{ $category_child->name }}</a></li>
|
||||
@endforeach
|
||||
@endif
|
||||
<li><a href="{{ $banner->category?->productsPage() }}">{{ __('See All') }}</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,14 @@
|
||||
<div class="carousel__item promobox promobox--type-03">
|
||||
<a href="{{ $brand->productsPage() }}" class="position-relative w-100">
|
||||
<div class="rimage" style="padding-top:40.816326530612244%;height:100%;">
|
||||
<img src="data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs="
|
||||
class="rimage__img rimage__img--fade-in lazyload"
|
||||
style=" object-fit: contain;"
|
||||
|
||||
data-master="{{ $brand->image() }}"
|
||||
data-srcset="{{ $brand->image() }} 1x, {{ $brand->image() }} 2x"
|
||||
alt="">
|
||||
</div>
|
||||
<div class="promobox__border "></div>
|
||||
</a>
|
||||
</div>
|
||||
@@ -0,0 +1,60 @@
|
||||
@php
|
||||
$brands = App\Models\Ecommerce\Product\Brand\Brand::with('media')->where('is_visible', true)->get(['id', 'name', 'slug']);
|
||||
@endphp
|
||||
|
||||
|
||||
<div id="theme-section-1537199513853" class="theme-section mt-20">
|
||||
<div data-section-id="1537199513853" data-section-type="carousel-brands" data-postload="carousel_brands">
|
||||
|
||||
<div class="container mt-0 mb-55">
|
||||
<div class="carousel carousel--arrows carousel-brands position-relative">
|
||||
{{-- <div class="border-top mb-50"></div> --}}
|
||||
|
||||
<div class="carousel__slider position-relative invisible"
|
||||
data-js-carousel
|
||||
data-autoplay="true"
|
||||
data-speed="5000"
|
||||
data-count="6"
|
||||
data-infinite="true"
|
||||
data-arrows="true"
|
||||
data-bullets="false">
|
||||
<div class="carousel__prev position-absolute cursor-pointer" data-js-carousel-prev>
|
||||
<i>
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-006" viewBox="0 0 24 24">
|
||||
<path d="M16.736 3.417a.652.652 0 0 1-.176.449l-8.32 8.301 8.32 8.301c.117.13.176.28.176.449s-.059.319-.176.449a.91.91 0 0 1-.215.127c-.078.032-.156.049-.234.049s-.156-.017-.234-.049a.93.93 0 0 1-.215-.127l-8.75-8.75a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449l8.75-8.75a.652.652 0 0 1 .449-.176c.169 0 .319.059.449.176.117.13.176.28.176.449z"/>
|
||||
</svg>
|
||||
</i>
|
||||
</div>
|
||||
<div class="carousel__items overflow-hidden">
|
||||
<div class="carousel__slick" data-js-carousel-slick>
|
||||
@foreach($brands as $brand)
|
||||
@include('web.themes.shella.components.carousel.brand-carousel-item', ['brand' => $brand])
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
<div class="carousel__next position-absolute cursor-pointer" data-js-carousel-next>
|
||||
<i>
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-007" viewBox="0 0 24 24">
|
||||
<path d="M6.708 20.917c0-.169.059-.319.176-.449l8.32-8.301-8.32-8.301a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176l8.75 8.75c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-8.75 8.75a.91.91 0 0 1-.215.127c-.078.032-.156.049-.234.049s-.156-.017-.234-.049a.91.91 0 0 1-.215-.127.652.652 0 0 1-.176-.449z"/>
|
||||
</svg>
|
||||
</i>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
Loader.require({
|
||||
type: "style",
|
||||
name: "plugin_slick"
|
||||
});
|
||||
|
||||
Loader.require({
|
||||
type: "script",
|
||||
name: "carousel_brands"
|
||||
});
|
||||
</script>
|
||||
|
||||
</div>
|
||||
@@ -0,0 +1,41 @@
|
||||
<div class="slider__slide" @if($carousel->link) onclick="window.location.href = '{{ $carousel->link }}'" @endif>
|
||||
<div class="promobox promobox--type-07 promobox--is-slider position-relative d-flex flex-column align-items-center text-center overflow-hidden">
|
||||
<div class="image-animation-trigger w-100">
|
||||
<div class="w-100">
|
||||
<div class="image-animation image-animation--from-default image-animation--to-default">
|
||||
<div class="rimage">
|
||||
|
||||
<div class="d-sm-none" style="padding-top: 200px;"></div>
|
||||
<div class="d-none d-sm-block d-md-none" style="padding-top: 550px;"></div>
|
||||
<div class="d-none d-md-block d-lg-none" style="padding-top: 550px;"></div>
|
||||
<div class="d-none d-lg-block d-xl-none" style="padding-top: 550px;"></div>
|
||||
<div class="d-none d-xl-block" style="padding-top: 550px;"></div>
|
||||
|
||||
<img
|
||||
src="data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs="
|
||||
class="rimage__img rimage__img--cover rimage__img--fade-in lazyload"
|
||||
data-master="{{ $carousel->image() }}"
|
||||
data-aspect-ratio="3.4909090909090907"
|
||||
data-srcset="{{ $carousel->image() }} 1x, {{ $carousel->image() }} 2x"
|
||||
alt=""
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="promobox__content promobox__content--animation-scale-in absolute-stretch hide-on-mobile d-flex flex-column flex-center px-15 py-7 overflow-hidden">
|
||||
<div class="promobox__content_inner position-absolute d-flex flex-column flex-center w-100" style="max-width: 650px;margin-top: -10px;">
|
||||
|
||||
<div class="promo-text mx-auto">
|
||||
<p class="h1 mb-15 colorize-theme2-c" style="color: {{ $carousel->textColor() }};">{{ $carousel->title }}</p>
|
||||
<p class="mb-25 h4 colorize-theme2-c" style="color: {{ $carousel->textColor() }};">{{ $carousel->description }}</p>
|
||||
@if($carousel->link)
|
||||
{{-- <a href="{{ $carousel->link }}" class="promobox__btn btn px-20 mt-25 pointer-events-all btn--secondary">{{ __('DISCOVER MORE') }}</a> --}}
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,43 @@
|
||||
@php
|
||||
$homepage_hero_carousels = App\Models\CMS\Media\Carousel::with('media')->where('place', 'homepage')->where('is_visible', true)->ordered()->get();
|
||||
@endphp
|
||||
|
||||
<div id="theme-section-1551844786848" class="theme-section">
|
||||
<div data-section-id="1551844786848" data-section-type="home-builder">
|
||||
<div class="overflow-x-hidden">
|
||||
<div class="row mt-0 mb-0 justify-content-start align-items-start">
|
||||
<div class="col-12 col-md-12 mt-0 mb-0">
|
||||
<div class="slider position-relative">
|
||||
<div class="slider__prev d-none d-lg-block position-absolute cursor-pointer" data-js-slider-prev>
|
||||
<i>
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-006" viewBox="0 0 24 24">
|
||||
<path d="M16.736 3.417a.652.652 0 0 1-.176.449l-8.32 8.301 8.32 8.301c.117.13.176.28.176.449s-.059.319-.176.449a.91.91 0 0 1-.215.127c-.078.032-.156.049-.234.049s-.156-.017-.234-.049a.93.93 0 0 1-.215-.127l-8.75-8.75a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449l8.75-8.75a.652.652 0 0 1 .449-.176c.169 0 .319.059.449.176.117.13.176.28.176.449z" />
|
||||
</svg>
|
||||
</i>
|
||||
</div>
|
||||
|
||||
<div class="slider__slick" data-js-slider-slick data-arrows="true" data-bullets="true" data-speed="7">
|
||||
@foreach($homepage_hero_carousels as $carousel)
|
||||
@include('web.themes.shella.components.carousel.hero-carousel-item', ['carousel' => $carousel])
|
||||
@endforeach
|
||||
</div>
|
||||
|
||||
<div class="slider__next d-none d-lg-block position-absolute cursor-pointer" data-js-slider-next>
|
||||
<i>
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-007" viewBox="0 0 24 24">
|
||||
<path d="M6.708 20.917c0-.169.059-.319.176-.449l8.32-8.301-8.32-8.301a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176l8.75 8.75c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-8.75 8.75a.91.91 0 0 1-.215.127c-.078.032-.156.049-.234.049s-.156-.017-.234-.049a.91.91 0 0 1-.215-.127.652.652 0 0 1-.176-.449z" />
|
||||
</svg>
|
||||
</i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
Loader.require({
|
||||
type: "script",
|
||||
name: "home_builder"
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
@@ -0,0 +1,63 @@
|
||||
<div class="product-collection__button-add-to-cart @guest js-popup-button @endguest"
|
||||
@guest
|
||||
data-js-popup-button="account"
|
||||
@endguest
|
||||
>
|
||||
<button class="btn btn--status @auth btn--animated js-product-button-add-to-cart @endauth p-5"
|
||||
@auth
|
||||
onclick="addToCart({{ $product_id }})"
|
||||
@endauth
|
||||
>
|
||||
<span class="d-flex flex-center">
|
||||
<i class="btn__icon mr-5 mb-4">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-109 fill-white" viewBox="0 0 24 24">
|
||||
<path d="M19.884 21.897a.601.601 0 0 1-.439.186h-15a.6.6 0 0 1-.439-.186.601.601 0 0 1-.186-.439v-15a.6.6 0 0 1 .186-.439.601.601 0 0 1 .439-.186h3.75c0-1.028.368-1.911 1.104-2.646.735-.735 1.618-1.104 2.646-1.104s1.911.368 2.646 1.104c.735.736 1.104 1.618 1.104 2.646h3.75a.6.6 0 0 1 .439.186.601.601 0 0 1 .186.439v15a.604.604 0 0 1-.186.439zM18.819 7.083h-3.125v2.5a.598.598 0 0 1-.186.439c-.124.124-.271.186-.439.186s-.315-.062-.439-.186a.6.6 0 0 1-.186-.439v-2.5h-5v2.5a.598.598 0 0 1-.186.439c-.124.124-.271.186-.439.186s-.315-.062-.439-.186a.6.6 0 0 1-.186-.439v-2.5H5.069v13.75h13.75V7.083zm-8.642-3.018a2.409 2.409 0 0 0-.733 1.768h5c0-.69-.244-1.279-.732-1.768s-1.077-.732-1.768-.732-1.279.244-1.767.732z" />
|
||||
</svg>
|
||||
</i>
|
||||
<span class="btn__text text-white">{{ __('ADD TO CART') }}</span>
|
||||
</span>
|
||||
<span class="d-flex flex-center" data-button-content="added">
|
||||
<i class="mr-5 mb-4">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-110 fill-white" viewBox="0 0 24 24">
|
||||
<path fill="#ffffff" d="M19.855 5.998a.601.601 0 0 0-.439-.186h-3.75c0-1.028-.368-1.911-1.104-2.646-.735-.735-1.618-1.104-2.646-1.104s-1.911.369-2.646 1.104c-.736.736-1.104 1.618-1.104 2.647h-3.75a.6.6 0 0 0-.439.186.598.598 0 0 0-.186.439v15a.6.6 0 0 0 .186.439c.124.123.27.186.439.186h15a.6.6 0 0 0 .439-.186.601.601 0 0 0 .186-.439v-15a.602.602 0 0 0-.186-.44zm-9.707-1.953c.488-.488 1.077-.732 1.768-.732s1.279.244 1.768.732.732 1.078.732 1.768h-5c0-.69.244-1.28.732-1.768zm6.926 7.194l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .896.896 0 0 1-.215-.127l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449z" />
|
||||
</svg>
|
||||
</i>
|
||||
|
||||
{{ __('ADDED') }}
|
||||
</span>
|
||||
<span class="d-flex flex-center" data-button-content="sold-out">SOLD OUT</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
|
||||
{{-- <div class="product-collection__button-add-to-cart mb-10 sm:mr-1 @guest js-popup-button @endguest"
|
||||
@guest
|
||||
data-js-popup-button="account"
|
||||
@endguest
|
||||
>
|
||||
<button class="btn btn--status @auth btn--animated js-product-button-add-to-cart @endauth p-5"
|
||||
@auth
|
||||
onclick="addToCart({{ $product_id }})"
|
||||
@endauth
|
||||
>
|
||||
<span class="d-flex flex-center">
|
||||
<i class="btn__icon mr-5 mb-4">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-109" viewBox="0 0 24 24">
|
||||
<path d="M19.884 21.897a.601.601 0 0 1-.439.186h-15a.6.6 0 0 1-.439-.186.601.601 0 0 1-.186-.439v-15a.6.6 0 0 1 .186-.439.601.601 0 0 1 .439-.186h3.75c0-1.028.368-1.911 1.104-2.646.735-.735 1.618-1.104 2.646-1.104s1.911.368 2.646 1.104c.735.736 1.104 1.618 1.104 2.646h3.75a.6.6 0 0 1 .439.186.601.601 0 0 1 .186.439v15a.604.604 0 0 1-.186.439zM18.819 7.083h-3.125v2.5a.598.598 0 0 1-.186.439c-.124.124-.271.186-.439.186s-.315-.062-.439-.186a.6.6 0 0 1-.186-.439v-2.5h-5v2.5a.598.598 0 0 1-.186.439c-.124.124-.271.186-.439.186s-.315-.062-.439-.186a.6.6 0 0 1-.186-.439v-2.5H5.069v13.75h13.75V7.083zm-8.642-3.018a2.409 2.409 0 0 0-.733 1.768h5c0-.69-.244-1.279-.732-1.768s-1.077-.732-1.768-.732-1.279.244-1.767.732z" />
|
||||
</svg>
|
||||
</i>
|
||||
<span class="btn__text">{{ __('ADD TO CART') }}</span>
|
||||
</span>
|
||||
<span class="d-flex flex-center" data-button-content="added">
|
||||
<i class="mr-5 mb-4">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-110" viewBox="0 0 24 24">
|
||||
<path d="M19.855 5.998a.601.601 0 0 0-.439-.186h-3.75c0-1.028-.368-1.911-1.104-2.646-.735-.735-1.618-1.104-2.646-1.104s-1.911.369-2.646 1.104c-.736.736-1.104 1.618-1.104 2.647h-3.75a.6.6 0 0 0-.439.186.598.598 0 0 0-.186.439v15a.6.6 0 0 0 .186.439c.124.123.27.186.439.186h15a.6.6 0 0 0 .439-.186.601.601 0 0 0 .186-.439v-15a.602.602 0 0 0-.186-.44zm-9.707-1.953c.488-.488 1.077-.732 1.768-.732s1.279.244 1.768.732.732 1.078.732 1.768h-5c0-.69.244-1.28.732-1.768zm6.926 7.194l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .896.896 0 0 1-.215-.127l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449z" />
|
||||
</svg>
|
||||
</i>
|
||||
|
||||
{{ __('ADDED') }}
|
||||
</span>
|
||||
<span class="d-flex flex-center" data-button-content="sold-out">SOLD OUT</span>
|
||||
</button>
|
||||
</div>
|
||||
--}}
|
||||
@@ -0,0 +1,37 @@
|
||||
<div class="product-collection__buttons-section d-flex px-lg-10">
|
||||
<div class="product-collection__button-add-to-wishlist mb-10">
|
||||
{{-- js-store-lists-add-wishlist --}}
|
||||
<a href="#" class="btn btn--text btn--status px-lg-6 @guest js-popup-button @endguest"
|
||||
@guest
|
||||
data-js-popup-button="account"
|
||||
@else
|
||||
onclick="toggleProductLike(event, this, {{ $product_id }})"
|
||||
@endguest
|
||||
{{-- data-js-tooltip data-tippy-content="{{ __('Wishlist') }}" data-tippy-placement="top" data-tippy-distance="-3" --}}
|
||||
>
|
||||
|
||||
@php
|
||||
$liked = $user_likes->contains(fn ($value, $index) => $value->id === $product_id);
|
||||
@endphp
|
||||
|
||||
<i id="{{ $product->id }}-favourite-icon-like" class="mb-1 ml-1 {{ $liked ? '' : 'd-none' }}">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-181" viewBox="0 0 24 24">
|
||||
<path d="M21.861 6.568a5.661 5.661 0 0 0-1.25-1.865c-.56-.56-1.191-.979-1.895-1.26a5.77 5.77 0 0 0-4.326 0c-.71.28-1.345.7-1.904 1.26-.026.039-.056.075-.088.107l-.107.107-.107-.107a.706.706 0 0 1-.088-.107c-.56-.56-1.194-.979-1.904-1.26s-1.433-.42-2.168-.42-1.455.14-2.158.42-1.335.7-1.895 1.26c-.547.547-.964 1.169-1.25 1.865s-.43 1.429-.43 2.197.144 1.501.43 2.197.703 1.318 1.25 1.865l7.871 7.871c.003.003.007.004.011.006l.439.436.439-.437c.003-.002.007-.003.01-.006l7.871-7.871c.547-.547.964-1.169 1.25-1.865s.43-1.429.43-2.197-.145-1.499-.431-2.196z" />
|
||||
</svg>
|
||||
</i>
|
||||
|
||||
<i id="{{ $product->id }}-favourite-icon-dislike" class="mb-1 ml-1 {{ $liked ? 'd-none' : '' }}">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-180" viewBox="0 0 24 24">
|
||||
<path d="M21.486 6.599a5.661 5.661 0 0 0-1.25-1.865c-.56-.56-1.191-.979-1.895-1.26a5.77 5.77 0 0 0-4.326 0c-.71.28-1.345.7-1.904 1.26-.026.039-.056.075-.088.107l-.107.107-.107-.107a.706.706 0 0 1-.088-.107c-.56-.56-1.194-.979-1.904-1.26s-1.433-.42-2.168-.42-1.455.14-2.158.42-1.335.7-1.895 1.26c-.547.546-.964 1.168-1.25 1.865s-.43 1.429-.43 2.197.144 1.501.43 2.197.703 1.318 1.25 1.865l7.871 7.871c.003.003.007.004.011.006l.439.436.439-.437c.003-.002.007-.003.01-.006l7.871-7.871c.547-.547.964-1.169 1.25-1.865s.43-1.429.43-2.197-.145-1.5-.431-2.196zm-1.162 3.916a4.436 4.436 0 0 1-.967 1.445l-7.441 7.441-7.441-7.441c-.417-.417-.739-.898-.967-1.445s-.342-1.12-.342-1.719.114-1.172.342-1.719.55-1.035.967-1.465c.442-.43.94-.755 1.494-.977s1.116-.332 1.689-.332a4.496 4.496 0 0 1 3.467 1.641c.098.117.186.241.264.371.117.169.293.254.527.254s.41-.085.527-.254c.078-.13.166-.254.264-.371s.198-.228.303-.332a4.5 4.5 0 0 1 3.164-1.309c.573 0 1.136.11 1.689.332s1.052.547 1.494.977c.417.43.739.918.967 1.465s.342 1.12.342 1.719-.114 1.172-.342 1.719z" />
|
||||
</svg>
|
||||
</i>
|
||||
|
||||
</a>
|
||||
</div>
|
||||
|
||||
{{-- Compare --}}
|
||||
{{-- @include('web.themes.shella.components.products.buttons.compare-button') --}}
|
||||
|
||||
{{-- Mobile quick view --}}
|
||||
{{-- @include('web.themes.shella.components.products.buttons.mobile-quick-view-button') --}}
|
||||
</div>
|
||||
@@ -0,0 +1,9 @@
|
||||
<div><label class="d-none">Color:</label>
|
||||
<div class="product-options__section d-flex flex-wrap px-2" data-style="color" data-property="color">
|
||||
{{-- @foreach($product->colors() as $product_color) --}}
|
||||
{{-- @endforeach --}}
|
||||
{{-- <div class="product-options__value product-options__value--circle standard-color-{{white}} rounded-circle text-hide cursor-pointer {{active}} lazyload" data-js-option-value data-value="white" data-bg="none" data-scale="2" data-js-tooltip data-tippy-content="{{White}}" data-tippy-placement="top" data-tippy-distance="6">
|
||||
{{White}}
|
||||
</div> --}}
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,14 @@
|
||||
<div class="product-collection__button-add-to-compare mb-10">
|
||||
<a href="account" class="btn btn--text btn--status px-lg-6 js-store-lists-add-compare" data-js-tooltip data-tippy-content="Compare" data-tippy-placement="top" data-tippy-distance="-3">
|
||||
<i class="mb-1 ml-1">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-039" viewBox="0 0 24 24">
|
||||
<path d="M23.408 19.784c-.01.007-.024.012-.035.02l-4.275-12.11.005-.014-.011-.004-.114-.323v-.061h-6.394v-4.75a.6.6 0 0 0-.186-.439c-.124-.124-.271-.186-.439-.186s-.315.062-.439.186a.601.601 0 0 0-.186.439v4.75H4.939v.062l-.114.322-.011.004.005.014L.544 19.803c-.01-.007-.025-.012-.035-.02l-.388 1.081c1.345.846 3.203 1.363 5.286 1.363 2.08 0 3.935-.515 5.279-1.359l-.019-.054.02-.007L6.326 8.458H17.59l-4.36 12.349.02.007-.019.054c1.344.844 3.199 1.359 5.279 1.359 2.083 0 3.941-.517 5.286-1.363l-.388-1.08zm-14.122.563c-1.085.486-2.434.781-3.88.781-1.423 0-2.749-.288-3.825-.761l.326-.924h7.06l.319.904zm-.71-2.013H2.299l3.138-8.888 3.139 8.888zm9.903-8.888l3.138 8.888h-6.276l3.138-8.888zm.031 11.682c-1.446 0-2.796-.295-3.88-.781l.319-.904h7.06l.326.924c-1.076.473-2.402.761-3.825.761z" />
|
||||
</svg>
|
||||
</i>
|
||||
<i class="mb-1 ml-1" data-button-content="added">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-235" viewBox="0 0 24 24">
|
||||
<path d="M23.4 19.8l-2.3-6.6c1.7-1.3 2.8-3.4 2.8-5.8 0-4.1-3.3-7.4-7.4-7.4-4 0-7.3 3.2-7.4 7.2H4.9v.1l-.1.4L.5 19.8l-.4 1.1c1.3.8 3.2 1.4 5.3 1.4 2.1 0 3.9-.5 5.3-1.4v-.1L6.3 8.5h2.9c.4 3.2 3 5.8 6.2 6.3l-2.1 6.1v.1c1.3.8 3.2 1.4 5.3 1.4 2.1 0 3.9-.5 5.3-1.4l-.5-1.2zm-14.1.5c-1.1.5-2.4.8-3.9.8-1.4 0-2.7-.3-3.8-.8l.3-.9H9l.3.9zm-.7-2H2.3l3.1-8.9 3.2 8.9zm6.6-6.9c-.1.1-.1.1-.2.1h-.2-.2c-.1 0-.1-.1-.2-.1l-2.5-2.5c-.1-.1-.2-.3-.2-.4s.1-.3.2-.4c.1-.1.3-.2.4-.2s.3.1.4.2l2.1 2.1 5.8-5.8c.1-.3.3-.4.4-.4s.3.1.4.2c.1.1.2.3.2.4s0 .4-.1.5l-6.3 6.3zm1.4 3.4c1.3 0 2.4-.3 3.5-.9l1.6 4.4h-6.3l1.2-3.5zm1.9 6.3c-1.4 0-2.8-.3-3.9-.8l.3-.9H22l.3.9c-1 .5-2.4.8-3.8.8z" />
|
||||
</svg>
|
||||
</i>
|
||||
</a>
|
||||
</div>
|
||||
@@ -0,0 +1,9 @@
|
||||
<div class="product-collection__button-quick-view-mobile d-lg-none mb-10">
|
||||
<a href="products/belted-chino-trousers?variant=13793281441844" class="btn btn--text pt-2 px-lg-6 js-popup-button" data-js-popup-button="quick-view" data-js-tooltip data-tippy-content="Quick View" data-tippy-placement="top" data-tippy-distance="-2">
|
||||
<i>
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-154" viewBox="0 0 24 24">
|
||||
<path d="M8.528 17.238c-1.107-.592-2.074-1.25-2.9-1.973-.827-.723-1.491-1.393-1.992-2.012-.501-.618-.771-.96-.811-1.025a.571.571 0 0 1-.117-.352c0-.13.039-.247.117-.352.039-.064.306-.406.801-1.025.495-.618 1.159-1.289 1.992-2.012.833-.723 1.803-1.38 2.91-1.973a7.424 7.424 0 0 1 3.555-.889c1.263 0 2.448.297 3.555.889 1.106.593 2.073 1.25 2.9 1.973.827.723 1.491 1.394 1.992 2.012.501.619.771.961.811 1.025a.573.573 0 0 1 .117.352.656.656 0 0 1-.117.371c-.039.053-.31.391-.811 1.016-.501.625-1.169 1.296-2.002 2.012-.833.717-1.804 1.371-2.91 1.963a7.375 7.375 0 0 1-3.535.889 7.415 7.415 0 0 1-3.555-.889zm.869-9.746c-.853.41-1.631.889-2.334 1.436s-1.312 1.101-1.826 1.66c-.515.561-.889.99-1.123 1.289.234.3.608.729 1.123 1.289.514.561 1.123 1.113 1.826 1.66s1.484 1.025 2.344 1.436 1.751.615 2.676.615c.924 0 1.813-.205 2.666-.615.853-.41 1.634-.889 2.344-1.436.709-.547 1.318-1.1 1.826-1.66.508-.56.885-.989 1.133-1.289a41.634 41.634 0 0 0-1.133-1.289c-.508-.56-1.113-1.113-1.816-1.66s-1.484-1.025-2.344-1.436-1.751-.615-2.676-.615c-.937 0-1.833.205-2.686.615zm.04 7.031c-.736-.735-1.104-1.617-1.104-2.646 0-1.028.368-1.91 1.104-2.646.735-.735 1.618-1.104 2.646-1.104 1.028 0 1.911.368 2.646 1.104.735.736 1.104 1.618 1.104 2.646 0 1.029-.368 1.911-1.104 2.646-.736.736-1.618 1.104-2.646 1.104-1.029 0-1.911-.367-2.646-1.104zm.878-4.414a2.41 2.41 0 0 0-.732 1.768c0 .69.244 1.279.732 1.768s1.077.732 1.768.732c.69 0 1.279-.244 1.768-.732s.732-1.077.732-1.768c0-.689-.244-1.279-.732-1.768s-1.078-.732-1.768-.732-1.279.244-1.768.732z" />
|
||||
</svg>
|
||||
</i>
|
||||
</a>
|
||||
</div>
|
||||
@@ -0,0 +1,18 @@
|
||||
<div class="product-image__overlay-bottom-right product-collection__images-navigation position-relative d-none d-lg-block mt-10 ml-auto">
|
||||
<div class="product-images-navigation d-flex">
|
||||
<span class="d-flex flex-center mr-3 rounded-circle cursor-pointer" data-js-product-images-navigation="prev">
|
||||
<i class="mr-2">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-006" viewBox="0 0 24 24">
|
||||
<path d="M16.736 3.417a.652.652 0 0 1-.176.449l-8.32 8.301 8.32 8.301c.117.13.176.28.176.449s-.059.319-.176.449a.91.91 0 0 1-.215.127c-.078.032-.156.049-.234.049s-.156-.017-.234-.049a.93.93 0 0 1-.215-.127l-8.75-8.75a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449l8.75-8.75a.652.652 0 0 1 .449-.176c.169 0 .319.059.449.176.117.13.176.28.176.449z" />
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span class="d-flex flex-center rounded-circle cursor-pointer" data-js-product-images-navigation="next">
|
||||
<i class="ml-3">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-007" viewBox="0 0 24 24">
|
||||
<path d="M6.708 20.917c0-.169.059-.319.176-.449l8.32-8.301-8.32-8.301a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176l8.75 8.75c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-8.75 8.75a.91.91 0 0 1-.215.127c-.078.032-.156.049-.234.049s-.156-.017-.234-.049a.91.91 0 0 1-.215-.127.652.652 0 0 1-.176-.449z" />
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,9 @@
|
||||
<div class="product-image__overlay-top-right product-collection__button-quick-view position-lg-relative d-none d-lg-flex mb-lg-10 ml-lg-auto">
|
||||
<a href="products/belted-chino-trousers?variant=13793281441844" class="button-quick-view d-flex flex-center rounded-circle js-popup-button" data-js-popup-button="quick-view" data-js-tooltip data-tippy-content="Quick View" data-tippy-placement="left" data-tippy-distance="5">
|
||||
<i>
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-154" viewBox="0 0 24 24">
|
||||
<path d="M8.528 17.238c-1.107-.592-2.074-1.25-2.9-1.973-.827-.723-1.491-1.393-1.992-2.012-.501-.618-.771-.96-.811-1.025a.571.571 0 0 1-.117-.352c0-.13.039-.247.117-.352.039-.064.306-.406.801-1.025.495-.618 1.159-1.289 1.992-2.012.833-.723 1.803-1.38 2.91-1.973a7.424 7.424 0 0 1 3.555-.889c1.263 0 2.448.297 3.555.889 1.106.593 2.073 1.25 2.9 1.973.827.723 1.491 1.394 1.992 2.012.501.619.771.961.811 1.025a.573.573 0 0 1 .117.352.656.656 0 0 1-.117.371c-.039.053-.31.391-.811 1.016-.501.625-1.169 1.296-2.002 2.012-.833.717-1.804 1.371-2.91 1.963a7.375 7.375 0 0 1-3.535.889 7.415 7.415 0 0 1-3.555-.889zm.869-9.746c-.853.41-1.631.889-2.334 1.436s-1.312 1.101-1.826 1.66c-.515.561-.889.99-1.123 1.289.234.3.608.729 1.123 1.289.514.561 1.123 1.113 1.826 1.66s1.484 1.025 2.344 1.436 1.751.615 2.676.615c.924 0 1.813-.205 2.666-.615.853-.41 1.634-.889 2.344-1.436.709-.547 1.318-1.1 1.826-1.66.508-.56.885-.989 1.133-1.289a41.634 41.634 0 0 0-1.133-1.289c-.508-.56-1.113-1.113-1.816-1.66s-1.484-1.025-2.344-1.436-1.751-.615-2.676-.615c-.937 0-1.833.205-2.686.615zm.04 7.031c-.736-.735-1.104-1.617-1.104-2.646 0-1.028.368-1.91 1.104-2.646.735-.735 1.618-1.104 2.646-1.104 1.028 0 1.911.368 2.646 1.104.735.736 1.104 1.618 1.104 2.646 0 1.029-.368 1.911-1.104 2.646-.736.736-1.618 1.104-2.646 1.104-1.029 0-1.911-.367-2.646-1.104zm.878-4.414a2.41 2.41 0 0 0-.732 1.768c0 .69.244 1.279.732 1.768s1.077.732 1.768.732c.69 0 1.279-.244 1.768-.732s.732-1.077.732-1.768c0-.689-.244-1.279-.732-1.768s-1.078-.732-1.768-.732-1.279.244-1.768.732z" />
|
||||
</svg>
|
||||
</i>
|
||||
</a>
|
||||
</div>
|
||||
@@ -0,0 +1,17 @@
|
||||
<div><label class="d-none">Size:</label>
|
||||
<div class="product-options__section d-flex flex-wrap" data-style="large-text" data-property="size">
|
||||
<div class="product-options__value product-options__value--large-text d-flex flex-center border cursor-pointer active lazyload" data-js-option-value data-value="30" data-bg="none" data-scale="2">30
|
||||
</div>
|
||||
|
||||
<div class="product-options__value product-options__value--large-text d-flex flex-center border cursor-pointer lazyload" data-js-option-value data-value="32" data-bg="none" data-scale="2">32
|
||||
</div>
|
||||
|
||||
|
||||
<div class="product-options__value product-options__value--large-text d-flex flex-center border cursor-pointer lazyload" data-js-option-value data-value="34" data-bg="none" data-scale="2">34
|
||||
</div>
|
||||
|
||||
|
||||
<div class="product-options__value product-options__value--large-text d-flex flex-center border cursor-pointer lazyload" data-js-option-value data-value="36" data-bg="none" data-scale="2">36
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,140 @@
|
||||
<div class="collection-control mb-25 mb-lg-30">
|
||||
<div class="row">
|
||||
<div class="col-8 col-lg-4 d-flex d-lg-flex align-items-center">
|
||||
<div class="d-flex d-lg-flex mr-30">
|
||||
{{-- <div class="collection-control__button-sidebar d-flex align-items-center cursor-pointer js-popup-button" data-js-popup-button="sidebar">
|
||||
<i class="mr-5">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-084" viewBox="0 0 24 24">
|
||||
<path d="M19.292 1.871c.169 0 .315.063.439.186a.601.601 0 0 1 .186.439v2.5a.657.657 0 0 1-.039.225.499.499 0 0 1-.117.186l-5.469 6.074v6.641a.582.582 0 0 1-.078.293.823.823 0 0 1-.195.234l-3.75 2.5c-.052.026-.107.049-.166.068a.603.603 0 0 1-.479-.05c-.104-.052-.186-.127-.244-.225s-.088-.205-.088-.322v-9.14L3.823 5.406a.491.491 0 0 1-.117-.186.648.648 0 0 1-.039-.224v-2.5a.6.6 0 0 1 .186-.439.604.604 0 0 1 .439-.186h15zm-.625 2.89v-1.64H4.917v1.641l5.469 6.074a.507.507 0 0 1 .117.186.653.653 0 0 1 .039.225v8.203l2.5-1.66v-6.543c0-.078.013-.152.039-.225a.515.515 0 0 1 .117-.186l5.469-6.075z"/>
|
||||
</svg>
|
||||
</i>
|
||||
<span class="text-uppercase">{{ __('Show filter') }}</span>
|
||||
</div> --}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-3 d-none d-lg-flex justify-content-lg-center align-items-lg-center" data-js-collection-replace="info">
|
||||
{{-- <div class="collection-control__information">Showing 1–12 of 42 results</div> --}}
|
||||
</div>
|
||||
|
||||
<div class="col-4 col-lg-5 d-flex justify-content-lg-end align-items-center">
|
||||
{{-- <div class="collection-control__sort-by d-none d-lg-block mr-20" data-js-collection-sort-by>
|
||||
<div class="select position-relative js-dropdown js-select">
|
||||
<div class="d-flex align-items-center" data-js-dropdown-button>
|
||||
<label for="SortBy" class="mb-0 mr-5">{{ __('Sort') }}:</label>
|
||||
<select name="sort_by" class="p-0 pr-25 mb-0 border-0 cursor-pointer" id="SortBy" onchange="addSorting(event.target.value)">
|
||||
<option value="price_amount-ascending">{{ __('Price Ascending') }}</option>
|
||||
<option value="price_amount-descending">{{ __('Price Descending') }}</option>
|
||||
<option value="created_at-descending" selected>{{ __('Date Descending') }}</option>
|
||||
<option value="created_at-ascending">{{ __('Date Ascending') }}</option>
|
||||
<option value="name-ascending">{{ __('Name Ascending') }}</option>
|
||||
<option value="name-descending">{{ __('Name Descending') }}</option>
|
||||
</select>
|
||||
<i class="position-absolute right-0">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-229" viewBox="0 0 24 24">
|
||||
<path d="M11.783 14.088l-3.75-3.75a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176l3.301 3.32 3.301-3.32a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-3.75 3.75a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .841.841 0 0 1-.215-.127z"/>
|
||||
</svg>
|
||||
</i>
|
||||
</div>
|
||||
<div class="select__dropdown dropdown d-none position-lg-absolute top-lg-100 left-lg-0" data-js-dropdown data-js-select-dropdown>
|
||||
<div class="px-15 pb-30 py-lg-15">
|
||||
<span data-value="price_amount-ascending">{{ __('Price Ascending') }}</span>
|
||||
<span data-value="price_amount-descending">{{ __('Price Descending') }}</span>
|
||||
<span data-value="created_at-descending" selected>{{ __('Date Descending') }}</span>
|
||||
<span data-value="created_at-ascending">{{ __('Date Ascending') }}</span>
|
||||
<span data-value="name-ascending">{{ __('Name Ascending') }}</span>
|
||||
<span data-value="name-descending">{{ __('Name Descending') }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> --}}
|
||||
|
||||
{{-- <div class="collection-control__view-length d-none d-lg-block" data-js-collection-view-length>
|
||||
<div class="select position-relative js-dropdown js-select">
|
||||
<div class="d-flex align-items-center" data-js-dropdown-button>
|
||||
<label for="ViewLength" class="mb-0 mr-5">Show:</label>
|
||||
<select name="view_length" class="p-0 pr-25 mb-0 border-0 cursor-pointer" id="ViewLength">
|
||||
<option value="6">6</option>
|
||||
<option value="12" selected>12</option>
|
||||
<option value="18">18</option>
|
||||
<option value="24">24</option>
|
||||
</select>
|
||||
<i class="position-absolute right-0">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-229" viewBox="0 0 24 24">
|
||||
<path d="M11.783 14.088l-3.75-3.75a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176l3.301 3.32 3.301-3.32a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-3.75 3.75a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .841.841 0 0 1-.215-.127z"/>
|
||||
</svg>
|
||||
</i>
|
||||
</div>
|
||||
<div class="select__dropdown dropdown d-none position-lg-absolute top-lg-100 left-lg-0" data-js-dropdown data-js-select-dropdown>
|
||||
<div class="px-15 pb-30 py-lg-15">
|
||||
<span data-value="6">6</span>
|
||||
<span data-value="12" class="selected">12</span>
|
||||
<span data-value="18">18</span>
|
||||
<span data-value="24">24</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> --}}
|
||||
|
||||
{{-- <div class="collection-control__view-grid ml-auto ml-lg-15"
|
||||
data-js-tooltip
|
||||
data-tippy-content="View of item"
|
||||
data-tippy-placement="top"
|
||||
data-tippy-distance="8">
|
||||
<div class="products-grid-buttons d-flex" data-js-products-grid-buttons data-value-xs="2" data-value-sm="2" data-value-md="3" data-value-lg="4" data-value-xl="4">
|
||||
<div class="mx-8 mx-lg-1 cursor-pointer d-md-none" data-value="1">
|
||||
<i>
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-304" viewBox="0 0 24 24">
|
||||
<path d="M21.2 2.6c-.1-.1-.3-.2-.4-.2H3.3c-.2 0-.3.1-.4.2-.2.1-.2.2-.2.4v17.6c0 .1.1.2.2.3.1.1.3.2.4.2h17.5c.2 0 .3-.1.4-.2.1-.1.1-.2.2-.3V3c0-.2 0-.3-.2-.4zm-1 4.2v13.1H3.9V3.6h16.3v3.2z"/>
|
||||
</svg>
|
||||
</i>
|
||||
</div>
|
||||
<div class="mx-8 mx-lg-1 cursor-pointer" data-value="2" data-active-xs data-active-sm>
|
||||
<i>
|
||||
<svg aria-hidden="true" focusable="false"
|
||||
role="presentation" class="icon icon-theme-185"
|
||||
viewBox="0 0 24 24">
|
||||
<path d="M3.306 21.142a.598.598 0 0 1-.439-.186.601.601 0 0 1-.186-.439v-17.5a.6.6 0 0 1 .186-.439.604.604 0 0 1 .439-.186h17.5c.169 0 .315.063.439.186a.601.601 0 0 1 .186.439v17.5a.6.6 0 0 1-.186.439.601.601 0 0 1-.439.186h-17.5zm.625-17.5v7.5h7.5v-7.5h-7.5zm0 16.25h7.5v-7.5h-7.5v7.5zm16.25-16.25h-7.5v7.5h7.5v-7.5zm0 16.25v-7.5h-7.5v7.5h7.5z"/>
|
||||
</svg>
|
||||
</i>
|
||||
</div>
|
||||
<div class="mx-8 mx-lg-1 cursor-pointer d-none d-sm-block" data-value="3" data-active-md>
|
||||
<i>
|
||||
<svg aria-hidden="true" focusable="false"
|
||||
role="presentation" class="icon icon-theme-186"
|
||||
viewBox="0 0 24 24">
|
||||
<path d="M2.828 2.567a.608.608 0 0 1 .449-.175h16.875c.183 0 .332.059.449.176s.176.268.176.449v16.875c0 .183-.059.332-.176.449s-.267.176-.449.176H3.277c-.183 0-.332-.059-.449-.176s-.176-.267-.176-.449V3.017c0-.182.059-.332.176-.45zm1.074 1.075v4.375h4.375V3.642H3.902zm4.375 5.625H3.902v4.375h4.375V9.267zm-4.375 10h4.375v-4.375H3.902v4.375zm10-11.25V3.642H9.527v4.375h4.375zm-4.375 1.25v4.375h4.375V9.267H9.527zm0 5.625v4.375h4.375v-4.375H9.527zm10-11.25h-4.375v4.375h4.375V3.642zm0 5.625h-4.375v4.375h4.375V9.267zm0 10v-4.375h-4.375v4.375h4.375z"/>
|
||||
</svg>
|
||||
</i>
|
||||
</div>
|
||||
<div class="mx-8 mx-lg-1 cursor-pointer d-none d-md-block" data-value="4" data-active-lg data-active-xl>
|
||||
<i>
|
||||
<svg aria-hidden="true" focusable="false"
|
||||
role="presentation" class="icon icon-theme-305"
|
||||
viewBox="0 0 24 24">
|
||||
<path d="M21.245 2.577a.605.605 0 0 0-.439-.186h-17.5a.602.602 0 0 0-.439.186.598.598 0 0 0-.186.44v17.629h.025c.024.114.07.22.16.31a.6.6 0 0 0 .439.186h17.5a.6.6 0 0 0 .439-.186.595.595 0 0 0 .16-.31h.025V3.017a.592.592 0 0 0-.184-.44zm-1.064 12.94h-3.125v-3.125h3.125v3.125zm0 1.25v3.125h-3.125v-3.125h3.125zm-11.875-1.25v-3.125h3.125v3.125H8.306zm3.125 1.25v3.125H8.306v-3.125h3.125zm-7.5-8.75h3.125v3.125H3.931V8.017zm0-1.25V3.642h3.125v3.125H3.931zm11.875 1.25v3.125h-3.125V8.017h3.125zm-3.125-1.25V3.642h3.125v3.125h-3.125zm-1.25 4.375H8.306V8.017h3.125v3.125zm-7.5 1.25h3.125v3.125H3.931v-3.125zm8.75 0h3.125v3.125h-3.125v-3.125zm7.5-1.25h-3.125V8.017h3.125v3.125zm0-4.375h-3.125V3.642h3.125v3.125zm-8.75 0H8.306V3.642h3.125v3.125zm-7.5 10h3.125v3.125H3.931v-3.125zm8.75 0h3.125v3.125h-3.125v-3.125z"/>
|
||||
</svg>
|
||||
</i>
|
||||
</div>
|
||||
<div class="mx-8 mx-lg-1 cursor-pointer d-none d-lg-block" data-value="list">
|
||||
<i>
|
||||
<svg aria-hidden="true" focusable="false"
|
||||
role="presentation" class="icon icon-theme-187"
|
||||
viewBox="0 0 24 24">
|
||||
<path d="M20.574 2.567a.61.61 0 0 0-.449-.176H3.25c-.183 0-.332.059-.449.176s-.176.268-.176.45v16.875c0 .183.059.332.176.449s.267.176.449.176h16.875c.182 0 .332-.059.449-.176s.176-.267.176-.449V3.017a.613.613 0 0 0-.176-.45zM8.25 19.267H3.875v-4.375H8.25v4.375zm0-5.625H3.875V9.267H8.25v4.375zm0-5.625H3.875V3.642H8.25v4.375zm11.25 11.25h-10v-4.375h10v4.375zm0-5.625h-10V9.267h10v4.375zm0-5.625h-10V3.642h10v4.375z"/>
|
||||
</svg>
|
||||
</i>
|
||||
</div>
|
||||
</div>
|
||||
</div> --}}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
Loader.require({
|
||||
type: "script",
|
||||
name: "products_view"
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,36 @@
|
||||
<div class="layer-navigation" data-js-collection-nav-section="filters" data-js-accordion="all">
|
||||
<div class="layer-navigation__head py-10 cursor-pointer open" data-js-accordion-button>
|
||||
<h5 class="d-flex align-items-center mb-0 text-uppercase">
|
||||
{{ __('Brands') }}
|
||||
<i class="layer-navigation__arrow">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-229" viewBox="0 0 24 24">
|
||||
<path d="M11.783 14.088l-3.75-3.75a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176l3.301 3.32 3.301-3.32a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-3.75 3.75a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .841.841 0 0 1-.215-.127z" />
|
||||
</svg>
|
||||
</i>
|
||||
</h5>
|
||||
</div>
|
||||
<div class="layer-navigation__accordion" data-js-accordion-content>
|
||||
<div class="pt-2 pb-10">
|
||||
<div>
|
||||
<div class="collection-filters row">
|
||||
<div class="col-12 mb-10">
|
||||
@foreach($brandRepository->filterBy($resource) as $brandFilter)
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="brands" value="{{ $brandFilter->id }}">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none">
|
||||
<i class="d-none">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z" />
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span>{{ $brandFilter->name }}</span>
|
||||
</label>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="border-bottom mb-10"></div>
|
||||
</div>
|
||||
@@ -0,0 +1,36 @@
|
||||
<div class="layer-navigation" data-js-collection-nav-section="filters" data-js-accordion="all">
|
||||
<div class="layer-navigation__head py-10 cursor-pointer open" data-js-accordion-button>
|
||||
<h5 class="d-flex align-items-center mb-0 text-uppercase">
|
||||
{{ __('Categories') }}
|
||||
<i class="layer-navigation__arrow">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-229" viewBox="0 0 24 24">
|
||||
<path d="M11.783 14.088l-3.75-3.75a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176l3.301 3.32 3.301-3.32a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-3.75 3.75a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .841.841 0 0 1-.215-.127z" />
|
||||
</svg>
|
||||
</i>
|
||||
</h5>
|
||||
</div>
|
||||
<div class="layer-navigation__accordion" data-js-accordion-content>
|
||||
<div class="pt-2 pb-10">
|
||||
<div>
|
||||
<div class="collection-filters row">
|
||||
<div class="col-12 mb-10">
|
||||
@foreach($categoryRepository->filterBy($resource) as $categoryFilter)
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="categories" value="{{ $categoryFilter->id }}">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none">
|
||||
<i class="d-none">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z" />
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span>{{ $categoryFilter->name }}</span>
|
||||
</label>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="border-bottom mb-10"></div>
|
||||
</div>
|
||||
@@ -0,0 +1,73 @@
|
||||
<div class="layer-navigation" data-js-collection-nav-section="filters" data-js-accordion="all">
|
||||
<div class="layer-navigation__head py-10 cursor-pointer open" data-js-accordion-button>
|
||||
<h5 class="d-flex align-items-center mb-0">COLOR<i class="layer-navigation__arrow">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-229" viewBox="0 0 24 24">
|
||||
<path d="M11.783 14.088l-3.75-3.75a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176l3.301 3.32 3.301-3.32a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-3.75 3.75a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .841.841 0 0 1-.215-.127z" />
|
||||
</svg>
|
||||
</i></h5>
|
||||
</div>
|
||||
<div class="layer-navigation__accordion" data-js-accordion-content>
|
||||
<div class="pt-2 pb-10">
|
||||
<div data-js-collection-replace="filter-1" data-js-collection-replace-only-full>
|
||||
<div class="collection-filters d-flex flex-wrap" data-js-collection-filters data-property="color"><label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 mr-15 mr-lg-10 input-checkbox--unbordered cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_color" value="red">
|
||||
<span class="position-relative d-block rounded-circle standard-color-red lazyload" data-value="red" data-bg="none">
|
||||
<i class="d-none standard-color-arrow"><svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z" /></svg></i>
|
||||
</span></label><label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 mr-15 mr-lg-10 input-checkbox--unbordered cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_color" value="orange">
|
||||
<span class="position-relative d-block rounded-circle standard-color-orange lazyload" data-value="orange" data-bg="none">
|
||||
<i class="d-none standard-color-arrow"><svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z" /></svg></i>
|
||||
</span></label><label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 mr-15 mr-lg-10 input-checkbox--unbordered cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_color" value="yellow">
|
||||
<span class="position-relative d-block rounded-circle standard-color-yellow lazyload" data-value="yellow" data-bg="none">
|
||||
<i class="d-none standard-color-arrow"><svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z" /></svg></i>
|
||||
</span></label><label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 mr-15 mr-lg-10 input-checkbox--unbordered cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_color" value="green">
|
||||
<span class="position-relative d-block rounded-circle standard-color-green lazyload" data-value="green" data-bg="none">
|
||||
<i class="d-none standard-color-arrow"><svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z" /></svg></i>
|
||||
</span></label><label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 mr-15 mr-lg-10 input-checkbox--unbordered cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_color" value="black">
|
||||
<span class="position-relative d-block rounded-circle standard-color-black lazyload" data-value="black" data-bg="none">
|
||||
<i class="d-none standard-color-arrow"><svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z" /></svg></i>
|
||||
</span></label><label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 mr-15 mr-lg-10 input-checkbox--unbordered cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_color" value="silver">
|
||||
<span class="position-relative d-block rounded-circle standard-color-silver lazyload" data-value="silver" data-bg="none">
|
||||
<i class="d-none standard-color-arrow"><svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z" /></svg></i>
|
||||
</span></label><label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 mr-15 mr-lg-10 input-checkbox--unbordered cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_color" value="blue">
|
||||
<span class="position-relative d-block rounded-circle standard-color-blue lazyload" data-value="blue" data-bg="none">
|
||||
<i class="d-none standard-color-arrow"><svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z" /></svg></i>
|
||||
</span></label><label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 mr-15 mr-lg-10 input-checkbox--unbordered cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_color" value="grey">
|
||||
<span class="position-relative d-block rounded-circle standard-color-grey lazyload" data-value="grey" data-bg="none">
|
||||
<i class="d-none standard-color-arrow"><svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z" /></svg></i>
|
||||
</span></label><label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 mr-15 mr-lg-10 input-checkbox--unbordered cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_color" value="white">
|
||||
<span class="position-relative d-block rounded-circle standard-color-white lazyload" data-value="white" data-bg="none">
|
||||
<i class="d-none standard-color-arrow"><svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z" /></svg></i>
|
||||
</span></label><label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 mr-15 mr-lg-10 input-checkbox--unbordered cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_color" value="violet">
|
||||
<span class="position-relative d-block rounded-circle standard-color-violet lazyload" data-value="violet" data-bg="none">
|
||||
<i class="d-none standard-color-arrow"><svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z" /></svg></i>
|
||||
</span></label><label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 mr-15 mr-lg-10 input-checkbox--unbordered cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_color" value="pink">
|
||||
<span class="position-relative d-block rounded-circle standard-color-pink lazyload" data-value="pink" data-bg="none">
|
||||
<i class="d-none standard-color-arrow"><svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z" /></svg></i>
|
||||
</span></label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="border-bottom"></div>
|
||||
</div>
|
||||
@@ -0,0 +1,36 @@
|
||||
<div class="layer-navigation" data-js-collection-nav-section="filters" data-js-accordion="all">
|
||||
<div class="layer-navigation__head py-10 cursor-pointer open" data-js-accordion-button>
|
||||
<h5 class="d-flex align-items-center mb-0 text-uppercase">
|
||||
{{ $name }}
|
||||
<i class="layer-navigation__arrow">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-229" viewBox="0 0 24 24">
|
||||
<path d="M11.783 14.088l-3.75-3.75a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176l3.301 3.32 3.301-3.32a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-3.75 3.75a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .841.841 0 0 1-.215-.127z" />
|
||||
</svg>
|
||||
</i>
|
||||
</h5>
|
||||
</div>
|
||||
<div class="layer-navigation__accordion" data-js-accordion-content>
|
||||
<div class="pt-2 pb-10">
|
||||
<div>
|
||||
<div class="collection-filters row">
|
||||
<div class="col-12 mb-10">
|
||||
@foreach($filters as $filter)
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="brands" value="{{ $filter['value'] }}">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none">
|
||||
<i class="d-none">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z" />
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span>{{ $filter['key'] }}</span>
|
||||
</label>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="border-bottom mb-10"></div>
|
||||
</div>
|
||||
@@ -0,0 +1,128 @@
|
||||
@push('footer-javascript')
|
||||
<script src="/web/themes/shella/js/filters.js"></script>
|
||||
@endpush
|
||||
|
||||
@php
|
||||
$brandRepository = new App\Repositories\Ecommerce\Product\Brand\BrandRepository(
|
||||
new App\Models\Ecommerce\Product\Brand\Brand,
|
||||
);
|
||||
$categoryRepository = new App\Repositories\Ecommerce\Product\Category\CategoryRepository(request());
|
||||
@endphp
|
||||
|
||||
<div class="collections__sidebar collections__sidebar--width-md d-none mx-20 d-lg-block float-left" data-sticky-sidebar-parent>
|
||||
<div class="js-sticky-sidebar">
|
||||
|
||||
<form action="#" method="POST" onsubmit="event.preventDefault();filterProduct(event)">
|
||||
|
||||
<div data-js-position-desktop="sidebar" data-sticky-sidebar-inner>
|
||||
<div id="theme-section-collection-sidebar" class="theme-section">
|
||||
<div data-section-id="collection-sidebar" data-section-type="collection-sidebar">
|
||||
<aside class="collection-sidebar js-position js-collection-sidebar" data-js-collection-sidebar data-js-position-name="sidebar">
|
||||
<nav class="collection-sidebar__navigation">
|
||||
|
||||
@include('web.themes.shella.components.products.collection.filters.categories-filter')
|
||||
|
||||
@include('web.themes.shella.components.products.collection.filters.brands-filter')
|
||||
|
||||
@include('web.themes.shella.components.products.collection.filters.price-filter')
|
||||
|
||||
{{-- @include('web.themes.shella.components.products.collection.filters.size-filter') --}}
|
||||
|
||||
<input class="btn text-white" type="submit" value="{{ __('Filter') }}">
|
||||
|
||||
{{-- <div class="layer-navigation" data-js-collection-nav-section="custom_html" data-js-accordion="all">
|
||||
<div class="layer-navigation__head py-10 cursor-pointer" data-js-accordion-button>
|
||||
<h5 class="d-flex align-items-center mb-0">CUSTOM CMS BLOCK</h5>
|
||||
</div>
|
||||
<div class="layer-navigation__accordion" data-js-accordion-content>
|
||||
<div class="pt-2 pb-10">
|
||||
<div class="rte">
|
||||
<div class="fs">
|
||||
<div class="d-flex align-items-start mb-15">
|
||||
<i class="mr-10">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-116" viewBox="0 0 24 24">
|
||||
<path d="M21.93 6.088l.029.029c.007.007.01.017.01.029l.039.127a.47.47 0 0 1 .02.127v15a.6.6 0 0 1-.186.439.601.601 0 0 1-.439.186H2.652a.6.6 0 0 1-.439-.186.601.601 0 0 1-.186-.439v-15a.47.47 0 0 1 .02-.127l.039-.127c0-.013.003-.022.01-.029a.387.387 0 0 0 .029-.029.478.478 0 0 1 .049-.078.844.844 0 0 1 .049-.059l.02-.02 4.375-3.75a.776.776 0 0 1 .195-.117.575.575 0 0 1 .215-.039h10c.078 0 .149.013.215.039.065.026.13.065.195.117l4.375 3.75v.02a.19.19 0 0 1 .068.059.557.557 0 0 1 .049.078zm-1.153 14.687V7.025h-5.625v5.625a.598.598 0 0 1-.186.439.601.601 0 0 1-.439.186h-5a.6.6 0 0 1-.439-.186.6.6 0 0 1-.186-.439V7.025H3.277v13.75h17.5zM7.262 3.275l-2.93 2.5h4.805l1.25-2.5H7.262zm2.89 8.75h3.75v-5h-3.75v5zm1.641-8.75l-1.25 2.5h2.969l-1.25-2.5h-.469zm7.93 2.5l-2.93-2.5h-3.125l1.25 2.5h4.805z" />
|
||||
</svg>
|
||||
</i>
|
||||
<p class="mb-0">Free shipping all orders of $49 or
|
||||
more of eligible items across any product
|
||||
category qualify.</p>
|
||||
</div>
|
||||
<div class="d-flex align-items-start mb-15">
|
||||
<i class="mr-10">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-125" viewBox="0 0 24 24">
|
||||
<path d="M21.508 5.035c.364.365.547.808.547 1.328v11.25c0 .521-.183.964-.547 1.328a1.808 1.808 0 0 1-1.328.547H3.93c-.521 0-.964-.182-1.328-.547a1.805 1.805 0 0 1-.547-1.328V6.363c0-.521.182-.963.547-1.328a1.81 1.81 0 0 1 1.328-.547h16.25c.521 0 .964.183 1.328.547zm-18.017.889a.6.6 0 0 0-.186.439v1.25h17.5v-1.25a.6.6 0 0 0-.186-.439.598.598 0 0 0-.439-.186H3.93a.598.598 0 0 0-.439.186zm-.186 4.814h17.5V8.863h-17.5v1.875zm17.315 7.315a.6.6 0 0 0 .186-.439v-5.625h-17.5v5.625c0 .169.062.316.186.439a.6.6 0 0 0 .439.186h16.25a.605.605 0 0 0 .439-.186zM9.995 14.674a.601.601 0 0 1 .186.439.598.598 0 0 1-.186.439.601.601 0 0 1-.439.186H5.18a.598.598 0 0 1-.439-.186.6.6 0 0 1-.186-.439.6.6 0 0 1 .186-.439.6.6 0 0 1 .439-.186h4.375c.169 0 .316.062.44.186zm9.375 0a.601.601 0 0 1 .186.439.598.598 0 0 1-.186.439.601.601 0 0 1-.439.186h-1.25a.598.598 0 0 1-.439-.186.6.6 0 0 1-.186-.439.6.6 0 0 1 .186-.439.6.6 0 0 1 .439-.186h1.25c.168 0 .315.062.439.186z" />
|
||||
</svg>
|
||||
</i>
|
||||
<p class="mb-0">Credit Card: Visa, MasterCard,
|
||||
Maestro, American Express. The total will be
|
||||
charged to your card when the order is
|
||||
shipped.</p>
|
||||
</div>
|
||||
<div class="d-flex align-items-start mb-15">
|
||||
<i class="mr-10">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-009" viewBox="0 0 24 24">
|
||||
<path d="M2.453 8.299c-.026-.039-.048-.075-.068-.107a2.896 2.896 0 0 0-.068-.107.715.715 0 0 1 0-.469 2.48 2.48 0 0 0 .068-.107c.02-.033.042-.068.068-.107l5-5a.9.9 0 0 1 .215-.128c.078-.032.156-.049.234-.049s.156.017.234.049a.93.93 0 0 1 .215.127c.117.13.176.28.176.449a.652.652 0 0 1-.176.449L4.407 7.225h10.059a6.36 6.36 0 0 1 2.549.518 6.63 6.63 0 0 1 2.09 1.406c.593.592 1.062 1.289 1.406 2.09s.518 1.65.518 2.549-.173 1.748-.518 2.549a6.63 6.63 0 0 1-1.406 2.09 6.647 6.647 0 0 1-2.09 1.406 6.373 6.373 0 0 1-2.549.518H8.528a.6.6 0 0 1-.439-.186.601.601 0 0 1-.186-.439c0-.169.062-.316.186-.439a.595.595 0 0 1 .439-.187h5.938a5.12 5.12 0 0 0 2.061-.42 5.397 5.397 0 0 0 1.689-1.143 5.454 5.454 0 0 0 1.143-1.689 5.12 5.12 0 0 0 .42-2.061c0-.729-.14-1.416-.42-2.061a5.397 5.397 0 0 0-2.832-2.832 5.116 5.116 0 0 0-2.061-.42H4.407L8.352 12.4c.117.13.176.28.176.449a.652.652 0 0 1-.176.449.652.652 0 0 1-.449.176.652.652 0 0 1-.449-.176L2.453 8.299z" />
|
||||
</svg>
|
||||
</i>
|
||||
<p class="mb-0">Returns and Refunds: You can return
|
||||
any item purchased on Shella within 20 days of
|
||||
the delivery date.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> --}}
|
||||
|
||||
{{-- <div class="layer-navigation" data-js-collection-nav-section="promobox" data-js-accordion="all">
|
||||
<div class="pt-20"></div>
|
||||
<div class="layer-navigation__accordion" data-js-accordion-content>
|
||||
<div class="pt-2 pb-10">
|
||||
<div class="promobox promobox--type-02 position-relative d-flex flex-column align-items-center text-center">
|
||||
<div class="w-100">
|
||||
<a href="product.html" class="w-100">
|
||||
<div class="image-animation image-animation--from-default image-animation--to-center image-animation--to-opacity">
|
||||
<div class="rimage" style="padding-top:128.1481481%;"><img src="data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=" class="rimage__img rimage__img--fade-in lazyload" data-master="https://cdn.shopify.com/s/files/1/0026/2910/7764/files/08_dbfb557e-a691-4822-9ece-255c7fa4a984_{width}x.progressive.png.jpg?v=1530696155" data-aspect-ratio="0.7803468208092486" data-srcset="https://cdn.shopify.com/s/files/1/0026/2910/7764/files/08_dbfb557e-a691-4822-9ece-255c7fa4a984_400x.progressive.png.jpg?v=1530696155 1x, https://cdn.shopify.com/s/files/1/0026/2910/7764/files/08_dbfb557e-a691-4822-9ece-255c7fa4a984_400x@2x.progressive.png.jpg?v=1530696155 2x" data-scale-perspective="1.1" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
<div class="promobox__plate position-absolute d-flex flex-column flex-center px-10 py-7 pointer-events-none">
|
||||
<p class="promobox__text-line-01 h5 position-relative m-0">
|
||||
NEW IN</p>
|
||||
<p class="promobox__text-line-02 position-relative m-0">
|
||||
Spring/Summer 2018 Collection</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> --}}
|
||||
|
||||
</nav>
|
||||
</aside>
|
||||
</div>
|
||||
<script>
|
||||
Loader.require({
|
||||
type: "script",
|
||||
name: "collection_sidebar"
|
||||
});
|
||||
|
||||
</script>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
Loader.require({
|
||||
type: "script",
|
||||
name: "plugin_sticky_sidebar"
|
||||
});
|
||||
|
||||
Loader.require({
|
||||
type: "script",
|
||||
name: "sticky_sidebar"
|
||||
});
|
||||
|
||||
</script>
|
||||
@@ -0,0 +1,36 @@
|
||||
<div class="layer-navigation" data-js-collection-nav-section="filter_by_price" data-js-accordion="all">
|
||||
<div class="layer-navigation__head py-10 cursor-pointer open" data-js-accordion-button>
|
||||
<h5 class="d-flex text-uppercase align-items-center mb-0">
|
||||
{{ __('Price') }}
|
||||
<i class="layer-navigation__arrow">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-229" viewBox="0 0 24 24">
|
||||
<path d="M11.783 14.088l-3.75-3.75a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176l3.301 3.32 3.301-3.32a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-3.75 3.75a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .841.841 0 0 1-.215-.127z" />
|
||||
</svg>
|
||||
</i>
|
||||
</h5>
|
||||
</div>
|
||||
<div class="layer-navigation__accordion" data-js-accordion-content>
|
||||
<div class="pt-2 pb-10">
|
||||
<div class="collection-filter-by-price">
|
||||
<input type="hidden" class="js-range-of-price" name="filter_by_price" data-min="0" data-max="10000" data-step="10">
|
||||
</div>
|
||||
<script>
|
||||
Loader.require({
|
||||
type: "style",
|
||||
name: "plugin_ion_range_slider"
|
||||
});
|
||||
|
||||
Loader.require({
|
||||
type: "script",
|
||||
name: "plugin_ion_range_slider"
|
||||
});
|
||||
|
||||
Loader.require({
|
||||
type: "script",
|
||||
name: "range_of_price"
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div>
|
||||
<div class="border-bottom"></div>
|
||||
</div>
|
||||
@@ -0,0 +1,126 @@
|
||||
<div class="layer-navigation" data-js-collection-nav-section="filters" data-js-accordion="all">
|
||||
<div class="layer-navigation__head py-10 cursor-pointer open" data-js-accordion-button>
|
||||
<h5 class="d-flex align-items-center mb-0">
|
||||
{{ __('Size') }}
|
||||
|
||||
<i class="layer-navigation__arrow">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-229" viewBox="0 0 24 24">
|
||||
<path d="M11.783 14.088l-3.75-3.75a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176l3.301 3.32 3.301-3.32a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-3.75 3.75a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .841.841 0 0 1-.215-.127z" />
|
||||
</svg>
|
||||
</i>
|
||||
</h5>
|
||||
</div>
|
||||
<div class="layer-navigation__accordion" data-js-accordion-content>
|
||||
<div class="pt-2 pb-10">
|
||||
<div data-js-collection-replace="filter-2" data-js-collection-replace-only-full>
|
||||
<div class="collection-filters row" data-js-collection-filters>
|
||||
<div class="col-6 mb-10">
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="30">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none">
|
||||
<i class="d-none">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z" /></svg>
|
||||
</i>
|
||||
</span>
|
||||
<span>30</span>
|
||||
</label>
|
||||
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="32">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none">
|
||||
<i class="d-none"><svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z" /></svg></i>
|
||||
</span><span>32</span></label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="34">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none">
|
||||
<i class="d-none"><svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z" /></svg></i>
|
||||
</span><span>34</span></label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="36">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none">
|
||||
<i class="d-none"><svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z" /></svg></i>
|
||||
</span><span>36</span></label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="38">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none">
|
||||
<i class="d-none"><svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z" /></svg></i>
|
||||
</span><span>38</span></label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="40">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none">
|
||||
<i class="d-none"><svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z" /></svg></i>
|
||||
</span><span>40</span></label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="42">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none">
|
||||
<i class="d-none"><svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z" /></svg></i>
|
||||
</span><span>42</span></label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="44">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none">
|
||||
<i class="d-none"><svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z" /></svg></i>
|
||||
</span><span>44</span></label>
|
||||
</div>
|
||||
<div class="col-6 mb-10"><label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="xxs">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none">
|
||||
<i class="d-none"><svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z" /></svg></i>
|
||||
</span><span>XXS</span></label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="xs">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none">
|
||||
<i class="d-none"><svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z" /></svg></i>
|
||||
</span><span>XS</span></label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="s">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none">
|
||||
<i class="d-none"><svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z" /></svg></i>
|
||||
</span><span>S</span></label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="m">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none">
|
||||
<i class="d-none"><svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z" /></svg></i>
|
||||
</span><span>M</span></label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="l">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none">
|
||||
<i class="d-none"><svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z" /></svg></i>
|
||||
</span><span>L</span></label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="xl">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none">
|
||||
<i class="d-none"><svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z" /></svg></i>
|
||||
</span><span>XL</span></label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="xxl">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none">
|
||||
<i class="d-none"><svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z" /></svg></i>
|
||||
</span><span>XXL</span></label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="xxxl">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none">
|
||||
<i class="d-none"><svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z" /></svg></i>
|
||||
</span><span>XXXL</span></label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="border-bottom"></div>
|
||||
</div>
|
||||
@@ -0,0 +1,138 @@
|
||||
@push('footer-javascript')
|
||||
<script src="/web/shella/scripts/cs/product-pagination.js"></script>
|
||||
@endpush
|
||||
|
||||
<div class="collections js-collections pb-10">
|
||||
|
||||
{{-- Breadcrumbs --}}
|
||||
<div data-js-collection-replace="breadcrumbs" data-js-collection-replace-only-full>
|
||||
<div class="breadcrumbs mt-15">
|
||||
<div class="mx-20">
|
||||
<ul class="list-unstyled d-flex text-lg flex-wrap align-items-center justify-content-center justify-content-lg-start">
|
||||
<li class="text-md"><a href="/">{{ __('Home') }}</a></li>
|
||||
<li class="text-md">
|
||||
<a href="{{ $resource->productsPage() }}">
|
||||
{{ __(class_basename($resource)) }}
|
||||
</a>
|
||||
</li>
|
||||
<li class="text-md"><span>{{ $resource->name }}</span></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mt-10 mt-lg-25">
|
||||
<div class="row mb-40">
|
||||
<div class="collections__body col pb-25">
|
||||
<div data-js-collection-replace="head" data-js-collection-replace-only-full>
|
||||
<div id="theme-section-collection-head" class="theme-section">
|
||||
<div data-section-id="collection-head" data-section-type="collection-head">
|
||||
<div class="collection-head">
|
||||
<div class="mb-15">
|
||||
<h1 class="h3 mb-10 lg:d-none text-center text-lg-left">{{ $resource->name }}</h1>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
Loader.require({
|
||||
type: "script",
|
||||
name: "collection_head"
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
<div id="theme-section-collection-body" class="theme-section mx-20">
|
||||
<div data-section-id="collection-body" data-section-type="collection-body">
|
||||
<div class="collection-body js-products-view">
|
||||
<div class="collection-control mb-25 mb-lg-30">
|
||||
<div class="row">
|
||||
<div class="col-8 col-lg-4 d-flex d-lg-flex align-items-center">
|
||||
<div class="lg:d-none d-flex d-lg-flex mr-30">
|
||||
<div class="collection-control__button-sidebar d-flex align-items-center cursor-pointer js-popup-button text-uppercase" data-js-popup-button="sidebar">
|
||||
<i class="mr-5">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-084" viewBox="0 0 24 24">
|
||||
<path d="M19.292 1.871c.169 0 .315.063.439.186a.601.601 0 0 1 .186.439v2.5a.657.657 0 0 1-.039.225.499.499 0 0 1-.117.186l-5.469 6.074v6.641a.582.582 0 0 1-.078.293.823.823 0 0 1-.195.234l-3.75 2.5c-.052.026-.107.049-.166.068a.603.603 0 0 1-.479-.05c-.104-.052-.186-.127-.244-.225s-.088-.205-.088-.322v-9.14L3.823 5.406a.491.491 0 0 1-.117-.186.648.648 0 0 1-.039-.224v-2.5a.6.6 0 0 1 .186-.439.604.604 0 0 1 .439-.186h15zm-.625 2.89v-1.64H4.917v1.641l5.469 6.074a.507.507 0 0 1 .117.186.653.653 0 0 1 .039.225v8.203l2.5-1.66v-6.543c0-.078.013-.152.039-.225a.515.515 0 0 1 .117-.186l5.469-6.075z" />
|
||||
</svg>
|
||||
</i>
|
||||
{{ __('Filter') }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h1 class="d-none lg:block h3 mb-10 d-lg-block text-center text-lg-left">
|
||||
{{ $resource->name }}
|
||||
</h1>
|
||||
</div>
|
||||
<div
|
||||
class="col-lg-3 d-none d-lg-flex justify-content-lg-center align-items-lg-center"
|
||||
data-js-collection-replace="info"
|
||||
>
|
||||
{{-- <div class="collection-control__information">
|
||||
Showing 1–12 of 42 results
|
||||
</div> --}}
|
||||
</div>
|
||||
<div class="col-4 col-lg-5 d-flex justify-content-lg-end align-items-center">
|
||||
@include('web.themes.shella.components.products.collection.sorting')
|
||||
@include('web.themes.shella.components.products.collection.pagination-select')
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@includeWhen($filtersEnabled, 'web.themes.shella.components.products.collection.filters.filters')
|
||||
|
||||
<div id="theme-section-collection-body" class="theme-section">
|
||||
|
||||
<div data-section-id="collection-body" data-section-type="collection-body">
|
||||
<div class="collection-body js-products-view" id="products-container">
|
||||
{{-- Products --}}
|
||||
@include('web.themes.trendyol.components.products.collection.grid-products', [
|
||||
'products' => $products
|
||||
])
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div class="pagination" id="pagination-container">
|
||||
<div class="d-flex justify-content-center mt-35">
|
||||
|
||||
@if($products->nextPageUrl())
|
||||
<a href="{{ $products->nextPageUrl() }}" class="btn btn--secondary" id="pagination-next">
|
||||
<span class="text-uppercase">{{ __('Next') }}</span>
|
||||
</a>
|
||||
@endif
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
Loader.require({
|
||||
type: "script",
|
||||
name: "collection_body"
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
Loader.require({
|
||||
type: "script",
|
||||
name: "collections"
|
||||
});
|
||||
</script>
|
||||
<div id="theme-section-carousel-products" class="theme-section">
|
||||
<script>
|
||||
Loader.require({
|
||||
type: "style",
|
||||
name: "plugin_slick"
|
||||
});
|
||||
|
||||
Loader.require({
|
||||
type: "script",
|
||||
name: "carousel_products"
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,125 @@
|
||||
<div class="col-6 col-sm-6 col-md-4 col-lg-3 cursor-pointer">
|
||||
<div class="product-collection d-flex flex-column mb-30" data-js-product data-js-product-json-preload data-product-handle="{{ $product->slug }}" data-product-variant-id="{{ $product->id }}">
|
||||
<div class="product-collection__image product-image product-image--hover-emersion-z position-relative w-100 js-product-images-navigation js-product-images-hovered-end js-product-images-hover"
|
||||
data-js-product-image-hover="{{ $product->getHoverImage('270x350') }}"
|
||||
data-js-product-image-hover-id="{{ $product->id }}"
|
||||
>
|
||||
<a href="{{ route('web.products.show', ['product' => $product->slug]) }}" class="d-block cursor-pointer" data-js-product-image>
|
||||
<div class="rimage" style="padding-top:128.0%;">
|
||||
<img src="data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs="
|
||||
class="rimage__img rimage__img--contain rimage__img--fade-in lazyload cursor-pointer"
|
||||
data-master="{{ $product->thumbnail('270x350') }}"
|
||||
data-aspect-ratio="0.78125"
|
||||
data-srcset="{{ $product->thumbnail('270x350') }} 1x, {{ $product->thumbnail('270x350') }} 2x"
|
||||
data-image-id="{{ $product->id }}"
|
||||
alt="{{ $product->name }}">
|
||||
</div>
|
||||
</a>
|
||||
<div class="product-image__overlay-top position-absolute d-flex flex-wrap top-0 left-0 w-100 px-10 pt-10">
|
||||
{{-- <a href="{{ route('web.products.show', ['product' => $product->slug]) }}" class="absolute-stretch cursor-pointer"></a> --}}
|
||||
<div class="product-image__overlay-top-left product-collection__labels position-relative d-flex flex-column align-items-start mb-10">
|
||||
|
||||
{{-- @if($product->isHot())
|
||||
<div class="label label--hot mb-3 mr-3 text-nowrap" data-js-product-label-hot>Hot</div>
|
||||
@endif --}}
|
||||
|
||||
@if($product->isNew())
|
||||
<div class="label label--new mb-3 mr-3 text-nowrap" data-js-product-label-new>{{ __('New') }}</div>
|
||||
@endif
|
||||
|
||||
@if($product->old_price_amount)
|
||||
<div class="label label--sale mb-3 mr-3 text-nowrap" data-js-product-label-sale>{{ $product->discountPercentage() }}%</div>
|
||||
@endif
|
||||
|
||||
{{-- @if($product->outOfStock()) --}}
|
||||
{{-- <div class="label label--out-stock mb-3 mr-3 text-nowrap" data-js-product-label-out-stock>Out Stock</div> --}}
|
||||
{{-- @endif --}}
|
||||
</div>
|
||||
|
||||
{{-- Quick view btn --}}
|
||||
{{-- @include('web.themes.shella.components.products.buttons.quick-view-button') --}}
|
||||
|
||||
</div>
|
||||
<div class="product-image__overlay-bottom position-absolute d-flex justify-content-center justify-content-lg-start align-items-end bottom-0 left-0 w-100 px-10 pb-10">
|
||||
{{-- <a href="#" class="absolute-stretch cursor-pointer"></a> --}}
|
||||
<div class="product-image__overlay-bottom-left product-collection__countdown position-relative mt-10">
|
||||
<div class="d-none-important" data-js-product-countdown>
|
||||
<div class="countdown countdown--type-01 d-flex flex-wrap justify-content-center js-countdown" data-date="2019-03-31 17:10:09"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Next - Prev buttons --}}
|
||||
{{-- @include('web.themes.shella.components.products.buttons.next-prev-buttons') --}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="product-collection__content d-flex flex-column align-items-start mt-15">
|
||||
<div class="product-collection__title mb-3">
|
||||
<h4 class="h6 m-0">
|
||||
<a href="{{ $product->showPage() }}">{{ $product->name }}</a>
|
||||
</h4>
|
||||
</div>
|
||||
<div class="product-collection__details d-none mb-8">
|
||||
<div class="product-collection__sku mb-5">
|
||||
<p class="m-0" data-js-product-sku>SKU: <span>00116с-23</span></p>
|
||||
</div>
|
||||
<div class="product-collection__barcode d-none-important mb-5">
|
||||
<p class="m-0" data-js-product-barcode>BARCODE: <span></span></p>
|
||||
</div>
|
||||
<div class="product-collection__availability mb-5">
|
||||
<p class="m-0" data-js-product-availability data-availability="true">
|
||||
AVAILABILITY: <span>In stock (1 item)</span></p>
|
||||
</div>
|
||||
<div class="product-collection__type mb-5">
|
||||
<p class="m-0" data-js-product-type>PRODUCT TYPE: <span>Polo</span></p>
|
||||
</div>
|
||||
<div class="product-collection__vendor mb-5">
|
||||
<p class="m-0" data-js-product-vendor>VENDOR: <span>Lacoste</span></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="product-collection__description d-none mb-15">
|
||||
<p class="m-0">Sample Paragraph Text Lorem ipsum dolor sit amet conse ctetur
|
||||
adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna
|
||||
aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
|
||||
nisi ut aliquip ex ea commodo consequat....</p>
|
||||
</div>
|
||||
<div class="product-collection__price mb-10">
|
||||
<span class="price @if($product->old_price_amount) price--sale @endif" data-js-product-price>
|
||||
@if($product->old_price_amount)
|
||||
<span><span class=money>{{ $product->old_price_amount }} TMT</span></span>
|
||||
@endif
|
||||
<span><span class=money>{{ $product->price_amount }} TMT</span></span>
|
||||
</span>
|
||||
</div>
|
||||
<div class="d-flex flex-column w-100 m-0">
|
||||
|
||||
<div class="product-collection__options">
|
||||
<div class="product-options product-options--type-collection js-product-options" data-js-product-options>
|
||||
{{-- Color --}}
|
||||
{{-- @include('web.themes.shella.components.products.buttons.colors') --}}
|
||||
|
||||
{{-- Size --}}
|
||||
{{-- @include('web.themes.shella.components.products.buttons.sizes-button') --}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Variants (select) --}}
|
||||
{{-- @include('web.themes.shella.components.products.select.variants') --}}
|
||||
|
||||
<div class="product-collection__buttons d-flex flex-column flex-lg-row align-items-lg-center flex-wrap mt-5 mt-lg-10">
|
||||
@include('web.themes.shella.components.products.buttons.add-to-cart', [
|
||||
'product_id' => $product->id
|
||||
])
|
||||
|
||||
@include('web.themes.shella.components.products.buttons.add-to-wishlist', [
|
||||
'product_id' => $product->id
|
||||
])
|
||||
</div>
|
||||
</div>
|
||||
<div class="product-collection__reviews">
|
||||
<div class="spr spr--text-hide spr--empty-hide d-flex flex-column">
|
||||
<span class="shopify-product-reviews-badge" data-id="1494579609652"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,9 @@
|
||||
<div class="collection-products" data-js-products>
|
||||
<div class="sorting-collections__products row" data-sorting-collections-items data-limit="8" data-grid="col-6 col-sm-6 col-md-4 col-lg-3">
|
||||
@foreach($products as $product)
|
||||
@include('web.themes.shella.components.products.collection.grid-product-item', [
|
||||
'product' => $product
|
||||
])
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,29 @@
|
||||
<div class="collection-control__sort-by d-none d-lg-block ml-10" data-js-collection-sort-by>
|
||||
<div class="select position-relative js-dropdown js-select">
|
||||
<div class="d-flex align-items-center" data-js-dropdown-button>
|
||||
<label for="show-product-count" class="mb-0 mr-5">{{ __('Count') }}:</label>
|
||||
<select name="sort_by" class="p-0 pr-25 mb-0 border-0 cursor-pointer" id="show-product-count-select"
|
||||
onchange="addUrlParam('perPage', event.target.value)">
|
||||
<option value="12">12</option>
|
||||
<option value="24">24</option>
|
||||
<option value="32">32</option>
|
||||
<option value="48">48</option>
|
||||
<option value="96">96</option>
|
||||
</select>
|
||||
<i class="position-absolute right-0">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-229" viewBox="0 0 24 24">
|
||||
<path d="M11.783 14.088l-3.75-3.75a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176l3.301 3.32 3.301-3.32a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-3.75 3.75a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .841.841 0 0 1-.215-.127z"/>
|
||||
</svg>
|
||||
</i>
|
||||
</div>
|
||||
<div class="select__dropdown dropdown d-none position-lg-absolute top-lg-100 left-lg-0" data-js-dropdown data-js-select-dropdown>
|
||||
<div class="px-15 pb-30 py-lg-15">
|
||||
<span data-value="12">12</span>
|
||||
<span data-value="24">24</span>
|
||||
<span data-value="32">32</span>
|
||||
<span data-value="48">48</span>
|
||||
<span data-value="96">96</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,30 @@
|
||||
<div class="collection-control__sort-by d-none d-lg-block" style="margin-left: 20%;" data-js-collection-sort-by>
|
||||
<div class="select position-relative js-dropdown js-select">
|
||||
<div class="d-flex align-items-center" data-js-dropdown-button>
|
||||
<label for="SortBy" class="mb-0 mr-5">{{ __('Sort') }}:</label>
|
||||
<select name="sort_by" class="p-0 pr-25 mb-0 border-0 cursor-pointer" id="SortBy" onchange="addSorting(event.target.value)">
|
||||
<option value="price_amount-ascending">{{ __('Price Ascending') }}</option>
|
||||
<option value="price_amount-descending">{{ __('Price Descending') }}</option>
|
||||
<option value="created_at-descending" selected>{{ __('Date Descending') }}</option>
|
||||
<option value="created_at-ascending">{{ __('Date Ascending') }}</option>
|
||||
<option value="name-ascending">{{ __('Name Ascending') }}</option>
|
||||
<option value="name-descending">{{ __('Name Descending') }}</option>
|
||||
</select>
|
||||
<i class="position-absolute right-0">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-229" viewBox="0 0 24 24">
|
||||
<path d="M11.783 14.088l-3.75-3.75a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176l3.301 3.32 3.301-3.32a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-3.75 3.75a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .841.841 0 0 1-.215-.127z"/>
|
||||
</svg>
|
||||
</i>
|
||||
</div>
|
||||
<div class="select__dropdown dropdown d-none position-lg-absolute top-lg-100 left-lg-0" data-js-dropdown data-js-select-dropdown>
|
||||
<div class="px-15 pb-30 py-lg-15">
|
||||
<span data-value="price_amount-ascending">{{ __('Price Ascending') }}</span>
|
||||
<span data-value="price_amount-descending">{{ __('Price Descending') }}</span>
|
||||
<span data-value="created_at-descending" selected>{{ __('Date Descending') }}</span>
|
||||
<span data-value="created_at-ascending">{{ __('Date Ascending') }}</span>
|
||||
<span data-value="name-ascending">{{ __('Name Ascending') }}</span>
|
||||
<span data-value="name-descending">{{ __('Name Descending') }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,132 @@
|
||||
{{-- data-limit="8" data-grid="col-6 col-sm-6 col-md-4 col-lg-3" --}}
|
||||
<div class="sorting-collections__products row" data-sorting-collections-items>
|
||||
@foreach($products as $product)
|
||||
<div class="col-6 col-sm-6 col-md-3 col-lg-20% cursor-pointer">
|
||||
<div class="product-collection d-flex flex-column mb-30" data-js-product data-js-product-json-preload data-product-handle="{{ $product->slug }}" data-product-variant-id="{{ $product->id }}">
|
||||
<div class="product-collection__image product-image product-image--hover-emersion-z position-relative w-100 js-product-images-navigation js-product-images-hovered-end js-product-images-hover"
|
||||
data-js-product-image-hover="{{ $product->getHoverImage('270x350') }}"
|
||||
data-js-product-image-hover-id="{{ $product->id }}"
|
||||
>
|
||||
<a href="{{ route('web.products.show', ['product' => $product->slug]) }}" class="d-block cursor-pointer" data-js-product-image>
|
||||
<div class="rimage" style="padding-top:128.0%;">
|
||||
<img src="data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs="
|
||||
class="rimage__img rimage__img--contain rimage__img--fade-in lazyload cursor-pointer"
|
||||
data-master="{{ $product->thumbnail('270x350') }}"
|
||||
data-aspect-ratio="0.78125"
|
||||
data-srcset="{{ $product->thumbnail('270x350') }} 1x, {{ $product->thumbnail('270x350') }} 2x"
|
||||
data-image-id="{{ $product->id }}"
|
||||
alt="{{ $product->name }}">
|
||||
</div>
|
||||
</a>
|
||||
<div class="product-image__overlay-top position-absolute d-flex flex-wrap top-0 left-0 w-100 px-10 pt-10">
|
||||
{{-- <a href="{{ route('web.products.show', ['product' => $product->slug]) }}" class="absolute-stretch cursor-pointer"></a> --}}
|
||||
<div class="product-image__overlay-top-left product-collection__labels position-relative d-flex flex-column align-items-start mb-10">
|
||||
|
||||
{{-- @if($product->isHot())
|
||||
<div class="label label--hot mb-3 mr-3 text-nowrap" data-js-product-label-hot>Hot</div>
|
||||
@endif --}}
|
||||
|
||||
@if($product->isNew())
|
||||
<div class="label label--new mb-3 mr-3 text-nowrap" data-js-product-label-new>{{ __('New') }}</div>
|
||||
@endif
|
||||
|
||||
@if($product->old_price_amount)
|
||||
<div class="label label--sale mb-3 mr-3 text-nowrap" data-js-product-label-sale>{{ $product->discount_rate }}%</div>
|
||||
@endif
|
||||
|
||||
{{-- @if($product->outOfStock()) --}}
|
||||
{{-- <div class="label label--out-stock mb-3 mr-3 text-nowrap" data-js-product-label-out-stock>Out Stock</div> --}}
|
||||
{{-- @endif --}}
|
||||
</div>
|
||||
|
||||
{{-- Quick view btn --}}
|
||||
{{-- @include('web.themes.shella.components.products.buttons.quick-view-button') --}}
|
||||
|
||||
</div>
|
||||
<div class="product-image__overlay-bottom position-absolute d-flex justify-content-center justify-content-lg-start align-items-end bottom-0 left-0 w-100 px-10 pb-10">
|
||||
{{-- <a href="#" class="absolute-stretch cursor-pointer"></a> --}}
|
||||
<div class="product-image__overlay-bottom-left product-collection__countdown position-relative mt-10">
|
||||
<div class="d-none-important" data-js-product-countdown>
|
||||
<div class="countdown countdown--type-01 d-flex flex-wrap justify-content-center js-countdown" data-date="2019-03-31 17:10:09"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Next - Prev buttons --}}
|
||||
{{-- @include('web.themes.shella.components.products.buttons.next-prev-buttons') --}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="product-collection__content d-flex flex-column align-items-start mt-15">
|
||||
<div class="product-collection__title mb-3">
|
||||
<h4 class="h6 m-0">
|
||||
<a href="{{ $product->showPage() }}">{{ $product->name }}</a>
|
||||
</h4>
|
||||
</div>
|
||||
<div class="product-collection__details d-none mb-8">
|
||||
<div class="product-collection__sku mb-5">
|
||||
<p class="m-0" data-js-product-sku>SKU: <span>00116с-23</span></p>
|
||||
</div>
|
||||
<div class="product-collection__barcode d-none-important mb-5">
|
||||
<p class="m-0" data-js-product-barcode>BARCODE: <span></span></p>
|
||||
</div>
|
||||
<div class="product-collection__availability mb-5">
|
||||
<p class="m-0" data-js-product-availability data-availability="true">
|
||||
AVAILABILITY: <span>In stock (1 item)</span></p>
|
||||
</div>
|
||||
<div class="product-collection__type mb-5">
|
||||
<p class="m-0" data-js-product-type>PRODUCT TYPE: <span>Polo</span></p>
|
||||
</div>
|
||||
<div class="product-collection__vendor mb-5">
|
||||
<p class="m-0" data-js-product-vendor>VENDOR: <span>Lacoste</span></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="product-collection__description d-none mb-15">
|
||||
<p class="m-0">Sample Paragraph Text Lorem ipsum dolor sit amet conse ctetur
|
||||
adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna
|
||||
aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
|
||||
nisi ut aliquip ex ea commodo consequat....</p>
|
||||
</div>
|
||||
<div class="product-collection__price mb-10">
|
||||
<span class="price @if($product->old_price_amount) price--sale @endif" data-js-product-price>
|
||||
@if($product->old_price_amount)
|
||||
<span><span class=money>{{ $product->old_price_amount }} TMT</span></span>
|
||||
@endif
|
||||
<span><span class=money>{{ $product->price_amount }} TMT</span></span>
|
||||
</span>
|
||||
</div>
|
||||
<div class="d-flex flex-column w-100 m-0">
|
||||
|
||||
<div class="product-collection__options">
|
||||
<div class="product-options product-options--type-collection js-product-options" data-js-product-options>
|
||||
{{-- Color --}}
|
||||
{{-- @include('web.themes.shella.components.products.buttons.colors') --}}
|
||||
|
||||
{{-- Size --}}
|
||||
{{-- @include('web.themes.shella.components.products.buttons.sizes-button') --}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Variants (select) --}}
|
||||
{{-- @include('web.themes.shella.components.products.select.variants') --}}
|
||||
|
||||
<div class="product-collection__buttons d-flex mt-5 mt-lg-10">
|
||||
@include('web.themes.shella.components.products.buttons.add-to-cart', [
|
||||
'product_id' => $product->id
|
||||
])
|
||||
|
||||
@include('web.themes.shella.components.products.buttons.add-to-wishlist', [
|
||||
'product_id' => $product->id
|
||||
])
|
||||
</div>
|
||||
</div>
|
||||
<div class="product-collection__reviews">
|
||||
<div class="spr spr--text-hide spr--empty-hide d-flex flex-column">
|
||||
<span class="shopify-product-reviews-badge" data-id="1494579609652"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
@endforeach
|
||||
</div>
|
||||
@@ -0,0 +1,24 @@
|
||||
<div class="product-collection__variants mb-10 d-none">
|
||||
<select name="id" class="m-0" data-js-product-variants>
|
||||
<option selected="selected" value="13793281441844">White / 30</option>
|
||||
<option value="13793286750260">White / 32</option>
|
||||
<option value="13793286783028">White / 34</option>
|
||||
<option value="13793286815796">White / 36</option>
|
||||
<option value="13793286848564">Green / 30</option>
|
||||
<option disabled="disabled" value="13793286881332">Green / 32</option>
|
||||
<option disabled="disabled" value="13793286914100">Green / 34</option>
|
||||
<option disabled="disabled" value="13793286946868">Green / 36</option>
|
||||
<option disabled="disabled" value="13793286979636">Pink / 30</option>
|
||||
<option disabled="disabled" value="13793287012404">Pink / 32</option>
|
||||
<option disabled="disabled" value="13793287045172">Pink / 34</option>
|
||||
<option value="13793287077940">Pink / 36</option>
|
||||
<option value="13793287110708">Black / 30</option>
|
||||
<option value="13793287143476">Black / 32</option>
|
||||
<option value="13793287176244">Black / 34</option>
|
||||
<option value="13793287209012">Black / 36</option>
|
||||
<option value="13793287241780">Gainsboro / 30</option>
|
||||
<option value="13793287274548">Gainsboro / 32</option>
|
||||
<option value="13793287307316">Gainsboro / 34</option>
|
||||
<option value="13793287340084">Gainsboro / 36</option>
|
||||
</select>
|
||||
</div>
|
||||
@@ -0,0 +1,97 @@
|
||||
<div class="widget-product" title="{{ $product->name }}">
|
||||
<a href="{{ $product->showPage() }}" style="width: 100%;">
|
||||
<div class="image-container rimage">
|
||||
<img class="p-card-img lazyload"
|
||||
src="data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs="
|
||||
data-src="{{ $product->thumbnail('288x431') }}"
|
||||
data-srcset="{{ $product->thumbnail('288x431') }} 1x, {{ $product->thumbnail('288x431') }} 2x"
|
||||
>
|
||||
{{-- Kargo bedavo bage --}}
|
||||
<div class="product-stamps">
|
||||
{{-- @if($product->isNew())
|
||||
<div class="stamp-box-wrapper enhanced">
|
||||
<div class="stamp fc text-center">
|
||||
<div class="inner text-uppercase">{{ __('New') }}</div>
|
||||
</div>
|
||||
</div>
|
||||
@endif --}}
|
||||
<div class="custom-stamp-box-wrapper">
|
||||
<div class="upper-left">
|
||||
{{-- <img src="https://cdn.dsmcdn.com/mnresize/250/250/indexing-sticker-stamp/moon/e68c3d96-a877-4e49-923b-ca420419ab40.png" style="width: 25%;"> --}}
|
||||
{{-- <img src="https://cdn.dsmcdn.com/mnresize/250/250/marketing/datascience/automation/2020/12/9/EnCokSatan_202012091129.png" style="width: 25%;"> --}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="description fixed-elements">
|
||||
<div class="product-brand-description two-line-text">
|
||||
<span class="name">{{ Str::limit($product->name, 46, '...') }}</span>
|
||||
{{-- <span class="product-stock">({{ $product->options_stock }})</span> --}}
|
||||
</div>
|
||||
<div class="ratings">
|
||||
<div class="star-w">
|
||||
<div class="empty">
|
||||
<div class="star"></div>
|
||||
</div>
|
||||
<div class="full" style="width: 100%; max-width: 100%;">
|
||||
<div class="star"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="star-w">
|
||||
<div class="empty">
|
||||
<div class="star"></div>
|
||||
</div>
|
||||
<div class="full" style="width: 100%; max-width: 100%;">
|
||||
<div class="star"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="star-w">
|
||||
<div class="empty">
|
||||
<div class="star"></div>
|
||||
</div>
|
||||
<div class="full" style="width: 100%; max-width: 100%;">
|
||||
<div class="star"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="star-w">
|
||||
<div class="empty">
|
||||
<div class="star"></div>
|
||||
</div>
|
||||
<div class="full" style="width: 100%; max-width: 100%;">
|
||||
<div class="star"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="star-w">
|
||||
<div class="empty">
|
||||
<div class="star"></div>
|
||||
</div>
|
||||
<div class="full" style="width: 88%; max-width: 100%;">
|
||||
<div class="star"></div>
|
||||
</div>
|
||||
</div><span class="ratingCount">(1534)</span>
|
||||
</div>
|
||||
<div class="price-container">
|
||||
<div class="prices">
|
||||
<div>
|
||||
<div class="price-box discounted">{{ $product->price_amount }} TMT</div>
|
||||
@if($product->old_price_amount)
|
||||
<div class="price-box original">{{ $product->old_price_amount }} TMT</div>
|
||||
@endif
|
||||
</div>
|
||||
<div>
|
||||
@if($product->old_price_amount)
|
||||
<div class="price-discount-box ml-5">{{ $product->discountPercentage() }}%</div>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
@include('web.themes.trendyol.components.products.buttons.add-to-wishlist', [
|
||||
'product_id' => $product->id
|
||||
])
|
||||
@include('web.themes.trendyol.components.products.buttons.add-to-cart', [
|
||||
'product_id' => $product->id
|
||||
])
|
||||
</div>
|
||||
@@ -0,0 +1,31 @@
|
||||
@push('header-css')
|
||||
<style>
|
||||
.component-list .widget-container:not(.no-padding) .widget-product {
|
||||
height: 320px !important;
|
||||
}
|
||||
</style>
|
||||
@endpush
|
||||
|
||||
<div class="styles-module_sliderBase__swkx1 product-slider" data-testid="carousel">
|
||||
<div
|
||||
data-arrow="left"
|
||||
onclick="sideScroll(this.parentElement.querySelector('[data-widget=carousel-container]'),'left',25,1000,100)"
|
||||
>
|
||||
<button class="arrow-btn"></button>
|
||||
</div>
|
||||
|
||||
<div
|
||||
data-arrow="right"
|
||||
onclick="sideScroll(this.parentElement.querySelector('[data-widget=carousel-container]'),'right',25,1000,100)"
|
||||
>
|
||||
<button class="arrow-btn"></button>
|
||||
</div>
|
||||
|
||||
<div class="styles-module_slider__o0fqa" data-widget="carousel-container">
|
||||
@foreach($products as $product)
|
||||
@include('web.themes.shella.components.products.trendyol.carousel-item', [
|
||||
'product' => $product
|
||||
])
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,116 @@
|
||||
<div class="popup__body position-relative d-none justify-content-end" data-js-popup-name="account" data-popup-right>
|
||||
<div class="popup-account py-25 px-20 js-popup-account" data-popup-content>
|
||||
<div class="popup-account__login">
|
||||
<div class="popup-account__head d-flex align-items-center mb-10">
|
||||
<h5 class="m-0 text-capitalize">{{ __('MY ACCOUNT') }}</h5>
|
||||
<i class="popup-account__close ml-auto cursor-pointer" data-js-popup-close>
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-164" viewBox="0 0 24 24">
|
||||
<path d="M19.583 4.965a.65.65 0 0 1-.176.449l-6.445 6.426 6.445 6.426c.117.131.176.28.176.449a.65.65 0 0 1-.176.449.846.846 0 0 1-.215.127.596.596 0 0 1-.468 0 .846.846 0 0 1-.215-.127l-6.426-6.445-6.426 6.445a.846.846 0 0 1-.215.127.596.596 0 0 1-.468 0 .846.846 0 0 1-.215-.127.65.65 0 0 1-.176-.449c0-.169.059-.318.176-.449l6.445-6.426-6.445-6.426a.65.65 0 0 1-.176-.449c0-.169.059-.318.176-.449a.652.652 0 0 1 .449-.176c.169 0 .319.059.449.176l6.426 6.445 6.426-6.445a.652.652 0 0 1 .449-.176c.169 0 .319.059.449.176.117.13.176.28.176.449z"/>
|
||||
</svg>
|
||||
</i>
|
||||
</div>
|
||||
<form action="#" method="POST" id="popup_customer_login" class="mb-15" onsubmit="loginAction(event)">
|
||||
@csrf
|
||||
|
||||
<div id="PopupCustomerPhoneContainer">
|
||||
<label for="PopupCustomerPhone" class="label-required text-capitalize">{{ __('Phone number') }}</label>
|
||||
<input type="text" name="phone_number" id="PopupCustomerPhone"
|
||||
placeholder="{{ __('Your phone number') }}" spellcheck="false" autocomplete="off"
|
||||
autocapitalize="off">
|
||||
</div>
|
||||
|
||||
<div id="PopupCustomerVerificationCodeContainer" class="d-none">
|
||||
<label for="PopupCustomerVerificationCode" class="label-required text-capitalize">{{ __('Verification code') }}</label>
|
||||
<input type="number" name="verification_code" id="PopupCustomerVerificationCode" class=""
|
||||
placeholder="{{ __('Verification code sent to you via sms') }}" spellcheck="false" autocomplete="off"
|
||||
autocapitalize="off">
|
||||
</div>
|
||||
|
||||
|
||||
{{-- <div>
|
||||
<label for="PopupCustomerPassword" class="label-required">PASSWORD</label>
|
||||
<input type="password" name="customer[password]" id="PopupCustomerPassword" class=""
|
||||
placeholder="••••••" required="required">
|
||||
</div> --}}
|
||||
|
||||
<input type="submit" class="btn btn--full btn--secondary mb-20" value="{{ __('Login') }}">
|
||||
<div class="mb-15">
|
||||
<span class="popup-account__return-to-store btn-link text-uppercase" data-js-popup-close>{{ __('RETURN TO STORE') }}</span>
|
||||
</div>
|
||||
<div class="mb-10">
|
||||
|
||||
{{-- <a href="login.html" class="btn-link js-button-block-visibility" data-block-link="#recover" data-action="open" data-action-close-popup="account">Forgot Your Password?</a> --}}
|
||||
<script>
|
||||
Loader.require({
|
||||
type: "script",
|
||||
name: "buttons_blocks_visibility"
|
||||
});
|
||||
</script>
|
||||
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<hr class="my-15"/>
|
||||
<div class="popup-account__head d-flex align-items-center mb-10">
|
||||
<h5 class="m-0 text-uppercase">{{ __('Sign up') }}</h5>
|
||||
</div>
|
||||
<div>
|
||||
|
||||
|
||||
<p class="h6 mb-15">{{ __('Enjoy the benefits of registering') }}:</p>
|
||||
<ul class="mb-20">
|
||||
<li class="mb-15">{{ __('Order: view Order History, track and manage purchases and returns') }}</li>
|
||||
{{-- <li class="mb-15">
|
||||
Address Book and Card Wallet: safely store delivery and payment details --}}
|
||||
{{-- for faster checkout --}}
|
||||
{{-- </li> --}}
|
||||
<li class="mb-15">{{ __('Saved for later: wish list your preferred items and track their availability') }}</li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
{{-- <a href="register.html" class="btn btn--full btn--secondary mb-20 js-popup-account-show-sign-up">Sign up now!</a> --}}
|
||||
</div>
|
||||
<div class="popup-account__sign-up d-none-important">
|
||||
<div class="popup-account__head d-flex align-items-center mb-10">
|
||||
<h5 class="m-0">SIGN UP</h5>
|
||||
<i class="popup-account__close ml-auto cursor-pointer" data-js-popup-close>
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-164"
|
||||
viewBox="0 0 24 24">
|
||||
<path d="M19.583 4.965a.65.65 0 0 1-.176.449l-6.445 6.426 6.445 6.426c.117.131.176.28.176.449a.65.65 0 0 1-.176.449.846.846 0 0 1-.215.127.596.596 0 0 1-.468 0 .846.846 0 0 1-.215-.127l-6.426-6.445-6.426 6.445a.846.846 0 0 1-.215.127.596.596 0 0 1-.468 0 .846.846 0 0 1-.215-.127.65.65 0 0 1-.176-.449c0-.169.059-.318.176-.449l6.445-6.426-6.445-6.426a.65.65 0 0 1-.176-.449c0-.169.059-.318.176-.449a.652.652 0 0 1 .449-.176c.169 0 .319.059.449.176l6.426 6.445 6.426-6.445a.652.652 0 0 1 .449-.176c.169 0 .319.059.449.176.117.13.176.28.176.449z"/>
|
||||
</svg>
|
||||
</i>
|
||||
</div>
|
||||
<form method="post" action="/account" id="popup_create_customer" accept-charset="UTF-8"><input
|
||||
type="hidden" name="form_type" value="create_customer"/><input type="hidden" name="utf8"
|
||||
value="✓"/>
|
||||
|
||||
<div>
|
||||
<label for="PopupCustomerEmail" class="label-required">FIRST NAME</label>
|
||||
<input type="text" name="customer[first_name]" id="PopupFirstName"
|
||||
placeholder="Enter Please Your First Name" required="required">
|
||||
</div>
|
||||
<div>
|
||||
<label for="PopupCustomerEmail" class="label-required">LAST NAME</label>
|
||||
<input type="text" name="customer[last_name]" id="PopupLastName"
|
||||
placeholder="Enter Please Your Last Name" required="required">
|
||||
</div>
|
||||
<div>
|
||||
<label for="PopupCustomerEmail" class="label-required">EMAIL</label>
|
||||
<input type="email" name="customer[email]" id="PopupEmail" class=""
|
||||
placeholder="Enter Please Your Email Address" value="" spellcheck="false"
|
||||
autocomplete="off" autocapitalize="off" required="required">
|
||||
</div>
|
||||
<div>
|
||||
<label for="PopupCustomerPassword" class="label-required">PASSWORD</label>
|
||||
<input type="password" name="customer[password]" id="PopupCreatePassword" class=""
|
||||
placeholder="••••••" required="required">
|
||||
</div>
|
||||
<input type="submit" class="btn btn--full btn--secondary mb-20" value="Sign up now!">
|
||||
<div class="mb-15">
|
||||
<span class="popup-account__return-to-store btn-link"
|
||||
data-js-popup-close>RETURN TO STORE</span>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,85 @@
|
||||
<div class="popup__body position-relative d-none justify-content-end" data-js-popup-name="cart" data-popup-right data-js-popup-ajax id="cart-sidebar">
|
||||
<div class="popup-cart py-25 px-20 js-popup-cart-ajax" data-popup-content>
|
||||
<div class="popup-cart__head d-flex align-items-center">
|
||||
<h5 class="m-0">
|
||||
{{ __('MY BAG') }}
|
||||
<span data-js-popup-cart-count>(@{{ cart_count }})</span>
|
||||
</h5>
|
||||
<i class="popup-cart__close ml-auto cursor-pointer" data-js-popup-close>
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-164" viewBox="0 0 24 24">
|
||||
<path d="M19.583 4.965a.65.65 0 0 1-.176.449l-6.445 6.426 6.445 6.426c.117.131.176.28.176.449a.65.65 0 0 1-.176.449.846.846 0 0 1-.215.127.596.596 0 0 1-.468 0 .846.846 0 0 1-.215-.127l-6.426-6.445-6.426 6.445a.846.846 0 0 1-.215.127.596.596 0 0 1-.468 0 .846.846 0 0 1-.215-.127.65.65 0 0 1-.176-.449c0-.169.059-.318.176-.449l6.445-6.426-6.445-6.426a.65.65 0 0 1-.176-.449c0-.169.059-.318.176-.449a.652.652 0 0 1 .449-.176c.169 0 .319.059.449.176l6.426 6.445 6.426-6.445a.652.652 0 0 1 .449-.176c.169 0 .319.059.449.176.117.13.176.28.176.449z"/>
|
||||
</svg>
|
||||
</i>
|
||||
</div>
|
||||
<div class="popup-cart__content">
|
||||
<div class="popup-cart__items mt-15 border-bottom">
|
||||
<div v-for="product in cartProducts">
|
||||
<div class="product-cart d-flex flex-row align-items-start mb-20" data-js-product=""
|
||||
:data-product-variant-id="product.id">
|
||||
<div class="product-cart__image mr-15">
|
||||
<a :href="routeFor(product.slug)" class="d-block">
|
||||
<img src="data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs="
|
||||
:srcset="imageFor(product.image)"
|
||||
:alt="product.name"
|
||||
>
|
||||
</a>
|
||||
</div>
|
||||
<div class="product-cart__content d-flex flex-column align-items-start">
|
||||
<div class="product-cart__title mb-3">
|
||||
<h3 class="h6 m-0">
|
||||
<a :href="routeFor(product.slug)">
|
||||
@{{ product.name }}
|
||||
</a>
|
||||
</h3>
|
||||
</div>
|
||||
<div class="product-cart__variant">@{{ product.brand?.name }}</div>
|
||||
<div class="product-cart__price mt-10 mb-10">
|
||||
<span class="product-cart__quantity">@{{ product.quantity }}</span>
|
||||
<span>x</span>
|
||||
<span class="price">
|
||||
<span>
|
||||
<span class="money">@{{ product.price_amount }} TMT</span>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<a href="#" class="btn-link" @click="removeCartItem(product.id)">{{ __('Remove') }}</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Subtotal --}}
|
||||
{{-- <div class="popup-cart__subtotal h5 d-flex align-items-center mt-15 mb-0">
|
||||
<p class="m-0">SUBTOTAL: $821</p>
|
||||
<span class="ml-auto">
|
||||
<span class="price" data-js-popup-cart-subtotal></span>
|
||||
</span>
|
||||
</div> --}}
|
||||
|
||||
{{-- Free shipping --}}
|
||||
{{-- <div class="popup-cart__free-shipping my-20">
|
||||
<div class="free-shipping position-relative px-6 py-3 text-lg-left js-free-shipping"
|
||||
data-value="20000">
|
||||
<div class="free-shipping__progress position-absolute top-0 left-0 h-100" data-js-progress
|
||||
style="width: 100.0%;"></div>
|
||||
<div class="free-shipping__text position-relative">
|
||||
<i class="mr-3">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation"
|
||||
class="icon icon-theme-127" viewBox="0 0 24 24">
|
||||
<path d="M21.648 12.672c.104.052.188.13.254.234a.62.62 0 0 1 .098.332v5a.602.602 0 0 1-.186.439.601.601 0 0 1-.439.186h-2.559a3.043 3.043 0 0 1-1.074 1.787 3.03 3.03 0 0 1-1.992.713c-.756 0-1.42-.238-1.992-.713a3.028 3.028 0 0 1-1.074-1.787h-1.309a.597.597 0 0 1-.439-.186.6.6 0 0 1-.186-.439V4.488H2.625a.597.597 0 0 1-.439-.186A.597.597 0 0 1 2 3.863a.6.6 0 0 1 .186-.439.597.597 0 0 1 .439-.186h8.75a.6.6 0 0 1 .439.186c.123.124.186.27.186.439v2.5h5a.614.614 0 0 1 .586.41l1.797 4.766 2.265 1.133zM9.314 9.674c.123.124.186.27.186.439a.602.602 0 0 1-.186.439.601.601 0 0 1-.439.186h-3.75a.597.597 0 0 1-.439-.186.597.597 0 0 1-.186-.439.6.6 0 0 1 .186-.439.598.598 0 0 1 .439-.186h3.75a.6.6 0 0 1 .439.186zm0 3.125c.123.124.186.27.186.439a.602.602 0 0 1-.186.439.601.601 0 0 1-.439.186h-2.5a.597.597 0 0 1-.439-.186.6.6 0 0 1-.186-.439.6.6 0 0 1 .186-.439.598.598 0 0 1 .439-.186h2.5a.6.6 0 0 1 .439.186zm11.436 4.814v-3.984l-2.148-1.074a.635.635 0 0 1-.195-.146.557.557 0 0 1-.117-.205l-1.719-4.59H12v10h.684a3.033 3.033 0 0 1 1.074-1.787 3.026 3.026 0 0 1 1.992-.713 3.03 3.03 0 0 1 1.992.713 3.041 3.041 0 0 1 1.074 1.787h1.934zm-3.936-6.064c.123.124.186.27.186.439a.602.602 0 0 1-.186.439.601.601 0 0 1-.439.186h-2.5a.597.597 0 0 1-.439-.186.6.6 0 0 1-.186-.439v-2.5a.6.6 0 0 1 .186-.439.598.598 0 0 1 .439-.186.6.6 0 0 1 .439.186c.123.124.186.27.186.439v1.875h1.875a.6.6 0 0 1 .439.186zm.264 8.017a1.81 1.81 0 0 0 .547-1.328 1.81 1.81 0 0 0-.547-1.328 1.812 1.812 0 0 0-1.328-.547 1.81 1.81 0 0 0-1.328.547 1.808 1.808 0 0 0-.547 1.328c0 .521.182.964.547 1.328.364.365.807.547 1.328.547s.963-.182 1.328-.547z"/>
|
||||
</svg>
|
||||
</i> <span data-js-text>Free Shipping</span>
|
||||
</div>
|
||||
</div>
|
||||
</div> --}}
|
||||
|
||||
<div class="popup-cart__buttons mt-15">
|
||||
@auth
|
||||
<a href="{{ route('web.pages.cart') }}" class="btn btn--full btn--secondary text-uppercase">{{ __('PROCEED TO CHECKOUT') }}</a>
|
||||
@endauth
|
||||
{{-- <a href="{{ route('web.pages.cart') }}" class="btn btn--full mt-20 text-uppercase">{{ __('VIEW SHOPPING BAG') }}</a> --}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="popup-cart__empty mt-20 d-none-important">{{ __('Your shopping bag is empty') }}.</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,104 @@
|
||||
<div class="popup__body position-relative d-none justify-content-end" data-js-popup-name="services" data-popup-right>
|
||||
<div class="popup-services py-25 px-20" data-popup-content>
|
||||
<div class="popup-services__head d-flex align-items-center mb-10">
|
||||
<h5 class="m-0 text-uppercase">{{ __('Here to help') }}</h5>
|
||||
<i class="account__close ml-auto cursor-pointer" data-js-popup-close>
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-164" viewBox="0 0 24 24">
|
||||
<path d="M19.583 4.965a.65.65 0 0 1-.176.449l-6.445 6.426 6.445 6.426c.117.131.176.28.176.449a.65.65 0 0 1-.176.449.846.846 0 0 1-.215.127.596.596 0 0 1-.468 0 .846.846 0 0 1-.215-.127l-6.426-6.445-6.426 6.445a.846.846 0 0 1-.215.127.596.596 0 0 1-.468 0 .846.846 0 0 1-.215-.127.65.65 0 0 1-.176-.449c0-.169.059-.318.176-.449l6.445-6.426-6.445-6.426a.65.65 0 0 1-.176-.449c0-.169.059-.318.176-.449a.652.652 0 0 1 .449-.176c.169 0 .319.059.449.176l6.426 6.445 6.426-6.445a.652.652 0 0 1 .449-.176c.169 0 .319.059.449.176.117.13.176.28.176.449z"/>
|
||||
</svg>
|
||||
</i></div>
|
||||
<div class="popup-services__content">
|
||||
|
||||
<div class="popup-services__content">
|
||||
<p>
|
||||
{{ __('Have a question? You may find an answer in our') }}: <a href="{{ route('web.faq') }}" class="btn-link">{{ __('FAQ') }}</a>.<br>
|
||||
</p>
|
||||
|
||||
<h6 class="mb-20">{{ __('Customer Services') }}</h6>
|
||||
<p class="d-flex align-items-start">
|
||||
<i class="mr-10">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-197" viewBox="0 0 24 24">
|
||||
<path d="M17.625 21.729c-2.148 0-4.174-.41-6.074-1.23a15.799 15.799 0 0 1-4.971-3.35c-1.413-1.413-2.529-3.069-3.35-4.971S2 8.253 2 6.104c0-.078.016-.156.049-.234a.864.864 0 0 1 .127-.215L5.301 2.53a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176l4.375 4.375c.117.13.176.28.176.449s-.059.319-.176.449l-2.695 2.676 5.371 5.371 2.676-2.695a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176l4.375 4.375c.117.13.176.28.176.449s-.059.319-.176.449l-3.125 3.125a.91.91 0 0 1-.215.127.596.596 0 0 1-.234.049zM5.75 3.858l-2.5 2.5c.039 1.927.433 3.74 1.182 5.439a14.528 14.528 0 0 0 3.037 4.463c1.275 1.276 2.764 2.288 4.463 3.037s3.512 1.143 5.439 1.182l2.5-2.5-3.496-3.496-2.676 2.695a.654.654 0 0 1-.449.176.65.65 0 0 1-.449-.176l-6.25-6.25c-.117-.13-.176-.28-.176-.449s.059-.319.176-.449l2.695-2.676L5.75 3.858z"/>
|
||||
</svg>
|
||||
</i>
|
||||
<span class="text-capitizalize">{{ __('Call us') }}</span>: +993 (12) 92-14-95
|
||||
</p>
|
||||
<p class="d-flex align-items-start"><i class="mr-10">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-234" viewBox="0 0 24 24">
|
||||
<path d="M16.053 3.083a10.212 10.212 0 0 1 3.174 2.148c.905.905 1.621 1.963 2.148 3.174s.791 2.507.791 3.887-.264 2.676-.791 3.887-1.244 2.269-2.148 3.174c-.905.905-1.963 1.621-3.174 2.148s-2.507.791-3.887.791-2.676-.264-3.887-.791-2.269-1.243-3.174-2.148c-.905-.905-1.621-1.963-2.148-3.174s-.791-2.506-.791-3.887c0-1.38.264-2.676.791-3.887S4.2 6.136 5.105 5.231c.906-.905 1.964-1.621 3.175-2.148s2.506-.791 3.887-.791c1.38 0 2.675.263 3.886.791zm-3.261 17.92a8.722 8.722 0 0 0 5.557-2.529 8.728 8.728 0 0 0 2.529-5.557h-2.461a.598.598 0 0 1-.439-.186.6.6 0 0 1-.186-.439.6.6 0 0 1 .186-.439.6.6 0 0 1 .439-.186h2.461a8.742 8.742 0 0 0-2.529-5.557 8.742 8.742 0 0 0-5.557-2.529v2.461a.598.598 0 0 1-.186.439.601.601 0 0 1-.439.186.598.598 0 0 1-.439-.186.6.6 0 0 1-.186-.439V3.581A8.728 8.728 0 0 0 5.985 6.11a8.722 8.722 0 0 0-2.529 5.557h2.461a.6.6 0 0 1 .439.186.601.601 0 0 1 .186.439.598.598 0 0 1-.186.439.601.601 0 0 1-.439.186H3.456a8.614 8.614 0 0 0 .781 3.047c.442.951 1.025 1.787 1.748 2.51s1.559 1.306 2.51 1.748c.95.443 1.966.703 3.047.781v-2.461a.6.6 0 0 1 .186-.439.6.6 0 0 1 .439-.186.6.6 0 0 1 .439.186.601.601 0 0 1 .186.439v2.461zm3.564-9.151a.601.601 0 0 1 .186.439.598.598 0 0 1-.186.439.601.601 0 0 1-.439.186h-3.75a.58.58 0 0 1-.283-.068.736.736 0 0 1-.225-.186l-3.75-5a.56.56 0 0 1-.117-.458.609.609 0 0 1 .254-.42.57.57 0 0 1 .459-.117.61.61 0 0 1 .419.254l3.555 4.746h3.438c.169 0 .315.062.439.185z"/>
|
||||
</svg>
|
||||
</i>
|
||||
{{ __('Mon-Fri') }}: 09:00-19:00 <br>{{ __('Sat') }}: 09:00-18:00<br>{{ __('Sun') }}: 09:00–16:00
|
||||
</p>
|
||||
<p class="d-flex align-items-start">
|
||||
<i class="mr-10">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-153" viewBox="0 0 24 24">
|
||||
<path d="M22.072 4.807c.013.026.02.049.02.068v.068c.013.026.02.046.02.059v13.75c0 .17-.062.316-.186.439a.601.601 0 0 1-.439.186H2.736a.598.598 0 0 1-.439-.186.598.598 0 0 1-.186-.439V5.002c0-.013.006-.032.02-.059v-.068c0-.019.006-.042.02-.068a.125.125 0 0 0 .029-.049.444.444 0 0 1 .029-.068.145.145 0 0 0 .02-.059c.013 0 .022-.003.029-.01a.04.04 0 0 0 .01-.029l.038-.039a.214.214 0 0 1 .059-.039l.039-.039c.013-.013.032-.02.059-.02a.125.125 0 0 1 .049-.029.184.184 0 0 1 .049-.01c.026-.013.049-.02.068-.02s.042-.006.068-.02H21.525c.026.014.049.02.068.02s.042.007.068.02c.013 0 .029.004.049.01.02.007.036.017.049.029.026 0 .045.007.059.02l.039.039a.286.286 0 0 1 .059.039l.039.039c0 .014.003.023.01.029.006.007.016.01.029.01 0 .014.006.033.02.059a.587.587 0 0 0 .039.068.102.102 0 0 1 .019.049zm-1.211 13.32V6.232l-8.379 6.152a.57.57 0 0 1-.176.088.659.659 0 0 1-.566-.088L3.361 6.232v11.895h17.5zM4.65 5.627l7.461 5.469 7.461-5.469H4.65z"/>
|
||||
</svg>
|
||||
</i>
|
||||
<a href="mailto:contact@post.shop.tm" class="btn-link">{{ __('Send us an email') }}.</a></p>
|
||||
</div>
|
||||
<hr>
|
||||
<div class="popup-services__head d-flex align-items-center mb-15">
|
||||
<h5 class="m-0">{{ __('Shipping') }}</h5>
|
||||
</div>
|
||||
<div class="popup-services__content">
|
||||
<p class="d-flex align-items-start">
|
||||
<i class="mr-10">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-116" viewBox="0 0 24 24">
|
||||
<path d="M21.93 6.088l.029.029c.007.007.01.017.01.029l.039.127a.47.47 0 0 1 .02.127v15a.6.6 0 0 1-.186.439.601.601 0 0 1-.439.186H2.652a.6.6 0 0 1-.439-.186.601.601 0 0 1-.186-.439v-15a.47.47 0 0 1 .02-.127l.039-.127c0-.013.003-.022.01-.029a.387.387 0 0 0 .029-.029.478.478 0 0 1 .049-.078.844.844 0 0 1 .049-.059l.02-.02 4.375-3.75a.776.776 0 0 1 .195-.117.575.575 0 0 1 .215-.039h10c.078 0 .149.013.215.039.065.026.13.065.195.117l4.375 3.75v.02a.19.19 0 0 1 .068.059.557.557 0 0 1 .049.078zm-1.153 14.687V7.025h-5.625v5.625a.598.598 0 0 1-.186.439.601.601 0 0 1-.439.186h-5a.6.6 0 0 1-.439-.186.6.6 0 0 1-.186-.439V7.025H3.277v13.75h17.5zM7.262 3.275l-2.93 2.5h4.805l1.25-2.5H7.262zm2.89 8.75h3.75v-5h-3.75v5zm1.641-8.75l-1.25 2.5h2.969l-1.25-2.5h-.469zm7.93 2.5l-2.93-2.5h-3.125l1.25 2.5h4.805z"/>
|
||||
</svg>
|
||||
</i>
|
||||
{{ __('Cheap shipping delivery all orders across any product category qualify.') }}
|
||||
</p>
|
||||
</div>
|
||||
<hr>
|
||||
<div class="popup-services__head d-flex align-items-center mb-15">
|
||||
<h5 class="m-0 text-uppercase">{{ __('Payments') }}</h5>
|
||||
</div>
|
||||
<div class="popup-services__content">
|
||||
<h6 class="mb-20">{{ __('Accepts the following payment methods') }}:</h6>
|
||||
<p class="d-flex align-items-start">
|
||||
<i class="mr-10">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-125" viewBox="0 0 24 24">
|
||||
<path d="M21.508 5.035c.364.365.547.808.547 1.328v11.25c0 .521-.183.964-.547 1.328a1.808 1.808 0 0 1-1.328.547H3.93c-.521 0-.964-.182-1.328-.547a1.805 1.805 0 0 1-.547-1.328V6.363c0-.521.182-.963.547-1.328a1.81 1.81 0 0 1 1.328-.547h16.25c.521 0 .964.183 1.328.547zm-18.017.889a.6.6 0 0 0-.186.439v1.25h17.5v-1.25a.6.6 0 0 0-.186-.439.598.598 0 0 0-.439-.186H3.93a.598.598 0 0 0-.439.186zm-.186 4.814h17.5V8.863h-17.5v1.875zm17.315 7.315a.6.6 0 0 0 .186-.439v-5.625h-17.5v5.625c0 .169.062.316.186.439a.6.6 0 0 0 .439.186h16.25a.605.605 0 0 0 .439-.186zM9.995 14.674a.601.601 0 0 1 .186.439.598.598 0 0 1-.186.439.601.601 0 0 1-.439.186H5.18a.598.598 0 0 1-.439-.186.6.6 0 0 1-.186-.439.6.6 0 0 1 .186-.439.6.6 0 0 1 .439-.186h4.375c.169 0 .316.062.44.186zm9.375 0a.601.601 0 0 1 .186.439.598.598 0 0 1-.186.439.601.601 0 0 1-.439.186h-1.25a.598.598 0 0 1-.439-.186.6.6 0 0 1-.186-.439.6.6 0 0 1 .186-.439.6.6 0 0 1 .439-.186h1.25c.168 0 .315.062.439.186z"/>
|
||||
</svg>
|
||||
</i>
|
||||
{{ __('Credit cards') }}
|
||||
</p>
|
||||
|
||||
<p class="d-flex align-items-start">
|
||||
<i class="mr-10">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-034" viewBox="0 0 24 24">
|
||||
<path d="M21.616 5.981a.609.609 0 0 1 .176.449v13.75c0 .183-.059.332-.176.449s-.267.176-.449.176H2.416a.607.607 0 0 1-.449-.176.609.609 0 0 1-.176-.449V6.43c0-.182.059-.332.176-.449a.609.609 0 0 1 .449-.176h.625v-1.25c0-.182.059-.332.176-.449a.609.609 0 0 1 .449-.176h16.25c.182 0 .332.059.449.176a.609.609 0 0 1 .176.449v1.25h.625c.182 0 .332.059.45.176zm-1.075 1.074h-17.5v12.5h17.5v-12.5zm-16.25-1.25h15V5.18h-15v.625zm14.825 5.176a.609.609 0 0 1 .176.449v3.75c0 .183-.059.332-.176.449s-.267.176-.449.176c-.534 0-.98.179-1.338.537-.358.358-.537.804-.537 1.338 0 .183-.059.332-.176.449s-.267.176-.449.176h-8.75c-.183 0-.332-.059-.449-.176s-.176-.267-.176-.449c0-.534-.179-.979-.537-1.338-.358-.358-.804-.537-1.338-.537-.183 0-.332-.059-.449-.176s-.176-.267-.176-.449v-3.75c0-.182.059-.332.176-.449s.267-.176.449-.176c.534 0 .979-.179 1.338-.537.357-.358.536-.803.536-1.338 0-.182.059-.332.176-.449s.267-.176.449-.176h8.75c.182 0 .332.059.449.176s.176.267.176.449c0 .534.179.98.537 1.338.358.358.804.537 1.338.537.182 0 .332.059.45.176zm-1.075 1.016a3.084 3.084 0 0 1-1.592-.85 3.084 3.084 0 0 1-.85-1.592H7.983a3.092 3.092 0 0 1-.85 1.592c-.437.437-.967.72-1.592.85v2.617a3.103 3.103 0 0 1 2.442 2.442H15.6a3.099 3.099 0 0 1 2.442-2.442v-2.617zm-4.482-.459a2.41 2.41 0 0 1 .732 1.768c0 .69-.244 1.279-.732 1.768s-1.078.732-1.768.732-1.279-.244-1.768-.732-.732-1.077-.732-1.768c0-.69.244-1.279.732-1.768s1.077-.732 1.768-.732c.69-.001 1.28.243 1.768.732zm-.889 2.646c.247-.247.371-.54.371-.879 0-.338-.124-.631-.371-.879a1.205 1.205 0 0 0-.879-.371c-.339 0-.632.124-.879.371a1.2 1.2 0 0 0-.371.879c0 .339.124.632.371.879.247.248.54.371.879.371.339 0 .632-.123.879-.371z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
{{ __('Cash') }}
|
||||
</p>
|
||||
|
||||
<p class="d-flex align-items-start">
|
||||
<i class="mr-10">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-124" viewBox="0 0 24 24">
|
||||
<path d="M21.897 2.174a.601.601 0 0 1 .186.439v3.75a.598.598 0 0 1-.186.439.601.601 0 0 1-.439.186.598.598 0 0 1-.439-.186.6.6 0 0 1-.186-.439V3.238h-17.5v3.125a.598.598 0 0 1-.186.439.596.596 0 0 1-.439.186.598.598 0 0 1-.439-.186.6.6 0 0 1-.186-.439v-3.75a.6.6 0 0 1 .186-.439.6.6 0 0 1 .439-.186h18.75a.6.6 0 0 1 .439.186zm-2.5 2.5a.601.601 0 0 1 .186.439v15c0 .521-.183.963-.547 1.328a1.812 1.812 0 0 1-1.328.547H6.458a1.81 1.81 0 0 1-1.328-.547 1.807 1.807 0 0 1-.547-1.328v-15a.6.6 0 0 1 .186-.439.6.6 0 0 1 .439-.186h13.75a.6.6 0 0 1 .439.186zM6.019 20.553a.6.6 0 0 0 .439.186h1.25v-15H5.833v14.375a.6.6 0 0 0 .186.439zM8.958 5.738v15h1.875v-15H8.958zm9.375 0h-6.25v15h5.625a.6.6 0 0 0 .439-.186.6.6 0 0 0 .186-.439V5.738zm-2.939 4.19a.6.6 0 0 1-.186-.439v-1.25a.6.6 0 0 1 .186-.439.6.6 0 0 1 .439-.186.6.6 0 0 1 .439.186.601.601 0 0 1 .186.439v1.25a.598.598 0 0 1-.186.439.601.601 0 0 1-.439.186.602.602 0 0 1-.439-.186zm0 8.75a.6.6 0 0 1-.186-.439v-3.75a.6.6 0 0 1 .186-.439.6.6 0 0 1 .439-.186.6.6 0 0 1 .439.186.601.601 0 0 1 .186.439v3.75a.598.598 0 0 1-.186.439.601.601 0 0 1-.439.186.602.602 0 0 1-.439-.186z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
{{ __('Terminal') }}
|
||||
</p>
|
||||
</div>
|
||||
{{-- <hr> --}}
|
||||
{{-- <div class="popup-services__head d-flex align-items-center mb-15">
|
||||
<h5 class="m-0">RETURN POLICY</h5>
|
||||
</div>
|
||||
<div class="popup-services__content">
|
||||
<p class="d-flex align-items-start">
|
||||
<i class="mr-10">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-009" viewBox="0 0 24 24">
|
||||
<path d="M2.453 8.299c-.026-.039-.048-.075-.068-.107a2.896 2.896 0 0 0-.068-.107.715.715 0 0 1 0-.469 2.48 2.48 0 0 0 .068-.107c.02-.033.042-.068.068-.107l5-5a.9.9 0 0 1 .215-.128c.078-.032.156-.049.234-.049s.156.017.234.049a.93.93 0 0 1 .215.127c.117.13.176.28.176.449a.652.652 0 0 1-.176.449L4.407 7.225h10.059a6.36 6.36 0 0 1 2.549.518 6.63 6.63 0 0 1 2.09 1.406c.593.592 1.062 1.289 1.406 2.09s.518 1.65.518 2.549-.173 1.748-.518 2.549a6.63 6.63 0 0 1-1.406 2.09 6.647 6.647 0 0 1-2.09 1.406 6.373 6.373 0 0 1-2.549.518H8.528a.6.6 0 0 1-.439-.186.601.601 0 0 1-.186-.439c0-.169.062-.316.186-.439a.595.595 0 0 1 .439-.187h5.938a5.12 5.12 0 0 0 2.061-.42 5.397 5.397 0 0 0 1.689-1.143 5.454 5.454 0 0 0 1.143-1.689 5.12 5.12 0 0 0 .42-2.061c0-.729-.14-1.416-.42-2.061a5.397 5.397 0 0 0-2.832-2.832 5.116 5.116 0 0 0-2.061-.42H4.407L8.352 12.4c.117.13.176.28.176.449a.652.652 0 0 1-.176.449.652.652 0 0 1-.449.176.652.652 0 0 1-.449-.176L2.453 8.299z"/>
|
||||
</svg>
|
||||
</i>You can return any item purchased on Shella within 20 days of the delivery date.
|
||||
</p>
|
||||
</div> --}}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,656 @@
|
||||
<div class="popup__body position-relative d-none show visible" data-js-popup-name="sidebar" data-popup-left="">
|
||||
<div class="popup-sidebar popup-sidebar--width-md py-30 px-20" data-popup-content="">
|
||||
<div class="popup-sidebar__head">
|
||||
<div class="popup-sidebar__close d-flex align-items-center cursor-pointer" data-js-popup-close="">
|
||||
<i class="mr-lg-5">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-164" viewBox="0 0 24 24">
|
||||
<path d="M19.583 4.965a.65.65 0 0 1-.176.449l-6.445 6.426 6.445 6.426c.117.131.176.28.176.449a.65.65 0 0 1-.176.449.846.846 0 0 1-.215.127.596.596 0 0 1-.468 0 .846.846 0 0 1-.215-.127l-6.426-6.445-6.426 6.445a.846.846 0 0 1-.215.127.596.596 0 0 1-.468 0 .846.846 0 0 1-.215-.127.65.65 0 0 1-.176-.449c0-.169.059-.318.176-.449l6.445-6.426-6.445-6.426a.65.65 0 0 1-.176-.449c0-.169.059-.318.176-.449a.652.652 0 0 1 .449-.176c.169 0 .319.059.449.176l6.426 6.445 6.426-6.445a.652.652 0 0 1 .449-.176c.169 0 .319.059.449.176.117.13.176.28.176.449z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
<span class="d-none d-lg-inline text-uppercase">{{ __('Close') }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="popup-sidebar__content pt-50" data-js-position-all="sidebar">
|
||||
<aside class="collection-sidebar js-position js-collection-sidebar" data-js-collection-sidebar="" data-js-position-name="sidebar" data-js-position-onload="">
|
||||
<nav class="collection-sidebar__navigation">
|
||||
<div class="layer-navigation d-none" data-js-collection-nav-section="current_filters" data-js-accordion="all">
|
||||
<div class="layer-navigation__head py-10 cursor-pointer open" data-js-accordion-button="">
|
||||
<h5 class="d-flex align-items-center mb-0 text-uppercase">
|
||||
{{ __('Current filters') }}
|
||||
<i class="layer-navigation__arrow">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-229" viewBox="0 0 24 24">
|
||||
<path d="M11.783 14.088l-3.75-3.75a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176l3.301 3.32 3.301-3.32a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-3.75 3.75a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .841.841 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</h5>
|
||||
</div>
|
||||
<div class="layer-navigation__accordion" data-js-accordion-content="">
|
||||
<div class="pt-2 pb-10">
|
||||
<div data-js-collection-replace="current-tags">
|
||||
<p class="mb-8">
|
||||
{{ __('There are no current tags') }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="border-bottom"></div>
|
||||
</div>
|
||||
|
||||
{{-- <div class="layer-navigation" data-js-collection-nav-section="collections" data-js-accordion="all">
|
||||
<div class="layer-navigation__head py-10 cursor-pointer open" data-js-accordion-button="">
|
||||
<h5 class="d-flex align-items-center mb-0">
|
||||
{{ __('Category') }}
|
||||
<i class="layer-navigation__arrow">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-229" viewBox="0 0 24 24">
|
||||
<path d="M11.783 14.088l-3.75-3.75a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176l3.301 3.32 3.301-3.32a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-3.75 3.75a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .841.841 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</h5>
|
||||
</div>
|
||||
<div class="layer-navigation__accordion" data-js-accordion-content="">
|
||||
<div class="pt-2 pb-10">
|
||||
<div class="collections-menu" data-js-collections-menu="">
|
||||
<div class="collections-menu__item" data-js-accordion="all" data-section-for-collection="womens">
|
||||
<div class="collections-menu__button d-flex align-items-center mb-15 mb-lg-9 cursor-pointer" data-js-accordion-button="">
|
||||
<label class="input-checkbox d-flex align-items-center mb-0 mr-0 cursor-pointer">
|
||||
<input type="radio" class="d-none" name="collection" value="womens" checked="checked" data-js-accordion-input="" data-wg-notranslate="manual">
|
||||
<span class="position-relative d-block mr-8 border">
|
||||
<i class="d-none">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span>Women's</span>
|
||||
</label>
|
||||
<i class="collections-menu__arrow">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-229" viewBox="0 0 24 24">
|
||||
<path d="M11.783 14.088l-3.75-3.75a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176l3.301 3.32 3.301-3.32a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-3.75 3.75a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .841.841 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
<span class="ml-auto">42</span>
|
||||
</div>
|
||||
<div class="collections-menu__list ml-25" data-js-accordion-content="">
|
||||
<div class="collections-menu__button d-flex align-items-center mb-15 mb-lg-9 cursor-pointer">
|
||||
<label class="input-checkbox d-flex align-items-center mb-0 mr-0 cursor-pointer">
|
||||
<input type="radio" class="d-none" name="collection" value="women-clothing" data-wg-notranslate="manual">
|
||||
<span class="position-relative d-block mr-8 border">
|
||||
<i class="d-none">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span>Clothing</span>
|
||||
</label>
|
||||
<span class="ml-auto">21</span>
|
||||
</div>
|
||||
<div class="collections-menu__button d-flex align-items-center mb-15 mb-lg-9 cursor-pointer">
|
||||
<label class="input-checkbox d-flex align-items-center mb-0 mr-0 cursor-pointer">
|
||||
<input type="radio" class="d-none" name="collection" value="women-shoes" data-wg-notranslate="manual">
|
||||
<span class="position-relative d-block mr-8 border">
|
||||
<i class="d-none">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span>Shoes</span>
|
||||
</label>
|
||||
<span class="ml-auto">15</span>
|
||||
</div>
|
||||
<div class="collections-menu__button d-flex align-items-center mb-15 mb-lg-9 cursor-pointer">
|
||||
<label class="input-checkbox d-flex align-items-center mb-0 mr-0 cursor-pointer">
|
||||
<input type="radio" class="d-none" name="collection" value="women-accessories" data-wg-notranslate="manual">
|
||||
<span class="position-relative d-block mr-8 border">
|
||||
<i class="d-none">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span>Accessories</span>
|
||||
</label>
|
||||
<span class="ml-auto">12</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="collections-menu__item" data-js-accordion="all" data-section-for-collection="mens">
|
||||
<div class="collections-menu__button d-flex align-items-center mb-15 mb-lg-9 cursor-pointer" data-js-accordion-button="">
|
||||
<label class="input-checkbox d-flex align-items-center mb-0 mr-0 cursor-pointer">
|
||||
<input type="radio" class="d-none" name="collection" value="mens" data-js-accordion-input="" data-wg-notranslate="manual">
|
||||
<span class="position-relative d-block mr-8 border">
|
||||
<i class="d-none">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span>Men's</span>
|
||||
</label>
|
||||
<i class="collections-menu__arrow">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-229" viewBox="0 0 24 24">
|
||||
<path d="M11.783 14.088l-3.75-3.75a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176l3.301 3.32 3.301-3.32a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-3.75 3.75a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .841.841 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
<span class="ml-auto">22</span>
|
||||
</div>
|
||||
<div class="collections-menu__list d-none ml-25" data-js-accordion-content="">
|
||||
<div class="collections-menu__button d-flex align-items-center mb-15 mb-lg-9 cursor-pointer">
|
||||
<label class="input-checkbox d-flex align-items-center mb-0 mr-0 cursor-pointer">
|
||||
<input type="radio" class="d-none" name="collection" value="men-clothing" data-wg-notranslate="manual">
|
||||
<span class="position-relative d-block mr-8 border">
|
||||
<i class="d-none">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span>Clothing</span>
|
||||
</label>
|
||||
<span class="ml-auto">15</span>
|
||||
</div>
|
||||
<div class="collections-menu__button d-flex align-items-center mb-15 mb-lg-9 cursor-pointer">
|
||||
<label class="input-checkbox d-flex align-items-center mb-0 mr-0 cursor-pointer">
|
||||
<input type="radio" class="d-none" name="collection" value="men-shoes" data-wg-notranslate="manual">
|
||||
<span class="position-relative d-block mr-8 border">
|
||||
<i class="d-none">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span>Shoes</span>
|
||||
</label>
|
||||
<span class="ml-auto">12</span>
|
||||
</div>
|
||||
<div class="collections-menu__button d-flex align-items-center mb-15 mb-lg-9 cursor-pointer">
|
||||
<label class="input-checkbox d-flex align-items-center mb-0 mr-0 cursor-pointer">
|
||||
<input type="radio" class="d-none" name="collection" value="men-accessories" data-wg-notranslate="manual">
|
||||
<span class="position-relative d-block mr-8 border">
|
||||
<i class="d-none">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span>Accessories</span>
|
||||
</label>
|
||||
<span class="ml-auto">15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="border-bottom"></div>
|
||||
</div> --}}
|
||||
|
||||
{{-- <div class="layer-navigation" data-js-collection-nav-section="filters" data-js-accordion="all">
|
||||
<div class="layer-navigation__head py-10 cursor-pointer open" data-js-accordion-button="">
|
||||
<h5 class="d-flex align-items-center mb-0">
|
||||
COLOR
|
||||
<i class="layer-navigation__arrow">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-229" viewBox="0 0 24 24">
|
||||
<path d="M11.783 14.088l-3.75-3.75a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176l3.301 3.32 3.301-3.32a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-3.75 3.75a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .841.841 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</h5>
|
||||
</div>
|
||||
<div class="layer-navigation__accordion" data-js-accordion-content="">
|
||||
<div class="pt-2 pb-10">
|
||||
<div data-js-collection-replace="filter-1" data-js-collection-replace-only-full="">
|
||||
<div class="collection-filters d-flex flex-wrap" data-js-collection-filters="" data-property="color">
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 mr-15 mr-lg-10 input-checkbox--unbordered cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_color" value="red">
|
||||
<span class="position-relative d-block rounded-circle standard-color-red lazyload" data-value="red" data-bg="none" data-was-processed="true" style="background-image: none;">
|
||||
<i class="d-none standard-color-arrow">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
</label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 mr-15 mr-lg-10 input-checkbox--unbordered cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_color" value="orange">
|
||||
<span class="position-relative d-block rounded-circle standard-color-orange lazyload" data-value="orange" data-bg="none" data-was-processed="true" style="background-image: none;">
|
||||
<i class="d-none standard-color-arrow">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
</label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 mr-15 mr-lg-10 input-checkbox--unbordered cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_color" value="yellow">
|
||||
<span class="position-relative d-block rounded-circle standard-color-yellow lazyload" data-value="yellow" data-bg="none" data-was-processed="true" style="background-image: none;">
|
||||
<i class="d-none standard-color-arrow">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
</label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 mr-15 mr-lg-10 input-checkbox--unbordered cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_color" value="green">
|
||||
<span class="position-relative d-block rounded-circle standard-color-green lazyload" data-value="green" data-bg="none" data-was-processed="true" style="background-image: none;">
|
||||
<i class="d-none standard-color-arrow">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
</label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 mr-15 mr-lg-10 input-checkbox--unbordered cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_color" value="black">
|
||||
<span class="position-relative d-block rounded-circle standard-color-black lazyload" data-value="black" data-bg="none" data-was-processed="true" style="background-image: none;">
|
||||
<i class="d-none standard-color-arrow">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
</label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 mr-15 mr-lg-10 input-checkbox--unbordered cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_color" value="silver">
|
||||
<span class="position-relative d-block rounded-circle standard-color-silver lazyload" data-value="silver" data-bg="none" data-was-processed="true" style="background-image: none;">
|
||||
<i class="d-none standard-color-arrow">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
</label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 mr-15 mr-lg-10 input-checkbox--unbordered cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_color" value="blue">
|
||||
<span class="position-relative d-block rounded-circle standard-color-blue lazyload" data-value="blue" data-bg="none" data-was-processed="true" style="background-image: none;">
|
||||
<i class="d-none standard-color-arrow">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
</label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 mr-15 mr-lg-10 input-checkbox--unbordered cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_color" value="grey">
|
||||
<span class="position-relative d-block rounded-circle standard-color-grey lazyload" data-value="grey" data-bg="none" data-was-processed="true" style="background-image: none;">
|
||||
<i class="d-none standard-color-arrow">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
</label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 mr-15 mr-lg-10 input-checkbox--unbordered cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_color" value="white">
|
||||
<span class="position-relative d-block rounded-circle standard-color-white lazyload" data-value="white" data-bg="none" data-was-processed="true" style="background-image: none;">
|
||||
<i class="d-none standard-color-arrow">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
</label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 mr-15 mr-lg-10 input-checkbox--unbordered cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_color" value="violet">
|
||||
<span class="position-relative d-block rounded-circle standard-color-violet lazyload" data-value="violet" data-bg="none" data-was-processed="true" style="background-image: none;">
|
||||
<i class="d-none standard-color-arrow">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
</label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 mr-15 mr-lg-10 input-checkbox--unbordered cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_color" value="pink">
|
||||
<span class="position-relative d-block rounded-circle standard-color-pink lazyload" data-value="pink" data-bg="none" data-was-processed="true" style="background-image: none;">
|
||||
<i class="d-none standard-color-arrow">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="border-bottom"></div>
|
||||
</div> --}}
|
||||
|
||||
{{-- <div class="layer-navigation" data-js-collection-nav-section="filters" data-js-accordion="all">
|
||||
<div class="layer-navigation__head py-10 cursor-pointer open" data-js-accordion-button="">
|
||||
<h5 class="d-flex align-items-center mb-0">
|
||||
SIZE
|
||||
<i class="layer-navigation__arrow">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-229" viewBox="0 0 24 24">
|
||||
<path d="M11.783 14.088l-3.75-3.75a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176l3.301 3.32 3.301-3.32a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-3.75 3.75a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .841.841 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</h5>
|
||||
</div>
|
||||
<div class="layer-navigation__accordion" data-js-accordion-content="">
|
||||
<div class="pt-2 pb-10">
|
||||
<div data-js-collection-replace="filter-2" data-js-collection-replace-only-full="">
|
||||
<div class="collection-filters row" data-js-collection-filters="">
|
||||
<div class="col-6 mb-10">
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="30">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none" data-was-processed="true" style="background-image: none;">
|
||||
<i class="d-none">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span>30</span>
|
||||
</label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="32">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none" data-was-processed="true" style="background-image: none;">
|
||||
<i class="d-none">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span>32</span>
|
||||
</label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="34">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none" data-was-processed="true" style="background-image: none;">
|
||||
<i class="d-none">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span>34</span>
|
||||
</label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="36">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none" data-was-processed="true" style="background-image: none;">
|
||||
<i class="d-none">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span>36</span>
|
||||
</label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="38">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none" data-was-processed="true" style="background-image: none;">
|
||||
<i class="d-none">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span>38</span>
|
||||
</label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="40">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none" data-was-processed="true" style="background-image: none;">
|
||||
<i class="d-none">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span>40</span>
|
||||
</label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="42">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none" data-was-processed="true" style="background-image: none;">
|
||||
<i class="d-none">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span>42</span>
|
||||
</label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="44">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none" data-was-processed="true" style="background-image: none;">
|
||||
<i class="d-none">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span>44</span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="col-6 mb-10">
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="xxs">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none" data-was-processed="true" style="background-image: none;">
|
||||
<i class="d-none">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span>XXS</span>
|
||||
</label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="xs">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none" data-was-processed="true" style="background-image: none;">
|
||||
<i class="d-none">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span>XS</span>
|
||||
</label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="s">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none" data-was-processed="true" style="background-image: none;">
|
||||
<i class="d-none">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span>S</span>
|
||||
</label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="m">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none" data-was-processed="true" style="background-image: none;">
|
||||
<i class="d-none">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span>M</span>
|
||||
</label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="l">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none" data-was-processed="true" style="background-image: none;">
|
||||
<i class="d-none">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span>L</span>
|
||||
</label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="xl">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none" data-was-processed="true" style="background-image: none;">
|
||||
<i class="d-none">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span>XL</span>
|
||||
</label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="xxl">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none" data-was-processed="true" style="background-image: none;">
|
||||
<i class="d-none">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span>XXL</span>
|
||||
</label>
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="filter_by_tag" value="xxxl">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none" data-was-processed="true" style="background-image: none;">
|
||||
<i class="d-none">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span>XXXL</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="border-bottom"></div>
|
||||
</div> --}}
|
||||
|
||||
{{-- <div class="layer-navigation" data-js-collection-nav-section="filter_by_price" data-js-accordion="all">
|
||||
<div class="layer-navigation__head py-10 cursor-pointer open" data-js-accordion-button="">
|
||||
<h5 class="d-flex align-items-center mb-0">
|
||||
PRICE
|
||||
<i class="layer-navigation__arrow">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-229" viewBox="0 0 24 24">
|
||||
<path d="M11.783 14.088l-3.75-3.75a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176l3.301 3.32 3.301-3.32a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-3.75 3.75a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .841.841 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</h5>
|
||||
</div>
|
||||
<div class="layer-navigation__accordion" data-js-accordion-content="">
|
||||
<div class="pt-2 pb-10">
|
||||
<div class="collection-filter-by-price">
|
||||
<input type="hidden" class="js-range-of-price" name="filter_by_price" data-min="0" data-max="900" data-step="10">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="border-bottom"></div>
|
||||
</div> --}}
|
||||
|
||||
<div class="layer-navigation" data-js-collection-nav-section="filters" data-js-accordion="all">
|
||||
<div class="layer-navigation__head py-10 cursor-pointer open" data-js-accordion-button="">
|
||||
<h5 class="d-flex align-items-center mb-0">
|
||||
{{ __('Brands') }}
|
||||
<i class="layer-navigation__arrow">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-229" viewBox="0 0 24 24">
|
||||
<path d="M11.783 14.088l-3.75-3.75a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176l3.301 3.32 3.301-3.32a.65.65 0 0 1 .449-.176c.169 0 .318.059.449.176.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-3.75 3.75a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .841.841 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</h5>
|
||||
</div>
|
||||
<div class="layer-navigation__accordion" data-js-accordion-content>
|
||||
<div class="pt-2 pb-10">
|
||||
<div data-js-collection-replace="filter-3" data-js-collection-replace-only-full>
|
||||
<div class="collection-filters row" data-js-collection-filters>
|
||||
<div class="col-12 mb-10">
|
||||
{{-- @foreach($brandRepository->filterBy($resource) as $filterBrand)
|
||||
<label class="input-checkbox d-flex align-items-center mb-15 mb-lg-10 cursor-pointer">
|
||||
<input type="checkbox" class="d-none" name="brands[]" value="{{ $brand->id }}">
|
||||
<span class="position-relative d-block mr-8 border lazyload" data-bg="none">
|
||||
<i class="d-none">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-146" viewBox="0 0 24 24">
|
||||
<path d="M9.703 15.489l-2.5-2.5a.652.652 0 0 1-.176-.449c0-.169.059-.319.176-.449.13-.117.28-.176.449-.176s.319.059.449.176l2.051 2.07 5.801-5.82c.13-.117.28-.176.449-.176s.319.059.449.176c.117.13.176.28.176.449a.652.652 0 0 1-.176.449l-6.25 6.25a.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .93.93 0 0 1-.215-.127z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span>{{ $brand->name }}</span>
|
||||
</label>
|
||||
@endforeach --}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="border-bottom"></div>
|
||||
<button class="btn text-white">{{ __('Filter') }}</button>
|
||||
</div>
|
||||
|
||||
{{-- <div class="layer-navigation" data-js-collection-nav-section="custom_html" data-js-accordion="all">
|
||||
<div class="layer-navigation__head py-10 cursor-pointer" data-js-accordion-button="">
|
||||
<h5 class="d-flex align-items-center mb-0">CUSTOM CMS BLOCK</h5>
|
||||
</div>
|
||||
<div class="layer-navigation__accordion" data-js-accordion-content="">
|
||||
<div class="pt-2 pb-10">
|
||||
<div class="rte">
|
||||
<div class="fs">
|
||||
<div class="d-flex align-items-start mb-15">
|
||||
<i class="mr-10">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-116" viewBox="0 0 24 24">
|
||||
<path d="M21.93 6.088l.029.029c.007.007.01.017.01.029l.039.127a.47.47 0 0 1 .02.127v15a.6.6 0 0 1-.186.439.601.601 0 0 1-.439.186H2.652a.6.6 0 0 1-.439-.186.601.601 0 0 1-.186-.439v-15a.47.47 0 0 1 .02-.127l.039-.127c0-.013.003-.022.01-.029a.387.387 0 0 0 .029-.029.478.478 0 0 1 .049-.078.844.844 0 0 1 .049-.059l.02-.02 4.375-3.75a.776.776 0 0 1 .195-.117.575.575 0 0 1 .215-.039h10c.078 0 .149.013.215.039.065.026.13.065.195.117l4.375 3.75v.02a.19.19 0 0 1 .068.059.557.557 0 0 1 .049.078zm-1.153 14.687V7.025h-5.625v5.625a.598.598 0 0 1-.186.439.601.601 0 0 1-.439.186h-5a.6.6 0 0 1-.439-.186.6.6 0 0 1-.186-.439V7.025H3.277v13.75h17.5zM7.262 3.275l-2.93 2.5h4.805l1.25-2.5H7.262zm2.89 8.75h3.75v-5h-3.75v5zm1.641-8.75l-1.25 2.5h2.969l-1.25-2.5h-.469zm7.93 2.5l-2.93-2.5h-3.125l1.25 2.5h4.805z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
<p class="mb-0">Free shipping all orders of $49 or more of eligible
|
||||
items across any product category qualify.
|
||||
</p>
|
||||
</div>
|
||||
<div class="d-flex align-items-start mb-15">
|
||||
<i class="mr-10">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-125" viewBox="0 0 24 24">
|
||||
<path d="M21.508 5.035c.364.365.547.808.547 1.328v11.25c0 .521-.183.964-.547 1.328a1.808 1.808 0 0 1-1.328.547H3.93c-.521 0-.964-.182-1.328-.547a1.805 1.805 0 0 1-.547-1.328V6.363c0-.521.182-.963.547-1.328a1.81 1.81 0 0 1 1.328-.547h16.25c.521 0 .964.183 1.328.547zm-18.017.889a.6.6 0 0 0-.186.439v1.25h17.5v-1.25a.6.6 0 0 0-.186-.439.598.598 0 0 0-.439-.186H3.93a.598.598 0 0 0-.439.186zm-.186 4.814h17.5V8.863h-17.5v1.875zm17.315 7.315a.6.6 0 0 0 .186-.439v-5.625h-17.5v5.625c0 .169.062.316.186.439a.6.6 0 0 0 .439.186h16.25a.605.605 0 0 0 .439-.186zM9.995 14.674a.601.601 0 0 1 .186.439.598.598 0 0 1-.186.439.601.601 0 0 1-.439.186H5.18a.598.598 0 0 1-.439-.186.6.6 0 0 1-.186-.439.6.6 0 0 1 .186-.439.6.6 0 0 1 .439-.186h4.375c.169 0 .316.062.44.186zm9.375 0a.601.601 0 0 1 .186.439.598.598 0 0 1-.186.439.601.601 0 0 1-.439.186h-1.25a.598.598 0 0 1-.439-.186.6.6 0 0 1-.186-.439.6.6 0 0 1 .186-.439.6.6 0 0 1 .439-.186h1.25c.168 0 .315.062.439.186z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
<p class="mb-0">Credit Card: Visa, MasterCard, Maestro, American
|
||||
Express. The total will be charged to your card when the order
|
||||
is shipped.
|
||||
</p>
|
||||
</div>
|
||||
<div class="d-flex align-items-start mb-15">
|
||||
<i class="mr-10">
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-009" viewBox="0 0 24 24">
|
||||
<path d="M2.453 8.299c-.026-.039-.048-.075-.068-.107a2.896 2.896 0 0 0-.068-.107.715.715 0 0 1 0-.469 2.48 2.48 0 0 0 .068-.107c.02-.033.042-.068.068-.107l5-5a.9.9 0 0 1 .215-.128c.078-.032.156-.049.234-.049s.156.017.234.049a.93.93 0 0 1 .215.127c.117.13.176.28.176.449a.652.652 0 0 1-.176.449L4.407 7.225h10.059a6.36 6.36 0 0 1 2.549.518 6.63 6.63 0 0 1 2.09 1.406c.593.592 1.062 1.289 1.406 2.09s.518 1.65.518 2.549-.173 1.748-.518 2.549a6.63 6.63 0 0 1-1.406 2.09 6.647 6.647 0 0 1-2.09 1.406 6.373 6.373 0 0 1-2.549.518H8.528a.6.6 0 0 1-.439-.186.601.601 0 0 1-.186-.439c0-.169.062-.316.186-.439a.595.595 0 0 1 .439-.187h5.938a5.12 5.12 0 0 0 2.061-.42 5.397 5.397 0 0 0 1.689-1.143 5.454 5.454 0 0 0 1.143-1.689 5.12 5.12 0 0 0 .42-2.061c0-.729-.14-1.416-.42-2.061a5.397 5.397 0 0 0-2.832-2.832 5.116 5.116 0 0 0-2.061-.42H4.407L8.352 12.4c.117.13.176.28.176.449a.652.652 0 0 1-.176.449.652.652 0 0 1-.449.176.652.652 0 0 1-.449-.176L2.453 8.299z"></path>
|
||||
</svg>
|
||||
</i>
|
||||
<p class="mb-0">Returns and Refunds: You can return any item
|
||||
purchased on Shella within 20 days of the delivery date.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> --}}
|
||||
|
||||
{{-- <div class="layer-navigation" data-js-collection-nav-section="promobox" data-js-accordion="all">
|
||||
<div class="pt-20"></div>
|
||||
<div class="layer-navigation__accordion" data-js-accordion-content="">
|
||||
<div class="pt-2 pb-10">
|
||||
<div class="promobox promobox--type-02 position-relative d-flex flex-column align-items-center text-center">
|
||||
<div class="w-100">
|
||||
<a href="product.html" class="w-100">
|
||||
<div class="image-animation image-animation--from-default image-animation--to-center image-animation--to-opacity">
|
||||
<div class="rimage" style="padding-top:128.1481481%;"><img src="data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=" class="rimage__img rimage__img--fade-in lazyload" data-master="https://cdn.shopify.com/s/files/1/0026/2910/7764/files/08_dbfb557e-a691-4822-9ece-255c7fa4a984_{width}x.progressive.png.jpg?v=1530696155" data-aspect-ratio="0.7803468208092486" data-srcset="https://cdn.shopify.com/s/files/1/0026/2910/7764/files/08_dbfb557e-a691-4822-9ece-255c7fa4a984_400x.progressive.png.jpg?v=1530696155 1x, https://cdn.shopify.com/s/files/1/0026/2910/7764/files/08_dbfb557e-a691-4822-9ece-255c7fa4a984_400x@2x.progressive.png.jpg?v=1530696155 2x" data-scale-perspective="1.1" alt=""></div>
|
||||
</div>
|
||||
</a>
|
||||
<div class="promobox__plate position-absolute d-flex flex-column flex-center px-10 py-7 pointer-events-none">
|
||||
<p class="promobox__text-line-01 h5 position-relative m-0">NEW
|
||||
IN
|
||||
</p>
|
||||
<p class="promobox__text-line-02 position-relative m-0">
|
||||
Spring/Summer 2018 Collection
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> --}}
|
||||
|
||||
</nav>
|
||||
</aside>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,55 @@
|
||||
<div id="likes-sidebar" class="popup__body position-relative d-none justify-content-end" data-js-popup-name="wishlist" data-popup-right data-js-popup-ajax>
|
||||
<div class="popup-wishlist py-25 px-20" data-popup-content>
|
||||
<div class="popup-wishlist__head d-flex align-items-center">
|
||||
<h5 class="m-0 text-uppercase">{{ __('MY WISH LIST') }}
|
||||
<span id="sidebar-wishlist-count">( @{{ wishlist_count }} )</span>
|
||||
</h5>
|
||||
<i class="popup-wishlist__close ml-auto cursor-pointer" data-js-popup-close>
|
||||
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-164" viewBox="0 0 24 24">
|
||||
<path d="M19.583 4.965a.65.65 0 0 1-.176.449l-6.445 6.426 6.445 6.426c.117.131.176.28.176.449a.65.65 0 0 1-.176.449.846.846 0 0 1-.215.127.596.596 0 0 1-.468 0 .846.846 0 0 1-.215-.127l-6.426-6.445-6.426 6.445a.846.846 0 0 1-.215.127.596.596 0 0 1-.468 0 .846.846 0 0 1-.215-.127.65.65 0 0 1-.176-.449c0-.169.059-.318.176-.449l6.445-6.426-6.445-6.426a.65.65 0 0 1-.176-.449c0-.169.059-.318.176-.449a.652.652 0 0 1 .449-.176c.169 0 .319.059.449.176l6.426 6.445 6.426-6.445a.652.652 0 0 1 .449-.176c.169 0 .319.059.449.176.117.13.176.28.176.449z"/>
|
||||
</svg>
|
||||
</i>
|
||||
</div>
|
||||
<div class="popup-wishlist__content">
|
||||
<div class="popup-wishlist__items mt-15 border-bottom">
|
||||
@verbatim
|
||||
<div v-for="product in likedProducts">
|
||||
<div class="product-store-lists d-flex flex-row align-items-start mb-20" data-js-product=""
|
||||
:data-product-handle="product.slug"
|
||||
:data-product-variant-id="product.id"
|
||||
>
|
||||
<div class="product-store-lists__image mr-15">
|
||||
<a class="d-block"
|
||||
:href="routeFor(product.slug)"
|
||||
>
|
||||
<img src="data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs="
|
||||
:srcset="imageFor(product.image)"
|
||||
:alt="product.slug"
|
||||
>
|
||||
</a>
|
||||
</div>
|
||||
<div class="product-store-lists__content d-flex flex-column align-items-start">
|
||||
<div class="product-store-lists__title mb-3">
|
||||
<h3 class="h6 m-0">
|
||||
<a :href="routeFor(product.slug)">{{ product.name }}</a></h3></div>
|
||||
<div class="product-store-lists__variant">{{ product.brand?.name }}</div>
|
||||
<div class="product-store-lists__price mt-10 mb-10">
|
||||
<span class="price" data-js-product-price="" data-wg-notranslate="manual">
|
||||
<span>
|
||||
<span class="money">{{ product.price_amount }} TMT</span>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<!-- <span class="product-store-lists__remove btn-link">Aýyr</span> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endverbatim
|
||||
</div>
|
||||
<div class="{{-- popup-wishlist__buttons --}} mt-5">
|
||||
<a href="{{ route('web.pages.favorites') }}" class="btn btn--full text-white text-uppercase mt-20 {{-- js-popup-button --}}" {{-- data-js-popup-button="wishlist-full" --}}>{{ __('See All') }}</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="popup-wishlist__empty mt-15 d-none-important">Your wish list is empty.</div>
|
||||
</div>
|
||||
</div>
|
||||
Reference in New Issue
Block a user