add el & update css in output_area to match run button in In from #3535

Without this change the output and Input areas become unaligned.

This still isn't an ideal fix, but it'll make a release possible without
making the styling problematic.

notebook/static/notebook/js/outputarea.js

@@ -370,6 +370,7 @@ define([
     OutputArea.prototype.create_output_area = function () {
         var oa = $("<div/>").addClass("output_area");
         if (this.prompt_area) {
+            oa.append($('<div/>').addClass('run_this_cell'));
             oa.append($('<div/>').addClass('prompt'));
         }
         return oa;

notebook/static/notebook/less/codecell.less

@@ -42,7 +42,7 @@ div.code_cell div.input_prompt {
     min-width: 11ex;
 }
 
-div.code_cell:hover .run_this_cell {
+div.code_cell:hover div.input .run_this_cell {
     visibility: visible;
 }
 
@@ -70,4 +70,3 @@ div.input_area > div.highlight > pre {
     padding: 0px;
     background-color: transparent;
 }
-

notebook/static/notebook/less/outputarea.less

@@ -41,6 +41,7 @@ div.out_prompt_overlay:hover {
 
 div.output_prompt {
     color: @output_prompt_color;
+    min-width: 11ex;
 }
 
 /* This class is the outer container of all output sections. */