diff --git a/frontend/src/components/dialog/extra-metadata-attributes-dialog/index.js b/frontend/src/components/dialog/extra-metadata-attributes-dialog/index.js
index c67069fa88..edde54ec0f 100644
--- a/frontend/src/components/dialog/extra-metadata-attributes-dialog/index.js
+++ b/frontend/src/components/dialog/extra-metadata-attributes-dialog/index.js
@@ -96,7 +96,7 @@ class ExtraMetadataAttributesDialog extends Component {
   updateData = (update, column) => {
     const newRow = { ...this.state.row, ...update };
     this.setState({ row: newRow }, () => {
-      const { repoID, filePath } = this.props;
+      const { repoID } = this.props;
 
       let newValue = update[column.key];
       let recordID = this.state.row._id;
diff --git a/frontend/src/css/layout.css b/frontend/src/css/layout.css
index 62c871542d..29b92b001e 100644
--- a/frontend/src/css/layout.css
+++ b/frontend/src/css/layout.css
@@ -52,9 +52,8 @@
   padding: .5rem 1rem;
   display: flex;
   flex-shrink: 0;
-  background: #fff;
+  background-color: #F8FAFD;
   border-bottom: 1px solid #eee;
-  box-shadow: 0 2px 4px rgba(0,0,0, 10%);
   z-index: 100;
 }
 
diff --git a/frontend/src/css/lib-content-view.css b/frontend/src/css/lib-content-view.css
index eb6acd4b44..eac96a24a1 100644
--- a/frontend/src/css/lib-content-view.css
+++ b/frontend/src/css/lib-content-view.css
@@ -196,7 +196,7 @@
   text-align: center;
   font-size: 16px;
   border-radius: 50%;
-  box-shadow: 0 3px 5px -1px rgba(0,0,0,.2), 0 6px 10px 0 rgba(0,0,0,.14), 0 1px 18px 0 rgba(0,0,0,.12);
+  box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12);
   user-select: none;
   border: none;
   right: 10px;
diff --git a/frontend/src/css/react-context-menu.css b/frontend/src/css/react-context-menu.css
index 2e0e932602..1229f7d5e5 100644
--- a/frontend/src/css/react-context-menu.css
+++ b/frontend/src/css/react-context-menu.css
@@ -1,78 +1,75 @@
 .react-contextmenu {
-    min-width: 160px;
-    padding: 5px 0;
-    margin: 2px 0 0;
-    font-size: 16px;
-    color: #373a3c;
-    text-align: left;
-    background-color: #fff;
-    background-clip: padding-box;
-    border: 1px solid rgba(0, 0, 0, .15);
-    border-radius: .25rem;
-    outline: none;
-    opacity: 0;
-    pointer-events: none;
-    transition: opacity 250ms ease !important;
+  min-width: 160px;
+  padding: 5px 0;
+  margin: 2px 0 0;
+  font-size: 16px;
+  color: #373a3c;
+  text-align: left;
+  background-color: #fff;
+  background-clip: padding-box;
+  border: 1px solid rgba(0, 0, 0, .15);
+  border-radius: .25rem;
+  outline: none;
+  opacity: 0;
+  pointer-events: none;
+  transition: opacity 250ms ease !important;
 }
 
 .react-contextmenu.react-contextmenu--visible {
-    opacity: 1;
-    pointer-events: auto;
+  opacity: 1;
+  pointer-events: auto;
 }
 
 .react-contextmenu-item {
-    padding: 3px 20px;
-    font-weight: 400;
-    line-height: 1.5;
-    color: #373a3c;
-    text-align: inherit;
-    white-space: nowrap;
-    background: 0 0;
-    border: 0;
+  padding: 3px 20px;
+  font-weight: 400;
+  line-height: 1.5;
+  color: #373a3c;
+  text-align: inherit;
+  white-space: nowrap;
+  background: 0 0;
+  border: 0;
 	cursor: pointer;
 }
 
 .react-contextmenu-item.react-contextmenu-item--active,
 .react-contextmenu-item.react-contextmenu-item--selected {
-    color: #fff;
-    background-color: #20a0ff;
-    border-color: #20a0ff;
-    text-decoration: none;
+  color: #fff;
+  background-color: #20a0ff;
+  border-color: #20a0ff;
+  text-decoration: none;
 }
 
 .react-contextmenu-item.react-contextmenu-item--disabled,
 .react-contextmenu-item.react-contextmenu-item--disabled:hover {
-    color: #878a8c;
-    background-color: transparent;
-    border-color: rgba(0,0,0,.15);
+  color: #878a8c;
+  background-color: transparent;
+  border-color: rgba(0, 0, 0, 0.15);
 }
 
 .react-contextmenu-item--divider {
-    margin-bottom: 3px;
-    padding: 2px 0;
-    border-bottom: 1px solid rgba(0,0,0,.15);
-    cursor: inherit;
+  margin-bottom: 3px;
+  padding: 2px 0;
+  border-bottom: 1px solid rgba(0, 0, 0, 0.15);
+  cursor: inherit;
 }
 .react-contextmenu-item--divider:hover {
-    background-color: transparent;
-    border-color: rgba(0,0,0,.15);
+  background-color: transparent;
+  border-color: rgba(0, 0, 0, 0.15);
 }
 
 .react-contextmenu-item.react-contextmenu-submenu {
 	padding: 0;
 }
 
-.react-contextmenu-item.react-contextmenu-submenu > .react-contextmenu-item {
-}
-
 .react-contextmenu-item.react-contextmenu-submenu > .react-contextmenu-item:after {
-    content: "▶";
-    display: inline-block;
-    position: absolute;
-    right: 7px;
+  content: "▶";
+  display: inline-block;
+  position: absolute;
+  right: 7px;
 }
 
 .example-multiple-targets::after {
-    content: attr(data-count);
-    display: block;
+  content: attr(data-count);
+  display: block;
 }
diff --git a/media/css/seahub.css b/media/css/seahub.css
index 6f1f1af9aa..6850e7815c 100644
--- a/media/css/seahub.css
+++ b/media/css/seahub.css
@@ -1187,18 +1187,15 @@ a.sf-popover-item {
     margin:5px -10px;
 }
 /********** Container ***********/
-#wrapper {
-}
 #header {
-    background:#f4f4f7;
-    width:100%;
-    height:53px;
+    background: #F8FAFD;
+    width: 100%;
+    height: 53px;
     font-size: 14px;
     border-bottom: 1px solid #e8e8e8;
-    padding:8px 16px 4px;
-    /*display:flex;*/
-    justify-content:space-between;
-    flex-shrink:0;
+    padding: 8px 16px 4px;
+    justify-content: space-between;
+    flex-shrink: 0;
 }
 #wide-panel-noframe {
     padding-top:16px;