message

components/BlogCardList.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="columns">
     <div v-for="article in articles" :key="article.id" class="column is-one-third">
-      <div class="card">
+      <div class="card rounded">
         <div class="card-image">
           <figure class="image is-4by3">
             <img :src="article.image.src" :alt="product.images[0].altText">

components/TheFooter.vue

@@ -27,6 +27,11 @@
           <p class="is-size-5">
             Policy
           </p>
+          <p class="footer-link">
+            <nuxt-link :to="`/policy/${privacyPolicy.handle}`">
+              Privacy Policy
+            </nuxt-link>
+          </p>
         </div>
         <div class="column is-4">
           <p class="is-size-5">
@@ -40,7 +45,12 @@
 
 <script>
 export default {
-  name: 'TheFooter'
+  name: 'TheFooter',
+  computed: {
+    privacyPolicy () {
+      return this.$store.state.shop.privacyPolicy
+    }
+  }
 }
 </script>
 

components/TheNavbar.vue

@@ -1,7 +1,7 @@
 <template>
   <b-navbar>
     <template slot="brand">
-      <b-navbar-item tag="a" href="/">
+      <b-navbar-item tag="nuxt-link" to="/">
         <img
           src="https://raw.githubusercontent.com/buefy/buefy/dev/static/img/buefy-logo.png"
           alt="Lightweight UI components for Vue.js based on Bulma"
@@ -16,19 +16,13 @@
         Products
       </b-navbar-item>
       <b-navbar-dropdown label="Blog">
-        <b-navbar-item
-          tag="a"
-          href="/blog"
-        >
-          All
-        </b-navbar-item>
         <b-navbar-item
           v-for="blog in blogs"
           :key="blog.id"
-          tag="a"
-          :href="`/blog/${blog.handle}`"
+          tag="nuxt-link"
+          :to="`/blog/${blog.node.handle}`"
         >
-          {{ blog.title }}
+          {{ blog.node.title }}
         </b-navbar-item>
       </b-navbar-dropdown>
     </template>