mirror of https://github.com/4xmen/xshop.git
xshop fix ui
parent
3b9d0670f8
commit
1e67096dbc
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
Binary file not shown.
|
Before Width: | Height: | Size: 60 KiB After Width: | Height: | Size: 64 KiB |
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 17 KiB |
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -0,0 +1,131 @@
|
||||
|
||||
:root {
|
||||
--bg: hsl(223deg, 10%, 90%);
|
||||
--trans-dur: 0.3s;
|
||||
}
|
||||
|
||||
|
||||
.tvdd {
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
width: 16em;
|
||||
height: 16em;
|
||||
}
|
||||
.tvdd__ring {
|
||||
top: 0;
|
||||
left: 18.75%;
|
||||
width: 62.5%;
|
||||
height: 62.5%;
|
||||
transform-origin: 50% 80%;
|
||||
}
|
||||
.tvdd__ring, .tvdd__ring-dot {
|
||||
position: absolute;
|
||||
}
|
||||
.tvdd__ring-dots {
|
||||
animation: pivot 1s linear infinite;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.tvdd__ring-dot {
|
||||
animation: pulse 1s ease-in-out infinite;
|
||||
background-color: hsl(193deg, 90%, 55%);
|
||||
border-radius: 50%;
|
||||
margin: -5% 0 0 -5%;
|
||||
width: 10%;
|
||||
height: 10%;
|
||||
}
|
||||
.tvdd__ring-dot:nth-child(1) {
|
||||
top: 38.3531429704%;
|
||||
left: 6.533337817%;
|
||||
}
|
||||
.tvdd__ring-dot:nth-child(2) {
|
||||
animation-delay: -0.0833333333s;
|
||||
top: 61.6468570296%;
|
||||
left: 6.533337817%;
|
||||
}
|
||||
.tvdd__ring-dot:nth-child(3) {
|
||||
animation-delay: -0.1666666667s;
|
||||
top: 81.8198051534%;
|
||||
left: 18.1801948466%;
|
||||
}
|
||||
.tvdd__ring-dot:nth-child(4) {
|
||||
animation-delay: -0.25s;
|
||||
top: 93.466662183%;
|
||||
left: 38.3531429704%;
|
||||
}
|
||||
.tvdd__ring-dot:nth-child(5) {
|
||||
animation-delay: -0.3333333333s;
|
||||
top: 93.466662183%;
|
||||
left: 61.6468570296%;
|
||||
}
|
||||
.tvdd__ring-dot:nth-child(6) {
|
||||
animation-delay: -0.4166666667s;
|
||||
top: 81.8198051534%;
|
||||
left: 81.8198051534%;
|
||||
}
|
||||
.tvdd__ring-dot:nth-child(7) {
|
||||
animation-delay: -0.5s;
|
||||
top: 61.6468570296%;
|
||||
left: 93.466662183%;
|
||||
}
|
||||
.tvdd__ring-dot:nth-child(8) {
|
||||
animation-delay: -0.5833333333s;
|
||||
top: 38.3531429704%;
|
||||
left: 93.466662183%;
|
||||
}
|
||||
.tvdd__ring-dot:nth-child(9) {
|
||||
animation-delay: -0.6666666667s;
|
||||
top: 18.1801948466%;
|
||||
left: 81.8198051534%;
|
||||
}
|
||||
.tvdd__ring-dot:nth-child(10) {
|
||||
animation-delay: -0.75s;
|
||||
top: 6.533337817%;
|
||||
left: 61.6468570296%;
|
||||
}
|
||||
.tvdd__ring-dot:nth-child(11) {
|
||||
animation-delay: -0.8333333333s;
|
||||
top: 6.533337817%;
|
||||
left: 38.3531429704%;
|
||||
}
|
||||
.tvdd__ring-dot:nth-child(12) {
|
||||
animation-delay: -0.9166666667s;
|
||||
top: 18.1801948466%;
|
||||
left: 18.1801948466%;
|
||||
}
|
||||
.tvdd__ring:nth-child(2) {
|
||||
transform: rotate(120deg);
|
||||
}
|
||||
.tvdd__ring:nth-child(2) .tvdd__ring-dot {
|
||||
background-color: hsl(223deg, 90%, 55%);
|
||||
}
|
||||
.tvdd__ring:nth-child(3) {
|
||||
transform: rotate(240deg);
|
||||
}
|
||||
.tvdd__ring:nth-child(3) .tvdd__ring-dot {
|
||||
background-color: hsl(253deg, 90%, 55%);
|
||||
}
|
||||
|
||||
/* Dark theme */
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--bg: hsl(223deg, 10%, 10%);
|
||||
}
|
||||
}
|
||||
/* Animations */
|
||||
@keyframes pivot {
|
||||
from {
|
||||
transform: rotate(0);
|
||||
}
|
||||
to {
|
||||
transform: rotate(30deg);
|
||||
}
|
||||
}
|
||||
@keyframes pulse {
|
||||
from, to {
|
||||
transform: scale(0.1);
|
||||
}
|
||||
50% {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
@ -1,152 +1,163 @@
|
||||
@extends('website.layout')
|
||||
@section('body-class') pt-0 @endsection
|
||||
@section('content')
|
||||
{{-- <section id="child">--}}
|
||||
{{-- <div id="particle"></div>--}}
|
||||
{{-- <div id="owl3" class="owl-carousel owl-theme">--}}
|
||||
{{-- @foreach($sliders as $x => $slider)--}}
|
||||
{{-- <div class="item @if(($x+1) % 2 == 0) owl-odd @endif">--}}
|
||||
{{-- <div class="text">--}}
|
||||
{{-- {!! $slider->body !!}--}}
|
||||
{{-- </div>--}}
|
||||
{{-- </div>--}}
|
||||
{{-- @endforeach--}}
|
||||
|
||||
{{-- </div>--}}
|
||||
{{-- </section>--}}
|
||||
<section id="index-top">
|
||||
<div class="container">
|
||||
<div class="grid">
|
||||
<div class="display-block position-relative">
|
||||
|
||||
<div class="fa fa-mobile-alt fa-bg"></div>
|
||||
<h2 class="mt-5 ms-3">
|
||||
{{\App\Helpers\getSetting('top1text')}}
|
||||
</h2>
|
||||
<div class="clearfix mt-5 mb-5"></div>
|
||||
<div id="owl2" class="owl-carousel owl-theme">
|
||||
@foreach($sliders as $slider)
|
||||
@foreach(\App\Helpers\getProductByCat(\App\Helpers\getSetting('top1cat'),'id','desc',10) as $p)
|
||||
<div class="item">
|
||||
@if(\App\Helpers\findLink($slider->body) != null)
|
||||
<a href="{{\App\Helpers\findLink($slider->body)}}">
|
||||
@endif
|
||||
<img src="{{$slider->imgurl()}}" alt="">
|
||||
@if(\App\Helpers\findLink($slider->body) != null)
|
||||
</a>
|
||||
@endif
|
||||
<div class="box">
|
||||
<a href="{{route('product',$p->slug)}}">
|
||||
<img src="{{$p->thumbUrl()}}" class="img-fluid" alt="{{$p->name}}" title="{{$p->name}}">
|
||||
<h4>
|
||||
{{$p->name}}
|
||||
</h4>
|
||||
</a>
|
||||
<span>
|
||||
{{$p->getPrice()}}
|
||||
</span>
|
||||
<a href="{{route('card.add',$p->slug)}}" class="add-to-card btn btn-primary btn-block mt-2 mb-2">
|
||||
<img src="{{asset('images/basket.svg')}}" class="basket-icon" alt="">
|
||||
افزودن به سبد خرید
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
<div class="position-relative xd">
|
||||
<a href="{{\App\Helpers\getSetting('top2text')}}">
|
||||
<img src="{{asset('images/mahi/sec1-1b.jpg')}}" alt="">
|
||||
</a>
|
||||
<div class="position-relative">
|
||||
@foreach(\App\Helpers\getProductByCat(\App\Helpers\getSetting('top2cat'),'id','desc',2) as $p)
|
||||
<article>
|
||||
<a href="{{route('product',$p->slug)}}">
|
||||
|
||||
<img src="{{$p->thumbUrl()}}" alt="{{$p->name}}" title="{{$p->name}}">
|
||||
<div>
|
||||
<div class="text-light">
|
||||
{{$p->getPrice()}}
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
<span class="badge bg-secondary discount">
|
||||
{{\App\Helpers\getSetting('top2text')}}
|
||||
</span>
|
||||
</article>
|
||||
@endforeach
|
||||
|
||||
</div>
|
||||
<div class="position-relative xd">
|
||||
<a href="{{\App\Helpers\getSetting('top3text')}}">
|
||||
<img src="{{asset('images/mahi/sec1-2b.jpg')}}" alt="">
|
||||
</a>
|
||||
<div class="position-relative">
|
||||
@foreach(\App\Helpers\getProductByCat(\App\Helpers\getSetting('top3cat'),'id','desc',2) as $p)
|
||||
<article>
|
||||
<a href="{{route('product',$p->slug)}}">
|
||||
|
||||
<img src="{{$p->thumbUrl()}}" alt="{{$p->name}}" title="{{$p->name}}">
|
||||
<div>
|
||||
<div class="text-light">
|
||||
{{$p->getPrice()}}
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
<span class="badge bg-secondary discount">
|
||||
{{\App\Helpers\getSetting('top3text')}}
|
||||
</span>
|
||||
</article>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section id="new-products" class="mt-5">
|
||||
<section id="new-products" class="mt-5 long-box">
|
||||
<div class="container pt-4 pb-4">
|
||||
<h1 class="mb-4">
|
||||
{{\App\Helpers\getSetting('sectext')}}
|
||||
<a href="{{route('products')}}" class="float-end btn btn-outline-primary">
|
||||
همه محصولات
|
||||
</a>
|
||||
</h1>
|
||||
<div class="owl-carousel owl-theme owl1">
|
||||
<div id="owl1" class="owl-carousel owl-theme">
|
||||
@foreach(\App\Helpers\getProductByCat(\App\Helpers\getSetting('seccat'),'id','desc',10) as $p)
|
||||
<div class="item">
|
||||
@include('website.component.pro',['p' => $p])
|
||||
<div class="item ">
|
||||
<div class="box">
|
||||
<a href="{{route('product',$p->slug)}}">
|
||||
<img src="{{$p->thumbUrl()}}" class="img-fluid" alt="{{$p->name}}" title="{{$p->name}}">
|
||||
</a>
|
||||
<a href="{{route('product',$p->slug)}}">
|
||||
<h4>
|
||||
{{$p->name}}
|
||||
</h4>
|
||||
<span>
|
||||
{{$p->getPrice()}}
|
||||
</span>
|
||||
</a>
|
||||
<div>
|
||||
<a href="{{route('card.add',$p->slug)}}" class="add-to-card btn btn-primary btn-block mt-2 mb-2 corner">
|
||||
<img src="{{asset('images/basket.svg')}}" class="basket-icon" alt="">
|
||||
افزودن به سبد خرید
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endforeach
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
{{-- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320" style="margin-top: -120px;margin-bottom: -100px;">--}}
|
||||
{{-- <path fill="#f442b3" fill-opacity="1"--}}
|
||||
{{-- d="M0,192L48,176C96,160,192,128,288,112C384,96,480,96,576,117.3C672,139,768,181,864,197.3C960,213,1056,203,1152,192C1248,181,1344,171,1392,165.3L1440,160L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path>--}}
|
||||
{{-- </svg>--}}
|
||||
<section style="">
|
||||
<div class="container">
|
||||
|
||||
<div class="owl-carousel owl-theme" id="owlx1">
|
||||
@foreach( \App\Helpers\getMainCats(6) as $cat )
|
||||
<div class="item">
|
||||
<a href="{{route('cat',$cat->slug)}}">
|
||||
<img src="{{$cat->imgurl()}}" alt="{{$cat->name}}">
|
||||
</a>
|
||||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
<a href="{{route('products')}}" class="float-end btn btn-outline-primary">
|
||||
همه محصولات
|
||||
</a>
|
||||
<br>
|
||||
<br>
|
||||
</div>
|
||||
</section>
|
||||
{{-- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320">--}}
|
||||
{{-- <path fill="#f442b3" fill-opacity="1"--}}
|
||||
{{-- d="M0,288L48,250.7C96,213,192,139,288,122.7C384,107,480,149,576,176C672,203,768,213,864,197.3C960,181,1056,139,1152,128C1248,117,1344,139,1392,149.3L1440,160L1440,0L1392,0C1344,0,1248,0,1152,0C1056,0,960,0,864,0C768,0,672,0,576,0C480,0,384,0,288,0C192,0,96,0,48,0L0,0Z"></path>--}}
|
||||
{{-- </svg>--}}
|
||||
|
||||
<section id="boy">
|
||||
<section id="filtering" class="pb-4 pt-4 bg long-box">
|
||||
<div class="container">
|
||||
<hr>
|
||||
<h1>
|
||||
پسرانه
|
||||
<a href="{{route('cat', \App\Helpers\getSettingCat('3cat')->slug )}}"
|
||||
class="float-end btn btn-outline-primary">
|
||||
مشاهده محصولات
|
||||
</a>
|
||||
{{\App\Helpers\getSetting('3text')}}
|
||||
</h1>
|
||||
<div class="owl-carousel owl-theme owl1">
|
||||
@foreach(\App\Helpers\getProductByCat(\App\Helpers\getSetting('seccat'),'id','desc',10) as $p)
|
||||
<div class="item">
|
||||
@include('website.component.pro',['p' => $p])
|
||||
</div>
|
||||
<div class="btn-group mt-3" role="group" aria-label="Basic example">
|
||||
<button type="button" class="btn btn-primary active" data-cat="all">همه</button>
|
||||
@foreach(\App\Helpers\getSubCats(\App\Helpers\getSetting('3cat')) as $cat)
|
||||
<button type="button" class="btn btn-primary" data-cat="cat{{$cat->id}}">
|
||||
{{$cat->name}}
|
||||
</button>
|
||||
@endforeach
|
||||
|
||||
</div>
|
||||
<div class="row">
|
||||
@foreach(\App\Helpers\getSubCats(\App\Helpers\getSetting('4cat')) as $cat)
|
||||
<div class="col">
|
||||
<a href="{{route('cat',$cat->slug)}}">
|
||||
<img src="{{$cat->thumbUrl()}}" class="img-fluid" title="{{$cat->name}}"
|
||||
alt="{{$cat->name}}">
|
||||
</a>
|
||||
<div id="da-thumbs" class="da-thumbs">
|
||||
@foreach(\App\Helpers\getProductByCat(\App\Helpers\getSetting('3cat'),'stock_quantity','desc',12) as $p)
|
||||
<div class="item custom @foreach($p->categories()->pluck('id')->toArray() as $c) cat{{$c}} @endforeach shad pad">
|
||||
<div class="box">
|
||||
<a href="{{route('product',$p->slug)}}">
|
||||
<img src="{{$p->thumbUrl()}}" class="img-fluid" alt="{{$p->name}}" title="{{$p->name}}" >
|
||||
<h4>
|
||||
{{$p->name}}
|
||||
</h4>
|
||||
</a>
|
||||
<span>
|
||||
|
||||
{{$p->getPrice()}}
|
||||
</span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
@endforeach
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section id="girl">
|
||||
<section id="brand" class="pt-4 pb-4">
|
||||
<div class="container">
|
||||
<hr>
|
||||
<h1>
|
||||
دخترانه
|
||||
<a href="{{route('cat', \App\Helpers\getSettingCat('seccat')->slug )}}"
|
||||
class="float-end btn btn-outline-primary">
|
||||
مشاهده محصولات
|
||||
</a>
|
||||
برندها
|
||||
</h1>
|
||||
<div class="row">
|
||||
<div class="owl-carousel owl-theme owl1">
|
||||
@foreach(\App\Helpers\getProductByCat(\App\Helpers\getSetting('4cat'),'id','desc',10) as $p)
|
||||
<div class="item">
|
||||
@include('website.component.pro',['p' => $p])
|
||||
</div>
|
||||
@endforeach
|
||||
|
||||
</div>
|
||||
@foreach(\App\Helpers\getSubCats(\App\Helpers\getSetting('4cat')) as $cat)
|
||||
<div class="col">
|
||||
<div class="col-md-2 col-sm-3 col-4">
|
||||
<a href="{{route('cat',$cat->slug)}}">
|
||||
<img class="img-fluid" src="{{$cat->thumbUrl()}}" title="{{$cat->name}}"
|
||||
alt="{{$cat->name}}">
|
||||
<img src="{{$cat->thumbUrl()}}" title="{{$cat->name}}" alt="{{$cat->name}}">
|
||||
</a>
|
||||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
@endsection
|
||||
|
||||
@ -1,22 +1,22 @@
|
||||
|
||||
|
||||
<div class="pt-2 text-muted" id="toggle-side">
|
||||
<h5 class="text-center py-3">
|
||||
تنظیم صافی و ترتیب نمایش
|
||||
</h5>
|
||||
</div>
|
||||
<div class="side-box">
|
||||
<h2>
|
||||
دسته بندی
|
||||
</h2>
|
||||
<ul class="list-group">
|
||||
<li class="list-group-item">
|
||||
<a href="">دسته اصلی</a>
|
||||
<div class="mt-2"></div>
|
||||
<ul class="list-group">
|
||||
{!! App\Helpers\showCats([],'list-group-item','list-group') !!}
|
||||
</ul>
|
||||
</li>
|
||||
<div class="pt-2 bg-primary text-light" id="toggle-side">
|
||||
<h2 class="text-center">
|
||||
تنظیم صافی و ترتیب نمایش
|
||||
</h2>
|
||||
</div>
|
||||
<div class="side-box">
|
||||
<h2>
|
||||
دسته بندی
|
||||
</h2>
|
||||
<ul class="list-group">
|
||||
<li class="list-group-item">
|
||||
<a href="">دسته اصلی</a>
|
||||
<div class="mt-2"></div>
|
||||
<ul class="list-group">
|
||||
{!! App\Helpers\showCats([],'list-group-item','list-group') !!}
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
Loading…
Reference in New Issue