mirror of
https://github.com/tiennm99/coolify.git
synced 2026-10-18 02:14:32 +00:00
feat(ui): unify resource nav sidebars and polish project layouts
Extract application/database/service configuration sidebars and unified headings; improve clone-to-environment, embedded deployments, storage actions, OAuth icons, terminal, and shared form components.
This commit is contained in:
1 parent
2291c3fa1c
commit
5de6f97256
85 files changed
+2087
-981
No files matched your search
@@ -1,7 +1,9 @@
|
||||
<div>
|
||||
<x-slot:title>{{ data_get_str($application, 'name')->limit(10) }} > Deployments | Coolify</x-slot>
|
||||
<livewire:project.shared.configuration-checker :resource="$application" />
|
||||
<livewire:project.application.heading :application="$application" wire:key="application-heading-deployment-index" />
|
||||
@unless ($embedded)
|
||||
<x-slot:title>{{ data_get_str($application, 'name')->limit(10) }} > Deployments | Coolify</x-slot>
|
||||
<livewire:project.shared.configuration-checker :resource="$application" />
|
||||
<livewire:project.application.heading :application="$application" wire:key="application-heading-deployment-index" />
|
||||
@endunless
|
||||
|
||||
@php
|
||||
$lastPage = max(1, (int) ceil($deployments_count / $defaultTake));
|
||||
@@ -11,7 +13,20 @@
|
||||
$hasActiveQuery = trim($search) !== '' || $hasActiveFilter;
|
||||
@endphp
|
||||
|
||||
<div class="application-settings-form"
|
||||
<section @class([
|
||||
'application-settings-workspace w-full',
|
||||
'mt-4 max-w-[1180px] lg:mt-0' => ! $embedded,
|
||||
])>
|
||||
<div @class([
|
||||
'min-w-0',
|
||||
'grid gap-8 xl:grid-cols-[210px_minmax(0,1fr)] xl:gap-10' => ! $embedded,
|
||||
])>
|
||||
@unless ($embedded)
|
||||
<x-application.configuration-sidebar :application="$application"
|
||||
current-route="project.application.deployment.index" />
|
||||
@endunless
|
||||
|
||||
<div class="application-settings-form min-w-0"
|
||||
@if (!$skip) wire:poll.5000ms="reloadDeployments" @endif>
|
||||
<x-application.settings-section title="Deployment history"
|
||||
helper="Search, filter, and open a deployment to inspect its build logs." flush>
|
||||
@@ -204,7 +219,10 @@
|
||||
<a wire:key="deployment-{{ data_get($deployment, 'deployment_uuid') }}"
|
||||
href="{{ $current_url . '/' . data_get($deployment, 'deployment_uuid') }}"
|
||||
{{ wireNavigate() }}
|
||||
class="data-table-row deployment-table-grid border-b border-neutral-200 text-[13px] text-neutral-600 dark:border-white/[0.08] dark:text-fg-dim">
|
||||
@class([
|
||||
'data-table-row deployment-table-grid border-b border-neutral-200 text-[13px] text-neutral-600 dark:border-white/[0.08] dark:text-fg-dim',
|
||||
'data-table-row-active' => $selectedDeploymentUuid === data_get($deployment, 'deployment_uuid'),
|
||||
])>
|
||||
<span><x-status-badge :status="$statusLabel" :type="$statusType" /></span>
|
||||
<span>{{ $sourceLabel }}</span>
|
||||
<span class="min-w-0">
|
||||
@@ -247,4 +265,6 @@
|
||||
@endif
|
||||
</x-application.settings-section>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
@@ -1,10 +1,20 @@
|
||||
<div class="flex h-[calc(100dvh-7.5rem)] min-h-[22rem] flex-col overflow-hidden sm:h-[calc(100vh-8rem)] sm:min-h-[32rem] lg:min-h-[42rem]">
|
||||
<div
|
||||
class="flex min-h-[calc(100dvh-7.5rem)] flex-col xl:h-[calc(100dvh-7.5rem)] xl:min-h-0 xl:overflow-hidden">
|
||||
<x-slot:title>
|
||||
{{ data_get_str($application, 'name')->limit(10) }} > Deployment | Coolify
|
||||
</x-slot>
|
||||
<livewire:project.shared.configuration-checker :resource="$application" />
|
||||
<livewire:project.application.heading :application="$application" wire:key="application-heading-deployment-show" />
|
||||
<div x-data="{
|
||||
<section class="application-settings-workspace flex min-h-0 w-full max-w-[1180px] flex-1">
|
||||
<div class="grid min-h-0 min-w-0 flex-1 gap-8 xl:grid-cols-[210px_minmax(0,1fr)] xl:gap-10">
|
||||
<x-application.configuration-sidebar :application="$application" :flush="true"
|
||||
current-route="project.application.deployment.show" />
|
||||
<div class="flex min-h-0 min-w-0 flex-col gap-4 xl:h-full xl:pt-px">
|
||||
<livewire:project.application.deployment.index :embedded="true"
|
||||
:selected-deployment-uuid="$deployment_uuid"
|
||||
wire:key="embedded-deployment-history-{{ $deployment_uuid }}" />
|
||||
|
||||
<div x-data="{
|
||||
fullscreen: @entangle('fullscreen'),
|
||||
alwaysScroll: {{ $isKeepAliveOn ? 'true' : 'false' }},
|
||||
rafId: null,
|
||||
@@ -261,8 +271,8 @@
|
||||
this.deploymentFinishedCleanup = null;
|
||||
}
|
||||
}
|
||||
}" class="flex flex-1 min-h-0 flex-col overflow-hidden">
|
||||
<div id="screen" :class="fullscreen ? 'fullscreen flex flex-col' : 'mt-2 flex flex-1 min-h-0 flex-col overflow-hidden lg:mt-3'">
|
||||
}" class="flex h-[calc(100dvh-8rem)] min-h-[32rem] w-full flex-col overflow-hidden xl:h-auto xl:min-h-0 xl:flex-1">
|
||||
<div id="screen" :class="fullscreen ? 'fullscreen flex flex-col' : 'mt-2 flex flex-1 min-h-0 flex-col overflow-hidden lg:mt-0'">
|
||||
<div @if ($isKeepAliveOn) wire:poll.2000ms="polling" @endif
|
||||
class="logs-viewer flex min-h-0 w-full flex-col overflow-hidden bg-[#0d0d0d] text-neutral-100"
|
||||
:class="fullscreen ? 'h-full' : 'flex-1 rounded-xl border border-neutral-800 shadow-sm'">
|
||||
@@ -456,4 +466,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
Reference in new issue
Block a user