From f54e4355e8368991ee0f4fa4ebd140faf723a654 Mon Sep 17 00:00:00 2001
From: Grant Nestor <grantnestor@gmail.com>
Date: Tue, 17 Jul 2018 12:33:48 -0700
Subject: [PATCH 1/3] Only display inline run button on mobile

---
 notebook/static/notebook/less/codecell.less | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/notebook/static/notebook/less/codecell.less b/notebook/static/notebook/less/codecell.less
index db75f0db0..0426b8ab2 100644
--- a/notebook/static/notebook/less/codecell.less
+++ b/notebook/static/notebook/less/codecell.less
@@ -42,10 +42,6 @@ div.code_cell div.input_prompt {
     min-width: 11ex;
 }
 
-div.code_cell:hover div.input .run_this_cell {
-    visibility: visible;
-}
-
 @media (-moz-touch-enabled: 1), (any-pointer: coarse) {
     .run_this_cell {
         visibility: visible;

From 3c4bc0ef623f05e04b2f2e4c2878c50300e1fcfb Mon Sep 17 00:00:00 2001
From: Grant Nestor <grantnestor@gmail.com>
Date: Tue, 17 Jul 2018 12:34:31 -0700
Subject: [PATCH 2/3] Display inline run button on same line as input prompt

---
 notebook/static/notebook/js/codecell.js     |  6 +++++-
 notebook/static/notebook/less/codecell.less | 20 ++++++++++++++------
 2 files changed, 19 insertions(+), 7 deletions(-)

diff --git a/notebook/static/notebook/js/codecell.js b/notebook/static/notebook/js/codecell.js
index 1e09b7d80..397420700 100644
--- a/notebook/static/notebook/js/codecell.js
+++ b/notebook/static/notebook/js/codecell.js
@@ -161,6 +161,8 @@ define([
         var input = $('<div></div>').addClass('input');
         this.input = input;
 
+        var prompt_container = $('<div/>').addClass('prompt_container');
+
         var run_this_cell = $('<div></div>').addClass('run_this_cell');
         run_this_cell.prop('title', 'Run this cell');
         run_this_cell.append('<i class="fa-step-forward fa"></i>');
@@ -170,6 +172,7 @@ define([
         });
 
         var prompt = $('<div/>').addClass('prompt input_prompt');
+        
         var inner_cell = $('<div/>').addClass('inner_cell');
         this.celltoolbar = new celltoolbar.CellToolbar({
             cell: this, 
@@ -189,7 +192,8 @@ define([
         this.code_mirror.on('keydown', $.proxy(this.handle_keyevent,this));
         $(this.code_mirror.getInputField()).attr("spellcheck", "false");
         inner_cell.append(input_area);
-        input.append(run_this_cell).append(prompt).append(inner_cell);
+        prompt_container.append(prompt).append(run_this_cell);
+        input.append(prompt_container).append(inner_cell);
 
         var output = $('<div></div>');
         cell.append(input).append(output);
diff --git a/notebook/static/notebook/less/codecell.less b/notebook/static/notebook/less/codecell.less
index 0426b8ab2..91211a114 100644
--- a/notebook/static/notebook/less/codecell.less
+++ b/notebook/static/notebook/less/codecell.less
@@ -21,20 +21,28 @@ div.input {
     }
 }
 
+div.prompt_container {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    align-items: flex-start;
+    text-align: right;
+}
+
 /* input_area and input_prompt must match in top border and margin for alignment */
 div.input_prompt {
     color: @input_prompt_color;
     border-top: 1px solid transparent;
 }
 
-.run_this_cell {
-    visibility: hidden;
+div.run_this_cell {
+    display: none;
     cursor: pointer;
     color: #333;
     padding-top: 5px;
     padding-bottom: 5px;
-    padding-left: 1ex;
-    padding-right: 1ex;
+    padding-left: 2ex;
+    padding-right: 2ex;
     width: 1ex;
 }
 
@@ -43,8 +51,8 @@ div.code_cell div.input_prompt {
 }
 
 @media (-moz-touch-enabled: 1), (any-pointer: coarse) {
-    .run_this_cell {
-        visibility: visible;
+    div.run_this_cell {
+        display: block;
     }
 }
 

From 43bd70b246556a1c46c172152f65df37e42a436e Mon Sep 17 00:00:00 2001
From: Grant Nestor <grantnestor@gmail.com>
Date: Wed, 18 Jul 2018 21:38:16 -0700
Subject: [PATCH 3/3] Fix uneven input prompt width

---
 notebook/static/notebook/less/codecell.less | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/notebook/static/notebook/less/codecell.less b/notebook/static/notebook/less/codecell.less
index 91211a114..a10e67ae4 100644
--- a/notebook/static/notebook/less/codecell.less
+++ b/notebook/static/notebook/less/codecell.less
@@ -47,7 +47,7 @@ div.run_this_cell {
 }
 
 div.code_cell div.input_prompt {
-    min-width: 11ex;
+    min-width: 15ex;
 }
 
 @media (-moz-touch-enabled: 1), (any-pointer: coarse) {