From a01e8adf8a3916f4b7af9210f294e27ea23bcab2 Mon Sep 17 00:00:00 2001
From: philipp lang <philipp@aweos.de>
Date: Tue, 27 Aug 2024 18:19:52 +0200
Subject: [PATCH] Add backdrop

---
 resources/js/components/ui/Popup.vue | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/resources/js/components/ui/Popup.vue b/resources/js/components/ui/Popup.vue
index eb7eff45..0c84fa42 100644
--- a/resources/js/components/ui/Popup.vue
+++ b/resources/js/components/ui/Popup.vue
@@ -1,7 +1,9 @@
 <template>
-    <div class="fixed z-40 top-0 left-0 w-full h-full flex items-center justify-center p-6">
-        <div class="relative rounded-lg p-8 bg-zinc-800 shadow-2xl shadow-black border border-zinc-700 border-solid w-full max-h-full flex flex-col overflow-auto"
-            :class="full ? 'h-full' : innerWidth">
+    <div class="fixed z-40 top-0 left-0 w-full h-full flex items-center justify-center p-6 bg-black/60 backdrop-blur-sm">
+        <div
+            class="relative rounded-lg p-8 bg-zinc-800 shadow-2xl shadow-black border border-zinc-700 border-solid w-full max-h-full flex flex-col overflow-auto"
+            :class="full ? 'h-full' : innerWidth"
+        >
             <div class="absolute top-0 right-0 mt-6 mr-6 flex space-x-6">
                 <slot name="actions"></slot>
                 <a href="#" @click.prevent="$emit('close')">