Safari UI fixes (#3678)

* Minimum content height for overlay

* Fix Safari TabBar clicks

* Fix extra vertical scrollbar on Chrome

* Swap to em heights

js/src/views/Application/TabBar/tabBar.js

@@ -59,7 +59,7 @@ class Tab extends Component {
         selected={ active }
         icon={ view.icon }
         label={ label }
-        onClick={ this.handleClick }
+        onTouchTap={ this.handleClick }
       >
         { children }
       </MUITab>

js/src/views/ParityBar/parityBar.css

@@ -42,25 +42,26 @@
 }
 
 .expanded {
-  right: 16px;
-  max-height: 300px;
+  right: 1em;
   border-radius: 4px 4px 0 0;
-  overflow-y: auto;
   display: flex;
   flex-direction: column;
+  max-height: 19em;
 }
 
 .expanded .content {
   flex: 1;
-  overflow: auto;
+  overflow-y: auto;
+  overflow-x: hidden;
   display: flex;
   background: rgba(0, 0, 0, 0.8);
+  min-height: 16em;
 }
 
 .corner {
   position: absolute;
   bottom: 0;
-  right: 16px;
+  right: 1em;
   border-radius: 4px 4px 0 0;
 }
 
@@ -118,7 +119,7 @@
 }
 
 .header {
-  height: 36px;
+  height: 2em;
   padding: 0.5em 1em;
   background: rgba(0, 0, 0, 0.25);
   margin-bottom: 0;
@@ -148,6 +149,7 @@
 
 .actions {
   float: right;
+  margin-top: -2px;
 }
 
 .actions div {