fix nav overflow

assets/style.less

@@ -61,10 +61,7 @@ p {
   color: white;
   background-color: #222;
   font-size: 18px;
-  // > *{
+  padding: 0 15px;
-  //   max-width: 1200px;
-  //   margin: 0 auto;
-  // }
 }
 
 
@@ -93,6 +90,14 @@ p {
     color: white;
   }
 
+  .el-submenu .el-submenu__icon-arrow {
+    margin-left: 0px;
+  }
+
+  .el-submenu .el-submenu__title {
+    padding: 0 15px;
+  }
+
   .el-menu-item:not(.is-disabled):focus,
   .el-menu-item.is-active,
   .el-menu-item:not(.is-disabled):hover,

components/Nav.vue

@@ -1,5 +1,5 @@
 <template lang="pug">
-  div#nav
+  el-header#header
     nuxt-link#logo(:to='$route.name==="index"?"/about":"/"')
       img(src='/favicon.ico')
       span.ml-1.hidden-xs-only {{settings.title}}
@@ -88,19 +88,20 @@ export default {
           message: e
         })
       }
-    },
+    }
   }
 }
 </script>
 
 <style lang='less'>
-
+#header {
+  display: inline;
   #logo {
     img {
       max-height: 60px;
     }
-  line-height: 60px;
     float: left;
+    line-height: 60px;
     color: white;
     font-size: 1.5em;
     font-weight: 600;
@@ -111,12 +112,14 @@ export default {
   }
 
   #menu {
-  float: right;
+    position: absolute;
+    right: 10px;
+    top: 0px;
     border-bottom: none;
-
     .el-menu-item {
       padding: 0px 15px;
     }
   }
+}
 
 </style>