Navbar(login + register) vue 생성 > fixed-toolbar

pages/index.vue

@@ -1,5 +1,18 @@
 <template>
-  <div class="md-layout md-aligment-center">
+  <div class="md-layout md-aligment-center" style="margin: 4em 0">
+    <!-- TOP Navigation-->
+    <md-toolbar class="fixed-toolbar" elevation="1">
+      <md-button class="md-icon-button">
+        <md-icon>menu</md-icon>
+      </md-button>
+      <nuxt-link class="md-primary md-title" to="/">
+        NuxtNews
+      </nuxt-link>
+      <div class="md-toolbar-section-end">
+        <md-button to="/login">Login</md-button>
+        <md-button to="/register">Register</md-button>
+      </div>
+    </md-toolbar>
     <!-- App Content -->
     <div class="md-layout-item md-size-95">
       <md-content class="md-layout md-gutter" style="background: #007998; padding: 1em;">
@@ -66,4 +79,10 @@ export default {
   .small-icon {
     font-size: 18px !important;
   }
+
+  .fixed-toolbar {
+    position: fixed;
+    top: 0;
+    z-index: 5;
+  }
 </style>

pages/login/index.vue

@@ -0,0 +1,3 @@
+<template>
+  <p>login</p>
+</template>

pages/register/index.vue

@@ -0,0 +1,3 @@
+<template>
+  <p>register</p>
+</template>