Improve the buttons on the mobile interface

Add some padding so that they're larger and easier to hit with a finger
This commit is contained in:
Matt Rogers 2015-07-20 20:36:24 -05:00
parent 6bcae280c3
commit f234fbd4e8
4 changed files with 20 additions and 9 deletions

View file

@ -289,3 +289,14 @@ div.note_wrapper p {
text-align: right;
}
.btn {
padding: 8px 8px;
border-radius: 5px;
background-image: none;
display: inline-block;
white-space: none;
border: 1px solid transparent;
background-color: #999999;
color: white;
}

View file

@ -1,5 +1,5 @@
<%= form_tag todo_path(@todo, :format => 'm'), :name => 'mobileEdit', :method => :put do %>
<%= render :partial => 'edit_form', :locals => { :parent_container_type => "show_mobile" } %>
<p><input type="submit" value="<%= t('common.update') %>" tabindex="6" accesskey="#" /></p>
<p><input type="submit" value="<%= t('common.update') %>" tabindex="6" accesskey="#" class="btn"/></p>
<% end -%>
<%= link_to t('common.cancel'), @return_path %>

View file

@ -1,6 +1,6 @@
<%= form_tag todos_path(:format => 'm'), :method => :post do %>
<%= render :partial => 'edit_form' %>
<p class="text-right"><input type="submit" value="<%= t('common.create') %>" tabindex="12" accesskey="#" /></p>
<p class="text-right"><input type="submit" class="btn" value="<%= t('common.create') %>" tabindex="12" accesskey="#" /></p>
<% end -%>
<%= link_to t('common.back'), @return_path %>

View file

@ -4,42 +4,42 @@
<h2><Actions><%= t('common.actions') %></h2>
<form method="get" action="<%= edit_todo_path(@todo, :format => :m)%>">
<button><%=t('todos.edit_action')%></button>
<button class="btn"><%=t('todos.edit_action')%></button>
<input type="hidden" name="_method" value="put" />
</form>
<form method="post" action="<%=toggle_star_todo_path(@todo, :format=>:m)%>">
<button><%=t('todos.star_action')%></button>
<button class="btn"><%=t('todos.star_action')%></button>
<input type="hidden" name="_method" value="put" />
<%= token_tag %>
</form>
<form method="post" action="<%=toggle_check_todo_path(@todo, :format=>:m)%>">
<button><%= t('todos.mark_complete')%></button>
<button class="btn"><%= t('todos.mark_complete')%></button>
<input type="hidden" name="_method" value="put" />
<%= token_tag %>
</form>
<form method="post" action="<%=defer_todo_path(@todo, :format=>:m, :days => 1)%>">
<button><%=t('todos.defer_x_days', :count => 1)%></button>
<button class="btn"><%=t('todos.defer_x_days', :count => 1)%></button>
<input type="hidden" name="_method" value="put" />
<%= token_tag %>
</form>
<form method="post" action="<%=defer_todo_path(@todo, :format=>:m, :days => 2)%>">
<button><%=t('todos.defer_x_days', :count => 2)%></button>
<button class="btn"><%=t('todos.defer_x_days', :count => 2)%></button>
<input type="hidden" name="_method" value="put" />
<%= token_tag %>
</form>
<form method="post" action="<%=defer_todo_path(@todo, :format=>:m, :days => 3)%>">
<button><%=t('todos.defer_x_days', :count => 3)%></button>
<button class="btn"><%=t('todos.defer_x_days', :count => 3)%></button>
<input type="hidden" name="_method" value="put" />
<%= token_tag %>
</form>
<form method="post" action="<%=defer_todo_path(@todo, :format=>:m, :days => 7)%>">
<button><%=t('todos.defer_x_days', :count => 7)%></button>
<button class="btn"><%=t('todos.defer_x_days', :count => 7)%></button>
<input type="hidden" name="_method" value="put" />
<%= token_tag %>
</form>