added theme part sarv menu

master
A1Gard 2 days ago
parent 24bb2f8e56
commit 50e5d053fb

@ -0,0 +1,167 @@
<section class="SarvMenu live-setting" data-live="{{$data->area_name.'_'.$data->part}}">
<div class="{{gfx()['container']}}">
<div class="sarv-row">
<div>
<img src="{{asset('upload/images/logo.svg')}}" alt="{{config('app.name')}}">
</div>
<div>
<form action="{{route('client.search')}}">
<div class="form-control omg-search">
<i class="ri-search-2-line"></i>
<input type="text" name="q" class="live-search" placeholder="{{__("Search")}}...">
</div>
</form>
<nav class="no-view">
<ul>
@foreach(getMenuBySettingItems($data->area_name.'_'.$data->part.'_menu') as $item)
<li>
@if($item->meta == null)
<a href="{{$item->webUrl()}}">
{{$item->title}}
</a>
@switch($item->menuable_type)
@case(\App\Models\Group::class)
@case(\App\Models\Category::class)
<div class="sub-menu main-dir">
<h6 class="p-3">
<a href="{{$item->webUrl()}}">
{{$item->title}}
</a>
</h6>
<ul>
@foreach($item->dest->children()->where('hide',false)->get() as $itm)
<li>
<a href="{{$itm->webUrl()}}">
<i class="{{$itm->icon}}"></i>
<b>
{{$itm->name}}
</b>
<i class="ri-arrow-down-s-line"></i>
</a>
<ul>
@foreach($itm->children()->where('hide',false)->get() as $im)
<li>
<a href="{{$im->webUrl()}}">
<i class="{{$im->icon}}"></i> {{$im->name}}
</a>
</li>
@endforeach
</ul>
</li>
@endforeach
</ul>
</div>
@break
@default
@endswitch
@else
<a href="{{$item->webUrl()}}">
{{$item->title}}
</a>
@endif
</li>
@endforeach
</ul>
</nav>
</div>
<div>
<div class="sarv-btn-container">
@if(auth('customer')->check())
<a href="{{route('client.profile')}}" class="btn btn-outline-primary">
<i class="ri-user-line"></i>
{{__("Profile")}}
</a>
@else
<a href="{{route('client.sign-in')}}" class="btn btn-outline-primary">
<i class="ri-user-line"></i>
<span>
{{__("Login")}} / {{__('Register')}}
</span>
</a>
@endif
<a href="{{ route('client.card') }}" class="btn btn-outline-primary live-card-show"
data-url="{{route('client.card.items')}}">
<i class="ri-shopping-bag-2-line"></i>
<span class="badge bg-danger card-count">
@if(cardCount() > 0)
{{cardCount()}}
@endif
</span>
</a>
<a class="btn btn-outline-primary" id="sarv-toggle" href="#">
<i class="ri-menu-line"></i>
</a>
</div>
<a href="{{getSetting($data->area_name.'_'.$data->part.'_link')}}" class="float-end mb-2 no-view">
<i class="{{getSetting($data->area_name.'_'.$data->part.'_icon')}}"></i>
{{getSetting($data->area_name.'_'.$data->part.'_title')}}
</a>
</div>
</div>
<form action="{{route('client.search')}}">
<div class="form-control mobile-search">
<i class="ri-search-2-line"></i>
<input type="text" name="q" class="live-search" placeholder="{{__("Search")}}...">
</div>
</form>
</div>
</section>
<div id="sarv-responsive-menu">
<nav class="nested-list">
<ul>
@foreach(getMenuBySettingItems($data->area_name.'_'.$data->part.'_menu') as $item)
<li>
@if($item->meta == null)
<a href="{{$item->webUrl()}}">
{{$item->title}}
</a>
@switch($item->menuable_type)
@case(\App\Models\Group::class)
@case(\App\Models\Category::class)
<ul>
@foreach($item->dest->children()->where('hide',false)->get() as $itm)
<li>
<a href="{{$itm->webUrl()}}">
<b>
{{$itm->name}}
</b>
</a>
@if($itm->children()->where('hide',false)->count() > 0)
<ul>
@foreach($itm->children()->where('hide',false)->get() as $im)
<li>
<a href="{{$im->webUrl()}}">
{{$im->name}}
</a>
</li>
@endforeach
</ul>
@endif
</li>
@endforeach
</ul>
@break
@default
@endswitch
@else
<a href="{{$item->webUrl()}}">
{{$item->title}}
</a>
@endif
</li>
@endforeach
</ul>
</nav>
</div>

