grid moved to global view

src/App.vue

@@ -4,9 +4,16 @@ import NavBar from '@/components/Navbar/NavBar.vue'
 
 <template>
   <NavBar />
-  <router-view />
+
+  <n-grid responsive="screen" item-responsive cols="24" :x-gap="16" :y-gap="16">
+    <n-gi span="xs:1 s:1 m:2 l:2 xl:3 xxl:3" />
+
+    <n-gi span="xs:22 s:22 m:20 l:20 xl:18 xxl:18">
+      <router-view />
+    </n-gi>
+
+    <n-gi span="xs:1 s:1 m:2 l:2 xl:3 xxl:3" />
+  </n-grid>
 </template>
 
-<style scoped>
-
-</style>
+<style scoped></style>

src/components/Navbar/NavBar.vue

@@ -124,6 +124,7 @@ const renderLabel = (option) => {
   border-bottom: 1px solid #eee;
   position: relative;
   z-index: 10;
+  margin-bottom: 10px;
 }
 
 .logo {

src/views/PersonalView.vue

@@ -3,28 +3,9 @@ import List from '@/views/PersonalView/List.vue'
 </script>
 
 <template>
-  <n-grid
-    responsive="screen"
-    item-responsive
-    cols="24"
-    :x-gap="16"
-    :y-gap="16"
-  >
-    <n-gi span="xs:1 s:1 m:2 l:2 xl:3 xxl:3"/>
-
-    <n-gi span="xs:22 s:22 m:20 l:20 xl:18 xxl:18">
-      <n-card class="personal-card"
-        bordered title="Personal info">
-        <List />
-      </n-card>
-    </n-gi>
-
-    <n-gi span="xs:1 s:1 m:2 l:2 xl:3 xxl:3"/>
-  </n-grid>
+  <n-card bordered title="Personal info">
+    <List />
+  </n-card>
 </template>
 
-<style scoped>
-.personal-card {
-  margin: 10px auto 0;
-}
-</style>
+<style scoped></style>