Move styles from bootstrap theme to css-in-js

src/app/tabs/runTab/contractDropdown.js

@@ -54,7 +54,7 @@ class ContractDropdownUI {
     this.createPanel = yo`<div class="${css.deployDropdown}"></div>`
     this.orLabel = yo`<div class="${css.orLabel}">or</div>`
     let el = yo`
-      <div class="${css.container} module-section">
+      <div class="${css.container} border-bottom border-light">
         <div class="${css.settingsLabel} form-control-label">Contract</div>
         <div class="${css.subcontainer}">
           ${this.selectContractNames} ${this.compFails} ${info}

src/app/tabs/runTab/settings.js

@@ -116,7 +116,7 @@ class SettingsUI {
         <div class="${css.settingsLabel} form-control-label">Value</div>
         <div class="${css.gasValueContainer}">
           <input type="text" class="form-control ${css.gasNval} ${css.col2}" id="value" value="0" title="Enter the value and choose the unit">
-          <select name="unit" class="form-control p-1 ${css.gasNvalUnit} ${css.col2_2} run-unit-input" id="unit">
+          <select name="unit" class="form-control p-1 ${css.gasNvalUnit} ${css.col2_2}" id="unit">
             <option data-unit="wei">wei</option>
             <option data-unit="gwei">gwei</option>
             <option data-unit="finney">finney</option>
@@ -127,7 +127,7 @@ class SettingsUI {
     `
 
     const el = yo`
-      <div class="${css.settings} module-section">
+      <div class="${css.settings} border-bottom border-light">
         ${environmentEl}
         ${networkEl}
         ${accountEl}

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

@@ -5,6 +5,9 @@ var css = csjs`
     display: flex;
     flex-direction: column;
   }
+  .runTabView::-webkit-scrollbar {
+    display: none;
+  }
   .instanceContainerTitle {
     display: flex;
     justify-content: space-between;
@@ -17,14 +20,6 @@ var css = csjs`
   .settings {
     padding: 16px 24px;
   }
-  .recorderCount {
-    /* margin-right: 30px; */
-    /* min-width: 13px; */
-    /* display: flex; */
-    /* justify-content: center; */
-    /* align-items: center; */
-    /* font-size: 10px; */
-  }
   .crow {
     display: block;
     margin-top: 8px;

src/universal-dapp-styles.js

@@ -38,6 +38,8 @@ var css = csjs`
     font-size: 11px;
     width:100%;
     border: none;
+    background: none;
+    text-transform: uppercase;
   }
   .inputGroupText {
     width: 100%;
@@ -57,7 +59,8 @@ var css = csjs`
     display: block;
     flex-direction: column;
     margin-bottom: 12px;
-    padding: 0 4px;
+    background: none;
+    border-radius: 2px;
   }
   .instance.hidesub .title {
       display: flex;
@@ -150,11 +153,6 @@ var css = csjs`
     align-self: center;
     margin-left: 4px;
   }
-  .value ul {
-    margin-bottom: 10px;
-    padding-top: 5px;
-    border-bottom: 4px solid var(--light);
-  }
   .contractActionsContainer {
     width: 100%;
   }