feat(ui): give the terminal pane a header with tabs, close and size (index.html, src/styles.css, src/main.ts, docs) - #74
Merged
Conversation
診断面を独立した窓として扱えるようにする。上端にヘッダを置き、そこへ開いて いる端末のタブ、端末自身の文字サイズ、面を畳む ✕ を載せる。角丸は面 (#diagnostics) が持ち、端末 (#terminal) は上側の角を手放す。値は 8px で、 ヘッダの上端と面の下端の両方に同じ値が出る。 タブと参加者の行は連動する。どちらを押しても同じ端末が画面に出る。二つは renderPanel の一回の呼び出しから同時に描くため、連動は実装の約束ではなく 構造で成立する。同じ選択を二つの面が持つ重複は #59 の判断と逆を向くが、 Master が承知の上で両方を選んでいる。 「読んだ」の合図が移る。showView は終了した端末を「別のアカウントが選ばれた」 時点で捨てていたが (#57)、終了したタブに ✕ が付いたことで、その合図は暗黙の 選択から明示の操作へ移る。合図は失われず、置き場所が変わる。代償は閉じられる までスクロールバックがメモリに残ることであり、受容したトレードオフへ記録した。 走っているセッションのタブには ✕ を出さない。出せば「セッションの終了」と 読まれ、行の 終了 を端末側へ移さない制約を破る。 端末の文字サイズは寸法の三軸目である。会話面 (#60) とも UI 全体 (#66) とも 独立し、互いに相対で乗らない。localStorage の梯子 (9〜24px、既定 13px) で 持ち、変えるたびに fit を呼んで桁数と行数をセッションへ伝える。表示は px で ある。何桁入るかを決めるのがこの数そのものだからである。 #68
…inset 実機を見ての三点(Master、2026-08-24、#68 本文「実機を見ての追加指示」)。 ヘッダに色を敷かない。窓は全体が一つの地であり、それはページの地 (--bg) で あってパネルの色味 (--surface) ではない。面が --surface を持っていたのは帯で あった頃の名残であり、ヘッダを一色の帯として端末の上に置く形になっていた。 ヘッダであることは位置と中身が言う。窓と会話面を分けるのは枠線と角丸である。 地が入れ替わったため、ヘッダの操作子と選択中のタブは --surface で持ち上げる (タイトルバーの操作子と同じ形)。 ヘッダに窓の名前「端末」を出す。左端に置き、タブはその後ろに並ぶ。何も走って いないときにヘッダが自分について言うのはこの名前だけになる。 枠と端末の間の余白を 0.35rem から 0.15rem へ詰める。ここは余白ではなく端末が 使っていない面積であり、CLI の桁数と行数は残った寸法から計算される。0 には しない。xterm はカーソルと選択を自分の箱の縁まで描くため、枠に密着させると縁が 枠線の上へ乗る。 #68
smileygames
commented
Aug 24, 2026
smileygames
left a comment
Member
Author
There was a problem hiding this comment.
自己レビュー結果: PASS
#68 の受け入れ基準と、実機を見ての追加指示三点に対して差分を確認した。
受け入れ基準
- ヘッダ —
#terminal-headに「端末」・タブ・寸法のピッカー・✕。診断ボタンは残っており、たためた状態から開く手として機能している(✕は畳んだ後は届かないため、二つは入口と出口)。 ✕は面をたたむ。 セッションは生きたまま、タブは面と一緒に戻る。行の終了は動いていない。- タブと行の連動 —
renderTerminalTabs()がrenderPanel()の中から呼ばれており、両面がviewsから一回の呼び出しで描かれる。約束事で同期を保つ形になっていない点を評価する。 - 角丸 —
--pane-radius: 8pxが#diagnosticsに乗り、overflow: hidden。#terminalは下側の角だけを持つ。 - 端末の寸法 —
pullcept.terminal-font-size、梯子9–24px(両端が上下限)、既定13px。px表記は #60 の%と意図的に別で、桁数を決める数だからという理由が付いている。三軸の独立は保たれている。 - タブの表示 — アカウント名。走っていないアカウントはタブを持たない。
✕は終了したタブにだけ出る —view.ended !== nullの中でのみ生成。走っているタブに出ると「セッションの終了」と読まれ、制約を破るため。- 「読んだ」の合図の移動 —
showView冒頭の終了ビュー破棄が消え、closeView()がタブの✕から呼ばれている。#68 本文に書いたとおりの形。
実機を見ての追加指示(三点とも入っている)
- ヘッダに色を敷かない — 面全体が
--bgになり、--surfaceはヘッダの中の操作と選択中のタブ側へ移った。ヘッダが帯にならない。 - 「端末」をヘッダ左に — タブがその後ろ。走っているセッションが無いときに面が自分について言う唯一のものでもある。
- 枠の余白 —
0.35rem→0.15rem。0にしていない理由(xterm がカーソルと選択を箱の縁まで描く)がコメントに残っている。
判断として見るべき点
#terminal の min-height が 18rem から 0 へ。ヘッダが中に入った固定 50vh の面では、18rem は端末が要求できて与えられない数になり、はみ出しが黙って切られる。落とした判断は妥当。
受容したトレードオフ(docs に記録済み)
実機未確認
追加指示三点の見え方は実機で未確認。docs の未実装節に記録済み。ヘッダ「端末」の表示は、実機を見た上で落とすかを決める暫定であり、落とす判断になった場合は別 issue で扱う(#68 本文)。
次の一手
実行モード auto。人間のレビュー gate は無く、この自己レビュー通過をもって squash merge する。リリース種別は minor 相当(新しい chrome 面の追加と、#57 の合図の置き場所の変更を含み、利用者から観測できる構造変更である)。
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Closes #68
診断面を独立した窓にした。上端のヘッダに、窓の名前「端末」・開いている端末のタブ・端末自身の文字サイズ・面を畳む
✕を載せ、角丸は面(#diagnostics)が持つ。端末(#terminal)は上側の角を手放す。タブと参加者の行は連動する。二つは
renderPanelの一回の呼び出しから同時に描くため、連動は構造で成立する。終了した端末のタブには✕が付き、「読んだ」の合図は暗黙の選択から明示の操作へ移った(showViewの終了ビュー破棄は落ちた)。端末の文字サイズは寸法の三軸目であり、会話面(#60)とも UI 全体(#66)とも独立している。ヘッダが出た状態の実機を見ての三点(#68 本文「実機を見ての追加指示」)を同じ PR で反映済みである——ヘッダに色を敷かない(窓は全体が一つの地)、ヘッダに窓の名前「端末」を出す、枠と端末の間の余白を
0.35remから0.15remへ詰める。最後の一点は端末が使える桁数と行数に直接効く。受容した重複と代償(タブと行が同じ選択を持つこと、終了した端末が閉じられるまでメモリに残ること)は #68 で決着済みであり、
docs/0-requirements.mdの「受容したトレードオフ」に記録した。