From dc87a4be58e4b09b000ebee660108affe7f9e7e6 Mon Sep 17 00:00:00 2001
From: obrucheoghene <obrucheoghene1@gmail.com>
Date: Tue, 25 Nov 2025 13:04:48 +0100
Subject: [PATCH] fix: show end button in small screen

---
 src/components/room/control-bar.tsx           | 3 +++
 src/components/room/media-device-dropdown.tsx | 2 +-
 2 files changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/components/room/control-bar.tsx b/src/components/room/control-bar.tsx
index 4c19293..608ac13 100644
--- a/src/components/room/control-bar.tsx
+++ b/src/components/room/control-bar.tsx
@@ -34,6 +34,9 @@ const ControlBar = () => {
 
         {/* Right Controls */}
         <div className="flex items-center gap-2 ">
+          <span className=" md:hidden">
+            <End />
+          </span>
           <Chat />
           <Users />
           <Menu />
diff --git a/src/components/room/media-device-dropdown.tsx b/src/components/room/media-device-dropdown.tsx
index 70ba9d6..38e798f 100644
--- a/src/components/room/media-device-dropdown.tsx
+++ b/src/components/room/media-device-dropdown.tsx
@@ -39,7 +39,7 @@ const MediaDeviceDropdown = ({
         <Button
           variant="ghost"
           size="icon"
-          className="w-8 h-8 rounded-lg bg-white/5 hover:bg-white/10 text-gray-400 cursor-pointer"
+          className="w-8 h-8 hidden md:flex  rounded-lg bg-white/5 hover:bg-white/10 text-gray-400 cursor-pointer"
         >
           <MoreVertical className="w-4 h-4" />
         </Button>