Description
ファイル変更一覧(FileChangesHeader)を展開した際、変更ファイル数に応じてリストが無制限に伸び、メッセージエリアを埋め尽くしてしまう。差分が多いファイルでは画面全体がファイル一覧で占有され、他のメッセージが見えなくなる。
一定の高さまでは表示し、それを超えた場合はスクロールバーで閲覧できるようにしたい。
Motivation
- ファイル変更が多い場合(10ファイル以上等)、展開するとメッセージエリアが完全に埋まり、前後のメッセージが確認できなくなる
- 他の折りたたみパネル(DiffView の差分行、ToolPartView の出力)では
max-height + overflow-y: auto で制限されており、統一的なデザインになっていない
Proposed Solution
FileChangesHeader.module.css の .list に max-height と overflow-y: auto を追加する。
既存の類似パターン:
DiffView の .lines: max-height: 300px; overflow-y: auto;
ToolPartView の .output: max-height: 200px; overflow-y: auto;
これらと統一感のある値(300px 程度)を設定する。
受け入れ条件
Description
ファイル変更一覧(
FileChangesHeader)を展開した際、変更ファイル数に応じてリストが無制限に伸び、メッセージエリアを埋め尽くしてしまう。差分が多いファイルでは画面全体がファイル一覧で占有され、他のメッセージが見えなくなる。一定の高さまでは表示し、それを超えた場合はスクロールバーで閲覧できるようにしたい。
Motivation
max-height+overflow-y: autoで制限されており、統一的なデザインになっていないProposed Solution
FileChangesHeader.module.cssの.listにmax-heightとoverflow-y: autoを追加する。既存の類似パターン:
DiffViewの.lines:max-height: 300px; overflow-y: auto;ToolPartViewの.output:max-height: 200px; overflow-y: auto;これらと統一感のある値(
300px程度)を設定する。受け入れ条件
300px程度)を超えた場合、スクロールバーが表示される