mirror of
https://github.com/tiennm99/coolify.git
synced 2026-08-20 06:23:23 +00:00
Andras Bacsai
bdb367555d
Standardize highlighted buttons, selected controls, and loading indicators on coollabs accent colors; improve light-mode log toolbar styling; enhance small popups with compact/icon modes; and align navbars, helpers, and related layouts with matching tests.
53 lines
2.8 KiB
PHP
53 lines
2.8 KiB
PHP
@props([
|
|
'provider',
|
|
'providerLabel',
|
|
'routeType' => null,
|
|
'tokens',
|
|
])
|
|
|
|
<x-application.settings-section title="{{ $providerLabel }} account"
|
|
description="Choose the cloud credential Coolify should use for this server." flush>
|
|
@if ($tokens->isEmpty())
|
|
<x-empty title="No {{ $providerLabel }} tokens"
|
|
description="Add an API token to continue provisioning." icon-name="keys" size="sm">
|
|
<x-slot:actions>
|
|
<x-modal-input title="Add {{ $providerLabel }} Token">
|
|
<x-slot:content>
|
|
<button type="button"
|
|
class="button button-highlighted">
|
|
<x-reicon name="plus" class="size-3.5" />
|
|
Add token
|
|
</button>
|
|
</x-slot:content>
|
|
<livewire:security.cloud-provider-token-form :modal_mode="true" :provider="$provider"
|
|
wire:key="new-server-provider-token-{{ $provider }}" />
|
|
</x-modal-input>
|
|
</x-slot:actions>
|
|
</x-empty>
|
|
@else
|
|
<div class="grid grid-cols-1 gap-3 p-3 sm:grid-cols-2 lg:grid-cols-4">
|
|
@foreach ($tokens as $token)
|
|
<a wire:key="{{ $provider }}-token-{{ $token->id }}"
|
|
class="group flex min-h-28 min-w-0 flex-col rounded-xl border border-neutral-200 bg-white p-3 shadow-sm transition-all hover:-translate-y-px hover:border-neutral-300 hover:no-underline hover:shadow-md dark:border-white/[0.08] dark:bg-white/[0.025] dark:hover:border-white/[0.14]"
|
|
href="{{ route('server.create.token', ['type' => $routeType ?: $provider, 'token_uuid' => $token->uuid]) }}"
|
|
{{ wireNavigate() }}>
|
|
<div class="flex items-start gap-3">
|
|
<span
|
|
class="flex size-8 shrink-0 items-center justify-center rounded-lg border border-neutral-200 bg-neutral-50 text-neutral-500 dark:border-white/[0.08] dark:bg-white/[0.04] dark:text-fg-dim">
|
|
<x-reicon name="keys" class="size-4" />
|
|
</span>
|
|
<div class="min-w-0 flex-1">
|
|
<h3 class="truncate text-[13px]! font-semibold! text-black dark:text-fg">
|
|
{{ $token->name ?? $providerLabel . ' token' }}
|
|
</h3>
|
|
<p class="mt-1 line-clamp-2 text-[11px] leading-4 text-neutral-500 dark:text-fg-faint">
|
|
{{ $token->description ?: 'Use this token to provision the server.' }}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
@endforeach
|
|
</div>
|
|
@endif
|
|
</x-application.settings-section>
|