Hacktoberfest 2026: le issue che i maintainer hanno segnato per ottobre, aperte e adatte ai principianti. Sfoglia le issue Hacktoberfest

Card heading level should be a prop (TagDetail renders section h2 followed by ProjectCard h2s)

Aperta
  • Qualcosa non va?
#170 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
3/5
Tempo stimato
1-2 giorni
Idoneità per principianti
68/100
Tipo di issue
Funzionalità
Chiarezza
Abbastanza chiara
Stato di attività
Attiva
Stack tecnologico
typescript
Ambito
accessibility, frontend

Direzione di ricerca

Individua i punti di ingresso denominati ProjectCard, PersonCard, HelpWantedCard, TagDetail, PeopleIndex e HelpWantedIndex, quindi leggi plans/a11y-mechanical.md e issue #156 per il contesto delle intestazioni. Verifica prima i livelli delle intestazioni e i siti di chiamata esistenti; il lavoro è completo quando le cards accettano i valori predefiniti proposti, TagDetail produce intestazioni dalla sezione all’elemento e il comportamento degli indici è verificato senza rompere gli utilizzi esistenti.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

enhancement

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).

Lingua principale
TypeScript
Stelle
1
Fork
1
Merge medio
11m
PR unite (30g)
22

Preparare l'ambiente

  • Include un Dockerfile o un file Docker Compose
  • Nessun modello di pull request
  • Nessuna guida per i contributori

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di CodeForPhilly/codeforphilly-ng

Tutte le issue di CodeForPhilly/codeforphilly-ng

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.