feat: streamline DNS modal in Proxmox by consolidating backdrop and escape key handling for improved user experience

This commit is contained in:
2025-12-04 12:06:41 -05:00
parent 0b8500d679
commit ad7346959d

View File

@@ -795,32 +795,10 @@
</div>
<p class="text-xs text-base/60 mt-1">Entries are applied in order. Add one IPv4/IPv6 resolver per line.</p>
<!-- Modal Backdrop -->
<div x-cloak x-show="showAddDnsModal"
x-transition:enter="transition ease-out duration-300"
x-transition:enter-start="opacity-0"
x-transition:enter-end="opacity-100"
x-transition:leave="transition ease-in duration-200"
x-transition:leave-start="opacity-100"
x-transition:leave-end="opacity-0"
@click="showAddDnsModal = false"
@keydown.escape.window="showAddDnsModal = false"
class="fixed inset-0 z-50 bg-black/50 backdrop-blur-sm"
style="display: none;">
</div>
<!-- Modal -->
<div x-cloak x-show="showAddDnsModal"
x-transition:enter="transition ease-out duration-300"
x-transition:enter-start="opacity-0 scale-95"
x-transition:enter-end="opacity-100 scale-100"
x-transition:leave="transition ease-in duration-200"
x-transition:leave-start="opacity-100 scale-100"
x-transition:leave-end="opacity-0 scale-95"
@click.away="showAddDnsModal = false"
@keydown.escape.window="showAddDnsModal = false"
class="fixed inset-0 z-50 flex items-center justify-center p-4"
style="display: none;">
<div class="relative bg-background-secondary border border-neutral rounded-lg shadow-xl w-full max-w-xl mx-4 p-5 space-y-4">
<div x-cloak x-show="showAddDnsModal" x-transition.opacity class="fixed inset-0 z-50 flex items-center justify-center">
<div class="absolute inset-0 bg-black/40 backdrop-blur-sm" @click="showAddDnsModal = false"></div>
<div class="relative bg-background-secondary border border-neutral rounded-lg shadow-xl w-full max-w-xl mx-4 p-5 space-y-4"
x-on:keydown.escape.window="showAddDnsModal = false">
<div class="flex items-center justify-between">
<h4 class="text-base font-semibold text-base/90">Add DNS Nameserver</h4>
<button type="button"