feat: add zIndex prop to drawer component and update modal z-index

Signed-off-by: Sameh16 <sameh_mohamed16@hotmail.com>

Author: Sameh16

frontend/src/shared/drawer/drawer.vue

@@ -11,6 +11,7 @@
       :destroy-on-close="true"
       :close-on-click-modal="false"
       :size="size"
+      :z-index="zIndex"
       @close="onClose"
     >
       <template #header="{ close, titleId, titleClass }">
@@ -67,6 +68,7 @@
 import { defineProps, computed, defineEmits } from 'vue';
 import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfButton from '@/ui-kit/button/Button.vue';
+import { number } from 'yup';
 
 const emit = defineEmits(['update:modelValue', 'close']);
 const props = defineProps({
@@ -106,6 +108,10 @@ const props = defineProps({
     type: Boolean,
     default: () => true,
   },
+  zIndex: {
+    type: number,
+    default: () => 2004,
+  },
 });
 
 const model = computed({

frontend/src/ui-kit/modal/modal.scss

@@ -5,7 +5,7 @@
   width: 100%;
   height: 100%;
   background-color: rgba(0, 30, 51, 0.1);
-  z-index: 2020;
+  z-index: 2005;
   visibility: visible;
   opacity: 1;
   display: flex;