a11y: make link into button #313
Conversation
static/css/style.css
Outdated
| @@ -957,6 +957,17 @@ input:checked + .menu-switch-slider:before { | |||
| float: right; | |||
| } | |||
|
|
|||
| #file-upload-link { | |||
There was a problem hiding this comment.
Let's create a generic class for this as we have more link in other modals that could use this.
There was a problem hiding this comment.
Do you mean the links created by
Line 1740 in 3b27fe8
Line 1445 in 3b27fe8
If so, shall I update the JS to use buttons and as they are using a different class
PythonEditor/static/css/style.css
Line 807 in 3b27fe8
There was a problem hiding this comment.
Yes, the WebUSB error modal and the modalMsg modal.
update this to use a single class for all error modal links?PythonEditor/static/css/style.css
Line 807 in 3b27fe8
Not necessarily, that CSS class set-ups the padding and things like that, which would apply as before.
The new class to replace #file-upload-link should only contain the CSS required to make a button look exactly like a link, we then add that css class to all the links reworked into buttons, and keep all the old classes that were already attached to them.
There was a problem hiding this comment.
I've updated this, but I'm now stuck at how to now trigger the click for the webUSB not availble modal in' Find Out More'
|
Thanks Mark! |
python-main.js
Outdated
| addCloseClickListener = true; | ||
| } else { | ||
| modalLinks.push('<a href="' + links[key] + '" target="_blank">' + key + '</a>'); | ||
| modalLinks.push('<button type="button" aria-label="' + key + '"class="button-link">' + key + '</button>'); | ||
| modalLinks.onclick=function(){"window.location.href(links[key])"}; |
There was a problem hiding this comment.
Have you tested this? I think this has broken the links in the WebUSB not available modal.
Also, would this not open the link in the same window instead of a new one?
There was a problem hiding this comment.
Got a bit stuck triggering the button, but have fixed this and it should now work
microbit-mark
force-pushed
the
a11y-fix-href-link
branch
from
88edfc7 to
3f6a234
Compare
Co-Authored-By: Carlos Pereira Atencio <carlos@microbit.org>
fixes https://github.com/microbit-foundation/platform-software-issue-tracker/issues/596
Buttons are accessible by default as opposed to links
Before
After