From 1cc97f567bb532c6a442ba9d1c1d62a6f9461ea1 Mon Sep 17 00:00:00 2001
From: afc163 <afc163@gmail.com>
Date: Sun, 14 Oct 2018 13:46:50 +0800
Subject: [PATCH] Adjust Header style details

---
 src/components/GlobalHeader/index.less |  4 ++--
 src/components/SelectLang/index.js     |  2 +-
 src/components/SelectLang/index.less   |  4 ++++
 src/components/TopNavHeader/index.js   | 12 ++++--------
 src/components/TopNavHeader/index.less |  7 +++----
 5 files changed, 14 insertions(+), 15 deletions(-)

diff --git a/src/components/GlobalHeader/index.less b/src/components/GlobalHeader/index.less
index c6c7d913..5ed7fbaf 100644
--- a/src/components/GlobalHeader/index.less
+++ b/src/components/GlobalHeader/index.less
@@ -4,7 +4,7 @@
 
 .header {
   height: 64px;
-  padding: 0 12px 0 0;
+  padding: 0;
   background: #fff;
   box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
   position: relative;
@@ -76,7 +76,7 @@ i.trigger {
       margin: 20px 8px 20px 0;
       color: @primary-color;
       background: rgba(255, 255, 255, 0.85);
-      vertical-align: middle;
+      vertical-align: top;
     }
   }
 }
diff --git a/src/components/SelectLang/index.js b/src/components/SelectLang/index.js
index 758f9a09..e8cba6f2 100644
--- a/src/components/SelectLang/index.js
+++ b/src/components/SelectLang/index.js
@@ -29,7 +29,7 @@ export default class SelectLang extends PureComponent {
       </Menu>
     );
     return (
-      <Dropdown overlay={langMenu}>
+      <Dropdown overlay={langMenu} placement="bottomRight">
         <Icon
           type="global"
           className={classNames(styles.dropDown, className)}
diff --git a/src/components/SelectLang/index.less b/src/components/SelectLang/index.less
index 1b81a7be..819c0f8c 100644
--- a/src/components/SelectLang/index.less
+++ b/src/components/SelectLang/index.less
@@ -14,4 +14,8 @@
   font-size: 14px;
   vertical-align: top;
   line-height: 64px;
+  > svg {
+    position: relative;
+    top: 2px;
+  }
 }
diff --git a/src/components/TopNavHeader/index.js b/src/components/TopNavHeader/index.js
index 9a8960a7..560f01d8 100644
--- a/src/components/TopNavHeader/index.js
+++ b/src/components/TopNavHeader/index.js
@@ -5,17 +5,13 @@ import BaseMenu from '../SiderMenu/BaseMenu';
 import styles from './index.less';
 
 export default class TopNavHeader extends PureComponent {
-  constructor(props) {
-    super(props);
-
-    this.state = {
-      maxWidth: (props.contentWidth === 'Fixed' ? 1200 : window.innerWidth) - 330 - 165 - 4 - 36,
-    };
-  }
+  state = {
+    maxWidth: undefined,
+  };
 
   static getDerivedStateFromProps(props) {
     return {
-      maxWidth: (props.contentWidth === 'Fixed' ? 1200 : window.innerWidth) - 330 - 165 - 4 - 36,
+      maxWidth: (props.contentWidth === 'Fixed' ? 1200 : window.innerWidth) - 280 - 165 - 40,
     };
   }
 
diff --git a/src/components/TopNavHeader/index.less b/src/components/TopNavHeader/index.less
index 39184582..9883019e 100644
--- a/src/components/TopNavHeader/index.less
+++ b/src/components/TopNavHeader/index.less
@@ -2,13 +2,12 @@
   width: 100%;
   transition: background 0.3s, width 0.2s;
   height: 64px;
-  padding: 0 12px 0 0;
   box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
   position: relative;
   :global {
     .ant-menu-submenu.ant-menu-submenu-horizontal {
+      line-height: 64px;
       height: 100%;
-      padding-top: 9px;
       .ant-menu-submenu-title {
         height: 100%;
       }
@@ -24,7 +23,7 @@
     &.wide {
       max-width: 1200px;
       margin: auto;
-      padding-left: 4px;
+      padding-left: 0;
     }
     .left {
       flex: 1;
@@ -51,7 +50,7 @@
   h1 {
     color: #fff;
     display: inline-block;
-    vertical-align: middle;
+    vertical-align: top;
     font-size: 16px;
     margin: 0 0 0 12px;
     font-weight: 400;
-- 
GitLab