-
Notifications
You must be signed in to change notification settings - Fork 0
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[WIP]: Theming checklist #9
base: main
Are you sure you want to change the base?
Conversation
I'm not sure if this fits as a new file in the PR or not, so I'm posting it here to keep the use of this checklist consolidated for now. JupyterLab 3.2.0 on Binder (July 12)Truncated version of the checklist with an emphasis on non-color review. Percievable
Operable
Understandable
|
So I started looking for some insight about the issue with ems/rems/px in multiple sites and it seems that it is really hard to just create rules that will work every time because each use case may be different. My proposal is to start with an audit based on use cases focused in certain parts of the interface to detect particular cases where we will decide if it is best to use ems, rems or px and start fixing the shape and size of certain objects. For doing this audit we will first define the use cases, ej. behavior of the side bar and do the following tests:
The main goal will be to see how the side bar currently behaves and if it is usable and start gathering insights to see how we can start to fix the issues. We will need to mix the 4 points among each other to see different settings of the same use case, in this case the side bar. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I added everyone's in-meeting feedback via suggestion so we have some history of the discussion stored for later. Please let me know if I missed anything.
- [ ] User interface components and graphics have a contrast ratio of at least 3:1 against adjacent color(s). [1.4.11](https://www.w3.org/TR/WCAG22/#non-text-contrast) | ||
- [ ] When a measurement should scale with text size, it is measured in ems. When a measurement should not scale with text size, it is measured in px. [Source](https://www.joshwcomeau.com/css/surprising-truth-about-pixels-and-accessibility/) | ||
- [ ] Syntax highlighting has a contrast ratio of at least 4.5:1 | ||
- [ ] Red and green are not used adjacent to one another or to convey opposite information unless they are labelled with non-color versions of the information at every instance. | ||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
400% zoom |
1.4.10: Reflow
This PR adds the draft theming checklist that I'm using to review current JupyterLab theming and our own work. I expect it to change. I am opening this for transparency.
Related to quansight-labs/jupyter-a11y-mgmt #133.