improve accessibility of sign-up modal #7966
Conversation
Codecov Report
@@ Coverage Diff @@
## master #7966 +/- ##
==========================================
+ Coverage 82.04% 82.17% +0.12%
==========================================
Files 97 97
Lines 5642 5643 +1
==========================================
+ Hits 4629 4637 +8
+ Misses 1013 1006 -7
|
|
@VladimirMikulic can you kindly review ? ✌️ |
|
@Tlazypanda great work! Would you be able to resolve these 7 errors and 19 warnings so its once and for all? Thanks. |
|
@VladimirMikulic Hey! The rest of these errors are flagged from the rest of the page for which I will be opening different issues(for ex - header one) and of the warnings apart from the ones in this page the rest are alright since they are -
|
|
Perhaps we can ask some fellow Outreachy folks to just take a quick look over this so you all are connected a bit? I'll request a review from @Shreyaa-s and @Shulammite-Aso -- we don't have to for every PR but it's nice to look out for one anothers' work every so often! And, feel free to help review some of their recent work too -- do you all have one that @Tlazypanda might be able to help look over? Thanks, all!!! 🎉 ❤️ |
| @@ -21,7 +21,7 @@ | |||
| <div class="row"> | |||
| <div class="col-md-6"> | |||
| <div class="form-group" id="username_div"> | |||
| <label for="username"><%= translation('user_sessions.new.username') %></label> | |||
| <label for="username-signup"><%= translation('user_sessions.new.username') %></label> | |||
There was a problem hiding this comment.
Just checking if this has affected our client-side validation at all? I would guess not but good to note this so people feel secure about it. Thank you!!!
| @@ -48,7 +49,7 @@ | |||
|
|
|||
| <div class="form-group row"> | |||
| <div class="form-group col-md-6"> | |||
| <label for="password"><%= translation('users._form.create_password') %></label> | |||
| <label for="password1"><%= translation('users._form.create_password') %></label> | |||
There was a problem hiding this comment.
Same question about client-side validation!
| @@ -59,7 +60,7 @@ | |||
| </div> | |||
|
|
|||
| <div class="form-group col-md-6"> | |||
| <label for="password_confirmation"><%= translation('users._form.password_confirmation') %></label> | |||
| <label for="password-confirmation"><%= translation('users._form.password_confirmation') %></label> | |||
| @@ -72,10 +73,11 @@ | |||
|
|
|||
| <div class="form-group row"> | |||
| <div class="col-md-12"> | |||
| <label for="user_bio"><%= translation('users._form.bio') %></label> | |||
| <label for="user-bio"><%= translation('users._form.bio') %></label> | |||
| @@ -16,6 +14,7 @@ | |||
| <div class="btn-group d-flex" role="group"> | |||
| <% [0,1].each_with_index do |s, j| %><% statement = turingtest[i][s] %> | |||
| <button type="button" class="col-5 btn btn-outline-secondary" style="font-size:3em;text-align:left;<% if i.odd? %> background:#eef;<% end %>" id="spamaway-<%= caller %>-<%= i.to_s + j.to_s %>"> | |||
| <label id="selectAnimal" for="spamaway_statement_<%= caller %>_<%= i.to_s + j.to_s %>"> | |||
|
I think changing the labels shouldn't interfere with the validation since we use |
|
Hey @Shreyaa-s @Shulammite-Aso @jywarren! Thanks for your reviews ❤️ And I tested for the client side validation with a new user works fine 😅 |
|
Awesome! Please give this one last test at stable.publiclab.org -- thank you! |
Fixes #7964
Improved accessibility of Sign up modal by adding missing form links, fixing orphaned form links, adding aria-labels for social icons and add alternative text for profile photo.
rake test@publiclab/reviewersfor help, in a comment belowScreenshots
Before
After
Thanks!