Add article page

client/src/components/UserWidget.vue

@@ -1,21 +1,22 @@
 <template>
-  <div class="user-profile">
-    <img class="user-profile__avatar"
+  <div class="user-widget">
+    <img class="user-widget__avatar"
          :src="avatar">
-    <span class="user-profile__name">{{name}}</span>
+    <span class="user-widget__name">{{name}}</span>
+    <span class="user-widget__date" v-if="date">{{date}}</span>
   </div>
 </template>
 
 <script>
   export default {
-    props: ['name', 'avatar']
+    props: ['name', 'avatar', 'date']
   }
 </script>
 
 <style scoped lang="scss">
   @import "@/styles/_variables.scss";
 
-  .user-profile {
+  .user-widget {
     color: $color-grey;
     display: flex;
     align-items: center;
@@ -23,7 +24,10 @@
     &__name {
       padding: 0px 10px;
       font-family: $sans-serif-font-family;
+    }
 
+    &__date {
+      font-family: $sans-serif-font-family;
     }
 
     &__avatar {

client/src/router/index.js

@@ -6,6 +6,7 @@ import book from '@/pages/book'
 import module from '@/pages/module'
 import rooms from '@/pages/rooms'
 import room from '@/pages/room'
+import article from '@/pages/article'
 import p404 from '@/pages/p404'
 
 const routes = [
@@ -13,6 +14,7 @@ const routes = [
   {path: '/module', name: 'module', component: module},
   {path: '/rooms', name: 'rooms', component: rooms},
   {path: '/room', name: 'room', component: room},
+  {path: '/article', name: 'article', component: article},
   {
     path: '/book',
     name: 'book',