From ba811d725aad10f58f6d07c92180bcf8bfaa0586 Mon Sep 17 00:00:00 2001
From: Shariq Ansari <sharique.rik@gmail.com>
Date: Mon, 27 May 2024 14:13:06 +0530
Subject: [PATCH] fix: render call ui in mobile view correctly

---
 frontend/src/components/CallUI.vue                 | 3 ++-
 frontend/src/components/Mobile/MobileAppHeader.vue | 6 ++----
 2 files changed, 4 insertions(+), 5 deletions(-)

diff --git a/frontend/src/components/CallUI.vue b/frontend/src/components/CallUI.vue
index 2123daf9..693257de 100644
--- a/frontend/src/components/CallUI.vue
+++ b/frontend/src/components/CallUI.vue
@@ -1,5 +1,5 @@
 <template>
-  <div v-show="showCallPopup">
+  <div v-show="showCallPopup" v-bind="$attrs">
     <div
       ref="callPopup"
       class="fixed z-20 flex w-60 cursor-move select-none flex-col rounded-lg bg-gray-900 p-4 text-gray-300 shadow-2xl"
@@ -116,6 +116,7 @@
     v-show="showSmallCallWindow"
     class="ml-2 flex cursor-pointer select-none items-center justify-between gap-3 rounded-lg bg-gray-900 px-2 py-[7px] text-base text-gray-300"
     @click="toggleCallWindow"
+    v-bind="$attrs"
   >
     <div class="flex items-center gap-2">
       <Avatar
diff --git a/frontend/src/components/Mobile/MobileAppHeader.vue b/frontend/src/components/Mobile/MobileAppHeader.vue
index 45ad5de9..2270a841 100644
--- a/frontend/src/components/Mobile/MobileAppHeader.vue
+++ b/frontend/src/components/Mobile/MobileAppHeader.vue
@@ -5,11 +5,9 @@
         <FeatherIcon name="menu" class="size-4" />
       </Button>
     </div>
-    <div id="app-header" class="flex-1"></div>
-    <div class="flex items-center justify-center">
-      <CallUI />
-    </div>
+    <div id="app-header" class="flex-1" />
   </div>
+  <CallUI class="mr-3 mt-2" />
 </template>
 
 <script setup>