run

static/css/themes/black.css

@@ -57,12 +57,12 @@
     box-shadow: 1px 0 0 0 #000000 inset, 1px 0 0 0 #000000, 0 1px 0 0 rgba(255, 255, 255, 0.15) inset;
 }
 
+.menu .split {
+    border-color: #000000;
+}
+
 #buildRun {
     background-color: #494949;
-    box-shadow: 1px 0 0 0 #000000 inset, 1px 0 0 0 #000000, 0 1px 0 0 rgba(255, 255, 255, 0.15) inset;
-    color: #6DB14C;
-    padding: 1px 5px;
-    border-radius: 3px;
 }
 
 .frame {

static/css/themes/default.css

@@ -55,12 +55,12 @@
     color: #393939;
 }
 
+.menu .split {
+    border-color: #b6b6b6;
+}
+
 #buildRun {
     background-color: #cfcfcf;
-    box-shadow: 1px 0 0 0 #b6b6b6 inset, 1px 0 0 0 #b6b6b6, 0 1px 0 0 rgba(255, 255, 255, 0.15) inset;
-    color: #6DB14C;
-    padding: 1px 5px;
-    border-radius: 3px;
 }
 
 .frame {

static/css/wide.css

@@ -239,6 +239,25 @@
     cursor: pointer;
     padding: 4px 7px;
 }
+
+.menu .split {
+    float: left;
+    border-left: 1px solid #919191;
+    height: 21px;
+    margin: 0 5px 0 0px
+}
+
+#buildRun {
+    color: #6DB14C;
+    padding: 0px 3px 0 5px;
+    border-radius: 10px;
+    display: inline-block;
+}
+
+#buildRun.ico-stop {
+    color: #9d0000;
+    padding: 0 4px 0 4px;
+}
 /* end menu */
 
 /* start editor */

static/js/menu.js

@@ -229,7 +229,7 @@ var menu = {
             return false;
         }
 
-        if ($(".toolbars .ico-stop").length === 1) {
+        if ($("#buildRun").hasClass("ico-stop")) {
             wide.stop();
             return false;
         }
@@ -248,7 +248,7 @@ var menu = {
                 bottomGroup.resetOutput();
             },
             success: function (data) {
-                $(".toolbars .ico-buildrun").addClass("ico-stop")
+                $("#buildRun").addClass("ico-stop")
                         .removeClass("ico-buildrun").attr("title", config.label.stop);
             }
         });

static/js/wide.js

@@ -358,7 +358,7 @@ var wide = {
                     break;
                 case 'run-done':
                     wide.curProcessId = undefined;
-                    $(".toolbars .ico-stop").removeClass("ico-stop")
+                    $("#buildRun").removeClass("ico-stop")
                             .addClass("ico-buildrun").attr("title", config.label.build_n_run);
 
                     break;
@@ -391,7 +391,7 @@ var wide = {
                             files[lint.file] = lint.file;
                         }
 
-                        $(".toolbars .ico-stop").removeClass("ico-stop")
+                        $("#buildRun").removeClass("ico-stop")
                                 .addClass("ico-buildrun").attr("title", config.label.build_n_run);
 
                         // trigger gutter lint
@@ -511,7 +511,7 @@ var wide = {
         wide._save(path, wide.curEditor);
     },
     stop: function () {
-        if ($(".toolbars .ico-buildrun").length === 1) {
+        if ($("#buildRun").hasClass("ico-buildrun")) {
             menu.run();
             return false;
         }
@@ -529,7 +529,7 @@ var wide = {
             data: JSON.stringify(request),
             dataType: "json",
             success: function (data) {
-                $(".toolbars .ico-stop").removeClass("ico-stop")
+                $("#buildRun").removeClass("ico-stop")
                         .addClass("ico-buildrun").attr("title", config.label.build_n_run);
             }
         });

views/index.html

@@ -341,7 +341,9 @@
                     </div>                    
                 </li>
             </ul>
+            <span class="split"></span>
             <span id="buildRun" onclick="menu.run()" class="font-ico ico-buildrun" title="{{.i18n.build_n_run}}"></span>
+            
         </div>
 
         <div class="content">