Improve handling of signup and login forms on small displays.

This commit is contained in:
Tom Hughes 2009-10-20 23:57:39 +00:00
parent 3244635aa1
commit fc4e72dc35
3 changed files with 35 additions and 8 deletions

View file

@ -4,10 +4,10 @@
<% form_tag :action => 'login' do %>
<%= hidden_field_tag('referer', h(params[:referer])) %>
<table>
<table id="loginForm">
<tr><td class="fieldName"><%= t 'user.login.email or username' %></td><td><%= text_field('user', 'email',{:size => 28, :maxlength => 255, :tabindex => 1}) %></td></tr>
<tr><td class="fieldName"><%= t 'user.login.password' %></td><td><%= password_field('user', 'password',{:size => 28, :maxlength => 255, :tabindex => 2}) %> <span class="minorNote">(<%= link_to t('user.login.lost password link'), :controller => 'user', :action => 'lost_password' %>)</span></td></tr>
<tr><td colspan=2>&nbsp;<!--vertical spacer--></td></tr>
<tr><td></td><td align="left"><%= submit_tag t('user.login.login_button'), :tabindex => 3 %></td></tr>
<tr><td colspan="2">&nbsp;<!--vertical spacer--></td></tr>
<tr><td></td><td align="right"><%= submit_tag t('user.login.login_button'), :tabindex => 3 %></td></tr>
</table>
<% end %>

View file

@ -20,18 +20,18 @@
<% form_tag :action => 'save' do %>
<%= hidden_field_tag('referer', h(params[:referer])) unless params[:referer].nil? %>
<table id="loginForm">
<table id="signupForm">
<tr><td class="fieldName"><%= t 'user.new.email address' %></td><td><%= text_field('user', 'email',{:size => 50, :maxlength => 255, :tabindex => 1}) %></td></tr>
<tr><td class="fieldName"><%= t 'user.new.confirm email address' %></td><td><%= text_field('user', 'email_confirmation',{:size => 50, :maxlength => 255, :tabindex => 2}) %></td></tr>
<tr><td></td><td><span class="minorNote"><%= t 'user.new.not displayed publicly' %></span></td></tr>
<tr><td colspan=2>&nbsp;<!--vertical spacer--></td></tr>
<tr><td colspan="2">&nbsp;<!--vertical spacer--></td></tr>
<tr><td class="fieldName"><%= t 'user.new.display name' %></td><td><%= text_field('user', 'display_name',{:size => 30, :maxlength => 255, :tabindex => 3}) %></td></tr>
<tr><td colspan=2>&nbsp;<!--vertical spacer--></td></tr>
<tr><td colspan="2">&nbsp;<!--vertical spacer--></td></tr>
<tr><td class="fieldName"><%= t 'user.new.password' %></td><td><%= password_field('user', 'pass_crypt',{:size => 30, :maxlength => 255, :tabindex => 4}) %></td></tr>
<tr><td class="fieldName"><%= t 'user.new.confirm password' %></td><td><%= password_field('user', 'pass_crypt_confirmation',{:size => 30, :maxlength => 255, :tabindex => 5}) %></td></tr>
<tr><td colspan=2>&nbsp;<!--vertical spacer--></td></tr>
<tr><td></td><td align=right><input type="submit" value="<%= t'user.new.signup' %>" tabindex="6"></td></tr>
<tr><td colspan="2">&nbsp;<!--vertical spacer--></td></tr>
<tr><td></td><td align="right"><input type="submit" value="<%= t'user.new.signup' %>" tabindex="6"></td></tr>
</table>
<% end %>

View file

@ -115,3 +115,30 @@ h1 {
display: inline;
}
#signupForm input[type="text"], #signupForm input[type="password"] {
width: 100%;
}
#signupForm input#user_email {
max-width: 30em;
}
#signupForm input#user_email_confirmation {
max-width: 30em;
}
#signupForm input#user_display_name {
max-width: 20em;
}
#signupForm input#user_pass_crypt {
max-width: 20em;
}
#signupForm input#user_pass_crypt_confirmation {
max-width: 20em;
}
#loginForm input#user_email {
width: 100%;
max-width: 18em;
}
#loginForm input#user_password {
width: 100%;
max-width: 18em;
}