mirror of
https://github.com/vitodeploy/vito.git
synced 2025-07-04 15:32:35 +00:00
Redesign (#124)
- redesign the dashboard - add search bar - Mobile-friendly design
This commit is contained in:
Saeed Vaziry
GitHub
@ -29,182 +29,37 @@
|
||||
@vite(["resources/css/app.css", "resources/js/app.js"])
|
||||
</head>
|
||||
|
||||
<body
|
||||
class="min-h-screen min-w-max bg-gray-100 font-sans antialiased dark:bg-gray-900 dark:text-gray-300"
|
||||
x-data=""
|
||||
x-cloak
|
||||
>
|
||||
<div class="flex min-h-screen">
|
||||
<div
|
||||
class="left-0 top-0 min-h-screen w-64 flex-none bg-gray-800 p-3 dark:border-r-2 dark:border-gray-800 dark:bg-gray-800/50"
|
||||
>
|
||||
<div class="block h-16">
|
||||
<div class="flex items-center justify-start text-2xl font-extrabold text-white">
|
||||
<x-application-logo class="h-7 w-7 rounded-md" />
|
||||
<span class="ml-1">Deploy</span>
|
||||
<body class="bg-gray-50 font-sans antialiased dark:bg-gray-900 dark:text-gray-300" x-data="" x-cloak>
|
||||
@include("layouts.partials.search")
|
||||
|
||||
@include("layouts.navigation")
|
||||
|
||||
@include("layouts.sidebar")
|
||||
|
||||
<div class="mt-[64px] w-full"></div>
|
||||
|
||||
<div class="sm:ml-64">
|
||||
@if (isset($header))
|
||||
<header class="border-b border-gray-200 bg-white dark:border-gray-700 dark:bg-gray-800">
|
||||
<div class="mx-auto flex h-20 w-full max-w-full items-center justify-between px-5">
|
||||
{{ $header }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-5">
|
||||
<div class="text-sm font-semibold uppercase text-gray-300">
|
||||
{{ __("Projects") }}
|
||||
</div>
|
||||
<div class="mt-2">
|
||||
@include("layouts.partials.project-select", ["project" => auth()->user()->currentProject])
|
||||
</div>
|
||||
|
||||
<div class="mt-5 text-sm font-semibold uppercase text-gray-300">
|
||||
{{ __("Servers") }}
|
||||
</div>
|
||||
<div class="mt-2">
|
||||
@include("layouts.partials.server-select", ["server" => $server ?? null])
|
||||
</div>
|
||||
|
||||
@if (isset($server))
|
||||
<div class="mt-3 space-y-1">
|
||||
<x-sidebar-link
|
||||
:href="route('servers.show', ['server' => $server])"
|
||||
:active="request()->routeIs('servers.show')"
|
||||
>
|
||||
<x-heroicon name="o-home" class="h-6 w-6" />
|
||||
<span class="ml-2 text-gray-50">
|
||||
{{ __("Overview") }}
|
||||
</span>
|
||||
</x-sidebar-link>
|
||||
@if ($server->webserver())
|
||||
<x-sidebar-link
|
||||
:href="route('servers.sites', ['server' => $server])"
|
||||
:active="request()->routeIs('servers.sites') || request()->is('servers/*/sites/*')"
|
||||
>
|
||||
<x-heroicon name="o-globe-alt" class="h-6 w-6" />
|
||||
<span class="ml-2 text-gray-50">
|
||||
{{ __("Sites") }}
|
||||
</span>
|
||||
</x-sidebar-link>
|
||||
@endif
|
||||
|
||||
@if ($server->database())
|
||||
<x-sidebar-link
|
||||
:href="route('servers.databases', ['server' => $server])"
|
||||
:active="request()->routeIs('servers.databases') ||
|
||||
request()->routeIs('servers.databases.backups')"
|
||||
>
|
||||
<x-heroicon name="o-circle-stack" class="h-6 w-6" />
|
||||
<span class="ml-2 text-gray-50">
|
||||
{{ __("Databases") }}
|
||||
</span>
|
||||
</x-sidebar-link>
|
||||
@endif
|
||||
|
||||
@if ($server->php())
|
||||
<x-sidebar-link
|
||||
:href="route('servers.php', ['server' => $server])"
|
||||
:active="request()->routeIs('servers.php')"
|
||||
>
|
||||
<x-heroicon name="o-code-bracket" class="h-6 w-6" />
|
||||
<span class="ml-2 text-gray-50">
|
||||
{{ __("PHP") }}
|
||||
</span>
|
||||
</x-sidebar-link>
|
||||
@endif
|
||||
|
||||
@if ($server->firewall())
|
||||
<x-sidebar-link
|
||||
:href="route('servers.firewall', ['server' => $server])"
|
||||
:active="request()->routeIs('servers.firewall')"
|
||||
>
|
||||
<x-heroicon name="o-fire" class="h-6 w-6" />
|
||||
<span class="ml-2 text-gray-50">
|
||||
{{ __("Firewall") }}
|
||||
</span>
|
||||
</x-sidebar-link>
|
||||
@endif
|
||||
|
||||
<x-sidebar-link
|
||||
:href="route('servers.cronjobs', ['server' => $server])"
|
||||
:active="request()->routeIs('servers.cronjobs')"
|
||||
>
|
||||
<x-heroicon name="o-clock" class="h-6 w-6" />
|
||||
<span class="ml-2 text-gray-50">
|
||||
{{ __("Cronjobs") }}
|
||||
</span>
|
||||
</x-sidebar-link>
|
||||
<x-sidebar-link
|
||||
:href="route('servers.ssh-keys', ['server' => $server])"
|
||||
:active="request()->routeIs('servers.ssh-keys')"
|
||||
>
|
||||
<x-heroicon name="o-key" class="h-6 w-6" />
|
||||
<span class="ml-2 text-gray-50">
|
||||
{{ __("SSH Keys") }}
|
||||
</span>
|
||||
</x-sidebar-link>
|
||||
<x-sidebar-link
|
||||
:href="route('servers.services', ['server' => $server])"
|
||||
:active="request()->routeIs('servers.services')"
|
||||
>
|
||||
<x-heroicon name="o-cog-6-tooth" class="h-6 w-6" />
|
||||
<span class="ml-2 text-gray-50">
|
||||
{{ __("Services") }}
|
||||
</span>
|
||||
</x-sidebar-link>
|
||||
|
||||
<x-sidebar-link
|
||||
:href="route('servers.settings', ['server' => $server])"
|
||||
:active="request()->routeIs('servers.settings')"
|
||||
>
|
||||
<x-heroicon name="o-wrench-screwdriver" class="h-6 w-6" />
|
||||
<span class="ml-2 text-gray-50">
|
||||
{{ __("Settings") }}
|
||||
</span>
|
||||
</x-sidebar-link>
|
||||
<x-sidebar-link
|
||||
:href="route('servers.logs', ['server' => $server])"
|
||||
:active="request()->routeIs('servers.logs')"
|
||||
>
|
||||
<x-heroicon name="o-square-3-stack-3d" class="h-6 w-6" />
|
||||
<span class="ml-2 text-gray-50">
|
||||
{{ __("Logs") }}
|
||||
</span>
|
||||
</x-sidebar-link>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@if (isset($sidebar))
|
||||
<div
|
||||
class="min-h-screen w-64 flex-none border-r border-gray-200 bg-white dark:border-gray-800 dark:bg-gray-900"
|
||||
>
|
||||
{{ $sidebar }}
|
||||
</div>
|
||||
</header>
|
||||
@endif
|
||||
|
||||
<div class="flex min-h-screen flex-grow flex-col">
|
||||
@include("layouts.navigation")
|
||||
@if (isset($header2))
|
||||
<header class="border-b border-gray-200 bg-white dark:border-gray-700 dark:bg-gray-800">
|
||||
<div class="mx-auto max-w-full px-5 py-6">
|
||||
{{ $header2 }}
|
||||
</div>
|
||||
</header>
|
||||
@endif
|
||||
|
||||
<!-- Page Heading -->
|
||||
@if (isset($header))
|
||||
<header class="border-b border-gray-200 bg-white dark:border-gray-800 dark:bg-gray-900">
|
||||
<div class="mx-auto flex h-20 w-full max-w-full items-center justify-between px-8">
|
||||
{{ $header }}
|
||||
</div>
|
||||
</header>
|
||||
@endif
|
||||
|
||||
@if (isset($header2))
|
||||
<header class="border-b border-gray-200 bg-white dark:border-gray-800 dark:bg-gray-900">
|
||||
<div class="mx-auto max-w-full px-8 py-6">
|
||||
{{ $header2 }}
|
||||
</div>
|
||||
</header>
|
||||
@endif
|
||||
|
||||
<!-- Page Content -->
|
||||
<main class="px-8">
|
||||
{{ $slot }}
|
||||
</main>
|
||||
<div class="px-4 py-10">
|
||||
{{ $slot }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
// On page load or when changing themes, best to add inline in `head` to avoid FOUC
|
||||
if (
|
||||
|
||||
Reference in New Issue
Block a user