211 lines
21 KiB
PHP
211 lines
21 KiB
PHP
<aside class="mt-24 ml-8 w-64 h-[calc(100vh-2rem)] md:flex hidden flex-col fixed top-0 left-0 rtl:right-0 z-10">
|
|
<div class="h-9/10 bg-background-secondary/80 backdrop-blur-md border border-neutral/50 rounded-2xl shadow-xl overflow-hidden">
|
|
<div class="flex flex-col h-full">
|
|
|
|
<div class="p-6 border-b border-neutral/50">
|
|
<div class="flex items-center gap-3">
|
|
<div class="w-10 h-10 bg-gradient-to-br from-primary to-secondary rounded-xl flex items-center justify-center shadow-lg">
|
|
<x-ri-dashboard-line class="w-6 h-6 text-white" />
|
|
</div>
|
|
<div>
|
|
<h2 class="text-lg font-bold text-foreground">{{ __('navigation.home') }}</h2>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex-1 overflow-y-auto p-4">
|
|
<div class="space-y-2">
|
|
|
|
<div class="mb-6 md:hidden">
|
|
<h3 class="text-xs font-semibold text-base/50 uppercase tracking-wider mb-3 px-3"></h3>
|
|
<div class="space-y-1">
|
|
@foreach (\App\Classes\Navigation::getLinks() as $nav)
|
|
@if (!empty($nav['children']))
|
|
<div x-data="{ activeAccordion: {{ $nav['active'] ? 'true' : 'false' }} }"
|
|
class="relative w-full overflow-hidden">
|
|
<button @click="activeAccordion = !activeAccordion"
|
|
class="flex items-center justify-between w-full px-4 py-3 rounded-xl text-sm font-medium transition-all duration-200 group
|
|
{{ $nav['active'] ? 'text-primary bg-primary/10 border border-primary/20 shadow-sm' : 'text-base/80 hover:text-foreground hover:bg-background' }}">
|
|
<div class="flex items-center gap-3">
|
|
@isset($nav['icon'])
|
|
<x-dynamic-component :component="$nav['icon']"
|
|
class="w-5 h-5 {{ $nav['active'] ? 'text-primary' : 'text-base/60 group-hover:text-primary' }} transition-colors" />
|
|
@endisset
|
|
<span>{{ $nav['name'] }}</span>
|
|
</div>
|
|
<x-ri-arrow-down-s-line x-bind:class="{ 'rotate-180': activeAccordion }"
|
|
class="w-5 h-5 text-base/60 transition-transform duration-300" />
|
|
</button>
|
|
<div x-show="activeAccordion" x-collapse x-cloak>
|
|
<div class="py-2 pl-8 pr-4 mt-2 border-l-2 border-primary/30 ml-4">
|
|
@foreach ($nav['children'] as $child)
|
|
<x-navigation.link :href="route($child['route'], $child['params'] ?? [])"
|
|
:spa="$child['spa'] ?? true"
|
|
class="flex items-center gap-3 px-3 py-2 rounded-lg text-sm font-medium mb-1 transition-all duration-200 group
|
|
{{ $child['active'] ? 'text-primary bg-primary/10 border border-primary/20' : 'text-base/70 hover:text-foreground hover:bg-background/50' }}">
|
|
{{ $child['name'] }}
|
|
@if($child['active'])
|
|
<div class="ml-auto w-2 h-2 bg-primary rounded-full"></div>
|
|
@endif
|
|
</x-navigation.link>
|
|
@endforeach
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@else
|
|
<x-navigation.link :href="route($nav['route'], $nav['params'] ?? [])"
|
|
:spa="$nav['spa'] ?? true"
|
|
class="flex items-center gap-3 px-4 py-3 rounded-xl text-sm font-medium transition-all duration-200 group
|
|
{{ $nav['active'] ? 'text-primary bg-primary/10 border border-primary/20 shadow-sm' : 'text-base/80 hover:text-foreground hover:bg-background' }}">
|
|
@isset($nav['icon'])
|
|
<x-dynamic-component :component="$nav['icon']"
|
|
class="w-5 h-5 {{ $nav['active'] ? 'text-primary' : 'text-base/60 group-hover:text-primary' }} transition-colors" />
|
|
@endisset
|
|
<span>{{ $nav['name'] }}</span>
|
|
@if($nav['active'])
|
|
<div class="ml-auto w-2 h-2 bg-primary rounded-full"></div>
|
|
@endif
|
|
</x-navigation.link>
|
|
@endif
|
|
@isset($nav['separator'])
|
|
<div class="h-px w-full bg-neutral/30 my-3 mx-3"></div>
|
|
@endisset
|
|
@endforeach
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mb-6">
|
|
<h3 class="text-xs font-semibold text-base/50 uppercase tracking-wider mb-3 px-3">{{ __('navigation.dashboard') }}</h3>
|
|
<div class="space-y-1">
|
|
@foreach (\App\Classes\Navigation::getDashboardLinks() as $nav)
|
|
@if (!empty($nav['children']))
|
|
<div x-data="{ activeAccordion: {{ $nav['active'] ? 'true' : 'false' }} }"
|
|
class="relative w-full overflow-hidden">
|
|
<button @click="activeAccordion = !activeAccordion"
|
|
class="flex items-center justify-between w-full px-4 py-3 rounded-xl text-sm font-medium transition-all duration-200 group
|
|
{{ $nav['active'] ? 'text-primary bg-primary/10 border border-primary/20 shadow-sm' : 'text-base/80 hover:text-foreground hover:bg-background' }}">
|
|
<div class="flex items-center gap-3">
|
|
@isset($nav['icon'])
|
|
<x-dynamic-component :component="$nav['icon']"
|
|
class="w-5 h-5 {{ $nav['active'] ? 'text-primary' : 'text-base/60 group-hover:text-primary' }} transition-colors" />
|
|
@endisset
|
|
<span>{{ $nav['name'] }}</span>
|
|
</div>
|
|
<x-ri-arrow-down-s-line x-bind:class="{ 'rotate-180': activeAccordion }"
|
|
class="w-5 h-5 text-base/60 transition-transform duration-300" />
|
|
</button>
|
|
<div x-show="activeAccordion" x-collapse x-cloak>
|
|
<div class="py-2 pl-8 pr-4 mt-2 border-l-2 border-primary/30 ml-4">
|
|
@foreach ($nav['children'] as $child)
|
|
@if ($child['condition'] ?? true)
|
|
<x-navigation.link :href="route($child['route'], $child['params'] ?? [])"
|
|
:spa="$child['spa'] ?? true"
|
|
class="flex items-center gap-3 px-3 py-2 rounded-lg text-sm font-medium mb-1 transition-all duration-200 group
|
|
{{ $child['active'] ? 'text-primary bg-primary/10 border border-primary/20' : 'text-base/70 hover:text-foreground hover:bg-background/50' }}">
|
|
{{ $child['name'] }}
|
|
@if($child['active'])
|
|
<div class="ml-auto w-2 h-2 bg-primary rounded-full"></div>
|
|
@endif
|
|
</x-navigation.link>
|
|
@endif
|
|
@endforeach
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@else
|
|
<x-navigation.link :href="route($nav['route'], $nav['params'] ?? [])"
|
|
:spa="$nav['spa'] ?? true"
|
|
class="flex items-center gap-3 px-4 py-3 rounded-xl text-sm font-medium transition-all duration-200 hover:scale-105 group
|
|
{{ $nav['active'] ? 'text-primary bg-primary/10 border border-primary/20 shadow-sm' : 'text-base/80 hover:text-foreground hover:bg-background' }}">
|
|
@isset($nav['icon'])
|
|
<x-dynamic-component :component="$nav['icon']"
|
|
class="w-5 h-5 {{ $nav['active'] ? 'text-primary' : 'text-base/60 group-hover:text-primary' }} transition-colors" />
|
|
@endisset
|
|
<span>{{ $nav['name'] }}</span>
|
|
@if($nav['active'])
|
|
<div class="ml-auto w-2 h-2 bg-primary rounded-full"></div>
|
|
@endif
|
|
</x-navigation.link>
|
|
@endif
|
|
@isset($nav['separator'])
|
|
<div class="h-px w-full bg-neutral/30 my-3 mx-3"></div>
|
|
@endisset
|
|
@endforeach
|
|
<div class="h-px w-full bg-neutral/30 my-3 mx-3"></div>
|
|
<a href="https://auth.virtnet.bond" target="_blank" rel="noopener" class="flex items-center gap-3 px-4 py-3 rounded-xl text-sm font-medium transition-all duration-200 hover:scale-105 group hover:text-foreground hover:bg-background">
|
|
<svg height="20px" width="20px" version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
viewBox="0 0 25.573 25.573" xml:space="preserve" class="w-5 h-5 text-base/60 group-hover:text-primary transition-colors">
|
|
<g>
|
|
<g>
|
|
<polygon style="currentColor" points="12.036,24.589 12.036,3.296 15.391,0.983 15.391,22.74 "/>
|
|
<path style="fill:currentColor;" d="M11.11,7.926v2.893c0,0-6.632,0.521-7.058,5.556c0,0-0.93,4.396,7.058,5.785v2.43
|
|
c0,0-11.226-1.155-11.109-8.331C0.001,16.258-0.115,8.968,11.11,7.926z"/>
|
|
<path style="fill:currentColor;" d="M16.2,7.926v2.702c0,0,2.142-0.029,3.934,1.463l-1.964,0.807l7.403,1.855V8.967l-2.527,1.43
|
|
C23.046,10.397,20.889,8.13,16.2,7.926z"/>
|
|
</g>
|
|
</g>
|
|
</svg><span>OpenID</span>
|
|
</a>
|
|
<a href="https://pve.virtnet.bond" target="_blank" rel="noopener" class="flex items-center gap-3 px-4 py-3 rounded-xl text-sm font-medium transition-all duration-200 hover:scale-105 group hover:text-foreground hover:bg-background">
|
|
<svg fill="currentColor" width="20px" height="20px" viewBox="0 0 24 24" role="img" xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 text-base/60 group-hover:text-primary transition-colors"><path d="M4.928 1.825c-1.09.553-1.09.64-.07 1.78 5.655 6.295 7.004 7.782 7.107 7.782.139.017 7.971-8.542 8.058-8.801.034-.07-.208-.312-.519-.536-.415-.312-.864-.433-1.712-.467-1.59-.104-2.144.242-4.115 2.455-.899 1.003-1.66 1.833-1.66 1.833-.017 0-.76-.813-1.642-1.798S8.473 2.1 8.127 1.91c-.796-.45-2.421-.484-3.2-.086zM1.297 4.367C.45 4.695 0 5.007 0 5.248c0 .121 1.331 1.678 2.94 3.459 1.625 1.78 2.939 3.268 2.939 3.302 0 .035-1.331 1.522-2.94 3.303C1.314 17.11.017 18.683.035 18.822c.086.467 1.504 1.055 2.541 1.055 1.678-.018 2.058-.312 5.603-4.202 1.78-1.954 3.233-3.614 3.233-3.666 0-.069-1.435-1.694-3.199-3.63-2.3-2.508-3.423-3.632-3.96-3.874-.812-.398-2.126-.467-2.956-.138zm18.467.12c-.502.26-1.764 1.505-3.943 3.891-1.763 1.937-3.199 3.562-3.199 3.631 0 .07 1.453 1.712 3.234 3.666 3.544 3.89 3.925 4.184 5.602 4.202 1.038 0 2.455-.588 2.542-1.055.017-.156-1.28-1.712-2.905-3.493-1.608-1.78-2.94-3.285-2.94-3.32 0-.034 1.332-1.539 2.94-3.32C22.72 6.91 24.017 5.352 24 5.214c-.087-.45-1.366-.968-2.473-1.038-.795-.034-1.21.035-1.763.312zM7.954 16.973c-2.144 2.369-3.908 4.374-3.943 4.46-.034.07.208.312.52.537.414.311.864.432 1.711.467 1.574.103 2.161-.26 4.15-2.508.864-.968 1.608-1.78 1.625-1.78s.761.812 1.643 1.798c2.023 2.248 2.559 2.576 4.132 2.49.848-.035 1.297-.156 1.712-.467.311-.225.553-.467.519-.536-.087-.26-7.92-8.819-8.058-8.801-.069 0-1.867 1.954-4.011 4.34z"/></svg><span>Proxmox</span>
|
|
</a>
|
|
<a
|
|
href="https://discord.gg/zFTJG2hmwN"
|
|
target="_blank"
|
|
rel="noopener"
|
|
class="flex items-center gap-3 px-4 py-3 rounded-xl text-sm font-medium transition-all duration-200 hover:scale-105 group hover:text-foreground hover:bg-background">
|
|
<svg xmlns="http://www.w3.org/2000/svg"
|
|
viewBox="0 0 24 24"
|
|
fill="currentColor"
|
|
class="w-5 h-5 text-base/60 group-hover:text-primary transition-colors">
|
|
<path d="M8.52062 13.8458C7.48059 13.8458 6.63159 12.9014 6.63159 11.7446 6.63159 10.5879 7.45936 9.64331 8.52062 9.64331 9.57123 9.64331 10.4308 10.5879 10.4096 11.7446 10.4096 12.9014 9.57123 13.8458 8.52062 13.8458ZM15.4941 13.8458C14.454 13.8458 13.604 12.9014 13.604 11.7446 13.604 10.5879 14.4328 9.64331 15.4941 9.64331 16.5447 9.64331 17.4043 10.5879 17.3831 11.7446 17.3831 12.9014 16.5553 13.8458 15.4941 13.8458ZM10.1253 4.32296 9.81655 3.76001 9.18323 3.86556C7.71915 4.10958 6.32658 4.54677 5.02544 5.14604L4.79651 5.25148 4.65507 5.46009C2.0418 9.31441 1.3258 13.1087 1.68032 16.8362L1.71897 17.2425 2.04912 17.4824C3.78851 18.7465 5.47417 19.5189 7.12727 20.0257L7.91657 20.2676 9.03013 17.5506C10.9397 18.0226 13.0592 18.0228 14.969 17.5511L16.0757 20.2683 16.8668 20.0256C18.5173 19.5193 20.2137 18.7472 21.9466 17.4811L22.2726 17.243 22.3131 16.8414C22.7491 12.5213 21.616 8.75773 19.3547 5.45652L19.2128 5.24944 18.9846 5.14504C17.6767 4.54685 16.2852 4.10981 14.8309 3.86573L14.2132 3.76207 13.8987 4.30369C13.8112 4.45445 13.7215 4.62464 13.6364 4.79687 12.5441 4.6847 11.456 4.68446 10.3726 4.79652 10.2882 4.62736 10.2025 4.4638 10.1253 4.32296ZM6.71436 16.6102C6.91235 16.7243 7.11973 16.8358 7.32557 16.9381L6.8764 18.034C5.75585 17.6259 4.61837 17.0637 3.4476 16.2557 3.22313 13.1178 3.86092 9.951 6.01196 6.68626 6.90962 6.29123 7.8535 5.98279 8.83606 5.77295 8.89631 5.89831 8.95235 6.02066 8.99839 6.12917L9.27128 6.77238 9.96259 6.67098C11.3152 6.4726 12.6772 6.47234 14.0523 6.67124L14.7424 6.77106 15.0147 6.12917C15.0621 6.01743 15.1167 5.89547 15.1743 5.77322 16.1525 5.98326 17.098 6.29212 18.0029 6.68812 19.8781 9.50857 20.8241 12.6544 20.5486 16.2552 19.3837 17.0625 18.2422 17.6249 17.1193 18.0335L16.6735 16.939C16.8799 16.8365 17.0879 16.7246 17.2865 16.6102 17.7763 16.328 18.3039 15.976 18.6402 15.6397L17.3606 14.3602C17.1969 14.5239 16.837 14.7808 16.3831 15.0423 15.9388 15.2983 15.498 15.5052 15.2164 15.5983 13.2126 16.2608 10.7883 16.2608 8.78443 15.5983 8.50285 15.5052 8.06205 15.2983 7.61772 15.0423 7.16383 14.7808 6.80392 14.5239 6.64017 14.3602L5.36065 15.6397C5.6969 15.976 6.2245 16.328 6.71436 16.6102Z"></path>
|
|
</svg>
|
|
<span>Discord</span>
|
|
</a>
|
|
<a
|
|
href="https://t.me/virtnetbondvps"
|
|
target="_blank"
|
|
rel="noopener"
|
|
class="flex items-center gap-3 px-4 py-3 rounded-xl text-sm font-medium transition-all duration-200 hover:scale-105 group hover:text-foreground hover:bg-background">
|
|
<svg xmlns="http://www.w3.org/2000/svg"
|
|
viewBox="0 0 24 24"
|
|
fill="currentColor"
|
|
class="w-5 h-5 text-base/60 group-hover:text-primary transition-colors">
|
|
<path d="M17.0943 7.14643C17.6874 6.93123 17.9818 6.85378 18.1449 6.82608C18.1461 6.87823 18.1449 6.92051 18.1422 6.94825C17.9096 9.39217 16.8906 15.4048 16.3672 18.2026C16.2447 18.8578 16.1507 19.1697 15.5179 18.798C15.1014 18.5532 14.7245 18.2452 14.3207 17.9805C12.9961 17.1121 11.1 15.8189 11.2557 15.8967C9.95162 15.0373 10.4975 14.5111 11.2255 13.8093C11.3434 13.6957 11.466 13.5775 11.5863 13.4525C11.64 13.3967 11.9027 13.1524 12.2731 12.8081C13.4612 11.7035 15.7571 9.56903 15.8151 9.32202C15.8246 9.2815 15.8334 9.13045 15.7436 9.05068C15.6539 8.97092 15.5215 8.9982 15.4259 9.01989C15.2904 9.05064 13.1326 10.4769 8.95243 13.2986C8.33994 13.7192 7.78517 13.9242 7.28811 13.9134L7.29256 13.9156C6.63781 13.6847 5.9849 13.4859 5.32855 13.286C4.89736 13.1546 4.46469 13.0228 4.02904 12.8812C3.92249 12.8466 3.81853 12.8137 3.72083 12.783C8.24781 10.8109 11.263 9.51243 12.7739 8.884C14.9684 7.97124 16.2701 7.44551 17.0943 7.14643ZM19.5169 5.21806C19.2635 5.01244 18.985 4.91807 18.7915 4.87185C18.5917 4.82412 18.4018 4.80876 18.2578 4.8113C17.7814 4.81969 17.2697 4.95518 16.4121 5.26637C15.5373 5.58382 14.193 6.12763 12.0058 7.03736C10.4638 7.67874 7.39388 9.00115 2.80365 11.001C2.40046 11.1622 2.03086 11.3451 1.73884 11.5619C1.46919 11.7622 1.09173 12.1205 1.02268 12.6714C0.970519 13.0874 1.09182 13.4714 1.33782 13.7738C1.55198 14.037 1.82635 14.1969 2.03529 14.2981C2.34545 14.4483 2.76276 14.5791 3.12952 14.6941C3.70264 14.8737 4.27444 15.0572 4.84879 15.233C6.62691 15.7773 8.09066 16.2253 9.7012 17.2866C10.8825 18.0651 12.041 18.8775 13.2243 19.6531C13.6559 19.936 14.0593 20.2607 14.5049 20.5224C14.9916 20.8084 15.6104 21.0692 16.3636 20.9998C17.5019 20.8951 18.0941 19.8479 18.3331 18.5703C18.8552 15.7796 19.8909 9.68351 20.1332 7.13774C20.1648 6.80544 20.1278 6.433 20.097 6.25318C20.0653 6.068 19.9684 5.58448 19.5169 5.21806Z"></path>
|
|
</svg>
|
|
<span>Telegram</span>
|
|
</a>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
@if(auth()->check())
|
|
<div class="flex items-center gap-3 p-3 bg-background/80 backdrop-blur-sm rounded-xl border border-neutral/50">
|
|
<div class="relative">
|
|
<img src="{{ auth()->user()->avatar }}"
|
|
class="w-10 h-10 rounded-full border-2 border-neutral/50 bg-background"
|
|
alt="User Avatar" />
|
|
<div class="absolute -bottom-0.5 -right-0.5 w-4 h-4 bg-green-500 rounded-full border-2 border-background">
|
|
<div class="w-full h-full bg-green-400 rounded-full animate-ping"></div>
|
|
</div>
|
|
</div>
|
|
<div class="flex-1 min-w-0">
|
|
<p class="text-sm font-semibold text-foreground truncate">{{ auth()->user()->name }}</p>
|
|
<p class="text-xs text-base/60 truncate">{{ auth()->user()->email }}</p>
|
|
</div>
|
|
<div class="flex items-center gap-1">
|
|
<livewire:auth.logout class="w-8 h-8 hover:bg-neutral/50 rounded-lg flex items-center justify-center transition-all duration-200" />
|
|
</div>
|
|
</div>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</aside> |