You've already forked Atomcms-edit
Initial commit
This commit is contained in:
@@ -0,0 +1,6 @@
|
||||
@props(['route' => '', 'classes' => '', 'target' => '_self'])
|
||||
|
||||
<a href="{{ $route }}" target="{{ $target }}" @class(['dropdown-item
|
||||
', $classes])>
|
||||
{{ $slot }}
|
||||
</a>
|
||||
@@ -0,0 +1,75 @@
|
||||
@props(['icon', 'routeGroup' => '', 'classes' => '', 'childClasses' => 'min-w-[150px]', 'uppercase' => false, 'showChevron' => false, 'flexCol' => true])
|
||||
|
||||
<div
|
||||
x-data="{
|
||||
open: false,
|
||||
toggle() {
|
||||
if (this.open) {
|
||||
return this.close()
|
||||
}
|
||||
|
||||
this.$refs.button.focus()
|
||||
|
||||
this.open = true
|
||||
},
|
||||
close(focusAfter) {
|
||||
if (! this.open) return
|
||||
|
||||
this.open = false
|
||||
|
||||
focusAfter && focusAfter.focus()
|
||||
},
|
||||
isTouchDevice: isTouchDevice()
|
||||
}"
|
||||
x-on:keydown.escape.prevent.stop="close($refs.button)"
|
||||
x-on:focusin.window="! $refs.panel.contains($event.target) && close()"
|
||||
x-id="['dropdown-button']"
|
||||
x-on:mouseenter="isTouchDevice ? false : toggle()"
|
||||
x-on:mouseleave="isTouchDevice ? false : toggle()"
|
||||
x-on:click.stop="isTouchDevice ? toggle() : {}"
|
||||
@class([
|
||||
'relative h-auto font-semibold transition duration-300 ease-in-out z-5',
|
||||
'active' => request()->is($routeGroup),
|
||||
$classes,
|
||||
])
|
||||
>
|
||||
<!-- Button -->
|
||||
<button
|
||||
x-ref="button"
|
||||
:aria-expanded="open"
|
||||
:aria-controls="$id('dropdown-button')"
|
||||
type="button"
|
||||
@class([
|
||||
'flex gap-1 items-center transition ease-in-out hover:text-[#ac93da] dropdown-parent',
|
||||
'flex-col' => $flexCol,
|
||||
])
|
||||
>
|
||||
@if(isset($icon))
|
||||
<img class="icon" src="{{ asset(sprintf('/assets/images/dusk/%s', $icon)) }}" alt="Missing icon">
|
||||
@endif
|
||||
|
||||
{{ $slot }}
|
||||
|
||||
@if($showChevron)
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-gray-400" viewBox="0 0 20 20"
|
||||
fill="currentColor">
|
||||
<path fill-rule="evenodd"
|
||||
d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z"
|
||||
clip-rule="evenodd"/>
|
||||
</svg>
|
||||
@endif
|
||||
</button>
|
||||
|
||||
<!-- Panel -->
|
||||
<div
|
||||
x-ref="panel"
|
||||
x-show="open"
|
||||
x-transition.origin.top.left
|
||||
x-on:click.outside="close($refs.button)"
|
||||
:id="$id('dropdown-button')"
|
||||
style="display: none;"
|
||||
@class(['absolute left-0 rounded bg-[#ac93da] shadow-sm whitespace-nowrap overflow-hidden z-[100] flex flex-col py-2 items-center gap-2 dropdown-children mt-1', $childClasses])
|
||||
>
|
||||
{{ $children }}
|
||||
</div>
|
||||
</div>
|
||||
+11
@@ -0,0 +1,11 @@
|
||||
<x-navigation.dropdown classes="!border-none" childClasses="w-[50px] -ml-2 flex items-center" :show-chevron="true" :flex-col="false">
|
||||
{{ $slot }}
|
||||
|
||||
<x-slot:children>
|
||||
@foreach (languages() as $lang)
|
||||
<x-navigation.dropdown-child :route="route('language.select', $lang->country_code)" classes="transition ease-in-out duration-300 hover:scale-110 flex justify-center">
|
||||
<img src="/assets/images/icons/flags/{{ $lang->country_code }}.png" alt="{{ $lang->country_code }}">
|
||||
</x-navigation.dropdown-child>
|
||||
@endforeach
|
||||
</x-slot:children>
|
||||
</x-navigation.dropdown>
|
||||
+109
@@ -0,0 +1,109 @@
|
||||
<nav class="nav-header" x-data="{
|
||||
open: false,
|
||||
}" x-on:keydown.escape="open = false" x-effect="document.body.classList.toggle('menu-open', open)">
|
||||
<div class="w-full min-h-[60px] text-white px-5 relative">
|
||||
<button @click="open = !open" class="absolute right-5 top-5 z-50 p-2 rounded-lg transition-all duration-200 hover:bg-white/10" aria-controls="dusk-mobile-menu" :aria-expanded="open">
|
||||
<span class="sr-only">{{ __('Open main menu') }}</span>
|
||||
<svg x-show="!open" x-cloak xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-7 h-7">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5" />
|
||||
</svg>
|
||||
<svg x-show="open" x-cloak xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-7 h-7">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12" />
|
||||
</svg>
|
||||
</button>
|
||||
|
||||
<div x-show="open" x-cloak
|
||||
x-transition:enter="transition ease-out duration-300"
|
||||
x-transition:enter-start="opacity-0 -translate-y-4"
|
||||
x-transition:enter-end="opacity-100 translate-y-0"
|
||||
x-transition:leave="transition ease-in duration-200"
|
||||
x-transition:leave-start="opacity-100 translate-y-0"
|
||||
x-transition:leave-end="opacity-0 -translate-y-4"
|
||||
class="flex flex-col text-white gap-x-14 p-4 space-y-3">
|
||||
<x-navigation.dropdown route-group="help-center*" :show-chevron="true" :flex-col="false">
|
||||
{{ __('Community') }}
|
||||
|
||||
<x-slot:children>
|
||||
<x-navigation.dropdown-child :route="route('article.index')" @click="open = false">
|
||||
{{ __('Articles') }}
|
||||
</x-navigation.dropdown-child>
|
||||
|
||||
|
||||
<x-navigation.dropdown-child :route="route('staff.index')" @click="open = false">
|
||||
{{ __('Staff') }}
|
||||
</x-navigation.dropdown-child>
|
||||
|
||||
<x-navigation.dropdown-child :route="route('teams.index')" @click="open = false">
|
||||
{{ __('Teams') }}
|
||||
</x-navigation.dropdown-child>
|
||||
|
||||
<x-navigation.dropdown-child :route="route('staff-applications.index')" @click="open = false">
|
||||
{{ __('Staff applications') }}
|
||||
</x-navigation.dropdown-child>
|
||||
|
||||
<x-navigation.dropdown-child :route="route('help-center.index')" @click="open = false">
|
||||
{{ __('Help center') }}
|
||||
</x-navigation.dropdown-child>
|
||||
|
||||
<x-navigation.dropdown-child :route="route('photos.index')" @click="open = false">
|
||||
{{ __('Photos') }}
|
||||
</x-navigation.dropdown-child>
|
||||
</x-slot:children>
|
||||
</x-navigation.dropdown>
|
||||
|
||||
<a href="{{ route('leaderboard.index') }}" class="transition ease-in-out hover:text-[#ac93da]" @click="open = false">
|
||||
{{ __('Leaderboards') }}
|
||||
</a>
|
||||
|
||||
<a href="{{ route('article.index') }}" class="transition ease-in-out hover:text-[#ac93da]" @click="open = false">
|
||||
{{ __('News') }}
|
||||
</a>
|
||||
|
||||
<a href="{{ route('welcome') }}" class="transition ease-in-out hover:text-[#ac93da]" @click="open = false">
|
||||
{{ __('Events') }}
|
||||
</a>
|
||||
|
||||
<a href="{{ route('shop.index') }}" class="transition ease-in-out hover:text-[#ac93da]" @click="open = false">
|
||||
{{ __('Store') }}
|
||||
</a>
|
||||
|
||||
<x-navigation.dropdown route-group="help-center*" :show-chevron="true" :flex-col="false">
|
||||
{{ __('Home') }}
|
||||
|
||||
<x-slot:children>
|
||||
@auth
|
||||
<x-navigation.dropdown-child :route="route('profile.show', Auth::user()->username)" @click="open = false">
|
||||
{{ __('My profile') }}
|
||||
</x-navigation.dropdown-child>
|
||||
|
||||
|
||||
<x-navigation.dropdown-child :route="route('settings.account.show')" @click="open = false">
|
||||
{{ __('Account settings') }}
|
||||
</x-navigation.dropdown-child>
|
||||
|
||||
<form action="{{ route('logout') }}" method="POST">
|
||||
@csrf
|
||||
<button type="submit" class="dropdown-item dark:text-gray-200 dark:hover:bg-gray-700 w-full text-left flex items-center gap-2 text-red-400 hover:text-red-300">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h4a3 3 0 013 3v1" />
|
||||
</svg>
|
||||
{{ __('Logout') }}
|
||||
</button>
|
||||
</form>
|
||||
@endauth
|
||||
|
||||
@guest
|
||||
<x-navigation.dropdown-child :route="route('login')" @click="open = false">
|
||||
{{ __('Login') }}
|
||||
</x-navigation.dropdown-child>
|
||||
|
||||
|
||||
<x-navigation.dropdown-child :route="route('register')" @click="open = false">
|
||||
{{ __('Register') }}
|
||||
</x-navigation.dropdown-child>
|
||||
@endguest
|
||||
</x-slot:children>
|
||||
</x-navigation.dropdown>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
+107
@@ -0,0 +1,107 @@
|
||||
<nav class="nav-header">
|
||||
<div class="max-w-7xl w-full flex justify-between items-center h-[120px]">
|
||||
<a href="/" class="transition duration-300 ease-in-out hover:scale-105">
|
||||
<img src="{{ setting('cms_logo') }}" alt="">
|
||||
</a>
|
||||
|
||||
<div class="flex text-white gap-x-14">
|
||||
<x-navigation.dropdown icon="community_icon.png" route-group="help-center*" :uppercase="true">
|
||||
{{ __('Community') }}
|
||||
|
||||
<x-slot:children>
|
||||
<x-navigation.dropdown-child :route="route('staff.index')">
|
||||
{{ __('Staff') }}
|
||||
</x-navigation.dropdown-child>
|
||||
|
||||
<x-navigation.dropdown-child :route="route('teams.index')">
|
||||
{{ __('Teams') }}
|
||||
</x-navigation.dropdown-child>
|
||||
|
||||
<x-navigation.dropdown-child :route="route('team-applications.index')">
|
||||
{{ __('Team applications') }}
|
||||
</x-navigation.dropdown-child>
|
||||
|
||||
<x-navigation.dropdown-child :route="route('staff-applications.index')">
|
||||
{{ __('Staff applications') }}
|
||||
</x-navigation.dropdown-child>
|
||||
|
||||
<x-navigation.dropdown-child :route="route('values.index')">
|
||||
{{ __('Rare values') }}
|
||||
</x-navigation.dropdown-child>
|
||||
|
||||
<x-navigation.dropdown-child :route="route('help-center.index')">
|
||||
{{ __('Help center') }}
|
||||
</x-navigation.dropdown-child>
|
||||
|
||||
<x-navigation.dropdown-child :route="route('photos.index')">
|
||||
{{ __('Photos') }}
|
||||
</x-navigation.dropdown-child>
|
||||
</x-slot:children>
|
||||
</x-navigation.dropdown>
|
||||
|
||||
<a href="{{ route('leaderboard.index') }}" class="flex flex-col gap-1 items-center transition ease-in-out hover:text-[#ac93da]">
|
||||
<img class="icon" src="{{ asset('/assets/images/dusk/leaderboard_icon.png') }}" alt="community icon">
|
||||
Leaderboards
|
||||
</a>
|
||||
|
||||
<a href="{{ route('article.index') }}" class="flex flex-col gap-1 items-center transition ease-in-out hover:text-[#ac93da]">
|
||||
<img class="icon" src="{{ asset('/assets/images/dusk/news_icon.png') }}" alt="community icon">
|
||||
News
|
||||
</a>
|
||||
|
||||
{{--
|
||||
<a href="#" class="flex flex-col gap-1 items-center transition ease-in-out hover:text-[#ac93da]">
|
||||
<img class="icon" src="{{ asset('/assets/images/dusk/events_icon.png') }}" alt="community icon">
|
||||
Events
|
||||
</a>
|
||||
--}}
|
||||
|
||||
|
||||
<a href="{{ route('shop.index') }}" class="flex flex-col gap-1 items-center transition ease-in-out hover:text-[#ac93da]">
|
||||
<img class="icon" src="{{ asset('/assets/images/dusk/store_icon.png') }}" alt="community icon">
|
||||
Store
|
||||
</a>
|
||||
|
||||
<x-navigation.dropdown icon="home_icon.png" route-group="user*" :uppercase="true">
|
||||
{{ __('Home') }}
|
||||
|
||||
<x-slot:children>
|
||||
@auth
|
||||
<x-navigation.dropdown-child :route="route('profile.show', Auth::user()->username)">
|
||||
{{ __('My profile') }}
|
||||
</x-navigation.dropdown-child>
|
||||
|
||||
<x-navigation.dropdown-child :route="route('draw-badge')">
|
||||
{{ __('Badge Drawer') }}
|
||||
</x-navigation.dropdown-child>
|
||||
|
||||
<x-navigation.dropdown-child :route="route('settings.account.show')">
|
||||
{{ __('Account settings') }}
|
||||
</x-navigation.dropdown-child>
|
||||
|
||||
<form action="{{ route('logout') }}" method="POST">
|
||||
@csrf
|
||||
<button type="submit" class="dropdown-item text-red-400 hover:text-red-300 flex items-center gap-2">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h4a3 3 0 013 3v1" />
|
||||
</svg>
|
||||
{{ __('Logout') }}
|
||||
</button>
|
||||
</form>
|
||||
@endauth
|
||||
|
||||
@guest
|
||||
<x-navigation.dropdown-child :route="route('login')">
|
||||
{{ __('Login') }}
|
||||
</x-navigation.dropdown-child>
|
||||
|
||||
|
||||
<x-navigation.dropdown-child :route="route('register')">
|
||||
{{ __('Register') }}
|
||||
</x-navigation.dropdown-child>
|
||||
@endguest
|
||||
</x-slot:children>
|
||||
</x-navigation.dropdown>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
Reference in New Issue
Block a user