💄 make the chat box less cramped

This commit is contained in:
TC
2026-06-14 19:23:24 +10:00
parent 7eb25b08b0
commit e69d588443
2 changed files with 30 additions and 20 deletions

View File

@@ -491,11 +491,18 @@
color: var(--text-primary);
}
/* ── Input row: paperclip + textarea + send ─── */
/* ── Input row: textarea on top, buttons below ─── */
.chat-input-row {
display: flex;
align-items: flex-end;
gap: 8px;
flex-direction: column;
gap: 6px;
}
.chat-input-actions {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 6px;
}
.chat-paperclip-btn {
@@ -561,6 +568,7 @@
padding: 8px 10px;
resize: none;
outline: none;
overflow: hidden;
transition: border-color 0.15s;
min-height: 36px;
}

View File

@@ -177,15 +177,6 @@ export function ChatInput({ onSend, onAttachmentsChange, disabled }: Props): JSX
)}
<div className="chat-input-row">
<button
className="chat-paperclip-btn"
onClick={handleAttach}
disabled={disabled}
title="Attach file (image, text, PDF)"
aria-label="Attach file"
>
</button>
<textarea
ref={textareaRef}
className="chat-textarea"
@@ -198,14 +189,25 @@ export function ChatInput({ onSend, onAttachmentsChange, disabled }: Props): JSX
disabled={disabled}
rows={1}
/>
<button
className="chat-send-btn"
onClick={submit}
disabled={!canSend}
aria-label="Send"
>
</button>
<div className="chat-input-actions">
<button
className="chat-paperclip-btn"
onClick={handleAttach}
disabled={disabled}
title="Attach file (image, text, PDF)"
aria-label="Attach file"
>
</button>
<button
className="chat-send-btn"
onClick={submit}
disabled={!canSend}
aria-label="Send"
>
</button>
</div>
</div>
{menuPos && (
<ContextMenu