Fix dark-mode table headers and phone-width overflow in the reference guide's CSS

Đang mở Phù hợp với người mới
  • Có gì không ổn?
#1,891 1 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

@yashdotdev13 đang làm issue này rồi.

Từ ngày 14/11/2026.

  • #1903 của @yashdotdev13 — đang mở

Đánh giá

Độ khó
2/5
Thời gian dự kiến
1-3 giờ
Mức phù hợp với người mới
72/100
Loại issue
Lỗi
Độ rõ ràng
Đặc tả rõ ràng
Mức độ hoạt động
Sôi nổi
Công nghệ
css
Lĩnh vực
documentation, frontend

Hướng nghiên cứu

Cả hai sửa đổi đều nằm trong css/wicket.css: thêm một quy tắc chế độ tối cho table thead, table tfoot và tbody tr th để ghi đè nền #f7f8f7 từ asciidoctor.css, và thay đổi margin âm của #toc.toc2 trong khối max-width: 767px sao cho khớp với padding của container chứa nó. Biên dịch bằng mvn -pl wicket-user-guide -Pguide generate-resources, sau đó kiểm tra target/generated-docs/single.html ở 375 px với prefers-color-scheme: dark. Hoàn thành khi chữ tiêu đề đạt độ tương phản 4,5:1 và trang không còn cuộn ngang nữa.

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

Mô tả

Two problems in the restyled reference guide (#1845), both in css/wicket.css, found while checking the accessibility chapter (#1847) in the new design.

Table header rows are unreadable in dark mode

asciidoctor.css gives table thead, table tfoot and tbody tr th the background #f7f8f7. In dark mode the header cells get the light text colour of the dark theme but keep this background, so the header row is light grey text, rgb(164, 184, 176), on an almost white background: a contrast of about 2:1, where WCAG 2.2 success criterion 1.4.3 asks for 4.5:1.

On master it shows on the one table with a header row, in "Working with AJAX" (chapter 19); #1847 adds a second one, the WCAG criteria table in "Accessibility". A dark-mode rule for table thead, table tfoot and tbody tr th that uses the page's own surface colour would fix both.

The page scrolls sideways at phone width

Below 768px, #toc.toc2 gets margin: 0 -36px (wicket.css, the max-width: 767px block). The table of contents then reaches from -18px to 393px on a 375px wide viewport, and the whole page scrolls 18px sideways (success criterion 1.4.10 asks for no scrolling in two directions at 320 CSS pixels). A negative margin that matches the padding of its container would keep the full-bleed look without the overflow.

Both were seen in target/generated-docs/single.html built with mvn -pl wicket-user-guide -Pguide generate-resources on master at 745ae018ec, in a 375 × 667 viewport and with prefers-color-scheme: dark.

Ngôn ngữ chính
Java
Star
800
Fork
423
Merge trung bình
1 ngày 1 giờ
Pull request đã merge (30 ngày)
170

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

Dự án này không cung cấp dev container, Dockerfile hay hướng dẫn đóng góp, nên bạn cần tự thiết lập môi trường: 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 apache/wicket

Tất cả issue của apache/wicket

Issue tương tự

Thêm issue về Java

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.