dave/coolify
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

Refactor modal-confirmation.blade.php for improved readability and maintainability

Browse Source
This commit is contained in:
Andras Bacsai
2024-10-21 11:02:44 +02:00
parent 7eea4b1ebf
commit bc05070f4c
1 changed files with 12 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
resources/views/components/modal-confirmation.blade.php
View File

@@ -159,8 +159,8 @@
<template x-teleport="body"> <template x-teleport="body">
<div x-show="modalOpen" <div x-show="modalOpen"
class="fixed top-0 lg:pt-10 left-0 z-[99] flex items-start justify-center w-screen h-screen" x-cloak> class="fixed top-0 lg:pt-10 left-0 z-[99] flex items-start justify-center w-screen h-screen" x-cloak>
<div x-show="modalOpen" <div x-show="modalOpen" class="absolute inset-0 w-full h-full bg-black bg-opacity-20 backdrop-blur-sm">
class="absolute inset-0 w-full h-full bg-black bg-opacity-20 backdrop-blur-sm"></div> </div>
<div x-show="modalOpen" x-trap.inert.noscroll="modalOpen" x-transition:enter="ease-out duration-100" <div x-show="modalOpen" x-trap.inert.noscroll="modalOpen" x-transition:enter="ease-out duration-100"
x-transition:enter-start="opacity-0 -translate-y-2 sm:scale-95" x-transition:enter-start="opacity-0 -translate-y-2 sm:scale-95"
x-transition:enter-end="opacity-100 translate-y-0 sm:scale-100" x-transition:enter-end="opacity-100 translate-y-0 sm:scale-100"
@@ -240,8 +240,8 @@
class="absolute right-2 top-1/2 text-gray-500 transform -translate-y-1/2 hover:text-gray-700" class="absolute right-2 top-1/2 text-gray-500 transform -translate-y-1/2 hover:text-gray-700"
title="Copy confirmation text" x-ref="copyButton"> title="Copy confirmation text" x-ref="copyButton">
<template x-if="!copied"> <template x-if="!copied">
<svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5" viewBox="0 0 20 20" <svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5"
fill="currentColor"> viewBox="0 0 20 20" fill="currentColor">
<path d="M8 3a1 1 0 011-1h2a1 1 0 110 2H9a1 1 0 01-1-1z" /> <path d="M8 3a1 1 0 011-1h2a1 1 0 110 2H9a1 1 0 01-1-1z" />
<path <path
d="M6 3a2 2 0 00-2 2v11a2 2 0 002 2h8a2 2 0 002-2V5a2 2 0 00-2-2 3 3 0 01-3 3H9a3 3 0 01-3-3z" /> d="M6 3a2 2 0 00-2 2v11a2 2 0 002 2h8a2 2 0 002-2V5a2 2 0 00-2-2 3 3 0 01-3 3H9a3 3 0 01-3-3z" />
@@ -282,10 +282,11 @@
Your Password Your Password
</label> </label>
<form @submit.prevent @keydown.enter.prevent> <form @submit.prevent @keydown.enter.prevent>
<input type="password" id="password-confirm" x-model="password" class="w-full input" <input type="password" id="password-confirm" x-model="password"
placeholder="Enter your password"> class="w-full input" placeholder="Enter your password">
</form> </form>
<p x-show="passwordError" x-text="passwordError" class="mt-1 text-sm text-red-500"></p> <p x-show="passwordError" x-text="passwordError" class="mt-1 text-sm text-red-500">
</p>
@error('password') @error('password')
<p class="mt-1 text-sm text-red-500">{{ $message }}</p> <p class="mt-1 text-sm text-red-500">{{ $message }}</p>
@enderror @enderror
@@ -314,10 +315,9 @@
</template> </template>
<template x-if="step === 2"> <template x-if="step === 2">
<x-forms.button <x-forms.button
x-bind:disabled="!disableTwoStepConfirmation && confirmWithText && userConfirmationText !== confirmationText" x-bind:disabled="!disableTwoStepConfirmation && confirmWithText && userConfirmationText !== confirmationText"
class="w-auto" class="w-auto" isError
isError
@click=" @click="
if (dispatchEvent) { if (dispatchEvent) {
$wire.dispatch(dispatchEventType, dispatchEventMessage); $wire.dispatch(dispatchEventType, dispatchEventMessage);
@@ -329,9 +329,8 @@
resetModal(); resetModal();
submitForm(); submitForm();
} }
" ">
> <span x-text="step2ButtonText"></span>
<span x-text="disableTwoStepConfirmation ? step2ButtonText : 'Permanently Delete'"></span>
</x-forms.button> </x-forms.button>
</template> </template>