Increased party width and mute icon size

src/components/Nickname.js

@@ -22,10 +22,10 @@ function Nickname({ nickname, stream }) {
       {stream && (
         <IconButton
           sx={{
-            width: "10px",
-            height: "10px",
+            width: "14px",
+            height: "14px",
             padding: 0,
-            margin: "2px",
+            marginLeft: "2px",
             position: "absolute",
             bottom: "-2px",
           }}
@@ -34,9 +34,9 @@ function Nickname({ nickname, stream }) {
         >
           <svg
             xmlns="http://www.w3.org/2000/svg"
-            height="10"
+            height="14"
             viewBox="0 0 24 24"
-            width="10"
+            width="14"
             fill="currentcolor"
           >
             {streamMuted ? (

src/components/Party.js

@@ -22,8 +22,8 @@ function Party({
       bg="background"
       sx={{
         flexDirection: "column",
-        width: "96px",
-        minWidth: "96px",
+        width: "112px",
+        minWidth: "112px",
         overflowY: "auto",
         alignItems: "center",
       }}

src/components/ProxyToken.js

@@ -55,9 +55,10 @@ function ProxyToken({ tokenClassName, onProxyDragEnd }) {
             if (proxyContainer) {
               const proxyContainerRect = proxyContainer.getBoundingClientRect();
               const proxyRect = proxy.getBoundingClientRect();
+              // TODO: Look into a better method than hardcoding these values
               proxyOnMap.current =
                 proxyContainerRect.right - proxyRect.right > 80 &&
-                proxyRect.left > 96;
+                proxyRect.left > 112;
             }
 
             // update the posiion attributes