Add prefers reduced motion sample #7
Conversation
Add prefers reduced motion and make minor updates to the aria live demo
| @@ -3,7 +3,7 @@ | |||
| <head> | |||
| <meta charset="utf-8" /> | |||
| <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" /> | |||
| <title>2025 Esri Developer & Technology Summit - Reduced Motion</title> | |||
| <title>Reduced motion</title> | |||
There was a problem hiding this comment.
nitpick:
Since the switch toggle pertains to animation and not the light/dark modes, should line 14 be omitted?
| @@ -1,6 +1,72 @@ | |||
| // DOM Elements | |||
| const mapEl = document.querySelector("arcgis-map"); | |||
There was a problem hiding this comment.
Unrelated to the code, but can the basemap be changed to a dark-grey or less prominent basemap? It seems like the data gets a bit washed out in the sample with the high contrast basemap.
There was a problem hiding this comment.
Done in the Map Viewer
| toggleModeEl.addEventListener("click", handleModeChange); | ||
|
|
There was a problem hiding this comment.
nitpick for line 29, do you think it would be useful to change the basemap when toggling between light/dark modes?
document.body.className = isDarkMode ? "calcite-mode-dark" : "";
mapEl.basemap = isDarkMode ? "dark-gray" : "gray";There was a problem hiding this comment.
Related nitpick:
What if the toggle switch also provided an aria-live region indicating the light/dark mode has been toggled?
There was a problem hiding this comment.
@geospatialem let me look at the aria-live update for light/dark mode. I "think" that since the user clicks the button that tells them they are toggling the light/dark that aria-live might be overkill? But I can add it and see if it feels too chatty
Updating the code to flip the basemap
No description provided.