Card heading level should be a prop (TagDetail renders section h2 followed by ProjectCard h2s)
维护者通常 1 天内回复
还没有人认领这个 Issue。
评估
- 难度
- 3/5
- 预计耗时
- 1-2 天
- 新手友好度
- 68/100
- Issue 类型
- 功能
- 描述清晰度
- 基本清楚
- 活跃度
- 活跃
- 技术栈
- typescript
调研方向
定位名为 ProjectCard、PersonCard、HelpWantedCard、TagDetail、PeopleIndex 和 HelpWantedIndex 的入口点,然后阅读 plans/a11y-mechanical.md 和 issue #156 以了解标题上下文。首先验证现有的标题级别和调用点;完成的标准是 cards 接受提议的默认值,TagDetail 生成从 section 到 item 的标题,并且在不破坏现有用法的情况下检查 index 的行为。
由索引模型根据 Issue 内容生成。
描述
Context
The shared cards render a fixed heading level: ProjectCard renders h2, PersonCard and HelpWantedCard render h3. PR #157 worked around this on the index screens by adding sr-only <h2>Results</h2> headings above the h3 cards rather than changing the cards, because each card is also used in a second context where its fixed level is correct.
Problem
The fixed level is still wrong somewhere. TagDetail renders a section <h2> ("Projects", "Help wanted", "Members") and then a list of ProjectCards, each of which contributes another h2 — so the section heading and every card title sit at the same level, and the document outline reads as a flat run of h2s instead of section → items. Any future screen that composes cards under a section heading hits the same problem.
Proposal
Give the three cards a headingLevel prop (2 | 3 | 4, defaulting to today's level so nothing changes at existing call sites), rendered via a small Heading helper or createElement(h${level}). Then TagDetail passes headingLevel={3} to ProjectCard, and the sr-only "Results" headings on PeopleIndex / HelpWantedIndex can be revisited (the cards could render h2 directly there).
Related: issue #156 (CardTitle semantics) covers the design-decision side of card headings.
Deferred from plans/a11y-mechanical.md (PR #157).
- 主要语言
- TypeScript
- 星标
- 1
- 派生
- 1
- 平均合并
- 1 天 20 小时
- 30 天内合并 PR
- 25
环境准备
我们还没有检查这个项目的环境配置文件。先看它的 README,通用步骤见我们的新手贡献指南。
从这里开始
- 先读完整个 Issue,再读项目的贡献指南。
- 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
- Fork 仓库,在一个分支上完成修改。
- 提交 Pull Request,并在描述里引用这个 Issue 编号。
CodeForPhilly/codeforphilly-ng 的其他 Issue
-
难度 2/5 1-3 小时 新手友好度 84/100
CodeForPhilly/codeforphilly-ng#178 ·
维护者通常 1 天内回复
-
MarkdownEditor toolbar: use Radix Toolbar from radix-ui instead of the hand-rolled roving tabindex未关闭enhancement
难度 2/5 1-3 小时 新手友好度 82/100
CodeForPhilly/codeforphilly-ng#169 ·
维护者通常 1 天内回复
-
难度 2/5 1-3 小时 新手友好度 76/100
CodeForPhilly/codeforphilly-ng#89 ·
维护者通常 1 天内回复
-
难度 2/5 1-3 小时 新手友好度 88/100
CodeForPhilly/codeforphilly-ng#87 ·
维护者通常 1 天内回复
-
难度 2/5 1-3 小时 新手友好度 74/100
CodeForPhilly/codeforphilly-ng#50 ·
维护者通常 1 天内回复
查看 CodeForPhilly/codeforphilly-ng 的全部 Issue
相似的 Issue
-
难度 2/5 1-3 小时 新手友好度 78/100
melgarafael/DeskcommCRM#1812 ·
维护者通常 1 天内回复
-
难度 2/5 1-3 小时 新手友好度 84/100
prisma/prisma-cli#309 ·
维护者通常 1 天内回复
-
难度 2/5 1-3 小时 新手友好度 78/100
gregwebs/pi-quota-dispatcher#26 ·
维护者通常 1 天内回复
-
难度 2/5 1-3 小时 新手友好度 74/100
openwatersio/slackwater.xyz#124 ·
维护者通常 1 天内回复
-
agent-reported area/browser area/docs documentation good first issue hacktoberfest help wanted P2
难度 1/5 1 小时以内 新手友好度 90/100
维护者通常 2 天内回复