From 7e954aa5d1ae244099cce59b60c90a414e55dc05 Mon Sep 17 00:00:00 2001
From: Sam Becker <sam@sambecker.com>
Date: Sat, 31 May 2025 16:48:41 -0500
Subject: [PATCH] Refine component outlines

---
 .vscode/settings.json       | 1 +
 src/app/AppViewSwitcher.tsx | 2 +-
 src/cmdk/CommandKClient.tsx | 2 +-
 src/components/Switcher.tsx | 8 +++-----
 4 files changed, 6 insertions(+), 7 deletions(-)

diff --git a/.vscode/settings.json b/.vscode/settings.json
index d20808fd..43e15f97 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -62,6 +62,7 @@
     "UsKSGcbt",
     "Velvia",
     "verceldb",
+    "viewerjs",
     "WRHGZC",
     "wxyz",
     "zadd",
diff --git a/src/app/AppViewSwitcher.tsx b/src/app/AppViewSwitcher.tsx
index fd92b37b..2eed0ee0 100644
--- a/src/app/AppViewSwitcher.tsx
+++ b/src/app/AppViewSwitcher.tsx
@@ -91,7 +91,7 @@ export default function AppViewSwitcher({
   return (
     <div
       className={clsx(
-        'flex gap-1 sm:gap-2',
+        'flex gap-1.5 sm:gap-2',
         className,
       )}
     >
diff --git a/src/cmdk/CommandKClient.tsx b/src/cmdk/CommandKClient.tsx
index 00f5c786..81bdbfd9 100644
--- a/src/cmdk/CommandKClient.tsx
+++ b/src/cmdk/CommandKClient.tsx
@@ -576,7 +576,7 @@ export default function CommandKClient({
     >
       <Modal
         anchor='top'
-        className="rounded-lg!"
+        className="rounded-[12px]!"
         onClose={() => setIsOpen?.(false)}
         noPadding
         fast
diff --git a/src/components/Switcher.tsx b/src/components/Switcher.tsx
index 40fd7b06..45b0017d 100644
--- a/src/components/Switcher.tsx
+++ b/src/components/Switcher.tsx
@@ -11,12 +11,10 @@ export default function Switcher({
   return (
     <div className={clsx(
       'flex divide-x overflow-hidden',
+      // Apply offset due to outline strategy
+      'translate-x-[1px] rounded-[5px]',
       'divide-medium',
-      'border rounded-md',
-      type === 'regular'
-        ? 'border-medium'
-        : 'border-transparent',
-      type === 'regular' && 'shadow-xs',
+      type === 'regular' && 'outline-medium shadow-xs',
     )}>
       {children}
     </div>