Hacktoberfest 2026: những issue maintainer đã đánh dấu cho tháng Mười, đang mở và phù hợp người mới. Xem issue Hacktoberfest

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

Đang mở
  • Có gì không ổn?
#170 0 bình luận 0 reaction 0 người được giao Xem trên GitHub

Maintainer thường phản hồi trong vòng 1 ngày

Chưa có ai nhận issue này.

Đánh giá

Độ khó
3/5
Thời gian dự kiến
1-2 ngày
Mức phù hợp với người mới
68/100
Loại issue
Tính năng
Độ rõ ràng
Khá rõ ràng
Mức độ hoạt động
Sôi nổi
Công nghệ
typescript
Lĩnh vực
accessibility, frontend

Hướng nghiên cứu

Xác định các entry point có tên ProjectCard, PersonCard, HelpWantedCard, TagDetail, PeopleIndex và HelpWantedIndex, sau đó đọc plans/a11y-mechanical.md và issue #156 để hiểu ngữ cảnh của các heading. Trước tiên, hãy xác minh các cấp heading và các vị trí gọi hiện có; được xem là hoàn tất khi các card chấp nhận các giá trị mặc định được đề xuất, TagDetail tạo ra các heading từ section đến item và hành vi của các index được kiểm tra mà không làm hỏng các cách sử dụng hiện có.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Mô tả

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

Ngôn ngữ chính
TypeScript
Star
1
Fork
1
Merge trung bình
1 ngày 20 giờ
Pull request đã merge (30 ngày)
25

Chuẩn bị môi trường

Chúng tôi chưa kiểm tra các tệp thiết lập môi trường của dự án này. Hãy bắt đầu từ README và xem hướng dẫn đóng góp lần đầu của chúng tôi để biết các bước chung.

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Issue khác của CodeForPhilly/codeforphilly-ng

Tất cả issue của CodeForPhilly/codeforphilly-ng

Issue tương tự

Thêm issue về TypeScript

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.