Polish styling of contacts popover

Co-Authored-By: Nathan Sobo <nathan@zed.dev>

styles/src/styleTree/contactFinder.ts

@@ -3,7 +3,7 @@ import picker from "./picker";
 import { backgroundColor, border, iconColor, player, text } from "./components";
 
 export default function contactFinder(theme: Theme) {
-  const sideMargin = 12;
+  const sideMargin = 6;
   const contactButton = {
     background: backgroundColor(theme, 100),
     color: iconColor(theme, "primary"),
@@ -33,8 +33,8 @@ export default function contactFinder(theme: Theme) {
           top: 4,
         },
         margin: {
-          left: 12,
-          right: 12,
+          left: sideMargin,
+          right: sideMargin,
         }
       }
     },

styles/src/styleTree/contactList.ts

@@ -53,22 +53,20 @@ export default function contactList(theme: Theme) {
         top: 4,
       },
       margin: {
-        left: sidePadding,
-        right: sidePadding,
+        left: 6
       },
     },
     userQueryEditorHeight: 33,
     addContactButton: {
-      margin: { left: 6, right: 12 },
       color: iconColor(theme, "primary"),
-      buttonWidth: 16,
+      buttonWidth: 28,
       iconWidth: 16,
     },
     rowHeight: 28,
     sectionIconSize: 8,
     headerRow: {
       ...text(theme, "mono", "secondary", { size: "sm" }),
-      margin: { top: 14 },
+      margin: { top: 6 },
       padding: {
         left: sidePadding,
         right: sidePadding,

styles/src/styleTree/contactsPopover.ts

@@ -8,7 +8,7 @@ export default function contactsPopover(theme: Theme) {
     padding: { top: 6 },
     shadow: popoverShadow(theme),
     border: border(theme, "primary"),
-    width: 250,
-    height: 300,
+    width: 300,
+    height: 400,
   }
 }