sam/dev_arc_aws
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add breathing room around terminal pane borders and content

Browse source 
Wider gap between panes in split view (borders were crowding each other
in 4-up grid), more inset between the pane border and the connect/
disconnect header, and a small horizontal gutter around the xterm mount
so the prompt text doesn't sit flush against the border.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_019hu9pZvJY4BgmcQeAw2ugk
This commit is contained in:
Claude 2026-06-21 09:54:40 +00:00
parent 1da719c541
commit f191119a28
No known key found for this signature in database
1 changed files with 6 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
src/pages/Terminal.tsx
View file

@ -180,7 +180,7 @@ export default function Terminal() {
</div> </div>
)} )}
<div className={`grid min-h-0 flex-1 gap-2 ${paneGridClass}`}> <div className={`grid min-h-0 flex-1 gap-3 ${paneGridClass}`}>
{activeTab.panes.map((pane) => ( {activeTab.panes.map((pane) => (
<TerminalPane <TerminalPane
key={pane.id} key={pane.id}
@ -231,13 +231,13 @@ function TerminalPane({
return ( return (
<div <div
onClick={onFocus} onClick={onFocus}
className="flex min-w-0 min-h-0 flex-col rounded-lg p-2" className="flex min-w-0 min-h-0 flex-col rounded-lg p-3"
style={{ style={{
backgroundColor: '#15161A', backgroundColor: '#15161A',
border: active ? `1px solid ${GOLD}` : '1px solid rgba(255,255,255,0.1)', border: active ? `1px solid ${GOLD}` : '1px solid rgba(255,255,255,0.1)',
}} }}
> >
<div className="mb-2 flex items-center gap-2 px-1 text-xs" style={{ color: TEXT_SECONDARY }}> <div className="mb-3 flex items-center gap-2 px-2 text-xs" style={{ color: TEXT_SECONDARY }}>
<span className="inline-block h-2 w-2 rounded-full" style={{ background: info.connected ? '#2ECC71' : '#7A7D85' }} /> <span className="inline-block h-2 w-2 rounded-full" style={{ background: info.connected ? '#2ECC71' : '#7A7D85' }} />
{host ? (info.connected ? `Connected — ${host.name}` : `Disconnected — ${host.name}`) : 'Select a host to connect'} {host ? (info.connected ? `Connected — ${host.name}` : `Disconnected — ${host.name}`) : 'Select a host to connect'}
{host && ( {host && (
@ -259,7 +259,9 @@ function TerminalPane({
</select> </select>
)} )}
</div> </div>
<div ref={cellRef} className="min-h-0 flex-1" /> <div className="min-h-0 flex-1" style={{ padding: '0 6px' }}>
<div ref={cellRef} className="h-full w-full" />
</div>
</div> </div>
) )
} }