mirror of
https://github.com/coollabsio/coolify.git
synced 2026-11-06 13:10:37 -04:00
fix(ui): clarify dialogs, use a red focus ring on error buttons, fix missing icons
- The certificate delete dialog no longer lists a proxy restart it does not perform, and its warning mentions the backup. - Confirmation dialogs list actions with a dash instead of a trash icon. - Error buttons get a red focus ring instead of the accent ring. - Use existing icons for the TLS empty state and built-in shared variables.
This commit is contained in:
@@ -127,6 +127,15 @@
|
||||
box-shadow: var(--button-depth-hover), 0 0 0 1px var(--color-accent);
|
||||
}
|
||||
|
||||
/* Destructive buttons keep a focus indicator in their own red instead of the accent. */
|
||||
.button.button-error:not(:disabled):focus-visible {
|
||||
box-shadow: var(--button-depth), 0 0 0 1px var(--color-red-500);
|
||||
}
|
||||
|
||||
.button.button-error:not(:disabled):hover:focus-visible {
|
||||
box-shadow: var(--button-depth-hover), 0 0 0 1px var(--color-red-500);
|
||||
}
|
||||
|
||||
/* Other button-like controls retain the lighter scale feedback. */
|
||||
.button,
|
||||
.icon-button,
|
||||
|
||||
@@ -267,21 +267,21 @@
|
||||
<ul class="mb-4 space-y-2">
|
||||
@foreach ($actions as $action)
|
||||
<li class="flex items-start gap-2 text-[12px] leading-5 text-red-600 dark:text-red-400">
|
||||
<x-reicon name="trash" class="mt-0.5 size-3.5 shrink-0" />
|
||||
<span class="shrink-0" aria-hidden="true">-</span>
|
||||
<span>{{ $action }}</span>
|
||||
</li>
|
||||
@endforeach
|
||||
@foreach ($checkboxes as $checkbox)
|
||||
<template x-if="selectedActions.includes('{{ $checkbox['id'] }}')">
|
||||
<li class="flex items-start gap-2 text-[12px] leading-5 text-red-600 dark:text-red-400">
|
||||
<x-reicon name="trash" class="mt-0.5 size-3.5 shrink-0" />
|
||||
<span class="shrink-0" aria-hidden="true">-</span>
|
||||
<span>{{ $checkbox['label'] }}</span>
|
||||
</li>
|
||||
</template>
|
||||
@if (isset($checkbox['default_warning']))
|
||||
<template x-if="!selectedActions.includes('{{ $checkbox['id'] }}')">
|
||||
<li class="flex items-start gap-2 text-[12px] leading-5 text-red-600 dark:text-red-400">
|
||||
<x-reicon name="trash" class="mt-0.5 size-3.5 shrink-0" />
|
||||
<span class="shrink-0" aria-hidden="true">-</span>
|
||||
<span>{{ $checkbox['default_warning'] }}</span>
|
||||
</li>
|
||||
</template>
|
||||
|
||||
@@ -123,7 +123,7 @@
|
||||
<span class="env-type-desktop text-[13px] text-neutral-500 dark:text-fg-dim">{{ str($type)->headline() }}</span>
|
||||
<span class="min-w-0 truncate font-mono text-[13px]" title="{{ $env->value }}">{{ $env->value }}</span>
|
||||
<span class="data-table-cell-dash">-</span>
|
||||
<span class="justify-self-end text-neutral-400 dark:text-fg-faint" title="Built-in variable, managed by Coolify"><x-reicon name="lock" class="size-3.5" /></span>
|
||||
<span class="justify-self-end text-neutral-400 dark:text-fg-faint" title="Built-in variable, managed by Coolify"><x-reicon name="keys" class="size-3.5" /></span>
|
||||
</div>
|
||||
</div>
|
||||
@else
|
||||
|
||||
@@ -156,8 +156,8 @@
|
||||
:actions="[
|
||||
'Save the current acme.json as a backup that you can restore below.',
|
||||
'Delete the certificate for '.$certificate['main_domain'].' from acme.json.',
|
||||
'Restart the proxy before it stops using the certificate. If a route still uses the domain, Traefik requests a new certificate after the restart.',
|
||||
]"
|
||||
warningMessage="The proxy keeps using the certificate until you restart it. If a route still uses the domain, Traefik requests a new certificate after the restart. You can restore the backup below to undo this."
|
||||
confirmationText="{{ $certificate['main_domain'] }}"
|
||||
confirmationLabel="Confirm by entering the domain"
|
||||
shortConfirmationLabel="Domain"
|
||||
|
||||
Reference in New Issue
Block a user