@ -0,0 +1,19 @@
window.addEventListener('load', function () {
window.addEventListener('scroll',function (e) {
if (window.scrollY > 100){
document.querySelector('.SarvMenu').classList.add('fixed');
}else{
document.querySelector('.SarvMenu').classList.remove('fixed');
}
});
document.querySelector('#sarv-toggle').addEventListener('click',function () {
document.querySelector('#sarv-responsive-menu').style.display = 'flex';
});
document.querySelector('#sarv-responsive-menu').addEventListener('click',function (e) {
if (e.target == this){
document.querySelector('#sarv-responsive-menu').style.display = 'none';
}
})
})

@ -0,0 +1,10 @@
{
"name": "SarvMenu",
"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,94 @@
<?php
namespace Resources\Views\Segments;
use App\Models\Menu;
use App\Models\Part;
use App\Models\Setting;
class SarvMenu
{
public static function onAdd(Part $part = null)
{
$setting = new Setting();
$setting->section = 'theme';
$setting->key = $part->area_name . '_' . $part->part.'_title';
$setting->value = __("Download app");
$setting->size = 4;
$setting->type = 'TEXT';
// $setting->data = json_encode(['xmin' => 2, 'xmax' => 90]);
$setting->title = $part->area_name . ' ' . $part->part. ' title';
$setting->save();
$setting = new Setting();
$setting->section = 'theme';
$setting->key = $part->area_name . '_' . $part->part.'_link';
$setting->value = __("link");
$setting->size = 4;
$setting->type = 'TEXT';
// $setting->data = json_encode(['xmin' => 2, 'xmax' => 90]);
$setting->title = $part->area_name . ' ' . $part->part. ' link';
$setting->save();
$setting = new Setting();
$setting->section = 'theme';
$setting->key = $part->area_name . '_' . $part->part.'_icon';
$setting->value = 'ri-mobile-download-line' ;
$setting->size = 4;
$setting->type = 'ICON';
// $setting->data = json_encode(['xmin' => 2, 'xmax' => 90]);
$setting->title = $part->area_name . ' ' . $part->part. ' icon';
$setting->save();
$setting = new Setting();
$setting->section = 'theme';
$setting->key = $part->area_name . '_' . $part->part.'_menu';
$setting->value = Menu::first()->id;
$setting->type = 'MENU';
$setting->size = 4;
$setting->title = $part->area_name . ' ' . $part->part .' menu';
$setting->save();
$setting = new Setting();
$setting->section = 'theme';
$setting->key = $part->area_name . '_' . $part->part.'_color';
$setting->value = '#dddddd';
$setting->type = 'COLOR';
$setting->data = json_encode(['name' => 'sarv -color']);
$setting->size = 4;
$setting->title = $part->area_name . ' ' . $part->part .' menu text color';
$setting->save();
$setting = new Setting();
$setting->section = 'theme';
$setting->key = $part->area_name . '_' . $part->part.'_bg';
$setting->value = '#ffffff';
$setting->type = 'COLOR';
$setting->data = json_encode(['name' => 'sarv-bg']);
$setting->size = 4;
$setting->title = $part->area_name . ' ' . $part->part .' background color';
$setting->save();
}
public static function onRemove(Part $part = null)
{
Setting::where('key',$part->area_name . '_' . $part->part.'_title')->first()?->delete();
Setting::where('key',$part->area_name . '_' . $part->part.'_icon')->first()?->delete();
Setting::where('key',$part->area_name . '_' . $part->part.'_link')->first()?->delete();
Setting::where('key',$part->area_name . '_' . $part->part.'_color')->first()?->delete();
Setting::where('key',$part->area_name . '_' . $part->part.'_bg')->first()?->delete();
Setting::where('key',$part->area_name . '_' . $part->part.'_menu')->first()?->delete();
}
public static function onMount(Part $part = null)
{
return $part;
}
}

@ -0,0 +1,256 @@
#sarv-toggle {
display: none;
}
.SarvMenu {
top: -150px;
transition: 400ms;
background: var(--sarv-bg);
color: var(--sarv-color);
a {
color: var(--sarv-color);
}
.omg-search {
}
.mobile-search {
position: relative;
top: -1rem;
display: none;
}
.form-control {
margin-top: 1rem;
padding: 0;
input {
border: 0;
background: #dddddd00;
width: calc(100% - 35px);
outline: none;
padding: .35rem 1rem;
margin-bottom: -5px;
position: relative;
top: -5px;
}
i {
font-size: 25px;
margin: 5px;
}
}
.sarv-row {
position: relative;
display: grid;
grid-template-columns: 2fr 20fr 8fr;
grid-gap: 1rem;
img {
max-width: 100%;
}
.sarv-btn-container {
display: grid;
grid-gap: .5rem;
grid-template-columns: 5fr 2fr;
padding: 1rem 0;
}
.btn {
font-size: 15px;
border-color: var(--sarv-color);
}
nav {
> ul {
display: flex;
align-items: center;
justify-content: start;
flex-direction: row;
padding: 0;
margin: 0;
list-style: none;
> li {
transition: 400ms;
padding: 1rem 1rem .5rem 1rem;
border-bottom: 2px transparent solid;
}
}
}
.sub-menu {
padding-bottom: 1rem;
position: absolute;
background: var(--sarv-bg);
top: 90%;
left: 0;
right: 0;
z-index: 99;
column-count: 4;
border-radius: var(--xshop-border-radius);
font-size: 14px;
max-height: 0;
transition: 500ms;
transition-delay: .3s;
opacity: 0;
ul {
padding: 0 1rem;
list-style: none;
ul {
li {
padding: .25rem .5rem;
position: relative;
&:before {
position: absolute;
inset-inline-start: -.4rem;
content: '\EA63';
font-family: "remixicon" !important;
}
}
}
}
}
li:hover {
border-bottom-color: var(--sarv-color);
.sub-menu {
max-height: 90vh;
opacity: 1;
z-index: 999;
}
}
}
&.fixed {
position: fixed;
left: 0;
right: 0;
top: 0;
z-index: 555;
.no-view {
display: none;
}
.mobile-search {
display: none !important;
}
}
}
#sarv-responsive-menu {
position: fixed;
left: 0;
right: 0;
bottom: 0;
z-index: 9999;
top: 0;
background: #0d0d0d44;
backdrop-filter: blur(7px);
display: none;
align-items: end;
nav {
max-height: 60vh;
overflow-y: auto;
width: 100%;
background: var(--sarv-bg);
color: var(--sarv-color);
ul {
list-style: none;
padding: 0 !important;
margin: 0 !important;
ul{
background: #00000022;
}
li {
border-top: 1px solid var(--sarv-color);
a {
padding: 1rem;
display: block;
color: var(--sarv-color);
}
i{
font-size: 35px;
position: relative;
top: 5px;
}
}
}
}
}
/*-1000px width*/
@media (max-width: 1000px) {
#sarv-toggle {
display: block;
}
.SarvMenu {
.mobile-search {
display: block;
}
nav, .omg-search, .float-end {
display: none;
}
.sarv-row {
grid-template-columns: 2fr 1fr 5fr;
img {
height: 60px;
}
.btn {
padding: 3px;
}
}
.sarv-btn-container {
grid-template-columns: 5fr 3fr 2fr !important;
}
}
//#sarv-responsive-menu {
// display: flex;
//}
}
/*-450px width*/
@media (max-width: 450px) {
.SarvMenu {
a span {
display: none;
}
.sarv-btn-container {
grid-template-columns: 3fr 3fr 3fr !important;
}
.btn {
border-color: transparent !important;
}
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.9 KiB

Loading…
Cancel
Save