From e2a61bb78d0a3ae3e864e6fc84cd5c926e5ef2d3 Mon Sep 17 00:00:00 2001 From: Scott Idem Date: Tue, 28 Apr 2026 20:44:46 -0400 Subject: [PATCH] fix: mode-select row layout so tools toggle doesn't push textarea down MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - #mode-select changed from flex column to flex row (desktop + mobile unified) - Chat/⚡ buttons now sit side-by-side at the same height as the textarea - Removed stale mode-agent CSS rules (mode removed in prior commit) - Mobile: simplified override — flex:1 only, direction/align already desktop default Co-Authored-By: Claude Sonnet 4.6 --- cortex/static/style.css | 25 ++++++++----------------- 1 file changed, 8 insertions(+), 17 deletions(-) diff --git a/cortex/static/style.css b/cortex/static/style.css index 740d308..5ccd1c9 100644 --- a/cortex/static/style.css +++ b/cortex/static/style.css @@ -635,8 +635,8 @@ position: relative; flex-shrink: 0; display: flex; - flex-direction: column; - align-items: stretch; + flex-direction: row; + align-items: center; gap: 4px; } @@ -654,10 +654,9 @@ white-space: nowrap; transition: border-color 0.15s, color 0.15s; } - #mode-select-btn:hover { border-color: var(--muted); color: var(--text); } - #mode-select-btn.mode-note { border-color: rgba(180,130,40,0.6); color: #c9a84c; } - #mode-select-btn.mode-otr { border-color: rgba(120,80,160,0.6); color: #a87fd4; } - #mode-select-btn.mode-agent { border-color: rgba(80,140,200,0.6); color: #7cb9e8; } + #mode-select-btn:hover { border-color: var(--muted); color: var(--text); } + #mode-select-btn.mode-note { border-color: rgba(180,130,40,0.6); color: #c9a84c; } + #mode-select-btn.mode-otr { border-color: rgba(120,80,160,0.6); color: #a87fd4; } #mode-icon { display: flex; align-items: center; } .mode-arrow { font-size: 0.55rem; color: var(--muted); margin-left: 2px; opacity: 0.5; } @@ -757,8 +756,7 @@ #input.mode-note:focus { border-color: rgba(180,130,40,0.85); } #input.mode-note.public { border-color: rgba(40,170,150,0.55); } #input.mode-note.public:focus { border-color: rgba(40,170,150,0.85); } - #input.mode-otr { border-color: rgba(120,80,160,0.4); background: rgba(120,80,160,0.04); } - #input.mode-agent { border-color: rgba(80,140,200,0.4); } + #input.mode-otr { border-color: rgba(120,80,160,0.4); background: rgba(120,80,160,0.04); } /* Send column — right side, stacked */ #send-col { @@ -1517,17 +1515,10 @@ font-size: 16px; /* prevent iOS Safari auto-zoom */ } - /* Mode select: row layout (btn left, note-vis right) */ - #mode-select { - flex-direction: row; - flex: 1; - align-items: center; - } + /* Mode select: grows to fill left side of bottom row */ + #mode-select { flex: 1; } #mode-select-btn { flex: 1; justify-content: center; } - /* Note vis button sits to the right of the mode btn on mobile */ - #note-vis-btn { margin-top: 0; } - /* Dropdown still opens upward on mobile */ #mode-dropdown { min-width: 140px; }