diff --git a/backend/src/seed/seed-db.js b/backend/src/seed/seed-db.js
index 3de70e643..45b4d87a9 100644
--- a/backend/src/seed/seed-db.js
+++ b/backend/src/seed/seed-db.js
@@ -1,3 +1,4 @@
+import faker from 'faker'
 import Factory from './factories'
 
 /* eslint-disable no-multi-spaces */
@@ -96,7 +97,7 @@ import Factory from './factories'
       asTrick.create('Post',     { id: 'p4' }),
       asTrack.create('Post',     { id: 'p5' }),
       asAdmin.create('Post',     { id: 'p6' }),
-      asModerator.create('Post', { id: 'p7' }),
+      asModerator.create('Post', { id: 'p7', content: `Hey @jenny-rostock, what's up? ${faker.lorem.paragraph()}` }),
       asUser.create('Post',      { id: 'p8' }),
       asTick.create('Post',      { id: 'p9' }),
       asTrick.create('Post',     { id: 'p10' }),
diff --git a/webapp/components/Notification.vue b/webapp/components/Notification.vue
new file mode 100644
index 000000000..53b73035c
--- /dev/null
+++ b/webapp/components/Notification.vue
@@ -0,0 +1,29 @@
+<template>
+  <nuxt-link
+    :to="{ name: 'post-id-slug', params: { id: post.id, slug: post.slug } }"
+  >
+  <hc-post-card :post="post" />
+  </nuxt-link>
+</template>
+
+<script>
+import HcPostCard from '~/components/PostCard.vue'
+
+export default {
+  name: 'HcNotification',
+  components: {
+    HcPostCard
+  },
+  props: {
+    notification: {
+      type: Object,
+      required: true
+    }
+  },
+  computed: {
+    post() {
+      return this.notification.post
+    }
+  }
+}
+</script>
diff --git a/webapp/layouts/default.vue b/webapp/layouts/default.vue
index 67edc52a3..2f30ad7db 100644
--- a/webapp/layouts/default.vue
+++ b/webapp/layouts/default.vue
@@ -49,13 +49,11 @@
                   slot="popover"
                 >
                   <div class="notifications-menu-popover">
-                    <nuxt-link
+                    <notification
                       v-for="notification in notifications"
                       :key="notification.id"
-                      :to="{ name: 'post-id-slug', params: { id: notification.post.id, slug: notification.post.slug } }"
-                    >
-                      {{ notification.post.contentExcerpt }}
-                    </nuxt-link>
+                      :notification="notification"
+                    />
                   </div>
                 </template>
               </dropdown>
@@ -145,6 +143,7 @@ import LocaleSwitch from '~/components/LocaleSwitch'
 import Dropdown from '~/components/Dropdown'
 import SearchInput from '~/components/SearchInput.vue'
 import Modal from '~/components/Modal'
+import Notification from '~/components/Notification'
 import seo from '~/components/mixins/seo'
 
 export default {
@@ -153,7 +152,8 @@ export default {
     LocaleSwitch,
     SearchInput,
     Modal,
-    LocaleSwitch
+    LocaleSwitch,
+    Notification
   },
   mixins: [seo],
   data() {
diff --git a/webapp/store/auth.js b/webapp/store/auth.js
index 688b8bed1..ad55f8b6c 100644
--- a/webapp/store/auth.js
+++ b/webapp/store/auth.js
@@ -89,7 +89,11 @@ export const actions = {
               createdAt
               post {
                 author {
+                  id
+                  slug
                   name
+                  disabled
+                  deleted
                 }
                 title
                 contentExcerpt