From a74eb3784cf56f41a2f1df200733d3f0f76e2e97 Mon Sep 17 00:00:00 2001
From: MarconLP <13001502+MarconLP@users.noreply.github.com>
Date: Sun, 9 Jul 2023 10:39:40 +0200
Subject: [PATCH] add backdrop to recorder

---
 src/components/VideoRecordModal.tsx | 13 +++++++++++++
 1 file changed, 13 insertions(+)

diff --git a/src/components/VideoRecordModal.tsx b/src/components/VideoRecordModal.tsx
index d36bfb0..a914547 100644
--- a/src/components/VideoRecordModal.tsx
+++ b/src/components/VideoRecordModal.tsx
@@ -25,6 +25,19 @@ export default function VideoRecordModal() {
   return (
     <Transition appear show={open} as={Fragment}>
       <Dialog as="div" className="relative z-10" onClose={handleClose}>
+        {/* backdrop */}
+        <Transition.Child
+          as={Fragment}
+          enter="ease-out duration-300"
+          enterFrom="opacity-0"
+          enterTo="opacity-100"
+          leave="ease-in duration-200"
+          leaveFrom="opacity-100"
+          leaveTo="opacity-0"
+        >
+          <div className="fixed inset-0 bg-black bg-opacity-25" />
+        </Transition.Child>
+
         <div className="fixed inset-0 overflow-y-auto">
           <div className="flex min-h-full items-center justify-center p-4 text-center">
             <Transition.Child