From f234fbd4e89162175efb08e4954a6db2bc531a46 Mon Sep 17 00:00:00 2001
From: Matt Rogers <codemattr@gmail.com>
Date: Mon, 20 Jul 2015 20:36:24 -0500
Subject: [PATCH 1/7] Improve the buttons on the mobile interface

Add some padding so that they're larger and easier to hit with a finger
---
 app/assets/stylesheets/mobile.css.scss | 11 +++++++++++
 app/views/todos/edit.m.erb             |  2 +-
 app/views/todos/new.m.erb              |  2 +-
 app/views/todos/show.m.erb             | 14 +++++++-------
 4 files changed, 20 insertions(+), 9 deletions(-)

diff --git a/app/assets/stylesheets/mobile.css.scss b/app/assets/stylesheets/mobile.css.scss
index 4cc1b6b5..372e7f71 100644
--- a/app/assets/stylesheets/mobile.css.scss
+++ b/app/assets/stylesheets/mobile.css.scss
@@ -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;
+}
+
diff --git a/app/views/todos/edit.m.erb b/app/views/todos/edit.m.erb
index 8f8d98a7..d1a35675 100644
--- a/app/views/todos/edit.m.erb
+++ b/app/views/todos/edit.m.erb
@@ -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 %>
diff --git a/app/views/todos/new.m.erb b/app/views/todos/new.m.erb
index 26b1a911..5284e69c 100644
--- a/app/views/todos/new.m.erb
+++ b/app/views/todos/new.m.erb
@@ -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 %>
 
diff --git a/app/views/todos/show.m.erb b/app/views/todos/show.m.erb
index 3a29573d..9159b0b3 100644
--- a/app/views/todos/show.m.erb
+++ b/app/views/todos/show.m.erb
@@ -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>

From 811d5321c2d63d3e75beac7bb747c4e41861fa8a Mon Sep 17 00:00:00 2001
From: Matt Rogers <codemattr@gmail.com>
Date: Fri, 24 Jul 2015 22:32:18 -0500
Subject: [PATCH 2/7] Add padding for the input boxes on the todo form

This makes them easier to hit on mobile with a finger.

The 8 pixel value is an arbitrary number not really based on anything
other than the fact that it looked better than the lower numbers I
tried.
---
 app/assets/stylesheets/mobile.css.scss | 1 +
 1 file changed, 1 insertion(+)

diff --git a/app/assets/stylesheets/mobile.css.scss b/app/assets/stylesheets/mobile.css.scss
index 372e7f71..07cba062 100644
--- a/app/assets/stylesheets/mobile.css.scss
+++ b/app/assets/stylesheets/mobile.css.scss
@@ -236,6 +236,7 @@ table.c {
 
 input#todo_description, input#tag_list, textarea#todo_notes, select#todo_project_id, select#todo_context_id {
     width: 95%;
+    padding: 8px 8px;
 }
 
 .next-prev-project {

From f5af02d3141baa7203937295306c91974869829f Mon Sep 17 00:00:00 2001
From: Matt Rogers <codemattr@gmail.com>
Date: Fri, 24 Jul 2015 22:36:09 -0500
Subject: [PATCH 3/7] Enlarge the font size for select boxes

The text for the select boxes on mobile is tiny. The makes them hard to
hit. Combined with the padding added earlier, this makes the select
boxes more usable when dealing with a mobile UI.
---
 app/assets/stylesheets/mobile.css.scss | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/app/assets/stylesheets/mobile.css.scss b/app/assets/stylesheets/mobile.css.scss
index 07cba062..b601f49e 100644
--- a/app/assets/stylesheets/mobile.css.scss
+++ b/app/assets/stylesheets/mobile.css.scss
@@ -239,6 +239,10 @@ input#todo_description, input#tag_list, textarea#todo_notes, select#todo_project
     padding: 8px 8px;
 }
 
