mirror of https://github.com/4xmen/xshop.git
parent
e77d1dc21a
commit
cec05b9a4b
@ -0,0 +1,102 @@
|
||||
<nav id="AplMenu">
|
||||
<ul class="{{gfx()['container']}}">
|
||||
<li class="icon-menu" id="logo-menu">
|
||||
<a href="{{url('/')}}">
|
||||
<img src="{{asset('upload/images/logo.svg')}}" alt="">
|
||||
{{-- <i class="ri-apple-line "></i>--}}
|
||||
</a>
|
||||
</li>
|
||||
|
||||
@foreach(getMenuBySetting($data->area->name.'_'.$data->part.'_menu')->items as $item)
|
||||
<li>
|
||||
@if($item->meta == null)
|
||||
<a href="{{$item->dest->webUrl()}}">
|
||||
{{$item->title}}
|
||||
</a>
|
||||
@switch($item->menuable_type)
|
||||
@case(\App\Models\Group::class)
|
||||
@case(\App\Models\Category::class)
|
||||
<div class="sub-menu">
|
||||
<div class="{{gfx()['container']}}">
|
||||
<div>
|
||||
<h4>
|
||||
{{$item->dest->name}}
|
||||
</h4>
|
||||
<ul>
|
||||
@if($item->dest->children()->count() == 0)
|
||||
@foreach($item->dest->published(5,'view') as $itm)
|
||||
<li>
|
||||
<a href="{{$itm->webUrl()}}">
|
||||
{{\Illuminate\Support\Str::limit($itm->title,25)}}
|
||||
</a>
|
||||
</li>
|
||||
@endforeach
|
||||
@else
|
||||
@foreach($item->dest->children as $itm)
|
||||
<li>
|
||||
<a href="{{$itm->webUrl()}}">
|
||||
{{$itm->name}}
|
||||
</a>
|
||||
</li>
|
||||
@endforeach
|
||||
@endif
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<h4>
|
||||
{{__("Latest ")}} {{$item->dest->name}}
|
||||
</h4>
|
||||
<ul>
|
||||
@foreach($item->dest->published(5) as $itm)
|
||||
|
||||
<li>
|
||||
<a href="{{$itm->webUrl()}}">
|
||||
{{\Illuminate\Support\Str::limit($itm->title,25)}}
|
||||
</a>
|
||||
</li>
|
||||
@endforeach
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<h4>
|
||||
{{$item->dest->subtitle}}
|
||||
</h4>
|
||||
<p>
|
||||
{{$item->dest->description}}
|
||||
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@break
|
||||
@default
|
||||
|
||||
@endswitch
|
||||
@else
|
||||
<a href="{{$item->meta}}">
|
||||
{{$item->title}}
|
||||
</a>
|
||||
@endif
|
||||
|
||||
</li>
|
||||
@endforeach
|
||||
|
||||
<li class="icon-menu">
|
||||
<a href="#">
|
||||
<i class="ri-search-line"></i>
|
||||
</a>
|
||||
</li>
|
||||
<li class="icon-menu">
|
||||
<a href="#">
|
||||
<i class="ri-shopping-bag-2-line"></i>
|
||||
</a>
|
||||
</li>
|
||||
<li id="toggler-menu" class="icon-menu">
|
||||
<a href="#">
|
||||
<i class="ri-menu-line"></i>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div id="reps-menu">
|
||||
</div>
|
||||
</nav>
|
||||
@ -0,0 +1,14 @@
|
||||
const toggleSideMenu = function (e) {
|
||||
e.preventDefault();
|
||||
let txt = '<ul>';
|
||||
document.querySelectorAll('#AplMenu > ul > li').forEach(function (el) {
|
||||
if(!el.classList.contains('icon-menu')){
|
||||
txt += el.outerHTML;
|
||||
}
|
||||
});
|
||||
txt += '</ul>';
|
||||
document.querySelector('#reps-menu').innerHTML = txt;
|
||||
};
|
||||
document.addEventListener('DOMContentLoaded',function () {
|
||||
document.querySelector('#toggler-menu').addEventListener('click',toggleSideMenu);
|
||||
});
|
||||
@ -0,0 +1,10 @@
|
||||
{
|
||||
"name": "AplMenu",
|
||||
"version": "1.0",
|
||||
"author": "xStack",
|
||||
"email": "xshop@xstack.ir",
|
||||
"license": "GPL-3.0-or-later",
|
||||
"url": "https:\/\/xstack.ir",
|
||||
"author_url": "https:\/\/4xmen.ir",
|
||||
"packages": []
|
||||
}
|
||||
@ -0,0 +1,31 @@
|
||||
<?php
|
||||
|
||||
namespace Resources\Views\Segments;
|
||||
|
||||
use App\Models\Menu;
|
||||
use App\Models\Part;
|
||||
use App\Models\Setting;
|
||||
|
||||
class AplMenu
|
||||
{
|
||||
public static function onAdd(Part $part = null)
|
||||
{
|
||||
|
||||
$setting = new Setting();
|
||||
$setting->section = 'theme';
|
||||
$setting->key = $part->area->name . '_' . $part->part.'_menu';
|
||||
$setting->value = Menu::first()->id;
|
||||
$setting->type = 'MENU';
|
||||
$setting->size = 12;
|
||||
$setting->title = $part->area->name . ' ' . $part->part .' menu';
|
||||
$setting->save();
|
||||
}
|
||||
public static function onRemove(Part $part = null)
|
||||
{
|
||||
Setting::where('key',$part->area->name . '_' . $part->part.'_menu')->first()?->delete();
|
||||
}
|
||||
public static function onMount(Part $part = null)
|
||||
{
|
||||
return $part;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,149 @@
|
||||
#AplMenu {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
z-index: 99;
|
||||
background: #434344;
|
||||
transition: 200ms;
|
||||
|
||||
#logo-menu{
|
||||
a{
|
||||
padding-top: 7px;
|
||||
}
|
||||
img{
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#toggler-menu,#reps-menu{
|
||||
display: none;
|
||||
}
|
||||
|
||||
&:hover{
|
||||
background: #202124;
|
||||
}
|
||||
|
||||
> ul {
|
||||
list-style: none;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0;
|
||||
margin: 0 auto;
|
||||
|
||||
> li {
|
||||
color: white;
|
||||
text-align: center;
|
||||
height: 47px;
|
||||
|
||||
div.sub-menu{
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
width: 100vw;
|
||||
background: #202124;
|
||||
left: 0;
|
||||
max-height: 0;
|
||||
transition: 900ms;
|
||||
overflow: hidden;
|
||||
.container{
|
||||
display: grid;
|
||||
grid-auto-columns: minmax(0, 1fr);
|
||||
grid-auto-flow: column;
|
||||
grid-gap: 1rem;
|
||||
text-align: start;
|
||||
padding-bottom: 2rem;
|
||||
|
||||
ul{
|
||||
list-style: none;
|
||||
padding: 0 1rem 0 1rem;
|
||||
li{
|
||||
margin: .75rem 0;
|
||||
}
|
||||
a{
|
||||
display: inline-block;
|
||||
font-weight: 500;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
h4{
|
||||
padding-top: 2rem;
|
||||
margin: .2rem;
|
||||
font-size: 15px;
|
||||
|
||||
}
|
||||
h3{
|
||||
font-weight: 700;
|
||||
font-size: 20px;
|
||||
margin: 0;
|
||||
}
|
||||
p{
|
||||
padding: 1rem 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:hover{
|
||||
div.sub-menu{
|
||||
max-height: 100vh;
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
font-weight: 200;
|
||||
color: white;
|
||||
display: block;
|
||||
padding: .7rem 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/*-768px width*/
|
||||
@media (max-width: 768px) {
|
||||
#toggler-menu{
|
||||
display: block;
|
||||
|
||||
|
||||
}
|
||||
|
||||
#logo-menu{
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
> ul {
|
||||
> li{
|
||||
display: none;
|
||||
}
|
||||
.icon-menu{
|
||||
display: block;
|
||||
padding: 0 1rem;
|
||||
|
||||
}
|
||||
}
|
||||
#reps-menu{
|
||||
overflow-y: hidden;
|
||||
color: white;
|
||||
display: block;
|
||||
ul{
|
||||
li{
|
||||
list-style: none;
|
||||
padding: .5rem;
|
||||
.sub-menu{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
h3{
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
a{
|
||||
color: white;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 91 KiB |
Loading…
Reference in New Issue