A slot row's hover toolbar covers its "0 of N taken" count
メンテナーはふだん 1 日以内に返信
まだ誰も着手していません。
評価
- 難易度
- 4/5
- 見積もり時間
- 1〜2日
- 初心者へのやさしさ
- 52/100
- issue の種類
- バグ
- 明瞭さ
- 明確に書かれている
- 活発さ
- 活発
- 技術スタック
- playwright, react, typescript
調査の方向性
Start with src/components/build-wysiwyg/WysiwygSlot.tsx and trace how hover, focus, and the interactive state control the toolbar. Then inspect the existing Playwright setup and tests/e2e/slot-row-layout.spec.ts as a suggested example; verify the count and toolbar do not overlap at 1280 and 390 widths, including a tagged row from #581. Done means the layout check passes, rows at rest stay unchanged, and the listed lint, typecheck, knip, and test commands pass.
索引モデルが issue の本文から書いたものです。
説明
Needs your OK: this moves a slot row's count aside while its Edit, Duplicate and Delete buttons show, so both stay visible. Swap pipeline:proposed for pipeline:ready to have it built.
What happens
On the Build tab, a closed slot row (WysiwygSlot in src/components/build-wysiwyg/WysiwygSlot.tsx) shows its count, such as "0 of 6 taken", at its right edge. Hover the row, or tab into it, and a toolbar with Edit, Duplicate and Delete appears at the same right edge. The toolbar is absolutely placed (right-2 top-1.5) on a white background, so it hides the count. The count is what organizers come to that row for, and it disappears whenever the pointer rests on it.
On a computer this happens on every hover. With the keyboard, it happens on every row that focus passes through.
To see it: at a computer width, create a signup with two slots, and hover either row.
Fix, in outline
- Move the count aside while the toolbar shows. When the row is hovered or has focus, give the row's button right padding the width of the toolbar, so the count slides left to sit just before it. The summary text gives up the room; it already truncates.
- Rows at rest don't change, and no row gets taller.
- Pin it in a browser. Add a Playwright check like
tests/e2e/slot-row-layout.spec.ts, which does this for the public page: on hover and on focus, the count's box and the toolbar's box don't overlap, at 1280 and 390 wide. jsdom has no layout, so a unit test can't catch it.
Watch for
- Phones. There's no hover, but the toolbar shows when the row has focus. Check 390 wide.
- #581 adds a "Still says TBD" tag to the row and lets its first line wrap on a phone. Check a tagged row too. Whichever lands second has a small merge in
WysiwygSlot.tsx. - The toolbar's
inertswitch (theinteractivestate) must still follow hover and focus. - CHANGELOG entry.
Choices this makes
- Move the count, or always keep room for the toolbar. Default: move the count only while the toolbar shows. Keeping the toolbar's room free on every row would cut every summary short, most of all on a phone, for a toolbar that's hidden most of the time. The cost is that the count slides left on hover.
- The toolbar stays a hover toolbar, in the same place, with the same buttons. Default: yes.
Done when
- Hovering or focusing a slot row shows its toolbar and its count side by side, at 1280 and 390 wide, checked by Playwright.
- A row at rest looks as it does now.
pnpm lint && pnpm typecheck && pnpm knip && pnpm testpass, and the new e2e check passes.
Found by the UX walkthrough (scenario O1) on 2026-10-24, and checked against the code on main at 4ed27a9.
Generated by Claude Code
- 主要言語
- TypeScript
- スター
- 19
- フォーク
- 4
- 平均マージ
- 20時間 9分
- マージ済み PR(30日)
- 156
環境構築
- Dockerfile または Docker Compose ファイルあり
- プルリクエストのテンプレートなし
- コントリビューションガイドを読む
はじめの一歩
- issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
- 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
- リポジトリをフォークし、ブランチを切って変更します。
- issue 番号を参照したプルリクエストを送ります。
richshaw/OpenSignup のほかの issue
-
enhancement pipeline:proposed pipeline:ux
難易度 2/5 1〜3時間 初心者へのやさしさ 72/100
richshaw/OpenSignup#654 ·
メンテナーはふだん 1 日以内に返信
-
enhancement pipeline:proposed pipeline:ux
難易度 2/5 1〜3時間 初心者へのやさしさ 82/100
richshaw/OpenSignup#653 ·
メンテナーはふだん 1 日以内に返信
-
enhancement pipeline:proposed pipeline:ux
難易度 2/5 1〜3時間 初心者へのやさしさ 78/100
richshaw/OpenSignup#652 ·
メンテナーはふだん 1 日以内に返信
-
enhancement good first issue pipeline:ready
難易度 2/5 1〜3時間 初心者へのやさしさ 82/100
richshaw/OpenSignup#645 ·
メンテナーはふだん 1 日以内に返信
-
bug good first issue pipeline:ready pipeline:ux
難易度 2/5 1〜3時間 初心者へのやさしさ 88/100
richshaw/OpenSignup#644 ·
メンテナーはふだん 1 日以内に返信
richshaw/OpenSignup の issue をすべて見る
似ている issue
-
a10y a10y-audit ai-driven-qa claude
難易度 2/5 1〜3時間 初心者へのやさしさ 86/100
linagora/twake-directory-manager#219 ·
メンテナーはふだん 1 日以内に返信
-
難易度 2/5 1〜3時間 初心者へのやさしさ 68/100
メンテナーはふだん 1 日以内に返信
-
type: bug
難易度 2/5 1〜3時間 初心者へのやさしさ 79/100
メンテナーはふだん 1 日以内に返信
-
0️⃣ phase/new
難易度 2/5 1〜3時間 初心者へのやさしさ 82/100
メンテナーはふだん 1 日以内に返信
-
Pulse v7: buildPreferencesFromTelos() bypasses telosSectionOrFile(), renders empty on unified-TELOS installs対応中かも @zephyr91 が今日担当しました。 オープン
難易度 2/5 1〜3時間 初心者へのやさしさ 75/100
danielmiessler/LifeOS#2393 ·
メンテナーはふだん 4 日以内に返信