Empty relations

pages/post/_slug/more-info.vue

@@ -43,12 +43,11 @@
           <hc-post-card :post="relatedPost" />
         </ds-flex-item>
       </ds-flex>
-      <ds-space
-        v-else
-        style="text-align: center; padding-top: 2em; opacity: .6;"
-      >
-        No related Posts
-      </ds-space>
+      <hc-empty
+        margin="large"
+        icon="file"
+        message="No related Posts"
+      />
     </ds-section>
     <ds-space margin-bottom="large" />
   </ds-card>
@@ -57,6 +56,7 @@
 <script>
 import gql from 'graphql-tag'
 import HcPostCard from '~/components/PostCard.vue'
+import HcEmpty from '~/components/Empty.vue'
 
 export default {
   transition: {
@@ -64,7 +64,8 @@ export default {
     mode: 'out-in'
   },
   components: {
-    HcPostCard
+    HcPostCard,
+    HcEmpty
   },
   computed: {
     post() {