From ee0cc6250069ed56f68b3702f89df90322fdb230 Mon Sep 17 00:00:00 2001 From: Daniel Date: Tue, 8 Sep 2026 22:55:28 +0200 Subject: [PATCH] =?UTF-8?q?fix:=20ChatGPT-style=20mobile=20layout=20?= =?UTF-8?q?=E2=80=94=20full-width=20chat,=20example=20questions=20visible,?= =?UTF-8?q?=20horizontal=20saved-chat=20chips,=20sources=20below?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- public/css/assistant.css | 21 ++++++++++++++++----- 1 file changed, 16 insertions(+), 5 deletions(-) diff --git a/public/css/assistant.css b/public/css/assistant.css index b61c866..f245dbb 100644 --- a/public/css/assistant.css +++ b/public/css/assistant.css @@ -162,17 +162,28 @@ .assistant-topbar { flex-wrap:wrap; } .assistant-topbar-title { flex-basis:100%; } .assistant-status { align-self:flex-start; } - .assistant-layout { grid-template-columns:1fr; } - .assistant-history { grid-column:1; grid-template-columns:1fr; } - .assistant-history .card { grid-column:1; grid-row:auto; } + /* ChatGPT-style mobile: one column, natural page flow, everything reachable by scroll. */ + .assistant-layout { display:flex; flex-direction:column; grid-template-columns:none; height:auto; min-height:100dvh; } + .assistant-history { display:flex; flex-direction:row; align-items:center; gap:8px; overflow-x:auto; padding:8px 10px; border-bottom:1px solid var(--g200); background:white; height:auto; min-height:0; } + .assistant-history .assistant-new-chat { flex:0 0 auto; } + .assistant-view-switch { flex:0 0 auto; display:flex; } + .assistant-history .card { flex:1 1 auto; display:block; min-width:0; box-shadow:none; border:none; background:none; } + #assistant-saved-chats { flex-direction:row; padding:0; gap:6px; overflow-x:auto; } + .assistant-saved-chat { flex:0 0 auto; max-width:200px; } + .assistant-main { flex:1 1 auto; min-height:60vh; display:flex; } + #assistant-chat-view { display:flex; flex-direction:column; flex:1 1 auto; min-height:60vh; } + .assistant-messages { flex:1 1 auto; max-height:none; padding:10px 12px; } + .assistant-empty { margin:20px auto; } + .assistant-examples { justify-content:flex-start; } + .assistant-examples button { max-width:100%; white-space:normal; text-align:left; border-radius:12px; } + .assistant-side { border-top:1px solid var(--g200); max-height:40vh; overflow-y:auto; } + .assistant-composer { position:static; flex:0 0 auto; } .assistant-toolbar { flex-direction:column; align-items:stretch; } .assistant-toolbar-actions { display:grid; grid-template-columns:1fr 1fr; } .assistant-toolbar-actions .btn-sm { width:100%; justify-content:center; } - .assistant-messages { padding:10px; } .assistant-msg, .assistant-msg.user { max-width:100%; } .assistant-bubble { font-size:13px; padding:11px 12px; } .assistant-table-scroll::after { display:block; } - .assistant-composer { position:sticky; bottom:0; z-index:3; } .assistant-composer-footer { flex-direction:column; align-items:stretch; } .assistant-composer-footer .btn-generate { width:100%; } .assistant-composer-footer #btn-assistant-cancel:not([hidden]) { width:100%; justify-content:center; }