fix: make page title optional

src/css/markdown.css

@@ -1,10 +1,14 @@
 @import "vars.css";
 
 .markdown-body {
-  & >*:first-child:not(h2) {
+  & >*:first-child {
     margin-top: 0;
   }
 
+  &.has-page-title >h2:first-child {
+    margin-top: 7rem;
+  }
+
   & a {
     text-decoration: none;
 

src/views/Home.vue

@@ -26,8 +26,8 @@
       </div>
       <div class="Main" v-else>
         <InjectedComponents position="main:start" />
-        <component :is="MarkdownTitle" class="page-title" />
-        <component :is="MarkdownBody" />
+        <component v-if="pageTitle" :is="MarkdownTitle" class="page-title" />
+        <component :class="{'has-page-title': pageTitle}" :is="MarkdownBody" />
         <EditLink />
         <PrevNextLinks />
         <InjectedComponents position="main:end" />
@@ -85,10 +85,14 @@ export default {
   },
 
   computed: {
+    pageTitle() {
+      return this.$store.state.page.title
+    },
+
     MarkdownTitle() {
       return {
         name: 'MarkdownTitle',
-        template: `<h1>${this.$store.state.page.title}</h1>`
+        template: `<h1>${this.pageTitle}</h1>`
       }
     },
 

website/index.js

@@ -101,6 +101,10 @@ new Docute({
         {
           title: 'Credits',
           link: '/credits'
+        },
+        {
+          title: 'Changelog',
+          link: '/changelog'
         }
       ]
     }
@@ -190,17 +194,14 @@ new Docute({
       ]
     }
   },
-  pageData: () => fetch('https://jsonplaceholder.typicode.com/posts')
-    .then(res => res.json())
-    .then(posts => {
-      return posts.reduce((result, post) => {
-        result['/post/' + post.id] = {
-          title: post.title,
-          content: post.body
-        }
-        return result
-      }, {})
-    })
+  pageData: () => {
+    return {
+      '/changelog': {
+        title: 'Changelog',
+        file: 'https://raw.githubusercontent.com/leptosia/docute/master/CHANGELOG.md'
+      }
+    }
+  }
 })
 
 Vue.component('ReverseText', {