In small screen the submenu is moved up, under the navbar-main
This commit is contained in:
parent
0cddce7a37
commit
6102e441d6
@ -157,7 +157,7 @@ .menu {
|
||||
}
|
||||
|
||||
.menu-item {
|
||||
@apply flex items-center w-full gap-3 py-1 pl-2 dark:hover:bg-coolgray-100 dark:hover:text-white hover:bg-neutral-300;
|
||||
@apply flex items-center w-full gap-3 py-1 px-2 sm:pr-0 dark:hover:bg-coolgray-100 dark:hover:text-white hover:bg-neutral-300;
|
||||
}
|
||||
|
||||
.menu-item-active {
|
||||
|
@ -2,8 +2,8 @@
|
||||
<h1>Configuration</h1>
|
||||
<livewire:project.shared.configuration-checker :resource="$application" />
|
||||
<livewire:project.application.heading :application="$application" />
|
||||
<div x-data="{ activeTab: window.location.hash ? window.location.hash.substring(1) : 'general' }" class="flex h-full pt-6">
|
||||
<div class="flex flex-col gap-2 xl:w-48">
|
||||
<div x-data="{ activeTab: window.location.hash ? window.location.hash.substring(1) : 'general' }" class="flex h-full pt-6 sm:flex-row flex-col gap-8">
|
||||
<div class="flex sm:flex-col gap-2 xl:w-48 overflow-x-scroll">
|
||||
<a class="menu-item" :class="activeTab === 'general' && 'menu-item-active'"
|
||||
@click.prevent="activeTab = 'general'; window.location.hash = 'general'" href="#">General</a>
|
||||
@if ($application->destination->server->isSwarm())
|
||||
@ -78,7 +78,7 @@
|
||||
@click.prevent="activeTab = 'danger'; window.location.hash = 'danger'" href="#">Danger Zone
|
||||
</a>
|
||||
</div>
|
||||
<div class="w-full pl-8">
|
||||
<div class="w-full">
|
||||
<div x-cloak x-show="activeTab === 'general'" class="h-full">
|
||||
<livewire:project.application.general :application="$application" />
|
||||
</div>
|
||||
|
@ -2,8 +2,8 @@
|
||||
<h1>Configuration</h1>
|
||||
<livewire:project.shared.configuration-checker :resource="$database" />
|
||||
<livewire:project.database.heading :database="$database" />
|
||||
<div x-data="{ activeTab: window.location.hash ? window.location.hash.substring(1) : 'general' }" class="flex h-full pt-6">
|
||||
<div class="flex flex-col gap-4 min-w-fit">
|
||||
<div x-data="{ activeTab: window.location.hash ? window.location.hash.substring(1) : 'general' }" class="flex h-full pt-6 sm:flex-row flex-col gap-8">
|
||||
<div class="flex sm:flex-col gap-2 xl:w-48 overflow-x-scroll">
|
||||
<a :class="activeTab === 'general' && 'dark:text-white'"
|
||||
@click.prevent="activeTab = 'general';
|
||||
window.location.hash = 'general'"
|
||||
@ -48,7 +48,7 @@
|
||||
href="#">Danger Zone
|
||||
</a>
|
||||
</div>
|
||||
<div class="w-full pl-8">
|
||||
<div class="w-full">
|
||||
<div x-cloak x-show="activeTab === 'general'" class="h-full">
|
||||
@if ($database->type() === 'standalone-postgresql')
|
||||
<livewire:project.database.postgresql.general :database="$database" />
|
||||
|
@ -1,6 +1,6 @@
|
||||
<div x-data="{ activeTab: window.location.hash ? window.location.hash.substring(1) : 'service-stack' }" x-init="$wire.check_status" wire:poll.5000ms="check_status">
|
||||
<livewire:project.service.navbar :service="$service" :parameters="$parameters" :query="$query" />
|
||||
<div class="flex h-full pt-6">
|
||||
<div class="flex h-full pt-6 sm:flex-row flex-col gap-8">
|
||||
<div class="flex flex-col items-start gap-4 min-w-fit">
|
||||
<a target="_blank" href="{{ $service->documentation() }}">Documentation <x-external-link /></a>
|
||||
<a :class="activeTab === 'service-stack' && 'dark:text-white'"
|
||||
@ -39,7 +39,7 @@
|
||||
href="#">Danger Zone
|
||||
</a>
|
||||
</div>
|
||||
<div class="w-full pl-8">
|
||||
<div class="w-full">
|
||||
<div x-cloak x-show="activeTab === 'service-stack'">
|
||||
<livewire:project.service.stack-form :service="$service" />
|
||||
<h3>Services</h3>
|
||||
|
@ -1,7 +1,7 @@
|
||||
<div x-data="{ activeTab: window.location.hash ? window.location.hash.substring(1) : 'general' }">
|
||||
<livewire:project.service.navbar :service="$service" :parameters="$parameters" :query="$query" />
|
||||
<div class="flex h-full pt-6">
|
||||
<div class="flex flex-col gap-4 min-w-fit">
|
||||
<div class="flex h-full pt-6 sm:flex-row flex-col gap-8">
|
||||
<div class="flex sm:flex-col gap-2 xl:w-48 overflow-x-scroll">
|
||||
<a class="{{ request()->routeIs('project.service.configuration') ? 'dark:text-white' : '' }}"
|
||||
href="{{ route('project.service.configuration', [...$parameters, 'stack_service_uuid' => null]) }}">
|
||||
<button><- Back</button>
|
||||
@ -24,7 +24,7 @@
|
||||
@click.prevent="activeTab = 'backups'; window.location.hash = 'backups'" href="#">Backups</a>
|
||||
@endif
|
||||
</div>
|
||||
<div class="w-full pl-8">
|
||||
<div class="w-full">
|
||||
@isset($serviceApplication)
|
||||
<div x-cloak x-show="activeTab === 'general'" class="h-full">
|
||||
<livewire:project.service.service-application-view :application="$serviceApplication" />
|
||||
|
@ -1,13 +1,13 @@
|
||||
<div>
|
||||
<x-server.navbar :server="$server" :parameters="$parameters" />
|
||||
<div x-data="{ activeTab: window.location.hash ? window.location.hash.substring(1) : 'managed' }" class="flex h-full">
|
||||
<div class="flex flex-col gap-4">
|
||||
<div x-data="{ activeTab: window.location.hash ? window.location.hash.substring(1) : 'managed' }" class="flex h-full flex-col md:flex-row gap-8">
|
||||
<div class="flex md:flex-col gap-4 flex-row">
|
||||
<a :class="activeTab === 'managed' && 'dark:text-white'"
|
||||
@click.prevent="activeTab = 'managed'; window.location.hash = 'managed'" href="#">Managed</a>
|
||||
<a :class="activeTab === 'unmanaged' && 'dark:text-white'"
|
||||
@click.prevent="activeTab = 'unmanaged'; window.location.hash = 'unmanaged'" href="#">Unmanaged</a>
|
||||
</div>
|
||||
<div class="w-full pl-8">
|
||||
<div class="w-full">
|
||||
<div x-cloak x-show="activeTab === 'managed'" class="h-full">
|
||||
<div class="flex flex-col">
|
||||
<div class="flex gap-2">
|
||||
|
Loading…
Reference in New Issue
Block a user