Fix menu and logo style

src/layouts/BasicLayout.js

@@ -168,7 +168,7 @@ class BasicLayout extends React.PureComponent {
             breakpoint="md"
             onCollapse={this.onCollapse}
             style={{ minHeight: '100vh' }}
-            width={272}
+            width={256}
           >
             <div className={styles.logo}>
               <Link to="/">
@@ -182,6 +182,7 @@ class BasicLayout extends React.PureComponent {
               defaultOpenKeys={this.getDefaultCollapsedSubMenus()}
               selectedKeys={this.getCurrentMenuSelectedKeys()}
               style={{ margin: '24px 0', width: '100%' }}
+              inlineIndent={32}
             >
               {this.getNavMenuItems(menus)}
             </Menu>

src/layouts/BasicLayout.less

@@ -10,7 +10,8 @@
   height: 64px;
   position: relative;
   line-height: 64px;
-  padding: 0 24px;
+  padding-left: 32px;
+  transition: all .3s;
   background: @primary-color;
   overflow: hidden;
   img {
@@ -29,8 +30,11 @@
   }
 }
 
-:global(.ant-layout-sider-collapsed) .logo > a {
-  width: 32px;
+:global(.ant-layout-sider-collapsed) .logo {
+  padding-left: 24px;
+  > a {
+    width: 32px;
+  }
 }
 
 .trigger {
@@ -40,7 +44,6 @@
   transition: all .3s;
   color: #fff;
   padding: 0 28px;
-  vertical-align: middle;
   &:hover {
     background: @primary-7;
   }