aria
aria copied to clipboard
w3c
[Draft] Enables respec darkmode
Closes #2133
Enables darkmode compatibilty through respecConfig.darkMode
This follows w3c/respec#3236
Much appreciated if anyone can please test this to see how it actually works in the ARIA context.
Hi @daniel-montalvo, I’m not sure this is a valid review, but the issue is still present in this PR’s auto-generated diff preview. respec’s diff engine found 4 changes to the ARIA spec in this PR that I presume are unrelated to your commit, but that did create a visual diff which still exhibits the color issue.
Is it possible for me to run respec locally and produce a diff preview after making a quick content change to the spec’s index.html file? I’m wondering if the issue might show up as resolved in that context.
@daniel-montalvo this doesn't seem to have any any visual effect when switching my browser's dark/light mode. I also tried manually adding ?darkMode=true to no avail.
Oh, as @adampage said, the diffs are (still) affected and still exhibiting the bug that Adam had reported.
The dark mode feature has been merged in respec, but not yet deployed in a release, so it is expected this would not have an effect yet
The dark mode feature has been merged in respec, but not yet deployed in a release, so it is expected this would not have an effect yet
Thanks @dontcallmedom for clarifying this, wasn't sure about whether it was already deployed or not.
Thanks @pkra and @adampage for testing this.
Moving this to draft until this is actually deployed in a respec release
@daniel-montalvo following today's call I checked again. I do not see any changes in the preview when forcing dark mode.
Doe the previews need to be refreshed in some way perhaps?
Deploy Preview for wai-aria ready!
| Name | Link |
|---|---|
| Latest commit | 284a5497cf3421f2e9d004b784b39cf1dab07bd5 |
| Latest deploy log | https://app.netlify.com/sites/wai-aria/deploys/669796434e54fa000822f7b5 |
| Deploy Preview | https://deploy-preview-2138--wai-aria.netlify.app |
| Preview on mobile | Toggle QR Code...Use your smartphone camera to open QR code link. |
To edit notification comments on pull requests, go to your Netlify site configuration.
![netlify[bot] avatar](https://avatars.githubusercontent.com/in/13473?v=4 "Published by a pub.dev verified publisher"){kind=small}
@daniel-montalvo in the latest netlify preview, I still don't see a visual change when forcing darkmode (in Chrome or Firefox). Sorry :(
I see the change in the preview. My OS is set to dark mode and I see this:
If I force light mode in dev tools I see the opposite:
Note that the suggestion about removing darkMode: true from the changes still seems to be unresolved.
@kfranqueiro thanks for making me take another look. I now noticed that when I switch to darkmode after loading, there's no effect. But if I reload the page, it's switched to dark mode. Maybe that's the expected behavior of respec right now. [Edit: once reloaded in dark mode, switching in and out of dark mode works as expected - I see this on both Chromium and Firefox so I suspect something is not quite right on the respec end.)
We need to fix our CSS, e.g., common.css sets table cells to a background of #eee which does not play well with dark mode's text color.
@daniel-montalvo let me know if you'd like CSS fixes as part of this PR or afterwards.
Thanks @kfranqueiro for taking a look at this.
@pkra Happy for the CSS changes to be included in this PR.