From c471b5d3fa6ce1968adb4cf87a15ac0e18febd20 Mon Sep 17 00:00:00 2001
From: simosmik <simosmik@gmail.com>
Date: Mon, 20 Apr 2026 15:05:08 +0000
Subject: [PATCH] fix: small mobile respnosive fixes

---
 .../chat/view/subcomponents/ChatComposer.tsx  |  7 ++++---
 .../PermissionRequestsBanner.tsx              | 21 ++++++++++---------
 2 files changed, 15 insertions(+), 13 deletions(-)

diff --git a/src/components/chat/view/subcomponents/ChatComposer.tsx b/src/components/chat/view/subcomponents/ChatComposer.tsx
index 1be8273f..b9d9076c 100644
--- a/src/components/chat/view/subcomponents/ChatComposer.tsx
+++ b/src/components/chat/view/subcomponents/ChatComposer.tsx
@@ -327,7 +327,7 @@ export default function ChatComposer({
             <button
               type="button"
               onClick={onModeSwitch}
-              className={`rounded-lg border px-2.5 py-1 text-xs font-medium transition-all duration-200 ${
+              className={`rounded-lg border px-1.5 py-1 text-xs font-medium transition-all duration-200 sm:px-2.5 ${
                 permissionMode === 'default'
                   ? 'border-border/60 bg-muted/50 text-muted-foreground hover:bg-muted'
                   : permissionMode === 'acceptEdits'
@@ -340,7 +340,7 @@ export default function ChatComposer({
             >
               <div className="flex items-center gap-1.5">
                 <div
-                  className={`h-1.5 w-1.5 rounded-full ${
+                  className={`h-2 w-2 rounded-full sm:h-1.5 sm:w-1.5 ${
                     permissionMode === 'default'
                       ? 'bg-muted-foreground'
                       : permissionMode === 'acceptEdits'
@@ -350,7 +350,7 @@ export default function ChatComposer({
                           : 'bg-primary'
                   }`}
                 />
-                <span>
+                <span className="hidden sm:inline">
                   {permissionMode === 'default' && t('codex.modes.default')}
                   {permissionMode === 'acceptEdits' && t('codex.modes.acceptEdits')}
                   {permissionMode === 'bypassPermissions' && t('codex.modes.bypassPermissions')}
@@ -384,6 +384,7 @@ export default function ChatComposer({
               <PromptInputButton
                 tooltip={{ content: t('input.clearInput', { defaultValue: 'Clear input' }) }}
                 onClick={onClearInput}
+                className="hidden sm:inline-flex"
               >
                 <XIcon />
               </PromptInputButton>
diff --git a/src/components/chat/view/subcomponents/PermissionRequestsBanner.tsx b/src/components/chat/view/subcomponents/PermissionRequestsBanner.tsx
index dc1e6f84..0641f186 100644
--- a/src/components/chat/view/subcomponents/PermissionRequestsBanner.tsx
+++ b/src/components/chat/view/subcomponents/PermissionRequestsBanner.tsx
@@ -83,19 +83,20 @@ export default function PermissionRequestsBanner({
                     Allow rule: <code className="rounded bg-muted px-1 py-0.5 text-xs">{permissionEntry}</code>
                   </div>
                 )}
-                {rawInput && (
-                  <details className="mt-2">
-                    <summary className="cursor-pointer text-xs text-muted-foreground hover:text-foreground">
-                      View tool input
-                    </summary>
-                    <pre className="mt-2 max-h-40 overflow-auto whitespace-pre-wrap rounded-md border bg-muted/50 p-2 text-xs text-muted-foreground">
-                      {rawInput}
-                    </pre>
-                  </details>
-                )}
               </ConfirmationRequest>
             </ConfirmationTitle>
 
+            {rawInput && (
+              <details className="mt-2">
+                <summary className="cursor-pointer text-xs text-muted-foreground hover:text-foreground">
+                  View tool input
+                </summary>
+                <pre className="mt-2 max-h-40 overflow-auto whitespace-pre-wrap rounded-md border bg-muted/50 p-2 text-xs text-muted-foreground">
+                  {rawInput}
+                </pre>
+              </details>
+            )}
+
             <ConfirmationActions>
               <ConfirmationAction
                 variant="outline"