Skip to content

Commit

Permalink
improve accessibility of sign-up modal (#7966)
Browse files Browse the repository at this point in the history
  • Loading branch information
@Tlazypanda
Tlazypanda authored Jun 3, 2020
1 parent d987cca commit 99241cb
Show file tree
Hide file tree
Showing 3 changed files with 15 additions and 15 deletions.
14 changes: 7 additions & 7 deletions app/views/layouts/_social_icons.html.erb
View file
Original file line number Diff line number Diff line change
@@ -1,28 +1,28 @@
<div class="container">

<div class="text-center">
<a href="/auth/google_oauth2?origin=<%= params[:return_to] || request.original_url %>" id="connect-google">
<a href="/auth/google_oauth2?origin=<%= params[:return_to] || request.original_url %>" id="connect-google" aria-label="Sign Up with Google">
<span class="btn btn-outline-light" style="margin-right:2px;background-color: #d34836;">
<i class="fa fa-google fa-fw" style="font-size:20px;color:white;"></i>
</span>
</a>
<a href="/auth/github?origin=<%= params[:return_to] || request.original_url %>" id="connect-github">
<a href="/auth/github?origin=<%= params[:return_to] || request.original_url %>" id="connect-github" aria-label="Sign Up with Github">
<span class="btn btn-default" style="margin-left:2px;background-color: #333;">
<i class="fa fa-github fa-fw" style="font-size:20px;color:white;"></i>
</span>
</a>
<a href="/auth/twitter?origin=<%= params[:return_to] || request.original_url %>" id="connect-twitter">
<a href="/auth/twitter?origin=<%= params[:return_to] || request.original_url %>" id="connect-twitter" aria-label="Sign Up with Twitter">
<span class="btn btn-outline-light" style="margin-left:2px;background-color: #1da1f2;">
<i class="fa fa-twitter fa-fw" style="font-size:20px;color:white;margin-left:2px;"></i>
</span>
</a>
<a href="/auth/facebook?origin=<%= params[:return_to] || request.original_url %>" id="connect-facebook">
<a href="/auth/facebook?origin=<%= params[:return_to] || request.original_url %>" id="connect-facebook" aria-label="Sign Up with Facebook">
<span class="btn btn-outline-light" style="margin-left:2px;background-color: #3b5998">
<i class="fa fa-facebook fa-fw" style="font-size:20px;color:white;"></i>
</span>
</a>
</div>

<div class='hr-or'></div>

</div>
Expand All @@ -38,7 +38,7 @@
font-family:"Junction Light", lucida grande,lucida sans console,sans-serif;
font-weight:normal;
}

div.hr-or:before {
content: 'OR';
padding:5px;
Expand Down
12 changes: 7 additions & 5 deletions app/views/users/_create_form.html.erb
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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>
<%= f.text_field :username, { tabindex: 1, placeholder: "Username", class: 'form-control', id: 'username-signup' } %>
<small class="invisible">Placeholder</small>
</div>
Expand All @@ -35,9 +35,10 @@

<div class="col-md-6" style="display:flex; justify-content: center;">
<div class="propic">
<img class="something_something rounded" src="https://www.gravatar.com/avatar/1aedb8d9dc4751e229a335e371db8058" style="width: 120px; height: 115px; margin-top: 10px; margin-bottom: 25px; margin-left: 55px; background:#ccc;" onerror="this.src='https://www.gravatar.com/avatar/1aedb8d9dc4751e229a335e371db8058'">
<img class="something_something rounded" alt="Profile Photo" src="https://www.gravatar.com/avatar/1aedb8d9dc4751e229a335e371db8058" style="width: 120px; height: 115px; margin-top: 10px; margin-bottom: 25px; margin-left: 55px; background:#ccc;" onerror="this.src='https://www.gravatar.com/avatar/1aedb8d9dc4751e229a335e371db8058'">
<div class="form-group">
<span class="btn btn-outline-primary btn-file">
<label id="selectProfilePhoto" for="something_else_unique">
<u style="cursor: pointer;">Choose image</u> or drag one here
<%= f.file_field :photo, id:"something_else_unique", onchange:'showFile(this, "something_something");', accept: "image/*", style: 'draggable: true' %>
</span>
Expand All @@ -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>
<%= f.password_field :password, { placeholder: 'Enter your new password',
tabindex: 4,
class: 'form-control',
Expand All @@ -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>
<%= f.password_field :password_confirmation, { placeholder: I18n.t('users._form.confirm_password'),
tabindex: 5,
class: 'form-control',
Expand All @@ -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>
<%= f.text_area :bio, { placeholder: I18n.t('users._form.add_bio'),
rows: 8,
class: 'form-control',
id: 'user-bio',
tabindex: 6 }
%>
</div>
Expand Down
4 changes: 1 addition & 3 deletions app/views/users/_spamaway.html.erb
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,7 @@

<div class="form-group spamaway">

<label for="spamaway_follow_instructions">
<%= translation('users._form.are_you_human') %>
</label>
<p style="font-size: 1.3em;">
<%= translation('users._form.spam_filtering') %>
</p>
Expand All @@ -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 %>">
<%= spam.radio_button vars[i], statement, { id: "spamaway_statement_#{caller}_#{i.to_s}#{j.to_s}" } %> <%= statement %>
</button>
<% end %>
Expand All @@ -27,7 +26,6 @@
</div>

<div class="form-group d-none">

<%= spam.text_area :follow_instructions, { class: "form-control col-lg-6",
rows: 8,
tabindex: 7,
Expand Down

0 comments on commit 99241cb

Please sign in to comment.