From 8e3dad559fa45f776f79471eade6f11258992a6f Mon Sep 17 00:00:00 2001
From: Alessandro <155005371+3clyp50@users.noreply.github.com>
Date: Tue, 23 Jun 2026 11:45:14 +0200
Subject: [PATCH] Fix welcome composer on mobile

Adjust the welcome-screen composer so the shared chat input wraps cleanly on narrow phones. Reclaim hidden expand-button padding, suppress placeholder-only textarea scrollbars, and tune the iPhone-width placeholder sizing while preserving normal typed-message scrolling.
---
 webui/components/welcome/welcome-screen.html | 39 ++++++++++++++++++++
 1 file changed, 39 insertions(+)

diff --git a/webui/components/welcome/welcome-screen.html b/webui/components/welcome/welcome-screen.html
index 15a29fc29..fcae43203 100644
--- a/webui/components/welcome/welcome-screen.html
+++ b/webui/components/welcome/welcome-screen.html
@@ -841,7 +841,36 @@
             }
 
             .welcome-composer .input-row {
+                align-items: center;
+                flex-wrap: wrap;
                 min-height: 4.35rem;
+                row-gap: 0.55rem;
+                white-space: normal;
+            }
+
+            .welcome-composer #chat-input-container {
+                flex: 1 1 11.5rem;
+                width: auto;
+                min-width: min(11.5rem, calc(100% - 3rem));
+            }
+
+            .welcome-composer #chat-input {
+                min-height: 4.5rem;
+                padding-right: 0.35rem;
+                align-content: center;
+            }
+
+            .welcome-composer #chat-input:placeholder-shown {
+                overflow-y: hidden;
+                scrollbar-width: none;
+            }
+
+            .welcome-composer #chat-input:placeholder-shown::-webkit-scrollbar {
+                display: none;
+            }
+
+            .welcome-composer #chat-buttons-wrapper {
+                margin-left: auto;
             }
 
             .welcome-setup-composer {
@@ -905,6 +934,16 @@
                 grid-template-columns: 1fr;
             }
         }
+
+        @media (max-width: 420px) {
+            .welcome-composer #chat-input:placeholder-shown {
+                min-height: 5rem;
+                padding-top: 0.52rem;
+                padding-bottom: 0.52rem;
+                font-size: 0.96rem;
+                line-height: 1.34;
+            }
+        }
     </style>
 </body>