mirror of https://github.com/4xmen/xshop.git
added Deeba menu part
fixed menu item lang bug url optimized menu item url function fixed some ui bug other theme part [responsive] update composer description added generatorpull/49/head
parent
ebd75dbc11
commit
b583f31627
@ -0,0 +1,39 @@
|
|||||||
|
<nav id='DeebaMenu'>
|
||||||
|
<div class="{{gfx()['container']}}">
|
||||||
|
<ul>
|
||||||
|
@php($items = getMenuBySetting($data->area->name.'_'.$data->part.'_menu')->items)
|
||||||
|
@php($menuShow = false)
|
||||||
|
@foreach($items as $i => $item)
|
||||||
|
{{-- find center --}}
|
||||||
|
@if(!$menuShow && ($i > (count($items) / 2) -1 ) )
|
||||||
|
@php($menuShow = true)
|
||||||
|
<li id="deeba-logo-main">
|
||||||
|
<a href="#">
|
||||||
|
<img src="{{asset('upload/images/logo.png')}}" alt="">
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
@endif
|
||||||
|
|
||||||
|
<li>
|
||||||
|
<a href="{{$item->webUrl()}}">
|
||||||
|
{{$item->title}}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
@endforeach
|
||||||
|
<li id="deeba-toggle">
|
||||||
|
<a >
|
||||||
|
<i class="ri-menu-line"></i>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<ul id="deeba-sided">
|
||||||
|
@foreach(getMenuBySetting($data->area->name.'_'.$data->part.'_menu')->items as $item)
|
||||||
|
<li>
|
||||||
|
<a href="{{$item->webUrl()}}">
|
||||||
|
{{$item->title}}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
@endforeach
|
||||||
|
</ul>
|
||||||
|
</nav>
|
@ -0,0 +1,14 @@
|
|||||||
|
const scrollBreakpoint = window.innerHeight * 0.7;
|
||||||
|
window.addEventListener('scroll',function () {
|
||||||
|
if (window.scrollY > scrollBreakpoint){
|
||||||
|
document.querySelector('#DeebaMenu').classList.add('active')
|
||||||
|
}else{
|
||||||
|
document.querySelector('#DeebaMenu').classList.remove('active')
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
window.addEventListener('load',function () {
|
||||||
|
document.querySelector('#deeba-toggle')?.addEventListener('click',function () {
|
||||||
|
document.querySelector('#deeba-sided').classList.toggle('show');
|
||||||
|
});
|
||||||
|
});
|
@ -0,0 +1,10 @@
|
|||||||
|
{
|
||||||
|
"name": "DeebaMenu",
|
||||||
|
"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 DeebaMenu
|
||||||
|
{
|
||||||
|
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,124 @@
|
|||||||
|
#DeebaMenu {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
z-index: 999;
|
||||||
|
width: 100%;
|
||||||
|
transition: 500ms;
|
||||||
|
background: #11111100;
|
||||||
|
backdrop-filter: blur(0);
|
||||||
|
|
||||||
|
|
||||||
|
ul {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
list-style: none;
|
||||||
|
text-align: center;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
|
||||||
|
li {
|
||||||
|
transition: 500ms;
|
||||||
|
flex: 1;
|
||||||
|
|
||||||
|
a {
|
||||||
|
padding: 1rem;
|
||||||
|
display: block;
|
||||||
|
|
||||||
|
color:var(--xshop-primary);
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: var(--xshop-secondary);
|
||||||
|
color: var(--xshop-diff2);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
#deeba-logo-main {
|
||||||
|
flex-grow: 2;
|
||||||
|
transition: 500ms;
|
||||||
|
|
||||||
|
|
||||||
|
a {
|
||||||
|
background: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
img {
|
||||||
|
height: 100px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#deeba-toggle,.fixed-center{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.active{
|
||||||
|
|
||||||
|
ul{
|
||||||
|
height: 3.5rem;
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
background: #11111133;
|
||||||
|
position: fixed;
|
||||||
|
backdrop-filter: blur(7px);
|
||||||
|
#deeba-logo-main img{
|
||||||
|
height: 1em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#deeba-sided{
|
||||||
|
opacity: .9;
|
||||||
|
padding: 0;
|
||||||
|
position: fixed;
|
||||||
|
inset-inline-end: -300px;
|
||||||
|
top: 3.5rem;
|
||||||
|
bottom: 0;
|
||||||
|
overflow-y: auto;
|
||||||
|
height: calc(100vh - 3.5rem);
|
||||||
|
width: 270px;
|
||||||
|
z-index: 999;
|
||||||
|
background: var(--xshop-secondary);
|
||||||
|
display: block;
|
||||||
|
|
||||||
|
li{
|
||||||
|
display: block;
|
||||||
|
a{
|
||||||
|
color: var(--xshop-diff2);
|
||||||
|
transition: 300ms;
|
||||||
|
&:hover{
|
||||||
|
background: var(--xshop-primary);
|
||||||
|
color: var(--xshop-diff);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/*-1024px width*/
|
||||||
|
@media (max-width: 1024px) {
|
||||||
|
#DeebaMenu{
|
||||||
|
li{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#deeba-toggle,.fixed-center{
|
||||||
|
display: block;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
//.fixed-center{
|
||||||
|
// visibility: hidden;
|
||||||
|
//}
|
||||||
|
#deeba-logo-main{
|
||||||
|
display: block;
|
||||||
|
flex-grow: 8;
|
||||||
|
}
|
||||||
|
.show{
|
||||||
|
inset-inline-end: 0 !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
Binary file not shown.
After Width: | Height: | Size: 297 KiB |
Loading…
Reference in New Issue