From 37256a0c1ab67f0059e6b7d65ec4d9ff5befa6b3 Mon Sep 17 00:00:00 2001
From: bennybrainless <242895261+bennybrainless@users.noreply.github.com>
Date: Thu, 20 Nov 2025 23:11:21 -0600
Subject: [PATCH] Adjust call panel layout sizing

---
 discord/src/components/ParticipantBox.tsx              | 8 +++++++-
 discord/src/pages/dashboard/panels/CallStatusPanel.tsx | 6 +++++-
 2 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/discord/src/components/ParticipantBox.tsx b/discord/src/components/ParticipantBox.tsx
index 34c815f..e7548c1 100644
--- a/discord/src/components/ParticipantBox.tsx
+++ b/discord/src/components/ParticipantBox.tsx
@@ -31,7 +31,13 @@ export const ParticipantBox = ({ participant }: ParticipantBoxProps) => {
         <img
           src={profileUrl}
           alt={participant.username}
-          className="h-[55%] object-cover rounded-full"
+          style={{
+            maxWidth: "80%",
+            maxHeight: "80%",
+            width: "70%",
+            height: "70%",
+          }}
+          className="object-cover rounded-full"
         />
       )}
       <p
diff --git a/discord/src/pages/dashboard/panels/CallStatusPanel.tsx b/discord/src/pages/dashboard/panels/CallStatusPanel.tsx
index 52c83bd..2b42a51 100644
--- a/discord/src/pages/dashboard/panels/CallStatusPanel.tsx
+++ b/discord/src/pages/dashboard/panels/CallStatusPanel.tsx
@@ -31,13 +31,17 @@ export const CallStatusPanel = () => {
     const gap = 24; // gap-6
     const horizontalPadding = 48; // approximate padding from p-4/md:p-6
     const verticalPadding = 48;
+    const headerHeight = 64; // approximate height of the header block including padding/border
 
     const count = participants.length || 1;
     const columns = Math.min(count, Math.max(1, Math.ceil(Math.sqrt(count))));
     const rows = Math.max(1, Math.ceil(count / columns));
 
     const availableWidth = Math.max(panelDimensions.width - horizontalPadding, minTileSize);
-    const availableHeight = Math.max(panelDimensions.height - verticalPadding, minTileSize);
+    const availableHeight = Math.max(
+      panelDimensions.height - verticalPadding - headerHeight,
+      minTileSize,
+    );
 
     const sizeByWidth = Math.floor((availableWidth - gap * (columns - 1)) / columns);
     const sizeByHeight = Math.floor((availableHeight - gap * (rows - 1)) / rows);