Hacktoberfest 2026:メンテナが10月に向けて印を付けた、オープンで初心者向けの issue。 Hacktoberfest の issue を見る

[Bug]: Selected and hovered dropdown rows look identical when adjacent

オープン 初心者向け
#19,208 コメント 0 件 リアクション 0 件 担当者 0 名 GitHub で見る

メンテナーはふだん 1 日以内に返信

まだ誰も着手していません。

評価

難易度
2/5
見積もり時間
1〜3時間
初心者へのやさしさ
65/100
issue の種類
バグ
明瞭さ
明確に書かれている
活発さ
活発
技術スタック
typescript
領域
frontend

調査の方向性

行のスタイルは apps/web/src/components/ui/menu.tsx にあるので、まずそこでメニュー項目に適用されている選択時とホバー時のクラスから確認してください。再現手順:差分パネルのスコープのドロップダウンを開き、"Latest turn" を選択して、その上の行にカーソルを合わせます。選択された行とホバーされた行が隣り合ったときに視覚的に区別できれば完了です。区別の方法としては、余白、マーカー、より明確な選択色のいずれかを使えます。どれを選ぶかは、スレッドでメンテナーが希望する案を確認してから決めてください。

索引モデルが issue の本文から書いたものです。

説明

Before submitting
  • I searched existing issues and did not find a duplicate.
  • I included enough detail to reproduce or investigate the problem.
Area

apps/web

Steps to reproduce
  1. Open a thread and open the diff panel.
  2. In the scope dropdown, select "Latest turn".
  3. Open the dropdown again and hover "Uncommitted", the row directly above.
Expected behavior

The selected row and the hovered row are distinguishable. The sidebar thread list stays readable in the same situation because it leaves a small gap between rows.

Actual behavior

The two rows get nearly identical backgrounds that touch with no gap, so they read as one tall highlight. The selected row has no other marker (such as a checkmark), so while hovering you can't tell which option is active.

The styling comes from the shared menu component (apps/web/src/components/ui/menu.tsx), so other dropdowns with a selected item likely behave the same way.

Possible fixes, for maintainers to choose: a gap between rows, a checkmark on the selected row, or a more distinct selected-row color.

Impact

Cosmetic issue

Version or commit

0.0.46-nightly.20261013.3066

Environment

macOS desktop app, Apple M5, dark theme

Screenshots, recordings, or supporting files
Image Image
主要言語
TypeScript
スター
24.8k
フォーク
6.4k
平均マージ
6時間 23分
マージ済み PR(30日)
203

環境構築

Codespaces で開く

このプロジェクトの開発コンテナを、あなたの GitHub アカウントでブラウザ上に起動します。

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

pingdotgg/t3code のほかの issue

pingdotgg/t3code の issue をすべて見る

似ている issue

TypeScript の issue をもっと見る

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。