+select {
+  font-size: 1.1em;
+}
+
 .next-prev-project {
     overflow:auto;
     padding:0;

From 2a6afba56e07f80626026b469e42c78abb0e35dc Mon Sep 17 00:00:00 2001
From: Matt Rogers <codemattr@gmail.com>
Date: Sat, 25 Jul 2015 07:58:39 -0500
Subject: [PATCH 4/7] Fix indentation to match the rest of the file

---
 app/assets/stylesheets/mobile.css.scss | 17 ++++++++---------
 1 file changed, 8 insertions(+), 9 deletions(-)

diff --git a/app/assets/stylesheets/mobile.css.scss b/app/assets/stylesheets/mobile.css.scss
index b601f49e..8d3e25fd 100644
--- a/app/assets/stylesheets/mobile.css.scss
+++ b/app/assets/stylesheets/mobile.css.scss
@@ -295,13 +295,12 @@ div.note_wrapper p {
 }
 
 .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;
+    padding: 8px 8px;
+    border-radius: 5px;
+    background-image: none;
+    display: inline-block;
+    white-space: none;
+    border: 1px solid transparent;
+    background-color: #999999;
+    color: white;
 }
-

From 568996ae73ffeac83f1f24a870c73bd1a02dad8f Mon Sep 17 00:00:00 2001
From: Matt Rogers <codemattr@gmail.com>
Date: Sat, 25 Jul 2015 07:59:10 -0500
Subject: [PATCH 5/7] Shorten the padding declaration.

A padding declaration of `8px 8px` is the same as just writing `8px` so
use the shorter version
---
 app/assets/stylesheets/mobile.css.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/assets/stylesheets/mobile.css.scss b/app/assets/stylesheets/mobile.css.scss
index 8d3e25fd..630af263 100644
--- a/app/assets/stylesheets/mobile.css.scss
+++ b/app/assets/stylesheets/mobile.css.scss
@@ -295,7 +295,7 @@ div.note_wrapper p {
 }
 
 .btn {
-    padding: 8px 8px;
+    padding: 8px;
     border-radius: 5px;
     background-image: none;
     display: inline-block;

From aa36fb97ab35700705975105a97c1be4b8f67c33 Mon Sep 17 00:00:00 2001
From: Matt Rogers <codemattr@gmail.com>
Date: Sat, 25 Jul 2015 07:59:56 -0500
Subject: [PATCH 6/7] Use hexadecimal values for color

---
 app/assets/stylesheets/mobile.css.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/assets/stylesheets/mobile.css.scss b/app/assets/stylesheets/mobile.css.scss
index 630af263..42ca3efb 100644
--- a/app/assets/stylesheets/mobile.css.scss
+++ b/app/assets/stylesheets/mobile.css.scss
@@ -302,5 +302,5 @@ div.note_wrapper p {
     white-space: none;
     border: 1px solid transparent;
     background-color: #999999;
-    color: white;
+    color: #ffffff;
 }

From a9d0c86f671de4fb09d42f7862a6385d5e87f8ea Mon Sep 17 00:00:00 2001
From: Matteo Giaccone <matteo.giaccone@welaika.com>
Date: Wed, 29 Jul 2015 21:47:43 +0100
Subject: [PATCH 7/7] Use box-sizing: border-box to style mobile input

---
 app/assets/stylesheets/mobile.css.scss | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/app/assets/stylesheets/mobile.css.scss b/app/assets/stylesheets/mobile.css.scss
index 42ca3efb..2ffe3872 100644
--- a/app/assets/stylesheets/mobile.css.scss
+++ b/app/assets/stylesheets/mobile.css.scss
@@ -235,8 +235,9 @@ table.c {
 }
 
 input#todo_description, input#tag_list, textarea#todo_notes, select#todo_project_id, select#todo_context_id {
-    width: 95%;
+    width: 100%;
     padding: 8px 8px;
+    box-sizing: border-box;
 }
 
 select {