Explorar o código

Footer 컴포넌트 생성 + Error 레이아웃 생성

김보경 %!s(int64=5) %!d(string=hai) anos
pai
achega
39740509fc
Modificáronse 3 ficheiros con 58 adicións e 1 borrados
  1. 35 0
      components/shared/Footer.vue
  2. 3 1
      layouts/default.vue
  3. 20 0
      layouts/error.vue

+ 35 - 0
components/shared/Footer.vue

@@ -0,0 +1,35 @@
+<template>
+  <div class="hero-footer footer footer-custom">
+    <div class="container">
+      <div class="has-text-centered">
+        <span class="icon">
+          <i class="fab fa-github"></i>
+        </span>
+        <p>ddowa <a target="_" href="https://www.comeagain.co.kr">www.comeagain.co.kr</a></p>
+      </div>
+    </div>
+  </div>
+</template>
+<style scoped lang="scss">
+  /* footer */
+  .icon {
+    margin-bottom: 20px;
+  }
+  .fa-github {
+    font-size: 45px;
+  }
+  .footer-custom {
+      background-color: #0d0c0d;
+      color: #fff;
+  }
+  .footer-custom p {
+      font-size: 1rem;
+      font-weight: 500;
+  }
+  .footer-custom a {
+      color: #d74436;
+  }
+  .footer-custom a:hover {
+      color: #e50076;
+  }
+</style>

+ 3 - 1
layouts/default.vue

@@ -2,13 +2,15 @@
   <div>
     <Navbar/>
     <nuxt />
+    <app-footer />
   </div>
 </template>
 <script>
+import AppFooter from '~/components/shared/Footer'
 import Navbar from "~/components/shared/Navbar";
 export default {
   components : {
-    Navbar
+    Navbar, AppFooter
   }
 }
 </script>

+ 20 - 0
layouts/error.vue

@@ -0,0 +1,20 @@
+<template>
+  <div class="container">
+    <ErrorView title="Ooooops, page you are trying to access doesn't exist :("
+               :status="'404'"
+               :navigateToPage="'/'"
+               :navigateToText="'Navigate back Home'" />
+  </div>
+</template>
+
+<script>
+import ErrorView from '@/components/shared/ErrorView'
+export default {
+  components: {
+    ErrorView
+  }
+}
+</script>
+
+<style scoped>
+</style>