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
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