diff --git a/website/src/components/tui/chrome.tsx b/website/src/components/tui/chrome.tsx
index 62d54cb..cb52eec 100644
--- a/website/src/components/tui/chrome.tsx
+++ b/website/src/components/tui/chrome.tsx
@@ -1,7 +1,7 @@
import { VERSION } from '@/lib/links'
import { cn } from '@/lib/utils'
-import { CLOCK, DATE, HOST, SESSION, SHORTCUTS, WINDOWS } from './data'
+import { SHORTCUTS } from './data'
interface TuiPaneProps {
title: string
@@ -54,32 +54,6 @@ export const MacWindow = ({ children }: { children: React.ReactNode }) => (
)
-export const TmuxBar = () => (
-
-
- {SESSION}
-
- {WINDOWS.map((w) => (
-
- {w.n} › {w.name}
-
- ))}
-
-
- {DATE} · {CLOCK}
-
- {HOST}
-
-
-)
export interface StatusCounts {
active: number
diff --git a/website/src/components/tui/data.ts b/website/src/components/tui/data.ts
index c62813c..b29e85e 100644
--- a/website/src/components/tui/data.ts
+++ b/website/src/components/tui/data.ts
@@ -41,26 +41,8 @@ export interface TransferRow {
rateMbps?: number
}
-interface TmuxWindow {
- n: number
- name: string
- active?: boolean
-}
-
-export const HOST = 'michels-macbook-pro-m4'
-export const CLOCK = '01:45 PM'
-export const DATE = '2026-07-24'
-export const SESSION = 'develop'
export const SHARE = '/Users/micheldegraaf/Downloads/Soulseek'
-export const WINDOWS: readonly TmuxWindow[] = [
- { n: 1, name: 'fish #' },
- { n: 2, name: 'fish #' },
- { n: 3, name: 'fish #' },
- { n: 4, name: 'fish #-' },
- { n: 5, name: 'fish *', active: true },
-]
-
export const SEARCHES: readonly SearchRow[] = [
{ id: 's1', query: 'public domain field recordings', results: 606, status: 'Done' },
{ id: 's2', query: 'creative commons ambient', results: 33, status: 'Done' },
diff --git a/website/src/components/tui/hero-terminal.tsx b/website/src/components/tui/hero-terminal.tsx
index bb588af..5ca854b 100644
--- a/website/src/components/tui/hero-terminal.tsx
+++ b/website/src/components/tui/hero-terminal.tsx
@@ -1,6 +1,6 @@
import { useCallback, useEffect, useMemo, useRef, useState, type KeyboardEvent } from 'react'
-import { MacWindow, ShortcutBar, StatusLine, TmuxBar, type StatusCounts } from './chrome'
+import { MacWindow, ShortcutBar, StatusLine, type StatusCounts } from './chrome'
import {
RESULTS,
SEARCHES,
@@ -362,22 +362,9 @@ export const HeroTerminal = () => {
setPhase('interactive')
}
- // Below 820px, stop shrinking at half size and let the wrapper scroll.
- const [minScale, setMinScale] = useState(() =>
- matches('(max-width: 820px)') ? 0.5 : 0,
- )
- useEffect(() => {
- const query = window.matchMedia('(max-width: 820px)')
- const sync = (event: MediaQueryListEvent) => {
- setMinScale(event.matches ? 0.5 : 0)
- }
- query.addEventListener('change', sync)
- return () => {
- query.removeEventListener('change', sync)
- }
- }, [])
-
- const { wrapRef, innerRef, scale, height, ready } = useFitScale(DESIGN_WIDTH, minScale)
+ // No floor: the terminal shrinks to whatever width it is given rather than
+ // holding a minimum size and scrolling sideways.
+ const { wrapRef, innerRef, scale, height, ready } = useFitScale(DESIGN_WIDTH)
const shownSearches = searches.map((search, i) =>
i === 0 && phase === 'searching' ? { ...search, status: '⋯', results: '—' } : search,
@@ -401,7 +388,6 @@ export const HeroTerminal = () => {
}}
>
-
{/*
role="application" is the ARIA escape hatch for a widget that
handles its own keys: it stops screen readers intercepting
diff --git a/website/src/components/tui/use-fit-scale.ts b/website/src/components/tui/use-fit-scale.ts
index 3aa5c5f..ce94e0c 100644
--- a/website/src/components/tui/use-fit-scale.ts
+++ b/website/src/components/tui/use-fit-scale.ts
@@ -15,11 +15,8 @@ interface FitScale {
* looking like a terminal. So it renders at native width and gets a CSS
* transform, and the wrapper is told the resulting height so the page below
* does not sit under it.
- *
- * `minScale` stops the shrink at a floor on small screens — past that the
- * wrapper scrolls sideways instead, which beats unreadable 4px text.
*/
-export const useFitScale = (designWidth: number, minScale: number): FitScale => {
+export const useFitScale = (designWidth: number): FitScale => {
const wrapRef = useRef(null)
const innerRef = useRef(null)
const [{ scale, height }, setState] = useState({ scale: 0, height: 0 })
@@ -36,7 +33,7 @@ export const useFitScale = (designWidth: number, minScale: number): FitScale =>
const width = wrap.clientWidth
if (width === 0) return
- const next = Math.max(minScale, Math.min(1, width / designWidth))
+ const next = Math.min(1, width / designWidth)
const nextHeight = inner.offsetHeight * next
if (nextHeight === 0) return
@@ -58,7 +55,7 @@ export const useFitScale = (designWidth: number, minScale: number): FitScale =>
return () => {
observer.disconnect()
}
- }, [designWidth, minScale])
+ }, [designWidth])
return { wrapRef, innerRef, scale, height, ready: scale > 0 }
}
diff --git a/website/src/index.css b/website/src/index.css
index 85aba26..d19f5ba 100644
--- a/website/src/index.css
+++ b/website/src/index.css
@@ -150,11 +150,6 @@
--tui-track: #2a2622;
--tui-bezel: #000000;
- /* tmux's own status bar. Emulator chrome, so it does not follow the theme. */
- --tmux-bg: #0e0c0a;
- --tmux-hl: #b9a6e8;
- --tmux-hl-fg: #1a1526;
-
color-scheme: dark;
}
@@ -223,10 +218,6 @@
* is what the Rust client does. Those names do not flip with the theme, so on
* manila they would leave paper-on-paper. Light mode re-cuts the same names
* darker, scoped to the terminal's content.
- *
- * Deliberately not applied to the tmux bar above it: that is the emulator's
- * own chrome, it keeps its near-black background in both themes, and needs
- * the bright phosphor to stay legible against it.
*/
[data-theme='light'] .tui-content {
--color-paper: #14110f;