fixes #1785

src/app/panels/styles/terminal-styles.js

@@ -21,6 +21,7 @@ var css = csjs`
     display           : flex;
     align-items       : center;
     width             : 100%;
+    border-bottom-style : ridge;
   }
   .clear           {
     margin-right      : 20px;

src/app/panels/terminal.js

@@ -136,10 +136,10 @@ class Terminal {
           </div>
           ${self._view.pendingTxCount}
           <div class=${css.verticalLine}></div>
-          <div class=${css.listen}>
+          <div class="form-check">
             <input id="listenNetworkCheck" onchange=${listenOnNetwork} type="checkbox" class="form-check-input "
             title="If checked Remix will listen on all transactions mined in the current environment and not only transactions created by you">
-            <label class="${css.listenLabel} form-check-label" title="If checked Remix will listen on all transactions mined in the current environment and not only transactions created by you" for="listenNetworkCheck">listen on network</label>
+            <label class="form-check-label" title="If checked Remix will listen on all transactions mined in the current environment and not only transactions created by you" for="listenNetworkCheck">listen on network</label>
           </div>
           ${self._view.dropdown}
           <div class=${css.search}>

src/app/ui/dropdown.js

@@ -45,9 +45,9 @@ class Dropdown {
       </div>
     `
     self._view.el = yo`
-      <div class=${css.dropdown} onclick=${show}>
+      <div class="${css.dropdown}" onclick=${show}>
         ${self._view.selected}
-        <div class=${css.options} style="display: none;">
+        <div class="${css.options} bg-light" style="display: none;">
           ${self.data._options.map(label => {
             var input = yo`<input data-idx=${self.data._elements.length} onchange=${emit} type="checkbox" />`
             if (self.data.selected.indexOf(label) !== -1) {

src/app/ui/landing-page/landing-page.js

@@ -9,7 +9,7 @@ var css = csjs`
     flex-wrap       : wrap;
     align-content   : space-around;
     padding         : 20px;
-    max-width       : 300px;
+    max-width       : 340px;
     background-color: var(--light);
     font-family     : "Lucida Console", Monaco, monospace;
   }

src/app/ui/styles/dropdown-styles.js

@@ -7,6 +7,7 @@ var css = csjs`
     display           : flex;
     flex-direction    : column;
     margin-right      : 10px;
+    margin-left       : 10px;
     width             : auto;
   }
   .selectbox          {
@@ -32,15 +33,16 @@ var css = csjs`
     display           : flex;
     flex-direction    : column;
     align-items       : end;
-    top               : 24px;
-    left              : 0;
-    width             : 250px;
-    border            : 1px solid var(--primary);
+    top               : 30px;
+    right             : 0;
+    width             : 230px;
+    border            : 1px solid var(--dark);
     border-radius     : 3px;
     border-top        : 0;
   }
   .option {
-    margin: 0;
+    margin-left       : 5px;
+    margin-top        : 5px;
   }
 `