Improve placeholder and side menu icon contrast for WCAG compliance

Đang mở Phù hợp với người mới
#2,855 0 bình luận 0 reaction 0 người được giao Xem trên GitHub

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

Đá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
68/100
Loại issue
Tính năng
Độ rõ ràng
Khá rõ ràng
Mức độ hoạt động
Ít trao đổi
Công nghệ
css, typescript
Lĩnh vực
accessibility, frontend

Hướng nghiên cứu

Tìm trong codebase --bn-colors-side-menu và các style placeholder của editor, sau đó kiểm tra cách các màu đó được áp dụng cho các biểu tượng của menu bên và văn bản placeholder. Cập nhật các style liên quan để văn bản và biểu tượng bị ảnh hưởng đáp ứng yêu cầu tương phản WCAG đã nêu, rồi xác minh kết quả theo mục tiêu 4.5:1.

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

Mô tả

a11y
Discussed in https://github.com/TypeCellOS/BlockNote/discussions/2519

Originally posted by Ovgodd September 4, 2025
Is your feature request related to a problem? Please describe.
The placeholder text and side menu icons in the BlockNote editor have insufficient contrast.
This fails WCAG 2.1 requirements (minimum 4.5:1), making it harder for users with low vision.

Describe the solution you'd like
Update the placeholder text and side menu icon styles to use higher-contrast colors.
For example, switching --bn-colors-side-menu: #cfcfcf; to --bn-colors-side-menu: #2a2a2a;

Image
Ngôn ngữ chính
TypeScript
Star
10.2k
Fork
772
Merge trung bình
3 ngày 11 giờ
Pull request đã merge (30 ngày)
17

Hướng dẫn đóng góp

Mở hướng dẫn đóng góp

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 TypeCellOS/BlockNote

Tất cả issue của TypeCellOS/BlockNote

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.