Restyle transactionActions and unify icons with other icons

src/app/tabs/run-tab.js

@@ -24,7 +24,7 @@ var pendingTxsText = yo`<span></span>`
 function runTab (container, appAPI, appEvents) {
   var events = new EventManager()
 
-  var clearInstanceElement = yo`<i class="${css.clearinstance} fa fa-minus-square-o" title="Clear Instances List" aria-hidden="true"></i>`
+  var clearInstanceElement = yo`<i class="${css.clearinstance} ${css.icon} fa fa-minus-square-o" title="Clear Instances List" aria-hidden="true"></i>`
   clearInstanceElement.addEventListener('click', () => {
     events.trigger('clearInstance', [])
   })
@@ -139,21 +139,14 @@ function makeRecorder (events, appAPI, appEvents) {
     api: appAPI
   })
   var css2 = csjs`
-    .container {
-    }
+    .container,
+    .runTxs,
     .recorder {
-      font-size: 20px;
-      cursor: pointer;
-    }
-    .runTxs {
-      margin-left: 10px;
-      font-size: 20px;
-      cursor: pointer;
     }
   `
 
-  var recordButton = yo`<i class="fa fa-floppy-o savetransaction ${css2.recorder}" title="Save Transactions" aria-hidden="true"></i>`
-  var runButton = yo`<i class="fa fa-play runtransaction ${css2.runTxs}"  title="Run Transactions" aria-hidden="true"></i>`
+  var recordButton = yo`<i class="fa fa-floppy-o savetransaction ${css2.recorder} ${css.icon}" title="Save Transactions" aria-hidden="true"></i>`
+  var runButton = yo`<i class="fa fa-play runtransaction ${css2.runTxs} ${css.icon}"  title="Run Transactions" aria-hidden="true"></i>`
 
   recordButton.onclick = () => {
     var txJSON = JSON.stringify(recorder.getAll(), null, 2)

src/app/tabs/styles/run-tab-styles.js

@@ -109,6 +109,9 @@ var css = csjs`
   .pendingTxsText {
     ${styles.rightPanel.runTab.borderBox_Instance}
     font-style: italic;
+    display: flex;
+    justify-content: space-evenly;
+    align-items: center;
   }
   .item {
     margin-right: 1em;
@@ -141,6 +144,7 @@ var css = csjs`
   .icon {
     cursor: pointer;
     font-size: 12px;
+    cursor: pointer;
     color: ${styles.rightPanel.runTab.icon_Color};
     margin-left: 5px;
   }
@@ -171,13 +175,17 @@ var css = csjs`
   .networkItem {
     margin-right: 5px;
   }
-  .clearinstance {
-    font-size: 20px;
-    cursor: pointer;
-    margin-right: 10px;
-  }
   .transactionActions {
-    float: right;
+    display: flex;
+    width: 50px;
+    justify-content: space-between;
+}
+
+
+
+
+
+
 `
 
 module.exports = css