fix modal, add env variables, etc

resources/views/components/inputs/input.blade.php

@@ -26,7 +26,8 @@
     @if ($type === 'textarea')
         <textarea {{ $attributes }} type={{ $type }} id={{ $id }} wire:model.defer={{ $id }}></textarea>
     @else
-        <input {{ $attributes }} type={{ $type }} id={{ $id }}
+        <input wire:dirty.class="text-black bg-amber-300" {{ $attributes }} type={{ $type }}
+            id={{ $id }}
             @if ($instantSave) wire:click='instantSave' wire:model.defer={{ $id }} @else wire:model.defer={{ $value ?? $id }} @endif />
     @endif
 

resources/views/components/layout.blade.php

@@ -76,6 +76,9 @@
             Livewire.on('reloadWindow', () => {
                 window.location.reload();
             })
+            Livewire.on('error', (message) => {
+                alert(message);
+            })
         </script>
     @endauth
 </body>

resources/views/components/naked-modal.blade.php

@@ -0,0 +1,19 @@
+@props([
+    'show' => null,
+    'message' => 'Are you sure you want to delete this?',
+    'action' => 'delete',
+])
+<div x-cloak x-show="{{ $show }}" x-transition.opacity class="fixed inset-0 bg-slate-900/75"></div>
+<div x-cloak x-show="{{ $show }}" x-transition class="fixed inset-0 z-50 flex items-center justify-center">
+    <div @click.away="{{ $show }} = false" class="w-screen h-20 max-w-xl mx-auto bg-black rounded-lg">
+        <div class="flex flex-col items-center justify-center h-full">
+            <div class="pb-5 text-white">{{ $message }}</div>
+            <div>
+                <x-inputs.button isWarning wire:click='{{ $action }}'>
+                    Yes
+                </x-inputs.button>
+                <x-inputs.button x-on:click="{{ $show }} = false">No</x-inputs.button>
+            </div>
+        </div>
+    </div>
+</div>