Fix: Styling changes (#3)

Fixes header row styling
Removes dead css
Hides upload button when canuplaod is false

Author: priyajeet

src/components/ContentExplorer/Content.scss

@@ -5,21 +5,14 @@
     flex: 1;
     flex-direction: column;
 
-    .bce-item-list,
-    .bce-empty-state {
+    .bce-item-list {
         flex: 1;
+        min-height: 300px;
         position: relative;
 
         // sass-lint:disable class-name-format
         .ReactVirtualized__Table__Grid {
             outline: none;
         }
     }
-
-    .bce-empty-state {
-        align-items: center;
-        display: flex;
-        flex: 1;
-        justify-content: center;
-    }
 }

src/components/ContentExplorer/ItemList.scss

@@ -74,22 +74,19 @@
 .bce-item-header-row {
     border-bottom: 1px solid $off-white;
     box-shadow: 0 4px 6px -2px $transparent-black;
-    color: $sevens;
-    font-weight: 400;
-    text-transform: none;
-}
-
-.ReactVirtualized__Table__headerTruncatedText {
-    vertical-align: middle;
-}
 
-.ReactVirtualized__Table__sortableHeaderColumn {
-    cursor: pointer;
-
-    &:active,
-    &:hover,
-    &:focus {
-        color: $blue;
-        outline: none;
+    .ReactVirtualized__Table__sortableHeaderColumn {
+        color: $sevens;
+        cursor: pointer;
+        font-weight: 400;
+        text-transform: none;
+        user-select: none;
+
+        &:active,
+        &:hover,
+        &:focus {
+            color: $dark-cerulean;
+            outline: none;
+        }
     }
 }

src/components/ContentExplorer/ShareDialog.js

@@ -7,7 +7,7 @@
 import React from 'react';
 import Modal from 'react-modal';
 import ShareAccessSelect from '../ShareAccessSelect';
-import { Button } from '../Button';
+import { Button, PrimaryButton } from '../Button';
 import { CLASS_MODAL_CONTENT, CLASS_MODAL_OVERLAY, CLASS_MODAL } from '../../constants';
 import type { BoxItem } from '../../flowTypes';
 import './ShareDialog.scss';
@@ -71,9 +71,9 @@ const ShareDialog = ({
                             }}
                             value={url}
                         />
-                        <Button className='buik-modal-button-copy' onClick={copy}>
+                        <PrimaryButton className='buik-modal-button-copy' onClick={copy}>
                             {getLocalizedMessage('buik.modal.dialog.share.button.copy')}
-                        </Button>
+                        </PrimaryButton>
                     </span>
                 </label>
             </div>

src/components/ContentExplorer/ShareDialog.scss

@@ -21,24 +21,14 @@
     }
 
     .buik-modal-button-copy {
-        appearance: none;
-        background-color: $blue;
-        border: 1px solid $blue;
-        border-left: 0 none;
         border-radius: 0 3px 3px 0;
-        box-shadow: inset 0 1px 1px $lightest-black;
-        color: $white;
         font-size: 10px;
         font-weight: bold;
         height: 34px;
         letter-spacing: 1px;
         line-height: 34px;
-        margin: 0;
-        outline: none;
         padding: 0 10px;
-        text-shadow: none;
         text-transform: uppercase;
-        transition: background-color .05s ease-in-out, border-color .05s ease-in-out;
     }
 
     .buik-modal-btns {

src/components/ContentPicker/Content.scss

@@ -5,21 +5,14 @@
     flex: 1;
     flex-direction: column;
 
-    .bcp-item-list,
-    .bcp-empty-state {
+    .bcp-item-list {
         flex: 1;
+        min-height: 300px;
         position: relative;
 
         // sass-lint:disable class-name-format
         .ReactVirtualized__Table__Grid {
             outline: none;
         }
     }
-
-    .bcp-empty-state {
-        align-items: center;
-        display: flex;
-        flex: 1;
-        justify-content: center;
-    }
 }

src/components/ContentTree/Content.scss

@@ -5,21 +5,14 @@
     flex: 1;
     flex-direction: column;
 
-    .bct-item-list,
-    .bct-empty-state {
+    .bct-item-list {
         flex: 1;
+        min-height: 300px;
         position: relative;
 
         // sass-lint:disable class-name-format
         .ReactVirtualized__Table__Grid {
             outline: none;
         }
     }
-
-    .bct-empty-state {
-        align-items: center;
-        display: flex;
-        flex: 1;
-        justify-content: center;
-    }
 }

src/components/ContentUploader/DroppableContent.scss

@@ -6,6 +6,7 @@
 
     .bcu-item-list {
         flex: 1;
+        min-height: 300px;
         position: relative;
 
         // sass-lint:disable class-name-format

src/components/ContentUploader/UploadState.scss

@@ -5,6 +5,7 @@
     display: flex;
     flex: 1;
     justify-content: center;
+    min-height: 300px;
     position: relative;
     text-align: center;
 

src/components/EmptyState/EmptyState.scss

@@ -3,6 +3,7 @@
     display: flex;
     flex: 1;
     justify-content: center;
+    min-height: 300px;
     position: relative;
     text-align: center;
 }

src/components/Header/Header.js

@@ -41,9 +41,10 @@ const Header = ({ view, searchQuery, canUpload, onSearch, onUpload, logoUrl, get
                     />
                 </div>
             </div>
-            <Button onClick={onUpload} isDisabled={!canUpload || !isFolder}>
-                {getLocalizedMessage('buik.header.button.upload')}
-            </Button>
+            {canUpload &&
+                <Button onClick={onUpload} isDisabled={!isFolder}>
+                    {getLocalizedMessage('buik.header.button.upload')}
+                </Button>}
         </div>
     );
 };