Update docs.

Author: moonwave99

homepage/data/docs.md

@@ -1,8 +1,8 @@
 ---
-title: Goffre | Documentation
+title: Documentation
 ---
 
-## `load(options)`
+## `async load(options)`
 
 Loads data from a folder, returns structured information gathered from `.md` and `.json` files.
 
@@ -59,14 +59,103 @@ Will be parsed as:
 }
 ```
 
-Available options:
+### Available options
 
-### `dataPath`
+#### `dataPath`
 
 Path where to look for data.
 
 **Default**: `process.cwd() + /data`.
 
-## `render(options)`
+## `async render(options)`
 
 Generates the `.html` files.
+
+### Available options
+
+#### `pages`
+
+An array of pages, ideally parsed via the `load()` method.
+
+The only constraint is to contain a unique `slug` key, like:
+
+```js
+[
+    {
+        title: 'This is a blog post',
+        slug: "blog/01-this-is-a-blog-post",
+        content: ...
+    },
+    {
+        title: 'This is another blog post',
+        slug: "blog/02-this-is-another-blog-post",
+        content: ...
+    },
+    ...
+]
+```
+
+#### `viewsPath`
+
+The folder containing the handlebars views.
+
+**Default**: `path.join(process.cwd(), "src", "views")`.
+
+#### `buildPath`
+
+The folder that will contain the HTML output.
+
+**Default**: `path.join(process.cwd(), "dist")`.
+
+#### `domain`
+
+The website domain, used in the handlebars helpers for generating URLs.
+
+#### `uglyUrls`
+
+If `true`, appends `.html` to generated URLs.
+
+**Default**: `false`.
+
+#### `locals`
+
+An object that will be merged into `apps.locals` and be available to all handlebars templates.
+
+#### `markdown`
+
+Overrides the [default markdown configuration][marked], e.g.:
+
+```js
+render({
+    ...
+    markdown: {
+        renderer: {
+            image: (href, title, text) =>
+                `<img class="lazy" data-src="${href}" alt="${text}"/>`,
+        },
+    }
+})
+```
+
+#### `handlebars`
+
+Contains the handlebars configurations and helpers, e.g.:
+
+```js
+render({
+    ...
+    handlebars: {
+        helpers: {
+            formatDate: (date) => date.toLocaleDateString(),
+        },
+    }
+})
+```
+
+#### `sitemap`
+
+Contains the sitemap configuration.
+
+**Default**: `{ generate: false, template: 'sitemap' }`.
+
+[marked]: https://github.com/markedjs/marked

homepage/src/client/css/style.css

@@ -50,6 +50,13 @@ aside ul li {
     margin-bottom: 0.5rem;
 }
 
+aside ul li.from-h3 {
+    margin-left: 1rem;
+}
+aside ul li.from-h4 {
+    margin-left: 1.5rem;
+}
+
 aside ul li:last-child {
     margin-bottom: 0;
 }
@@ -126,17 +133,14 @@ body > footer {
     margin-bottom: 2rem;
 }
 
-.page {
-}
-
-.page.text {
-    /* max-width: 50rem; */
-}
-
 .page > header {
     margin-bottom: 2rem;
 }
 
+.page > header h1 span:last-child {
+    color: rgba(0, 0, 0, 0.5);
+}
+
 .text-body > * {
     margin-bottom: 2rem;
 }
@@ -255,6 +259,19 @@ body > footer {
     text-overflow: ellipsis;
 }
 
+.page-docs .page.text h4 {
+    margin-top: 5rem;
+    margin-bottom: 1rem;
+}
+
+.page-docs .page.text h4 + p {
+    margin-bottom: 1rem;
+}
+
+.page-docs .page.text p + pre {
+    margin-top: 0rem;
+}
+
 @media screen and (max-width: 1024px) {
     aside {
         display: none;
@@ -275,8 +292,7 @@ body > footer {
 
 @media screen and (max-width: 480px) {
     .page-index main > section h1 {
-        font-size: 2rem;
-        text-align: center;
+        font-size: 2.5rem;
     }
     body {
         position: relative;

homepage/src/client/index.js

@@ -21,7 +21,9 @@ function initOutline() {
     );
 
     $titles.forEach((el) => {
-        $aside.innerHTML += `<li><a href="#${el.id}">${el.innerText}</a></li>`;
+        $aside.innerHTML += `<li class="from-${el.tagName.toLowerCase()}"><a href="#${
+            el.id
+        }">${el.innerText}</a></li>`;
         observer.observe(el);
     });
 
@@ -33,7 +35,6 @@ function initOutline() {
         const $target = document.getElementById(
             event.target.href.split("#")[1]
         );
-        console.log($target);
         if (!$target) {
             return;
         }
@@ -42,6 +43,7 @@ function initOutline() {
             behavior: "smooth",
             block: "center",
         });
+        history.replaceState(null, null, event.target.href);
     });
 }
 

homepage/src/views/_default.handlebars

@@ -1,6 +1,9 @@
 <section class="page text">
     <header>
-        <h1>{{title}}</h1>
+        <h1>
+            <span>Goffre</span>
+            <span>{{title}}</span>
+        </h1>
     </header>
     <section class="text-body">
         {{{content}}}