From 277c68d8e5f95b57d44e00ea180c359ada56bd3c Mon Sep 17 00:00:00 2001
From: Adam <2363879+adamdotdevin@users.noreply.github.com>
Date: Tue, 17 Feb 2026 07:34:02 -0600
Subject: [PATCH] chore: app polish (#13976)

Co-authored-by: David Hill <iamdavidhill@gmail.com>
---
 packages/app/src/components/prompt-input.tsx | 48 ++++++++++++--------
 packages/app/src/components/titlebar.tsx     |  2 +-
 2 files changed, 30 insertions(+), 20 deletions(-)

diff --git a/packages/app/src/components/prompt-input.tsx b/packages/app/src/components/prompt-input.tsx
index 7813e01cd..54b9286eb 100644
--- a/packages/app/src/components/prompt-input.tsx
+++ b/packages/app/src/components/prompt-input.tsx
@@ -1334,7 +1334,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
             <div class="shrink-0">
               <div
                 data-component="prompt-mode-toggle"
-                class="relative h-8 w-[68px] rounded-[4px] bg-surface-inset-base shadow-[var(--shadow-xs-border-base)] p-0 flex items-center gap-1 overflow-visible"
+                class="relative h-6 w-[68px] rounded-[4px] bg-surface-inset-base border border-[0.5px] border-border-weak-base p-0 flex items-center gap-1 overflow-visible"
               >
                 <div
                   class="absolute inset-y-0 left-0 w-[calc((100%-4px)/2)] rounded-[4px] bg-surface-raised-stronger-non-alpha shadow-[var(--shadow-xs-border)] transition-transform duration-200 ease-out will-change-transform"
@@ -1344,33 +1344,43 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
                 />
                 <button
                   type="button"
-                  class="relative z-10 flex-1 h-full flex items-center justify-center rounded-[4px]"
+                  class="relative z-10 flex-1 h-full p-0.5 flex items-center justify-center"
                   aria-pressed={store.mode === "shell"}
                   onClick={() => setMode("shell")}
                 >
-                  <Icon
-                    name="console"
-                    size="normal"
-                    classList={{
-                      "text-icon-strong-base": store.mode === "shell",
-                      "text-icon-weak": store.mode !== "shell",
-                    }}
-                  />
+                  <div
+                    class="w-full h-full flex items-center justify-center rounded-[2px] transition-colors hover:bg-surface-inset-base"
+                    classList={{ "hover:bg-transparent": store.mode === "shell" }}
+                  >
+                    <Icon
+                      name="console"
+                      class="size-[18px]"
+                      classList={{
+                        "text-icon-strong-base": store.mode === "shell",
+                        "text-icon-weak": store.mode !== "shell",
+                      }}
+                    />
+                  </div>
                 </button>
                 <button
                   type="button"
-                  class="relative z-10 flex-1 h-full flex items-center justify-center rounded-[4px]"
+                  class="relative z-10 flex-1 h-full p-0.5 flex items-center justify-center"
                   aria-pressed={store.mode === "normal"}
                   onClick={() => setMode("normal")}
                 >
-                  <Icon
-                    name="prompt"
-                    size="normal"
-                    classList={{
-                      "text-icon-interactive-base": store.mode === "normal",
-                      "text-icon-weak": store.mode !== "normal",
-                    }}
-                  />
+                  <div
+                    class="w-full h-full flex items-center justify-center rounded-[2px] transition-colors hover:bg-surface-inset-base"
+                    classList={{ "hover:bg-transparent": store.mode === "normal" }}
+                  >
+                    <Icon
+                      name="prompt"
+                      class="size-[18px]"
+                      classList={{
+                        "text-icon-interactive-base": store.mode === "normal",
+                        "text-icon-weak": store.mode !== "normal",
+                      }}
+                    />
+                  </div>
                 </button>
               </div>
             </div>
diff --git a/packages/app/src/components/titlebar.tsx b/packages/app/src/components/titlebar.tsx
index e10fbe3b3..262b3e073 100644
--- a/packages/app/src/components/titlebar.tsx
+++ b/packages/app/src/components/titlebar.tsx
@@ -278,7 +278,7 @@ export function Titlebar() {
         }}
         onMouseDown={drag}
       >
-        <div id="opencode-titlebar-right" class="flex items-center gap-3 shrink-0 justify-end" />
+        <div id="opencode-titlebar-right" class="flex items-center gap-1 shrink-0 justify-end" />
         <Show when={windows()}>
           <div class="w-6 shrink-0" />
           <div data-tauri-decorum-tb class="flex flex-row" />