deploy: 668805d3d5

2021-08-18 08:05:12 +00:00 · 2021-08-18 08:05:12 +00:00 · 7c8597ee41
parent b19124509c
commit 7c8597ee41
45 changed files with 1368 additions and 898 deletions
--- a/404.html
+++ b/404.html
@ -8,10 +8,10 @@
 <meta name=description content>
 <link rel=canonical href=https://jpanther.github.io/Congo/404.html>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="404 Page not found">
 <meta property="og:description" content>
 <meta property="og:type" content="website">
@ -19,8 +19,6 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="404 Page not found">
 <meta name=twitter:description content>
 <meta itemprop=name content="404 Page not found">
 <meta itemprop=description content>
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -30,24 +28,24 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
 </header>
 <main class=flex-grow>
-<h1 class="mb-3 text-4xl font-extrabold">Page Not Found 🤷‍♂️</h1>
+<h1 class="mb-3 text-4xl font-extrabold">Page Not Found 😕</h1>
 <p class="mt-8 mb-12 text-gray-400 dark:text-gray-500">Error 404</p>
 <div class="prose dark:prose-light">
 <p>It seems that the page you've requested does not exist.</p>
@ -60,9 +58,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/css/main.css
+++ b/css/main.css
--- a/docs/advanced-customisation/index.html
+++ b/docs/advanced-customisation/index.html
@ -8,10 +8,10 @@
 <meta name=description content="Learn how to build Congo manually.">
 <link rel=canonical href=https://jpanther.github.io/Congo/docs/advanced-customisation/>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="Advanced Customisation">
 <meta property="og:description" content="Learn how to build Congo manually.">
 <meta property="og:type" content="article">
@ -21,11 +21,7 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="Advanced Customisation">
 <meta name=twitter:description content="Learn how to build Congo manually.">
-<meta itemprop=name content="Advanced Customisation">
+<script type=application/ld+json>{"@context":"https://schema.org","@type":"BlogPosting","articleSection":"Documentation","name":"Advanced Customisation","headline":"Advanced Customisation","description":"Learn how to build Congo manually.","inLanguage":"en-AU","author":{"@type":"Person","name":"Congo"},"creator":{"@type":"Person","name":"Congo"},"copyrightHolder":"Congo","copyrightYear":"2020","dateCreated":"2020-08-09T00:00:00\u002b00:00","datePublished":"2020-08-09T00:00:00\u002b00:00","dateModified":"2020-08-09T00:00:00\u002b00:00","url":"https:\/\/jpanther.github.io\/Congo\/docs\/advanced-customisation\/","wordCount":"293","keywords":["advanced","css","docs"]}</script>
 <meta itemprop=description content="Learn how to build Congo manually."><meta itemprop=datePublished content="2020-08-09T00:00:00+00:00">
 <meta itemprop=dateModified content="2020-08-09T00:00:00+00:00">
 <meta itemprop=wordCount content="293">
 <meta itemprop=keywords content="advanced,css,docs,">
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -35,18 +31,18 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
@ -54,11 +50,21 @@
 <main class=flex-grow>
 <article class=max-w-prose>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/docs/>Documentation</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/docs/advanced-customisation/>Advanced Customisation</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <h1 class="mt-0 text-4xl font-extrabold">Advanced Customisation</h1>
 <div class="mt-8 mb-12 text-base text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-2
+2 mins
 mins
 </span>
 </div>
 </header>
@ -99,14 +105,14 @@ mins
 </code></pre></div><p>Now whenever you make a change, the (non-minified) CSS files will be rebuilt automatically. This mode is useful to run when using <code>hugo server</code> to preview your site during development. Remember to perform a full build before publishing your website.</p>
 </section>
 <footer class=pt-8>
-<div class=pt-8>
+<div class="pt-8 article-pagination">
 <hr class="border-gray-300 border-dotted dark:border-gray-600">
 <div class="flex justify-between pt-3">
 <span>
 <a class=flex href=https://jpanther.github.io/Congo/docs/partials/>
-<span class=mr-3>&larr;</span>
+<span class="mr-3 article-pagination-direction">&larr;</span>
 <span class="flex flex-col">
-<span class=button__text>Partials</span>
+<span class=article-pagination-title>Partials</span>
 </span>
 </a>
 </span>
@ -124,9 +130,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/docs/configuration/index.html
+++ b/docs/configuration/index.html
@ -8,10 +8,10 @@
 <meta name=description content="All the configuration variables available in Congo.">
 <link rel=canonical href=https://jpanther.github.io/Congo/docs/configuration/>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="Configuration">
 <meta property="og:description" content="All the configuration variables available in Congo.">
 <meta property="og:type" content="article">
@ -21,11 +21,7 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="Configuration">
 <meta name=twitter:description content="All the configuration variables available in Congo.">
-<meta itemprop=name content="Configuration">
+<script type=application/ld+json>{"@context":"https://schema.org","@type":"BlogPosting","articleSection":"Documentation","name":"Configuration","headline":"Configuration","description":"All the configuration variables available in Congo.","inLanguage":"en-AU","author":{"@type":"Person","name":"Congo"},"creator":{"@type":"Person","name":"Congo"},"copyrightHolder":"Congo","copyrightYear":"2020","dateCreated":"2020-08-14T00:00:00\u002b00:00","datePublished":"2020-08-14T00:00:00\u002b00:00","dateModified":"2020-08-14T00:00:00\u002b00:00","url":"https:\/\/jpanther.github.io\/Congo\/docs\/configuration\/","wordCount":"989","keywords":["config","docs"]}</script>
 <meta itemprop=description content="All the configuration variables available in Congo."><meta itemprop=datePublished content="2020-08-14T00:00:00+00:00">
 <meta itemprop=dateModified content="2020-08-14T00:00:00+00:00">
 <meta itemprop=wordCount content="581">
 <meta itemprop=keywords content="config,docs,">
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -35,18 +31,18 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
@ -54,11 +50,21 @@
 <main class=flex-grow>
 <article class=max-w-prose>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/docs/>Documentation</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/docs/configuration/>Configuration</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <h1 class="mt-0 text-4xl font-extrabold">Configuration</h1>
 <div class="mt-8 mb-12 text-base text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-3
+5 mins
 mins
 </span>
 </div>
 </header>
@ -74,11 +80,12 @@ mins
 <span class="relative inline-block align-text-bottom icon"><svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="exclamation-triangle" class="svg-inline--fa fa-exclamation-triangle fa-w-18" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path fill="currentcolor" d="M569.517 440.013C587.975 472.007 564.806 512 527.94 512H48.054c-36.937.0-59.999-40.055-41.577-71.987L246.423 23.985c18.467-32.009 64.72-31.951 83.154.0l239.94 416.028zM288 354c-25.405.0-46 20.595-46 46s20.595 46 46 46 46-20.595 46-46-20.595-46-46-46zm-43.673-165.346 7.418 136c.347 6.364 5.609 11.346 11.982 11.346h48.546c6.373.0 11.635-4.982 11.982-11.346l7.418-136c.375-6.874-5.098-12.654-11.982-12.654h-63.383c-6.884.0-12.356 5.78-11.981 12.654z"/></svg>
 </span>
 </span>
-<span class="no-prose dark:text-gray-300">As outlined in the <a href=/docs/installation/#set-up-your-configuration-files>installation instructions</a>, you should adjust your theme configuration by modifying the files in the <code>config/_default/</code> folder of your Hugo project and delete the <code>config.toml</code> file in your project root.</span>
+<span class="no-prose dark:text-gray-300">As outlined in the <a href=../../docs/installation/#set-up-your-configuration-files>installation instructions</a>, you should adjust your theme configuration by modifying the files in the <code>config/_default/</code> folder of your Hugo project and delete the <code>config.toml</code> file in your project root.</span>
 </div>
-<h2 id=parameters>Parameters <a class=heading-anchor href=#parameters aria-label=Anchor>#</a></h2>
+<h2 id=site-configuration>Site Configuration <a class=heading-anchor href=#site-configuration aria-label=Anchor>#</a></h2>
-<p>Congo provides a large number of configuration parameters that control how the theme functions. The table below outlines every available parameter in the <code>config/_default/params.toml</code> file.</p>
+<p>Standard Hugo configuration variables are respected throughout the theme, however there are some specific things that should be configured for the best experience.</p>
-<p>Many of the article defaults here can be overridden on a per article basis by specifying it in the front matter. Refer to the <a href=/docs/front-matter/>Front Matter</a> section for further details.</p>
+<p>The site configuration is managed through the <code>config/_default/config.toml</code> file. The table below outlines all the settings that the Congo takes advantage of.</p>
 <p>Note that the variable names provided in this table use dot notation to simplify the TOML data structure (ie. <code>author.name</code> refers to <code>[author] name</code>).</p>
 <table>
 <thead>
 <tr>
@ -90,22 +97,121 @@ mins
 </thead>
 <tbody>
 <tr>
 <td><code>theme</code></td>
 <td>string</td>
 <td><code>"congo"</code></td>
 <td>This must be set to <code>"congo"</code> for the theme to function.</td>
 </tr>
 <tr>
 <td><code>baseURL</code></td>
 <td>string</td>
 <td><em>Not set</em></td>
 <td>The URL to the root of the website.</td>
 </tr>
 <tr>
 <td><code>languageCode</code></td>
 <td>string</td>
 <td><code>"en"</code></td>
 <td>The language of the website for site metadata purposes. It can be a top-level language (ie. <code>"en"</code>) or a sub-variant (ie. <code>"en-AU"</code>)."</td>
 </tr>
 <tr>
 <td><code>defaultContentLanguage</code></td>
 <td>string</td>
 <td><code>"en"</code></td>
 <td>This value determines the language of theme components."</td>
 </tr>
 <tr>
 <td><code>title</code></td>
 <td>string</td>
 <td><code>"Congo"</code></td>
 <td>The title of the website. This will be displayed in the site header and footer.</td>
 </tr>
 <tr>
 <td><code>copyright</code></td>
 <td>string</td>
 <td><em>Not set</em></td>
 <td>A Markdown string containing the copyright message to be displayed in the site footer. If none is provided, Congo will automatically generate a copyright string using the site <code>title</code>.</td>
 </tr>
 <tr>
 <td><code>enableEmoji</code></td>
 <td>boolean</td>
 <td><code>true</code></td>
 <td>Whether emoji strings in content should be converted to emoji symbols.</td>
 </tr>
 <tr>
 <td><code>enableRobotsTXT</code></td>
 <td>boolean</td>
 <td><code>true</code></td>
 <td>When enabled a <code>robots.txt</code> file will be created in the site root that allows search engines to crawl the entire site. Set to <code>false</code> if you wish to provide your own file.</td>
 </tr>
 <tr>
 <td><code>author.name</code></td>
 <td>string</td>
 <td><em>Not set</em></td>
 <td>The author&rsquo;s name. This will be displayed in article footers, and on the homepage when the profile layout is used.</td>
 </tr>
 <tr>
 <td><code>author.image</code></td>
 <td>string</td>
 <td><em>Not set</em></td>
 <td>Path to the image file of the author. The image should be a 1:1 aspect ratio and placed in the site&rsquo;s <code>static/</code> folder.</td>
 </tr>
 <tr>
 <td><code>author.links</code></td>
 <td>array of objects</td>
 <td><em>Not set</em></td>
 <td>The links to display alongside the author&rsquo;s details. The config file contains example links which can simply be uncommented to enable. The order that the links are displayed is determined by the order they appear in the array. Custom links can be added by providing corresponding SVG icon assets in <code>assets/icons/</code>.</td>
 </tr>
 <tr>
 <td><code>[permalinks]</code></td>
 <td></td>
 <td><em>Not set</em></td>
 <td>Refer to the <a href=https://gohugo.io/content-management/urls/#permalinks>Hugo docs</a> for permalink configuration.</td>
 </tr>
 <tr>
 <td><code>[taxonomies]</code></td>
 <td></td>
 <td><em>Not set</em></td>
 <td>Refer to the <a href=https://gohugo.io/content-management/taxonomies/>Hugo docs</a> for taxonomy configuration.</td>
 </tr>
 </tbody>
 </table>
 <h2 id=theme-parameters>Theme Parameters <a class=heading-anchor href=#theme-parameters aria-label=Anchor>#</a></h2>
 <p>Congo provides a large number of configuration parameters that control how the theme functions. The table below outlines every available parameter in the <code>config/_default/params.toml</code> file.</p>
 <p>Many of the article defaults here can be overridden on a per article basis by specifying it in the front matter. Refer to the <a href=../../docs/front-matter/>Front Matter</a> section for further details.</p>
 <table>
 <thead>
 <tr>
 <th>Name</th>
 <th>Type</th>
 <th>Default</th>
 <th>Description</th>
 </tr>
 </thead>
 <tbody>
 <tr>
 <td><code>description</code></td>
 <td>string</td>
 <td><em>Not set</em></td>
 <td>The description of the website for metadata purposes.</td>
 </tr>
 <tr>
 <td><code>mainSections</code></td>
 <td>array of strings</td>
 <td><em>Not set</em></td>
 <td>The sections that should be displayed in the recent articles list. If not provided the section with the greatest number of articles is used.</td>
 </tr>
 <tr>
 <td><code>homepage.layout</code></td>
 <td>string</td>
 <td><code>"page"</code></td>
-<td>The layout of the homepage. Valid values are <code>page</code>, <code>profile</code> or <code>custom</code>. When set to <code>custom</code>, you must provide your own layout by creating a <code>/layouts/partials/home/custom.html</code> file. Refer to the <a href=/docs/homepage-layout/>Homepage Layout</a> section for more details.</td>
+<td>The layout of the homepage. Valid values are <code>page</code>, <code>profile</code> or <code>custom</code>. When set to <code>custom</code>, you must provide your own layout by creating a <code>/layouts/partials/home/custom.html</code> file. Refer to the <a href=../../docs/homepage-layout/>Homepage Layout</a> section for more details.</td>
 </tr>
 <tr>
-<td><code>homepage.showList</code></td>
+<td><code>homepage.showRecent</code></td>
 <td>boolean</td>
 <td><code>false</code></td>
-<td>Whether or not recent articles are listed on the homepage beneath the page content. Refer to the <a href=/docs/homepage-layout/#recent-articles>Recent Articles</a> docs for more details.</td>
+<td>Whether or not to display the recent articles list on the homepage.</td>
 </tr>
 <tr>
 <td><code>homepage.listSections</code></td>
 <td>array of strings</td>
 <td><code>["blog"]</code></td>
 <td>The sections of content to include in the recent list when <code>homepage.showList</code> is <code>true</code>.</td>
 </tr>
 <tr>
 <td><code>article.showDate</code></td>
@ -126,6 +232,12 @@ mins
 <td>Whether or not the author box is displayed in the article footer.</td>
 </tr>
 <tr>
 <td><code>article.showBreadcrumbs</code></td>
 <td>boolean</td>
 <td><code>false</code></td>
 <td>Whether or not breadcrumbs are displayed in the article header.</td>
 </tr>
 <tr>
 <td><code>article.showDraftLabel</code></td>
 <td>boolean</td>
 <td><code>true</code></td>
@ -156,10 +268,16 @@ mins
 <td>Which sharing links to display at the end of each article. When not provided, or set to <code>false</code> no links will be displayed.</td>
 </tr>
 <tr>
 <td><code>list.showBreadcrumbs</code></td>
 <td>boolean</td>
 <td><code>false</code></td>
 <td>Whether or not breadcrumbs are displayed in the header on list pages.</td>
 </tr>
 <tr>
 <td><code>list.groupByYear</code></td>
 <td>boolean</td>
 <td><code>true</code></td>
-<td>Whether or not articles are grouped under years in the article listing.</td>
+<td>Whether or not articles are grouped by year on list pages.</td>
 </tr>
 <tr>
 <td><code>sitemap.excludedKinds</code></td>
@ -213,23 +331,23 @@ mins
 </table>
 </section>
 <footer class=pt-8>
-<div class=pt-8>
+<div class="pt-8 article-pagination">
 <hr class="border-gray-300 border-dotted dark:border-gray-600">
 <div class="flex justify-between pt-3">
 <span>
 <a class=flex href=https://jpanther.github.io/Congo/docs/getting-started/>
-<span class=mr-3>&larr;</span>
+<span class="mr-3 article-pagination-direction">&larr;</span>
 <span class="flex flex-col">
-<span class=button__text>Getting Started</span>
+<span class=article-pagination-title>Getting Started</span>
 </span>
 </a>
 </span>
 <span>
 <a class="flex text-right" href=https://jpanther.github.io/Congo/docs/homepage-layout/>
 <span class="flex flex-col">
-<span>Homepage Layout</span>
+<span class=article-pagination-title>Homepage Layout</span>
 </span>
-<span class=ml-3>&rarr;</span>
+<span class="ml-3 article-pagination-direction">&rarr;</span>
 </a>
 </span>
 </div>
@ -244,9 +362,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/docs/front-matter/index.html
+++ b/docs/front-matter/index.html
@ -8,10 +8,10 @@
 <meta name=description content="All the front matter variables available in Congo.">
 <link rel=canonical href=https://jpanther.github.io/Congo/docs/front-matter/>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="Front Matter">
 <meta property="og:description" content="All the front matter variables available in Congo.">
 <meta property="og:type" content="article">
@ -21,11 +21,7 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="Front Matter">
 <meta name=twitter:description content="All the front matter variables available in Congo.">
-<meta itemprop=name content="Front Matter">
+<script type=application/ld+json>{"@context":"https://schema.org","@type":"BlogPosting","articleSection":"Documentation","name":"Front Matter","headline":"Front Matter","description":"All the front matter variables available in Congo.","inLanguage":"en-AU","author":{"@type":"Person","name":"Congo"},"creator":{"@type":"Person","name":"Congo"},"copyrightHolder":"Congo","copyrightYear":"2020","dateCreated":"2020-08-12T00:00:00\u002b00:00","datePublished":"2020-08-12T00:00:00\u002b00:00","dateModified":"2020-08-12T00:00:00\u002b00:00","url":"https:\/\/jpanther.github.io\/Congo\/docs\/front-matter\/","wordCount":"194","keywords":["front matter","config","docs"]}</script>
 <meta itemprop=description content="All the front matter variables available in Congo."><meta itemprop=datePublished content="2020-08-12T00:00:00+00:00">
 <meta itemprop=dateModified content="2020-08-12T00:00:00+00:00">
 <meta itemprop=wordCount content="194">
 <meta itemprop=keywords content="front matter,config,docs,">
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -35,18 +31,18 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
@ -54,17 +50,27 @@
 <main class=flex-grow>
 <article class=max-w-prose>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/docs/>Documentation</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/docs/front-matter/>Front Matter</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <h1 class="mt-0 text-4xl font-extrabold">Front Matter</h1>
 <div class="mt-8 mb-12 text-base text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-1
+1 min
 min
 </span>
 </div>
 </header>
 <section class="prose dark:prose-light">
 <p>In addition to the <a href=https://gohugo.io/content-management/front-matter/#front-matter-variables>default Hugo front matter parameters</a>, Congo adds a number of additional options to customise the presentation of individual articles. All the available theme parameters are listed below.</p>
-<p>Front matter parameter default values are inherited from the theme&rsquo;s <a href=/docs/configuration/>base configuration</a>, so you only need to specify these parameters in your front matter when you want to override the default.</p>
+<p>Front matter parameter default values are inherited from the theme&rsquo;s <a href=../../docs/configuration/>base configuration</a>, so you only need to specify these parameters in your front matter when you want to override the default.</p>
 <table>
 <thead>
 <tr>
@ -121,23 +127,23 @@ min
 </table>
 </section>
 <footer class=pt-8>
-<div class=pt-8>
+<div class="pt-8 article-pagination">
 <hr class="border-gray-300 border-dotted dark:border-gray-600">
 <div class="flex justify-between pt-3">
 <span>
 <a class=flex href=https://jpanther.github.io/Congo/docs/homepage-layout/>
-<span class=mr-3>&larr;</span>
+<span class="mr-3 article-pagination-direction">&larr;</span>
 <span class="flex flex-col">
-<span class=button__text>Homepage Layout</span>
+<span class=article-pagination-title>Homepage Layout</span>
 </span>
 </a>
 </span>
 <span>
 <a class="flex text-right" href=https://jpanther.github.io/Congo/docs/shortcodes/>
 <span class="flex flex-col">
-<span>Shortcodes</span>
+<span class=article-pagination-title>Shortcodes</span>
 </span>
-<span class=ml-3>&rarr;</span>
+<span class="ml-3 article-pagination-direction">&rarr;</span>
 </a>
 </span>
 </div>
@ -152,9 +158,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/docs/getting-started/index.html
+++ b/docs/getting-started/index.html
@ -8,10 +8,10 @@
 <meta name=description content="All the front matter variables available in Congo.">
 <link rel=canonical href=https://jpanther.github.io/Congo/docs/getting-started/>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="Getting Started">
 <meta property="og:description" content="All the front matter variables available in Congo.">
 <meta property="og:type" content="article">
@ -21,11 +21,7 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="Getting Started">
 <meta name=twitter:description content="All the front matter variables available in Congo.">
-<meta itemprop=name content="Getting Started">
+<script type=application/ld+json>{"@context":"https://schema.org","@type":"BlogPosting","articleSection":"Documentation","name":"Getting Started","headline":"Getting Started","description":"All the front matter variables available in Congo.","inLanguage":"en-AU","author":{"@type":"Person","name":"Congo"},"creator":{"@type":"Person","name":"Congo"},"copyrightHolder":"Congo","copyrightYear":"2020","dateCreated":"2020-08-15T00:00:00\u002b00:00","datePublished":"2020-08-15T00:00:00\u002b00:00","dateModified":"2020-08-15T00:00:00\u002b00:00","url":"https:\/\/jpanther.github.io\/Congo\/docs\/getting-started\/","wordCount":"338","keywords":["installation","docs"]}</script>
 <meta itemprop=description content="All the front matter variables available in Congo."><meta itemprop=datePublished content="2020-08-15T00:00:00+00:00">
 <meta itemprop=dateModified content="2020-08-15T00:00:00+00:00">
 <meta itemprop=wordCount content="319">
 <meta itemprop=keywords content="installation,docs,">
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -35,18 +31,18 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
@ -54,11 +50,21 @@
 <main class=flex-grow>
 <article class=max-w-prose>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/docs/>Documentation</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/docs/getting-started/>Getting Started</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <h1 class="mt-0 text-4xl font-extrabold">Getting Started</h1>
 <div class="mt-8 mb-12 text-base text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-2
+2 mins
 mins
 </span>
 </div>
 </header>
@ -68,7 +74,7 @@ mins
 <span class="relative inline-block align-text-bottom icon"><svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="exclamation-triangle" class="svg-inline--fa fa-exclamation-triangle fa-w-18" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path fill="currentcolor" d="M569.517 440.013C587.975 472.007 564.806 512 527.94 512H48.054c-36.937.0-59.999-40.055-41.577-71.987L246.423 23.985c18.467-32.009 64.72-31.951 83.154.0l239.94 416.028zM288 354c-25.405.0-46 20.595-46 46s20.595 46 46 46 46-20.595 46-46-20.595-46-46-46zm-43.673-165.346 7.418 136c.347 6.364 5.609 11.346 11.982 11.346h48.546c6.373.0 11.635-4.982 11.982-11.346l7.418-136c.375-6.874-5.098-12.654-11.982-12.654h-63.383c-6.884.0-12.356 5.78-11.981 12.654z"/></svg>
 </span>
 </span>
-<span class="no-prose dark:text-gray-300">This section assumes you have already <a href=/docs/installation/>installed the Congo theme</a>.</span>
+<span class="no-prose dark:text-gray-300">This section assumes you have already <a href=../../docs/installation/>installed the Congo theme</a>.</span>
 </div>
 <p>The config files that ship with Congo contain all of the possible settings that the theme recognises. By default, many of these are commented out but you can simply uncomment them to activate or change a specific feature.</p>
 <p>A few things you need to set for a new installation:</p>
@ -76,17 +82,17 @@ mins
 <span class=nx>baseURL</span> <span class=p>=</span> <span class=s2>&#34;https://your_domain.com&#34;</span>
 <span class=nx>languageCode</span> <span class=p>=</span> <span class=s2>&#34;en-AU&#34;</span>
 <span class=nx>title</span> <span class=p>=</span> <span class=s2>&#34;My awesome website&#34;</span>
 </code></pre></div><p>It&rsquo;s also useful to set the author configuration in the <code>config/_default/author.toml</code> file. You can also add links to your profiles here to enable them in the theme.</p>
 <div class=highlight><pre tabindex=0 class=chroma><code class=language-toml data-lang=toml><span class=c># config/_default/author.toml</span>
 <span class=p>[</span><span class=nx>author</span><span class=p>]</span>
 <span class=nx>name</span> <span class=p>=</span> <span class=s2>&#34;Your name&#34;</span>
 <span class=nx>image</span> <span class=p>=</span> <span class=s2>&#34;img/author.jpg&#34;</span>
 <span class=nx>links</span> <span class=p>=</span> <span class=p>[</span>
  <span class=p>{</span> <span class=nx>twitter</span> <span class=p>=</span> <span class=s2>&#34;https://twitter.com/username&#34;</span> <span class=p>}</span>
 <span class=p>]</span>
-</code></pre></div><h2 id=organising-content>Organising content <a class=heading-anchor href=#organising-content aria-label=Anchor>#</a></h2>
+</code></pre></div><p>The <code>[author]</code> configuration determines how the author information is displayed on the website. The image should be placed in the site&rsquo;s <code>static/</code> folder. Links will be displayed in the order they are listed.</p>
 <p>Further detail about these configuration options is covered in the <a href=../../docs/configuration/>Configuration</a> section.</p>
 <h2 id=organising-content>Organising content <a class=heading-anchor href=#organising-content aria-label=Anchor>#</a></h2>
 <p>By default, Congo doesn&rsquo;t force you to use a particular content type. In doing so you are free to define your content as you wish. You might prefer <em>pages</em> for a static site, <em>posts</em> for a blog, or <em>projects</em> for a portfolio.</p>
 <p>The same logic applies to taxonomies. Some people prefer to use <em>tags</em> and <em>categories</em>, others prefer to use <em>topics</em>.</p>
 <p>Hugo defaults to using posts, tags and categories out of the box and this will work fine if that&rsquo;s what you want. If you wish to customise this, however, you can do so by creating the following files:</p>
@ -106,26 +112,26 @@ mins
  <span class=nx>name</span> <span class=p>=</span> <span class=s2>&#34;Topics&#34;</span>
  <span class=nx>pageRef</span> <span class=p>=</span> <span class=s2>&#34;topics&#34;</span>
  <span class=nx>weight</span> <span class=p>=</span> <span class=mi>20</span>
-</code></pre></div><p>These steps are the bare minimum configuration. If you now run <code>hugo server</code> you will be presented with a blank Congo website. Detailed configuration is covered in the <a href=/docs/configuration/>Configuration</a> section.</p>
+</code></pre></div><p>These steps are the bare minimum configuration. If you now run <code>hugo server</code> you will be presented with a blank Congo website. Detailed configuration is covered in the <a href=../../docs/configuration/>Configuration</a> section.</p>
 </section>
 <footer class=pt-8>
-<div class=pt-8>
+<div class="pt-8 article-pagination">
 <hr class="border-gray-300 border-dotted dark:border-gray-600">
 <div class="flex justify-between pt-3">
 <span>
 <a class=flex href=https://jpanther.github.io/Congo/docs/installation/>
-<span class=mr-3>&larr;</span>
+<span class="mr-3 article-pagination-direction">&larr;</span>
 <span class="flex flex-col">
-<span class=button__text>Installation</span>
+<span class=article-pagination-title>Installation</span>
 </span>
 </a>
 </span>
 <span>
 <a class="flex text-right" href=https://jpanther.github.io/Congo/docs/configuration/>
 <span class="flex flex-col">
-<span>Configuration</span>
+<span class=article-pagination-title>Configuration</span>
 </span>
-<span class=ml-3>&rarr;</span>
+<span class="ml-3 article-pagination-direction">&rarr;</span>
 </a>
 </span>
 </div>
@ -140,9 +146,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/docs/homepage-layout/index.html
+++ b/docs/homepage-layout/index.html
@ -8,10 +8,10 @@
 <meta name=description content="Configuring the homepage layout in the Congo theme.">
 <link rel=canonical href=https://jpanther.github.io/Congo/docs/homepage-layout/>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="Homepage Layout">
 <meta property="og:description" content="Configuring the homepage layout in the Congo theme.">
 <meta property="og:type" content="article">
@ -21,11 +21,7 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="Homepage Layout">
 <meta name=twitter:description content="Configuring the homepage layout in the Congo theme.">
-<meta itemprop=name content="Homepage Layout">
+<script type=application/ld+json>{"@context":"https://schema.org","@type":"BlogPosting","articleSection":"Documentation","name":"Homepage Layout","headline":"Homepage Layout","description":"Configuring the homepage layout in the Congo theme.","inLanguage":"en-AU","author":{"@type":"Person","name":"Congo"},"creator":{"@type":"Person","name":"Congo"},"copyrightHolder":"Congo","copyrightYear":"2020","dateCreated":"2020-08-13T00:00:00\u002b00:00","datePublished":"2020-08-13T00:00:00\u002b00:00","dateModified":"2020-08-13T00:00:00\u002b00:00","url":"https:\/\/jpanther.github.io\/Congo\/docs\/homepage-layout\/","wordCount":"434","keywords":["homepage","layouts","docs"]}</script>
 <meta itemprop=description content="Configuring the homepage layout in the Congo theme."><meta itemprop=datePublished content="2020-08-13T00:00:00+00:00">
 <meta itemprop=dateModified content="2020-08-13T00:00:00+00:00">
 <meta itemprop=wordCount content="422">
 <meta itemprop=keywords content="homepage,layouts,docs,">
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -35,18 +31,18 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
@ -54,11 +50,21 @@
 <main class=flex-grow>
 <article class=max-w-prose>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/docs/>Documentation</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/docs/homepage-layout/>Homepage Layout</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <h1 class="mt-0 text-4xl font-extrabold">Homepage Layout</h1>
 <div class="mt-8 mb-12 text-base text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-2
+3 mins
 mins
 </span>
 </div>
 </header>
@ -78,29 +84,30 @@ mins
 <p>If the built-in homepage layouts aren&rsquo;t sufficient for your needs, you have the option to provide your own custom layout. This allows you to have total control over the page content and essentially gives you a blank slate to work with.</p>
 <p>To enable the custom layout, set <code>homepage.layout = "custom"</code> in the <code>params.toml</code> configuration file.</p>
 <p>With the configuration value set, create a new <code>custom.html</code> file and place it in <code>layouts/partials/home/custom.html</code>. Now whatever is in the <code>custom.html</code> file will be placed in the content area of the site homepage. You can use whatever HTML, Tailwind, or Hugo templating functions to define your layout.</p>
 <p>To include recent articles on the custom layout, use the <code>recent-articles.html</code> partial.</p>
 <h2 id=recent-articles>Recent articles <a class=heading-anchor href=#recent-articles aria-label=Anchor>#</a></h2>
-<p>All homepage layouts have the option of displaying recent articles below the main page content. To enable this, simply set the <code>homepage.showList</code> setting to <code>true</code> in the <code>params.toml</code> configuration file.</p>
+<p>All homepage layouts have the option of displaying recent articles below the main page content. To enable this, simply set the <code>homepage.showRecent</code> setting to <code>true</code> in the <code>params.toml</code> configuration file.</p>
 <p><img src=home-profile-list.jpg alt="Profile layout with recent articles"></p>
 <p>The articles listed in this section are derived from the <code>homepage.listSections</code> setting which allows for whatever content types you are using on your website. For instance, if you had content sections for <em>posts</em> and <em>projects</em> you could set this setting to <code>["posts", "projects"]</code> and all the articles in these two sections would be used to populate the recent list. The theme expects this setting to be an array so if you only use one section for all your content, you should set this accordingly: <code>["blog"]</code>.</p>
 </section>
 <footer class=pt-8>
-<div class=pt-8>
+<div class="pt-8 article-pagination">
 <hr class="border-gray-300 border-dotted dark:border-gray-600">
 <div class="flex justify-between pt-3">
 <span>
 <a class=flex href=https://jpanther.github.io/Congo/docs/configuration/>
-<span class=mr-3>&larr;</span>
+<span class="mr-3 article-pagination-direction">&larr;</span>
 <span class="flex flex-col">
-<span class=button__text>Configuration</span>
+<span class=article-pagination-title>Configuration</span>
 </span>
 </a>
 </span>
 <span>
 <a class="flex text-right" href=https://jpanther.github.io/Congo/docs/front-matter/>
 <span class="flex flex-col">
-<span>Front Matter</span>
+<span class=article-pagination-title>Front Matter</span>
 </span>
-<span class=ml-3>&rarr;</span>
+<span class="ml-3 article-pagination-direction">&rarr;</span>
 </a>
 </span>
 </div>
@ -115,9 +122,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/docs/index.html
+++ b/docs/index.html
@ -9,10 +9,10 @@
 <link rel=canonical href=https://jpanther.github.io/Congo/docs/>
 <link rel=alternate type=application/rss+xml href=https://jpanther.github.io/Congo/docs/index.xml title=Congo>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="Documentation">
 <meta property="og:description" content="Learn how to use Congo and its features.">
 <meta property="og:type" content="website">
@ -20,8 +20,6 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="Documentation">
 <meta name=twitter:description content="Learn how to use Congo and its features.">
 <meta itemprop=name content="Documentation">
 <meta itemprop=description content="Learn how to use Congo and its features.">
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -31,120 +29,122 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
 </header>
 <main class=flex-grow>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/docs/>Documentation</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <section class="prose dark:prose-light">
 <h1 class="mb-3 text-4xl font-extrabold">Documentation</h1>
 <section><p class="!mb-9 text-xl">
 Simple, yet powerful. Learn how to use Congo and its features.
 </p>
-<figure><img src=/Congo/docs/screenshot.png>
+<figure><img src=https://jpanther.github.io/Congo/docs/screenshot.png>
 </figure>
-<p>This section contains everything you need to know about Congo. If you&rsquo;re new, check out the <a href=/docs/installation/>Installation</a> guide to begin or visit the <a href=/samples/>Samples</a> section to see what Congo can do.</p>
+<p>This section contains everything you need to know about Congo. If you&rsquo;re new, check out the <a href=../docs/installation/>Installation</a> guide to begin or visit the <a href=../samples/>Samples</a> section to see what Congo can do.</p>
 <hr>
 </section>
 </section>
 </header>
 <section>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/installation/>Installation</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/installation/>Installation</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-2
+2 mins
 mins
 </span>
 </div>
 </article>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/getting-started/>Getting Started</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/getting-started/>Getting Started</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-2
+2 mins
 mins
 </span>
 </div>
 </article>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/configuration/>Configuration</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/configuration/>Configuration</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-3
+5 mins
 mins
 </span>
 </div>
 </article>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/homepage-layout/>Homepage Layout</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/homepage-layout/>Homepage Layout</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-2
+3 mins
 mins
 </span>
 </div>
 </article>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/front-matter/>Front Matter</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/front-matter/>Front Matter</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-1
+1 min
 min
 </span>
 </div>
 </article>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/shortcodes/>Shortcodes</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/shortcodes/>Shortcodes</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-2
+2 mins
 mins
 </span>
 </div>
 </article>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/partials/>Partials</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/partials/>Partials</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-3
+3 mins
 mins
 </span>
 </div>
 </article>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/advanced-customisation/>Advanced Customisation</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/advanced-customisation/>Advanced Customisation</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-2
+2 mins
 mins
 </span>
 </div>
 </article>
@ -157,9 +157,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/docs/index.xml
+++ b/docs/index.xml
@ -4,7 +4,7 @@ Install Hugo # You can find specific instructions for your platform in the offic
 Make sure you are using Hugo version 0.86.1 or later as the theme takes advantage of some of the latest Hugo features.
 Create a new site # Run the command hugo new site mywebsite to create a new Hugo site in a folder named mywebsite.</description></item><item><title>Getting Started</title><link>https://jpanther.github.io/Congo/docs/getting-started/</link><pubDate>Sat, 15 Aug 2020 00:00:00 +0000</pubDate><guid>https://jpanther.github.io/Congo/docs/getting-started/</guid><description>This section assumes you have already installed the Congo theme. The config files that ship with Congo contain all of the possible settings that the theme recognises. By default, many of these are commented out but you can simply uncomment them to activate or change a specific feature.
 A few things you need to set for a new installation:
-# config/_default/config.toml baseURL = &amp;#34;https://your_domain.com&amp;#34; languageCode = &amp;#34;en-AU&amp;#34; title = &amp;#34;My awesome website&amp;#34; It&amp;rsquo;s also useful to set the author configuration in the config/_default/author.</description></item><item><title>Configuration</title><link>https://jpanther.github.io/Congo/docs/configuration/</link><pubDate>Fri, 14 Aug 2020 00:00:00 +0000</pubDate><guid>https://jpanther.github.io/Congo/docs/configuration/</guid><description>Congo is a highly customisable theme and uses some of the latest Hugo features to simplify how it is configured.
+# config/_default/config.toml baseURL = &amp;#34;https://your_domain.com&amp;#34; languageCode = &amp;#34;en-AU&amp;#34; title = &amp;#34;My awesome website&amp;#34; [author] name = &amp;#34;Your name&amp;#34; image = &amp;#34;img/author.</description></item><item><title>Configuration</title><link>https://jpanther.github.io/Congo/docs/configuration/</link><pubDate>Fri, 14 Aug 2020 00:00:00 +0000</pubDate><guid>https://jpanther.github.io/Congo/docs/configuration/</guid><description>Congo is a highly customisable theme and uses some of the latest Hugo features to simplify how it is configured.
 The theme ships with a default configuration that gets you up and running with a basic blog or static website.
 Configuration files bundled with the theme are provided in TOML format as this is the default Hugo syntax. Feel free to convert your config to YAML or JSON if you wish.</description></item><item><title>Homepage Layout</title><link>https://jpanther.github.io/Congo/docs/homepage-layout/</link><pubDate>Thu, 13 Aug 2020 00:00:00 +0000</pubDate><guid>https://jpanther.github.io/Congo/docs/homepage-layout/</guid><description>Congo provides a fully flexible homepage layout. There are two main templates to choose from with additional settings to adjust the design. Alternatively, you can also provide your own template and have complete control over the homepage content.
 The layout of the homepage is controlled by the homepage.layout setting in the params.toml configuration file. Additionally, all layouts have the option to include a listing of recent articles.
--- a/docs/installation/index.html
+++ b/docs/installation/index.html
@ -8,10 +8,10 @@
 <meta name=description content="How to install the Congo theme.">
 <link rel=canonical href=https://jpanther.github.io/Congo/docs/installation/>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="Installation">
 <meta property="og:description" content="How to install the Congo theme.">
 <meta property="og:type" content="article">
@ -21,11 +21,7 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="Installation">
 <meta name=twitter:description content="How to install the Congo theme.">
-<meta itemprop=name content="Installation">
+<script type=application/ld+json>{"@context":"https://schema.org","@type":"BlogPosting","articleSection":"Documentation","name":"Installation","headline":"Installation","description":"How to install the Congo theme.","inLanguage":"en-AU","author":{"@type":"Person","name":"Congo"},"creator":{"@type":"Person","name":"Congo"},"copyrightHolder":"Congo","copyrightYear":"2020","dateCreated":"2020-08-16T00:00:00\u002b00:00","datePublished":"2020-08-16T00:00:00\u002b00:00","dateModified":"2020-08-16T00:00:00\u002b00:00","url":"https:\/\/jpanther.github.io\/Congo\/docs\/installation\/","wordCount":"318","keywords":["installation","docs"]}</script>
 <meta itemprop=description content="How to install the Congo theme."><meta itemprop=datePublished content="2020-08-16T00:00:00+00:00">
 <meta itemprop=dateModified content="2020-08-16T00:00:00+00:00">
 <meta itemprop=wordCount content="318">
 <meta itemprop=keywords content="installation,docs,">
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -35,18 +31,18 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
@ -54,11 +50,21 @@
 <main class=flex-grow>
 <article class=max-w-prose>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/docs/>Documentation</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/docs/installation/>Installation</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <h1 class="mt-0 text-4xl font-extrabold">Installation</h1>
 <div class="mt-8 mb-12 text-base text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-2
+2 mins
 mins
 </span>
 </div>
 </header>
@ -86,8 +92,9 @@ git submodule add -b stable https://github.com/jpanther/Congo.git themes/congo
 </div>
 <h3 id=install-manually>Install manually <a class=heading-anchor href=#install-manually aria-label=Anchor>#</a></h3>
 <p>Download the latest release of the theme.</p>
-<a class="px-4 py-2 !text-white !no-underline rounded-md bg-primary-600 hover:!bg-primary-500 dark:bg-primary-800 dark:hover:!bg-primary-700" href=https://github.com/jpanther/Congo/releases target=_blank role=button>Download from Github
+<button class="px-4 py-1 !text-white !no-underline rounded-md bg-primary-600 hover:!bg-primary-500 dark:bg-primary-800 dark:hover:!bg-primary-700" href=https://github.com/jpanther/Congo/releases target=_blank role=button>
-</a>
+Download from Github
 </button>
 <p>Extract the archive, rename the folder to <code>congo</code> and move it to the <code>themes/</code> directory inside your your <code>mywebsite</code> folder.</p>
 <div class="flex px-4 py-3 rounded-md bg-primary-100 dark:bg-primary-900">
 <span class="pr-3 text-primary-400">
@ -102,7 +109,7 @@ git submodule add -b stable https://github.com/jpanther/Congo.git themes/congo
 <p>Refer to the Hugo docs for more information or read the next section to learn more about configuring the theme.</p>
 </section>
 <footer class=pt-8>
-<div class=pt-8>
+<div class="pt-8 article-pagination">
 <hr class="border-gray-300 border-dotted dark:border-gray-600">
 <div class="flex justify-between pt-3">
 <span>
@ -110,9 +117,9 @@ git submodule add -b stable https://github.com/jpanther/Congo.git themes/congo
 <span>
 <a class="flex text-right" href=https://jpanther.github.io/Congo/docs/getting-started/>
 <span class="flex flex-col">
-<span>Getting Started</span>
+<span class=article-pagination-title>Getting Started</span>
 </span>
-<span class=ml-3>&rarr;</span>
+<span class="ml-3 article-pagination-direction">&rarr;</span>
 </a>
 </span>
 </div>
@ -127,9 +134,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/docs/partials/index.html
+++ b/docs/partials/index.html
@ -8,10 +8,10 @@
 <meta name=description content="All the partials available in Congo.">
 <link rel=canonical href=https://jpanther.github.io/Congo/docs/partials/>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="Partials">
 <meta property="og:description" content="All the partials available in Congo.">
 <meta property="og:type" content="article">
@ -21,11 +21,7 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="Partials">
 <meta name=twitter:description content="All the partials available in Congo.">
-<meta itemprop=name content="Partials">
+<script type=application/ld+json>{"@context":"https://schema.org","@type":"BlogPosting","articleSection":"Documentation","name":"Partials","headline":"Partials","description":"All the partials available in Congo.","inLanguage":"en-AU","author":{"@type":"Person","name":"Congo"},"creator":{"@type":"Person","name":"Congo"},"copyrightHolder":"Congo","copyrightYear":"2020","dateCreated":"2020-08-10T00:00:00\u002b00:00","datePublished":"2020-08-10T00:00:00\u002b00:00","dateModified":"2020-08-10T00:00:00\u002b00:00","url":"https:\/\/jpanther.github.io\/Congo\/docs\/partials\/","wordCount":"598","keywords":["partials","analytics","privacy","comments","favicons","icon","docs"]}</script>
 <meta itemprop=description content="All the partials available in Congo."><meta itemprop=datePublished content="2020-08-10T00:00:00+00:00">
 <meta itemprop=dateModified content="2020-08-10T00:00:00+00:00">
 <meta itemprop=wordCount content="598">
 <meta itemprop=keywords content="partials,analytics,privacy,comments,favicons,icon,docs,">
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -35,18 +31,18 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
@ -54,11 +50,21 @@
 <main class=flex-grow>
 <article class=max-w-prose>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/docs/>Documentation</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/docs/partials/>Partials</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <h1 class="mt-0 text-4xl font-extrabold">Partials</h1>
 <div class="mt-8 mb-12 text-base text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-3
+3 mins
 mins
 </span>
 </div>
 </header>
@ -95,36 +101,36 @@ mins
 └─ site.webmanifest
 </code></pre></div><p>Alternatively, you can also completely override the default favicon behaviour and provide your own favicon HTML tags and assets. Simply provide a <code>layouts/partials/favicons.html</code> file in your project and this will be injected into the site <code>&lt;head></code> in place of the default assets.</p>
 <h2 id=icon>Icon <a class=heading-anchor href=#icon aria-label=Anchor>#</a></h2>
-<p>Similar to the <a href=/docs/shortcodes/#icon>icon shortcode</a>, you can include icons in your own templates and partials by using Congo&rsquo;s <code>icon.html</code> partial. The partial takes one parameter which is the name of the icon to be included.</p>
+<p>Similar to the <a href=../../docs/shortcodes/#icon>icon shortcode</a>, you can include icons in your own templates and partials by using Congo&rsquo;s <code>icon.html</code> partial. The partial takes one parameter which is the name of the icon to be included.</p>
 <p><strong>Example:</strong></p>
 <div class=highlight><pre tabindex=0 class=chroma><code class=language-go data-lang=go>  <span class=p>{{</span> <span class=nx>partial</span> <span class=s>&#34;icon.html&#34;</span> <span class=s>&#34;github&#34;</span> <span class=p>}}</span>
 </code></pre></div><p>Congo includes a number of built-in icons for social, links and other purposes. You can also provide your own icon assets by including the SVG in <code>assets/icons/</code>.</p>
 <h2 id=extensions>Extensions <a class=heading-anchor href=#extensions aria-label=Anchor>#</a></h2>
 <p>Congo also provides for a number of extension partials that allow for expanding upon base functionality.</p>
 <h3 id=article-link>Article link <a class=heading-anchor href=#article-link aria-label=Anchor>#</a></h3>
-<p>If you wish to insert additional code after article links, create a <code>layouts/partials/extend-article-link.html</code> file. This is especially powerful when combined with the <a href=/docs/shortcodes/#badge><code>badge</code></a> shortcode which can be used to highlight metadata for certain articles.</p>
+<p>If you wish to insert additional code after article links, create a <code>layouts/partials/extend-article-link.html</code> file. This is especially powerful when combined with the <a href=../../docs/shortcodes/#badge><code>badge</code></a> shortcode which can be used to highlight metadata for certain articles.</p>
 <h3 id=head-and-footer>Head and Footer <a class=heading-anchor href=#head-and-footer aria-label=Anchor>#</a></h3>
 <p>The theme allows for inserting additional code directly into the <code>&lt;head></code> and <code>&lt;footer></code> sections of the template. These can be useful for providing scripts or other logic that isn&rsquo;t part of the theme.</p>
 <p>Simply create either <code>layouts/partials/extend-head.html</code> or <code>layouts/partials/extend-footer.html</code> and these will automatically be included in your website build. Both partials are injected as the last items in <code>&lt;head></code> and <code>&lt;footer></code> so they can be used to override theme defaults.</p>
 </section>
 <footer class=pt-8>
-<div class=pt-8>
+<div class="pt-8 article-pagination">
 <hr class="border-gray-300 border-dotted dark:border-gray-600">
 <div class="flex justify-between pt-3">
 <span>
 <a class=flex href=https://jpanther.github.io/Congo/docs/shortcodes/>
-<span class=mr-3>&larr;</span>
+<span class="mr-3 article-pagination-direction">&larr;</span>
 <span class="flex flex-col">
-<span class=button__text>Shortcodes</span>
+<span class=article-pagination-title>Shortcodes</span>
 </span>
 </a>
 </span>
 <span>
 <a class="flex text-right" href=https://jpanther.github.io/Congo/docs/advanced-customisation/>
 <span class="flex flex-col">
-<span>Advanced Customisation</span>
+<span class=article-pagination-title>Advanced Customisation</span>
 </span>
-<span class=ml-3>&rarr;</span>
+<span class="ml-3 article-pagination-direction">&rarr;</span>
 </a>
 </span>
 </div>
@ -139,9 +145,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/docs/shortcodes/index.html
+++ b/docs/shortcodes/index.html
@ -8,10 +8,10 @@
 <meta name=description content="All the shortcodes available in Congo.">
 <link rel=canonical href=https://jpanther.github.io/Congo/docs/shortcodes/>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="Shortcodes">
 <meta property="og:description" content="All the shortcodes available in Congo.">
 <meta property="og:type" content="article">
@ -21,11 +21,7 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="Shortcodes">
 <meta name=twitter:description content="All the shortcodes available in Congo.">
-<meta itemprop=name content="Shortcodes">
+<script type=application/ld+json>{"@context":"https://schema.org","@type":"BlogPosting","articleSection":"Documentation","name":"Shortcodes","headline":"Shortcodes","description":"All the shortcodes available in Congo.","inLanguage":"en-AU","author":{"@type":"Person","name":"Congo"},"creator":{"@type":"Person","name":"Congo"},"copyrightHolder":"Congo","copyrightYear":"2020","dateCreated":"2020-08-11T00:00:00\u002b00:00","datePublished":"2020-08-11T00:00:00\u002b00:00","dateModified":"2020-08-11T00:00:00\u002b00:00","url":"https:\/\/jpanther.github.io\/Congo\/docs\/shortcodes\/","wordCount":"392","keywords":["shortcodes","mermaid","icon","lead","docs"]}</script>
 <meta itemprop=description content="All the shortcodes available in Congo."><meta itemprop=datePublished content="2020-08-11T00:00:00+00:00">
 <meta itemprop=dateModified content="2020-08-11T00:00:00+00:00">
 <meta itemprop=wordCount content="392">
 <meta itemprop=keywords content="shortcodes,mermaid,icon,lead,docs,">
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -35,18 +31,18 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
@ -54,11 +50,21 @@
 <main class=flex-grow>
 <article class=max-w-prose>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/docs/>Documentation</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/docs/shortcodes/>Shortcodes</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <h1 class="mt-0 text-4xl font-extrabold">Shortcodes</h1>
 <div class="mt-8 mb-12 text-base text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-2
+2 mins
 mins
 </span>
 </div>
 </header>
@ -84,7 +90,7 @@ mins
 <div class=highlight><pre tabindex=0 class=chroma><code class=language-md data-lang=md>{{<span class=p>&lt;</span> <span class=nt>badge</span> <span class=p>&gt;</span>}}
 New article!
 {{<span class=p>&lt;</span> <span class=p>/</span><span class=nt>badge</span> <span class=p>&gt;</span>}}
-</code></pre></div><span class="ml-1 px-1 py-[2px] text-xs font-normal border rounded-md text-primary-700 dark:text-primary-400 border-primary-400 dark:border-primary-600 inline-block align-middle mb-1">
+</code></pre></div><span class="ml-1 px-1 py-[1px] text-xs font-normal border rounded-md text-primary-700 dark:text-primary-400 border-primary-400 dark:border-primary-600 inline-block align-middle mb-1">
 New article!
 </span>
 <h2 id=button>Button <a class=heading-anchor href=#button aria-label=Anchor>#</a></h2>
@ -93,9 +99,9 @@ New article!
 <div class=highlight><pre tabindex=0 class=chroma><code class=language-md data-lang=md>{{<span class=p>&lt;</span> <span class=nt>button</span> <span class=na>href</span><span class=o>=</span><span class=s>&#34;#button&#34;</span> <span class=na>target</span><span class=o>=</span><span class=s>&#34;_self&#34;</span> <span class=p>&gt;</span>}}
 Call to action
 {{<span class=p>&lt;</span> <span class=p>/</span><span class=nt>button</span> <span class=p>&gt;</span>}}
-</code></pre></div><a class="px-4 py-2 !text-white !no-underline rounded-md bg-primary-600 hover:!bg-primary-500 dark:bg-primary-800 dark:hover:!bg-primary-700" href=#button target=_self role=button>
+</code></pre></div><button class="px-4 py-1 !text-white !no-underline rounded-md bg-primary-600 hover:!bg-primary-500 dark:bg-primary-800 dark:hover:!bg-primary-700" href=#button target=_self role=button>
 Call to action
-</a>
+</button>
 <h2 id=icon>Icon <a class=heading-anchor href=#icon aria-label=Anchor>#</a></h2>
 <p><code>icon</code> outputs an SVG icon and takes the icon name as its only parameter. The icon is scaled to match the current text size.</p>
 <p><strong>Example:</strong></p>
@ -104,7 +110,7 @@ Call to action
 </span>
 </p>
 <p>Icons are populated using Hugo pipelines which makes them very flexible. Congo ships with a default set of icons for social, email, and generic links. If you want to add your own icons, you can simply place them in <code>/assets/icons/</code> and reference them using the <code>icon</code> shortcode passing in the icon&rsquo;s filename (without the <code>.svg.</code> extension).</p>
-<p>Icons can also be used in partials by calling the <a href=/docs/partials/#icon>icon partial</a>.</p>
+<p>Icons can also be used in partials by calling the <a href=../../docs/partials/#icon>icon partial</a>.</p>
 <h2 id=lead>Lead <a class=heading-anchor href=#lead aria-label=Anchor>#</a></h2>
 <p><code>lead</code> is used to bring emphasis to the start of an article. It can be used to style an introduction, or to call out an important piece of information. Simply wrap any Markdown content in the <code>lead</code> shortcode.</p>
 <p><strong>Example:</strong></p>
@ -131,23 +137,23 @@ B-->C[Profit]
 </div>
 </section>
 <footer class=pt-8>
-<div class=pt-8>
+<div class="pt-8 article-pagination">
 <hr class="border-gray-300 border-dotted dark:border-gray-600">
 <div class="flex justify-between pt-3">
 <span>
 <a class=flex href=https://jpanther.github.io/Congo/docs/front-matter/>
-<span class=mr-3>&larr;</span>
+<span class="mr-3 article-pagination-direction">&larr;</span>
 <span class="flex flex-col">
-<span class=button__text>Front Matter</span>
+<span class=article-pagination-title>Front Matter</span>
 </span>
 </a>
 </span>
 <span>
 <a class="flex text-right" href=https://jpanther.github.io/Congo/docs/partials/>
 <span class="flex flex-col">
-<span>Partials</span>
+<span class=article-pagination-title>Partials</span>
 </span>
-<span class=ml-3>&rarr;</span>
+<span class="ml-3 article-pagination-direction">&rarr;</span>
 </a>
 </span>
 </div>
@ -162,9 +168,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 <script src=https://unpkg.com/mermaid@8.11.4/dist/mermaid.min.js></script>
--- a/index.html
+++ b/index.html
@ -9,10 +9,10 @@
 <link rel=canonical href=https://jpanther.github.io/Congo/>
 <link rel=alternate type=application/rss+xml href=https://jpanther.github.io/Congo/index.xml title=Congo>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="Welcome to Congo! :tada:">
 <meta property="og:description" content="This is a demo of the Congo theme for Hugo.">
 <meta property="og:type" content="website">
@ -20,8 +20,7 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="Welcome to Congo! :tada:">
 <meta name=twitter:description content="This is a demo of the Congo theme for Hugo.">
-<meta itemprop=name content="Welcome to Congo! :tada:">
+<script type=application/ld+json>{"@context":"https://schema.org","@type":"WebSite","name":"Congo","url":"https:\/\/jpanther.github.io\/Congo\/","description":""}</script>
 <meta itemprop=description content="This is a demo of the Congo theme for Hugo.">
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -31,36 +30,23 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
 </header>
 <main class=flex-grow>
 <script type=text/javascript>function switchLayout(){var a=document.getElementById("page"),b=document.getElementById("profile"),c=document.getElementById("layout");a.style.display==="none"?(a.style.display="block",b.style.display="none",c.innerHTML="page"):(a.style.display="none",b.style.display="block",c.innerHTML="profile")}</script>
 <div class="flex px-4 py-3 mb-8 text-base rounded-md bg-primary-100 dark:bg-primary-900">
 <span class="flex items-center pr-3 text-primary-400">
 <span class="relative inline-block align-text-bottom icon"><svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="exclamation-triangle" class="svg-inline--fa fa-exclamation-triangle fa-w-18" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path fill="currentcolor" d="M569.517 440.013C587.975 472.007 564.806 512 527.94 512H48.054c-36.937.0-59.999-40.055-41.577-71.987L246.423 23.985c18.467-32.009 64.72-31.951 83.154.0l239.94 416.028zM288 354c-25.405.0-46 20.595-46 46s20.595 46 46 46 46-20.595 46-46-20.595-46-46-46zm-43.673-165.346 7.418 136c.347 6.364 5.609 11.346 11.982 11.346h48.546c6.373.0 11.635-4.982 11.982-11.346l7.418-136c.375-6.874-5.098-12.654-11.982-12.654h-63.383c-6.884.0-12.356 5.78-11.981 12.654z"/></svg>
 </span>
 </span>
 <span class="flex items-center justify-between flex-grow no-prose dark:text-gray-300">
 <span>This is a demo of the `<code id=layout>page</code>` layout.</span>
 <button class="font-bold px-4 py-2 !text-white !no-underline rounded-md bg-primary-600 hover:!bg-primary-500 dark:bg-primary-800 dark:hover:!bg-primary-700" onclick=switchLayout()>
 Switch layout &orarr;
 </button>
 </span>
 </div>
 <div id=page>
 <article class="max-w-full prose dark:prose-light">
 <header>
@ -69,19 +55,83 @@ Switch layout &orarr;
 <section><p class="!mb-9 text-xl">
 A simple, lightweight theme for Hugo built with Tailwind CSS.
 </p>
-<p>This is a demo site built entirely using Congo. It also contains a complete set of <a href=/docs/>theme documentation</a>. Congo is flexible and is great for both static page-based content (like this demo) or a traditional blog with a feed of recent posts.</p>
+<div class="flex px-4 py-1 mb-8 text-base rounded-md bg-primary-100 dark:bg-primary-900">
-<p>Explore the <a href=/samples/>sample pages</a> to get a feel for what Congo can do. If you like what you see, check out the project on <a href=https://github.com/jpanther/Congo>Github</a> or read the <a href=/docs/installation/>Installation guide</a> to get started.</p>
+<span class="flex items-center pr-3 text-primary-400">
-<figure><img src=/Congo/mountains.jpg alt="Photo by Anna Scarfiello on Unsplash."><figcaption>
+<span class="relative inline-block align-text-bottom icon"><svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="exclamation-triangle" class="svg-inline--fa fa-exclamation-triangle fa-w-18" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path fill="currentcolor" d="M569.517 440.013C587.975 472.007 564.806 512 527.94 512H48.054c-36.937.0-59.999-40.055-41.577-71.987L246.423 23.985c18.467-32.009 64.72-31.951 83.154.0l239.94 416.028zM288 354c-25.405.0-46 20.595-46 46s20.595 46 46 46 46-20.595 46-46-20.595-46-46-46zm-43.673-165.346 7.418 136c.347 6.364 5.609 11.346 11.982 11.346h48.546c6.373.0 11.635-4.982 11.982-11.346l7.418-136c.375-6.874-5.098-12.654-11.982-12.654h-63.383c-6.884.0-12.356 5.78-11.981 12.654z"/></svg>
 </span>
 </span>
 <span class="flex items-center justify-between flex-grow dark:text-gray-300">
 <span class=prose>This is a demo of the <code id=layout>page</code> layout.</span>
 <button class="px-4 py-1 !text-white !no-underline rounded-md bg-primary-600 hover:!bg-primary-500 dark:bg-primary-800 dark:hover:!bg-primary-700" onclick=switchLayout()>
 Switch layout &orarr;
 </button>
 </span>
 </div>
 <p>This is a demo site built entirely using Congo. It also contains a complete set of <a href=./docs/>theme documentation</a>. Congo is flexible and is great for both static page-based content (like this demo) or a traditional blog with a feed of recent posts.</p>
 <p>Explore the <a href=./samples/>sample pages</a> to get a feel for what Congo can do. If you like what you see, check out the project on <a href=https://github.com/jpanther/Congo>Github</a> or read the <a href=./docs/installation/>Installation guide</a> to get started.</p>
 <figure><img src=https://jpanther.github.io/Congo/mountains.jpg alt="Photo by Anna Scarfiello on Unsplash."><figcaption>
 <p>Photo by <a href="https://unsplash.com/@little_anne?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Anna Scarfiello</a> on <a href="https://unsplash.com/?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a>.</p>
 </figcaption>
 </figure>
 </section>
 </article>
 <section>
 <h2 class="mt-8 text-2xl font-extrabold">Recent</h2>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
 <a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/installation/>Installation</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
 2 mins
 </span>
 </div>
-<div id=profile style=display:none>
+</article>
-<article class="flex flex-col items-center justify-center text-center
+<article>
-mb-8">
+<h3 class="mt-6 text-xl font-semibold">
-<header class="flex flex-col items-center mb-3">
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/getting-started/>Getting Started</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
 2 mins
 </span>
 </div>
 </article>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
 <a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/configuration/>Configuration</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
 5 mins
 </span>
 </div>
 </article>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
 <a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/homepage-layout/>Homepage Layout</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
 3 mins
 </span>
 </div>
 </article>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
 <a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/front-matter/>Front Matter</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
 1 min
 </span>
 </div>
 </article>
 </section>
 </div>
 <div id=profile class="hidden h-full">
 <article class="flex flex-col items-center justify-center text-center">
 <header class="flex flex-col mb-3">
 <img class="mb-2 rounded-full w-36 h-36" src=https://jpanther.github.io/Congo/img/author.jpg>
 <h1 class="text-4xl font-extrabold">
 Congo
@ -106,78 +156,81 @@ Congo
 <section class="prose dark:prose-light"><p class="!mb-9 text-xl">
 A simple, lightweight theme for Hugo built with Tailwind CSS.
 </p>
-<p>This is a demo site built entirely using Congo. It also contains a complete set of <a href=/docs/>theme documentation</a>. Congo is flexible and is great for both static page-based content (like this demo) or a traditional blog with a feed of recent posts.</p>
+<div class="flex px-4 py-1 mb-8 text-base rounded-md bg-primary-100 dark:bg-primary-900">
-<p>Explore the <a href=/samples/>sample pages</a> to get a feel for what Congo can do. If you like what you see, check out the project on <a href=https://github.com/jpanther/Congo>Github</a> or read the <a href=/docs/installation/>Installation guide</a> to get started.</p>
+<span class="flex items-center pr-3 text-primary-400">
-<figure><img src=/Congo/mountains.jpg alt="Photo by Anna Scarfiello on Unsplash."><figcaption>
+<span class="relative inline-block align-text-bottom icon"><svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="exclamation-triangle" class="svg-inline--fa fa-exclamation-triangle fa-w-18" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path fill="currentcolor" d="M569.517 440.013C587.975 472.007 564.806 512 527.94 512H48.054c-36.937.0-59.999-40.055-41.577-71.987L246.423 23.985c18.467-32.009 64.72-31.951 83.154.0l239.94 416.028zM288 354c-25.405.0-46 20.595-46 46s20.595 46 46 46 46-20.595 46-46-20.595-46-46-46zm-43.673-165.346 7.418 136c.347 6.364 5.609 11.346 11.982 11.346h48.546c6.373.0 11.635-4.982 11.982-11.346l7.418-136c.375-6.874-5.098-12.654-11.982-12.654h-63.383c-6.884.0-12.356 5.78-11.981 12.654z"/></svg>
 </span>
 </span>
 <span class="flex items-center justify-between flex-grow dark:text-gray-300">
 <span class=prose>This is a demo of the <code id=layout>page</code> layout.</span>
 <button class="px-4 py-1 !text-white !no-underline rounded-md bg-primary-600 hover:!bg-primary-500 dark:bg-primary-800 dark:hover:!bg-primary-700" onclick=switchLayout()>
 Switch layout &orarr;
 </button>
 </span>
 </div>
 <p>This is a demo site built entirely using Congo. It also contains a complete set of <a href=./docs/>theme documentation</a>. Congo is flexible and is great for both static page-based content (like this demo) or a traditional blog with a feed of recent posts.</p>
 <p>Explore the <a href=./samples/>sample pages</a> to get a feel for what Congo can do. If you like what you see, check out the project on <a href=https://github.com/jpanther/Congo>Github</a> or read the <a href=./docs/installation/>Installation guide</a> to get started.</p>
 <figure><img src=https://jpanther.github.io/Congo/mountains.jpg alt="Photo by Anna Scarfiello on Unsplash."><figcaption>
 <p>Photo by <a href="https://unsplash.com/@little_anne?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Anna Scarfiello</a> on <a href="https://unsplash.com/?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a>.</p>
 </figcaption>
 </figure>
 </section>
 </article>
-</div>
+<section class=text-center>
-<section>
+<h2 class="mt-8 text-2xl font-extrabold">Recent</h2>
 <h2 class="text-2xl font-extrabold">Recent</h2>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/samples/markdown-syntax/>Markdown Syntax Guide</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/installation/>Installation</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <time datetime="2019-03-11 00:00:00 +0000 UTC">
 11 March 2019
 </time>
 <span class=px-1>&#183;</span>
 <span title="Reading time">
-3
+2 mins
 mins
 </span>
 </div>
 </article>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/samples/rich-content/>Rich Content</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/getting-started/>Getting Started</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <time datetime="2019-03-10 00:00:00 +0000 UTC">
 10 March 2019
 </time>
 <span class=px-1>&#183;</span>
 <span title="Reading time">
-1
+2 mins
 min
 </span>
 </div>
 </article>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/samples/math-typesetting/>Math Typesetting</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/configuration/>Configuration</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <time datetime="2019-03-08 00:00:00 +0000 UTC">
 8 March 2019
 </time>
 <span class=px-1>&#183;</span>
 <span title="Reading time">
-1
+5 mins
 min
 </span>
 </div>
 </article>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/samples/emoji-support/>Emoji Support</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/homepage-layout/>Homepage Layout</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <time datetime="2019-03-05 00:00:00 +0000 UTC">
 5 March 2019
 </time>
 <span class=px-1>&#183;</span>
 <span title="Reading time">
-1
+3 mins
-min
+</span>
 </div>
 </article>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
 <a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/front-matter/>Front Matter</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
 1 min
 </span>
 </div>
 </article>
 </section>
 </div>
 <script type=text/javascript>function switchLayout(){const a=document.getElementById("page"),b=document.getElementById("profile"),c=document.querySelectorAll("code[id=layout]");a.style.display==="none"?(a.style.display="block",b.style.display="none",c.forEach(function(a){a.innerText="page"})):(a.style.display="none",b.style.display="block",c.forEach(function(a){a.innerText="profile"}))}</script>
 </main><footer class="py-10 text-sm">
 <p class="text-gray-400 dark:text-gray-500">
 &copy;
@ -186,9 +239,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/index.xml
+++ b/index.xml
@ -4,7 +4,7 @@ Install Hugo # You can find specific instructions for your platform in the offic
 Make sure you are using Hugo version 0.86.1 or later as the theme takes advantage of some of the latest Hugo features.
 Create a new site # Run the command hugo new site mywebsite to create a new Hugo site in a folder named mywebsite.</description></item><item><title>Getting Started</title><link>https://jpanther.github.io/Congo/docs/getting-started/</link><pubDate>Sat, 15 Aug 2020 00:00:00 +0000</pubDate><guid>https://jpanther.github.io/Congo/docs/getting-started/</guid><description>This section assumes you have already installed the Congo theme. The config files that ship with Congo contain all of the possible settings that the theme recognises. By default, many of these are commented out but you can simply uncomment them to activate or change a specific feature.
 A few things you need to set for a new installation:
-# config/_default/config.toml baseURL = &amp;#34;https://your_domain.com&amp;#34; languageCode = &amp;#34;en-AU&amp;#34; title = &amp;#34;My awesome website&amp;#34; It&amp;rsquo;s also useful to set the author configuration in the config/_default/author.</description></item><item><title>Configuration</title><link>https://jpanther.github.io/Congo/docs/configuration/</link><pubDate>Fri, 14 Aug 2020 00:00:00 +0000</pubDate><guid>https://jpanther.github.io/Congo/docs/configuration/</guid><description>Congo is a highly customisable theme and uses some of the latest Hugo features to simplify how it is configured.
+# config/_default/config.toml baseURL = &amp;#34;https://your_domain.com&amp;#34; languageCode = &amp;#34;en-AU&amp;#34; title = &amp;#34;My awesome website&amp;#34; [author] name = &amp;#34;Your name&amp;#34; image = &amp;#34;img/author.</description></item><item><title>Configuration</title><link>https://jpanther.github.io/Congo/docs/configuration/</link><pubDate>Fri, 14 Aug 2020 00:00:00 +0000</pubDate><guid>https://jpanther.github.io/Congo/docs/configuration/</guid><description>Congo is a highly customisable theme and uses some of the latest Hugo features to simplify how it is configured.
 The theme ships with a default configuration that gets you up and running with a basic blog or static website.
 Configuration files bundled with the theme are provided in TOML format as this is the default Hugo syntax. Feel free to convert your config to YAML or JSON if you wish.</description></item><item><title>Users</title><link>https://jpanther.github.io/Congo/users/</link><pubDate>Fri, 14 Aug 2020 00:00:00 +0000</pubDate><guid>https://jpanther.github.io/Congo/users/</guid><description>Real websites that are built with Congo. Website Details Congo user? To add your site to this list, submit a pull request.</description></item><item><title>Homepage Layout</title><link>https://jpanther.github.io/Congo/docs/homepage-layout/</link><pubDate>Thu, 13 Aug 2020 00:00:00 +0000</pubDate><guid>https://jpanther.github.io/Congo/docs/homepage-layout/</guid><description>Congo provides a fully flexible homepage layout. There are two main templates to choose from with additional settings to adjust the design. Alternatively, you can also provide your own template and have complete control over the homepage content.
 The layout of the homepage is controlled by the homepage.layout setting in the params.toml configuration file. Additionally, all layouts have the option to include a listing of recent articles.
--- a/samples/emoji-support/index.html
+++ b/samples/emoji-support/index.html
@ -8,10 +8,10 @@
 <meta name=description content="Guide to emoji usage in Hugo">
 <link rel=canonical href=https://jpanther.github.io/Congo/samples/emoji-support/>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="Emoji Support">
 <meta property="og:description" content="Guide to emoji usage in Hugo">
 <meta property="og:type" content="article">
@ -21,11 +21,7 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="Emoji Support">
 <meta name=twitter:description content="Guide to emoji usage in Hugo">
-<meta itemprop=name content="Emoji Support">
+<script type=application/ld+json>{"@context":"https://schema.org","@type":"BlogPosting","articleSection":"Content Samples","name":"Emoji Support","headline":"Emoji Support","description":"Guide to emoji usage in Hugo","inLanguage":"en-AU","author":{"@type":"Person","name":"Congo"},"creator":{"@type":"Person","name":"Congo"},"copyrightHolder":"Congo","copyrightYear":"2019","dateCreated":"2019-03-05T00:00:00\u002b00:00","datePublished":"2019-03-05T00:00:00\u002b00:00","dateModified":"2019-03-05T00:00:00\u002b00:00","url":"https:\/\/jpanther.github.io\/Congo\/samples\/emoji-support\/","wordCount":"129","keywords":["emoji","sample"]}</script>
 <meta itemprop=description content="Guide to emoji usage in Hugo"><meta itemprop=datePublished content="2019-03-05T00:00:00+00:00">
 <meta itemprop=dateModified content="2019-03-05T00:00:00+00:00">
 <meta itemprop=wordCount content="129">
 <meta itemprop=keywords content="emoji,sample,">
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -35,18 +31,18 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
@ -54,15 +50,25 @@
 <main class=flex-grow>
 <article class=max-w-prose>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/samples/>Content Samples</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/samples/emoji-support/>Emoji Support</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <h1 class="mt-0 text-4xl font-extrabold">Emoji Support</h1>
 <div class="mt-8 mb-12 text-base text-gray-400 dark:text-gray-500">
 <time datetime="2019-03-05 00:00:00 +0000 UTC">
 5 March 2019
 </time>
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 <span title="Reading time">
-1
+1 min
 min
 </span>
 </div>
 </header>
@ -83,6 +89,9 @@ font-family: Apple Color Emoji, Segoe UI Emoji, NotoColorEmoji, Segoe UI Symbol,
 <div class="flex items-center">
 <img class="w-24 h-24 !mt-0 !mb-0 mr-4 rounded-full" src=https://jpanther.github.io/Congo/img/author.jpg>
 <div>
 <div class="text-[0.6rem] leading-3 text-gray-400 dark:text-gray-500 uppercase">
 Author
 </div>
 <div class="font-semibold leading-6 text-gray-800 dark:text-gray-300">
 Congo
 </div>
@ -102,14 +111,14 @@ Congo
 </div>
 </div>
 </div>
-<div class=pt-8>
+<div class="pt-8 article-pagination">
 <hr class="border-gray-300 border-dotted dark:border-gray-600">
 <div class="flex justify-between pt-3">
 <span>
 <a class=flex href=https://jpanther.github.io/Congo/samples/math-typesetting/>
-<span class=mr-3>&larr;</span>
+<span class="mr-3 article-pagination-direction">&larr;</span>
 <span class="flex flex-col">
-<span class=button__text>Math Typesetting</span>
+<span class=article-pagination-title>Math Typesetting</span>
 <time class="-mt-1 text-xs text-gray-400 dark:text-gray-500" datetime="2019-03-05 00:00:00 +0000 UTC">
 5 March 2019
 </time>
@ -130,9 +139,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/samples/index.html
+++ b/samples/index.html
@ -9,10 +9,10 @@
 <link rel=canonical href=https://jpanther.github.io/Congo/samples/>
 <link rel=alternate type=application/rss+xml href=https://jpanther.github.io/Congo/samples/index.xml title=Congo>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="Content Samples">
 <meta property="og:description" content="See what's possible with Congo.">
 <meta property="og:type" content="website">
@ -20,8 +20,6 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="Content Samples">
 <meta name=twitter:description content="See what's possible with Congo.">
 <meta itemprop=name content="Content Samples">
 <meta itemprop=description content="See what's possible with Congo.">
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -31,92 +29,98 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
 </header>
 <main class=flex-grow>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/samples/>Content Samples</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <section class="prose dark:prose-light">
 <h1 class="mb-3 text-4xl font-extrabold">Content Samples</h1>
 <section><p class="!mb-9 text-xl">
 Congo brings your content to life. 😍
 </p>
 <p>This section contains some demo pages that show how Congo renders different types of content. These pages come from Hugo&rsquo;s official <a href=https://github.com/gohugoio/hugoBasicExample>hugoBasicExample</a> repository.</p>
-<p>You can also see an example <a href=/tags/>taxonomy listing</a> page.</p>
+<p>You can also see an example <a href=../tags/>taxonomy listing</a> page.</p>
 <p><em><strong>Sidenote:</strong> This page is just a standard Congo article listing and Hugo has been configured to generate a <code>samples</code> content type.</em></p>
 <hr>
 </section>
 </section>
 </header>
 <section>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/samples/markdown-syntax/>Markdown Syntax Guide</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/samples/markdown-syntax/>Markdown Syntax Guide</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <time datetime="2019-03-11 00:00:00 +0000 UTC">
 11 March 2019
 </time>
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 <span title="Reading time">
-3
+3 mins
 mins
 </span>
 </div>
 </article>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/samples/rich-content/>Rich Content</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/samples/rich-content/>Rich Content</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <time datetime="2019-03-10 00:00:00 +0000 UTC">
 10 March 2019
 </time>
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 <span title="Reading time">
-1
+1 min
 min
 </span>
 </div>
 </article>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/samples/math-typesetting/>Math Typesetting</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/samples/math-typesetting/>Math Typesetting</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <time datetime="2019-03-08 00:00:00 +0000 UTC">
 8 March 2019
 </time>
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 <span title="Reading time">
-1
+1 min
 min
 </span>
 </div>
 </article>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/samples/emoji-support/>Emoji Support</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/samples/emoji-support/>Emoji Support</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <time datetime="2019-03-05 00:00:00 +0000 UTC">
 5 March 2019
 </time>
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 <span title="Reading time">
-1
+1 min
 min
 </span>
 </div>
 </article>
@ -129,9 +133,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/samples/markdown-syntax/index.html
+++ b/samples/markdown-syntax/index.html
@ -8,10 +8,10 @@
 <meta name=description content="Sample article showcasing basic Markdown syntax and formatting for HTML elements.">
 <link rel=canonical href=https://jpanther.github.io/Congo/samples/markdown-syntax/>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="Markdown Syntax Guide">
 <meta property="og:description" content="Sample article showcasing basic Markdown syntax and formatting for HTML elements.">
 <meta property="og:type" content="article">
@ -21,11 +21,7 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="Markdown Syntax Guide">
 <meta name=twitter:description content="Sample article showcasing basic Markdown syntax and formatting for HTML elements.">
-<meta itemprop=name content="Markdown Syntax Guide">
+<script type=application/ld+json>{"@context":"https://schema.org","@type":"BlogPosting","articleSection":"Content Samples","name":"Markdown Syntax Guide","headline":"Markdown Syntax Guide","description":"Sample article showcasing basic Markdown syntax and formatting for HTML elements.","inLanguage":"en-AU","author":{"@type":"Person","name":"Congo"},"creator":{"@type":"Person","name":"Congo"},"copyrightHolder":"Congo","copyrightYear":"2019","dateCreated":"2019-03-11T00:00:00\u002b00:00","datePublished":"2019-03-11T00:00:00\u002b00:00","dateModified":"2019-03-11T00:00:00\u002b00:00","url":"https:\/\/jpanther.github.io\/Congo\/samples\/markdown-syntax\/","wordCount":"467","keywords":["markdown","css","html","sample"]}</script>
 <meta itemprop=description content="Sample article showcasing basic Markdown syntax and formatting for HTML elements."><meta itemprop=datePublished content="2019-03-11T00:00:00+00:00">
 <meta itemprop=dateModified content="2019-03-11T00:00:00+00:00">
 <meta itemprop=wordCount content="467">
 <meta itemprop=keywords content="markdown,css,html,sample,">
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -35,18 +31,18 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
@ -54,15 +50,25 @@
 <main class=flex-grow>
 <article class=max-w-prose>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/samples/>Content Samples</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/samples/markdown-syntax/>Markdown Syntax Guide</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <h1 class="mt-0 text-4xl font-extrabold">Markdown Syntax Guide</h1>
 <div class="mt-8 mb-12 text-base text-gray-400 dark:text-gray-500">
 <time datetime="2019-03-11 00:00:00 +0000 UTC">
 11 March 2019
 </time>
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 <span title="Reading time">
-3
+3 mins
 mins
 </span>
 </div>
 </header>
@ -211,6 +217,9 @@ mins
 <div class="flex items-center">
 <img class="w-24 h-24 !mt-0 !mb-0 mr-4 rounded-full" src=https://jpanther.github.io/Congo/img/author.jpg>
 <div>
 <div class="text-[0.6rem] leading-3 text-gray-400 dark:text-gray-500 uppercase">
 Author
 </div>
 <div class="font-semibold leading-6 text-gray-800 dark:text-gray-300">
 Congo
 </div>
@ -230,7 +239,7 @@ Congo
 </div>
 </div>
 </div>
-<div class=pt-8>
+<div class="pt-8 article-pagination">
 <hr class="border-gray-300 border-dotted dark:border-gray-600">
 <div class="flex justify-between pt-3">
 <span>
@ -238,12 +247,12 @@ Congo
 <span>
 <a class="flex text-right" href=https://jpanther.github.io/Congo/samples/rich-content/>
 <span class="flex flex-col">
-<span>Rich Content</span>
+<span class=article-pagination-title>Rich Content</span>
 <time class="-mt-1 text-xs text-gray-400 dark:text-gray-500" datetime="2019-03-11 00:00:00 +0000 UTC">
 11 March 2019
 </time>
 </span>
-<span class=ml-3>&rarr;</span>
+<span class="ml-3 article-pagination-direction">&rarr;</span>
 </a>
 </span>
 </div>
@ -258,9 +267,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/samples/math-typesetting/index.html
+++ b/samples/math-typesetting/index.html
@ -8,10 +8,10 @@
 <meta name=description content="A brief guide to setup KaTeX">
 <link rel=canonical href=https://jpanther.github.io/Congo/samples/math-typesetting/>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="Math Typesetting">
 <meta property="og:description" content="A brief guide to setup KaTeX">
 <meta property="og:type" content="article">
@ -21,11 +21,7 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="Math Typesetting">
 <meta name=twitter:description content="A brief guide to setup KaTeX">
-<meta itemprop=name content="Math Typesetting">
+<script type=application/ld+json>{"@context":"https://schema.org","@type":"BlogPosting","articleSection":"Content Samples","name":"Math Typesetting","headline":"Math Typesetting","description":"A brief guide to setup KaTeX","inLanguage":"en-AU","author":{"@type":"Person","name":"Congo"},"creator":{"@type":"Person","name":"Congo"},"copyrightHolder":"Congo","copyrightYear":"2019","dateCreated":"2019-03-08T00:00:00\u002b00:00","datePublished":"2019-03-08T00:00:00\u002b00:00","dateModified":"2019-03-08T00:00:00\u002b00:00","url":"https:\/\/jpanther.github.io\/Congo\/samples\/math-typesetting\/","wordCount":"121","keywords":["sample"]}</script>
 <meta itemprop=description content="A brief guide to setup KaTeX"><meta itemprop=datePublished content="2019-03-08T00:00:00+00:00">
 <meta itemprop=dateModified content="2019-03-08T00:00:00+00:00">
 <meta itemprop=wordCount content="121">
 <meta itemprop=keywords content="sample,">
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -35,18 +31,18 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
@ -54,15 +50,25 @@
 <main class=flex-grow>
 <article class=max-w-prose>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/samples/>Content Samples</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/samples/math-typesetting/>Math Typesetting</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <h1 class="mt-0 text-4xl font-extrabold">Math Typesetting</h1>
 <div class="mt-8 mb-12 text-base text-gray-400 dark:text-gray-500">
 <time datetime="2019-03-08 00:00:00 +0000 UTC">
 8 March 2019
 </time>
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 <span title="Reading time">
-1
+1 min
 min
 </span>
 </div>
 </header>
@ -98,6 +104,9 @@ $$</p>
 <div class="flex items-center">
 <img class="w-24 h-24 !mt-0 !mb-0 mr-4 rounded-full" src=https://jpanther.github.io/Congo/img/author.jpg>
 <div>
 <div class="text-[0.6rem] leading-3 text-gray-400 dark:text-gray-500 uppercase">
 Author
 </div>
 <div class="font-semibold leading-6 text-gray-800 dark:text-gray-300">
 Congo
 </div>
@ -117,14 +126,14 @@ Congo
 </div>
 </div>
 </div>
-<div class=pt-8>
+<div class="pt-8 article-pagination">
 <hr class="border-gray-300 border-dotted dark:border-gray-600">
 <div class="flex justify-between pt-3">
 <span>
 <a class=flex href=https://jpanther.github.io/Congo/samples/rich-content/>
-<span class=mr-3>&larr;</span>
+<span class="mr-3 article-pagination-direction">&larr;</span>
 <span class="flex flex-col">
-<span class=button__text>Rich Content</span>
+<span class=article-pagination-title>Rich Content</span>
 <time class="-mt-1 text-xs text-gray-400 dark:text-gray-500" datetime="2019-03-08 00:00:00 +0000 UTC">
 8 March 2019
 </time>
@ -134,12 +143,12 @@ Congo
 <span>
 <a class="flex text-right" href=https://jpanther.github.io/Congo/samples/emoji-support/>
 <span class="flex flex-col">
-<span>Emoji Support</span>
+<span class=article-pagination-title>Emoji Support</span>
 <time class="-mt-1 text-xs text-gray-400 dark:text-gray-500" datetime="2019-03-08 00:00:00 +0000 UTC">
 8 March 2019
 </time>
 </span>
-<span class=ml-3>&rarr;</span>
+<span class="ml-3 article-pagination-direction">&rarr;</span>
 </a>
 </span>
 </div>
@ -154,9 +163,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/samples/rich-content/index.html
+++ b/samples/rich-content/index.html
@ -8,10 +8,10 @@
 <meta name=description content="A brief description of Hugo Shortcodes">
 <link rel=canonical href=https://jpanther.github.io/Congo/samples/rich-content/>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="Rich Content">
 <meta property="og:description" content="A brief description of Hugo Shortcodes">
 <meta property="og:type" content="article">
@ -21,11 +21,7 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="Rich Content">
 <meta name=twitter:description content="A brief description of Hugo Shortcodes">
-<meta itemprop=name content="Rich Content">
+<script type=application/ld+json>{"@context":"https://schema.org","@type":"BlogPosting","articleSection":"Content Samples","name":"Rich Content","headline":"Rich Content","description":"A brief description of Hugo Shortcodes","inLanguage":"en-AU","author":{"@type":"Person","name":"Congo"},"creator":{"@type":"Person","name":"Congo"},"copyrightHolder":"Congo","copyrightYear":"2019","dateCreated":"2019-03-10T00:00:00\u002b00:00","datePublished":"2019-03-10T00:00:00\u002b00:00","dateModified":"2019-03-10T00:00:00\u002b00:00","url":"https:\/\/jpanther.github.io\/Congo\/samples\/rich-content\/","wordCount":"155","keywords":["shortcodes","privacy","sample"]}</script>
 <meta itemprop=description content="A brief description of Hugo Shortcodes"><meta itemprop=datePublished content="2019-03-10T00:00:00+00:00">
 <meta itemprop=dateModified content="2019-03-10T00:00:00+00:00">
 <meta itemprop=wordCount content="155">
 <meta itemprop=keywords content="shortcodes,privacy,sample,">
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -35,18 +31,18 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
@ -54,15 +50,25 @@
 <main class=flex-grow>
 <article class=max-w-prose>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/samples/>Content Samples</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/samples/rich-content/>Rich Content</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <h1 class="mt-0 text-4xl font-extrabold">Rich Content</h1>
 <div class="mt-8 mb-12 text-base text-gray-400 dark:text-gray-500">
 <time datetime="2019-03-10 00:00:00 +0000 UTC">
 10 March 2019
 </time>
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 <span title="Reading time">
-1
+1 min
 min
 </span>
 </div>
 </header>
@ -91,6 +97,9 @@ min
 <div class="flex items-center">
 <img class="w-24 h-24 !mt-0 !mb-0 mr-4 rounded-full" src=https://jpanther.github.io/Congo/img/author.jpg>
 <div>
 <div class="text-[0.6rem] leading-3 text-gray-400 dark:text-gray-500 uppercase">
 Author
 </div>
 <div class="font-semibold leading-6 text-gray-800 dark:text-gray-300">
 Congo
 </div>
@ -110,14 +119,14 @@ Congo
 </div>
 </div>
 </div>
-<div class=pt-8>
+<div class="pt-8 article-pagination">
 <hr class="border-gray-300 border-dotted dark:border-gray-600">
 <div class="flex justify-between pt-3">
 <span>
 <a class=flex href=https://jpanther.github.io/Congo/samples/markdown-syntax/>
-<span class=mr-3>&larr;</span>
+<span class="mr-3 article-pagination-direction">&larr;</span>
 <span class="flex flex-col">
-<span class=button__text>Markdown Syntax Guide</span>
+<span class=article-pagination-title>Markdown Syntax Guide</span>
 <time class="-mt-1 text-xs text-gray-400 dark:text-gray-500" datetime="2019-03-10 00:00:00 +0000 UTC">
 10 March 2019
 </time>
@ -127,12 +136,12 @@ Congo
 <span>
 <a class="flex text-right" href=https://jpanther.github.io/Congo/samples/math-typesetting/>
 <span class="flex flex-col">
-<span>Math Typesetting</span>
+<span class=article-pagination-title>Math Typesetting</span>
 <time class="-mt-1 text-xs text-gray-400 dark:text-gray-500" datetime="2019-03-10 00:00:00 +0000 UTC">
 10 March 2019
 </time>
 </span>
-<span class=ml-3>&rarr;</span>
+<span class="ml-3 article-pagination-direction">&rarr;</span>
 </a>
 </span>
 </div>
@ -147,9 +156,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/tags/advanced/index.html
+++ b/tags/advanced/index.html
@ -9,10 +9,10 @@
 <link rel=canonical href=https://jpanther.github.io/Congo/tags/advanced/>
 <link rel=alternate type=application/rss+xml href=https://jpanther.github.io/Congo/tags/advanced/index.xml title=Congo>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="advanced">
 <meta property="og:description" content>
 <meta property="og:type" content="website">
@ -20,8 +20,6 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="advanced">
 <meta name=twitter:description content>
 <meta itemprop=name content="advanced">
 <meta itemprop=description content>
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -31,38 +29,50 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
 </header>
 <main class=flex-grow>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/>Tags</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/advanced/>advanced</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <section class="prose dark:prose-light">
 <h1 class="mb-3 text-4xl font-extrabold">advanced</h1>
 <section></section>
 </section>
 </header>
 <section>
 <h2 class="mt-12 text-2xl font-bold first:mt-8">2020</h2>
 <hr class="border-gray-400 border-dotted w-36">
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/advanced-customisation/>Advanced Customisation</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/advanced-customisation/>Advanced Customisation</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-2
+2 mins
 mins
 </span>
 </div>
 </article>
@ -75,9 +85,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/tags/analytics/index.html
+++ b/tags/analytics/index.html
@ -9,10 +9,10 @@
 <link rel=canonical href=https://jpanther.github.io/Congo/tags/analytics/>
 <link rel=alternate type=application/rss+xml href=https://jpanther.github.io/Congo/tags/analytics/index.xml title=Congo>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="analytics">
 <meta property="og:description" content>
 <meta property="og:type" content="website">
@ -20,8 +20,6 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="analytics">
 <meta name=twitter:description content>
 <meta itemprop=name content="analytics">
 <meta itemprop=description content>
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -31,38 +29,50 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
 </header>
 <main class=flex-grow>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/>Tags</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/analytics/>analytics</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <section class="prose dark:prose-light">
 <h1 class="mb-3 text-4xl font-extrabold">analytics</h1>
 <section></section>
 </section>
 </header>
 <section>
 <h2 class="mt-12 text-2xl font-bold first:mt-8">2020</h2>
 <hr class="border-gray-400 border-dotted w-36">
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/partials/>Partials</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/partials/>Partials</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-3
+3 mins
 mins
 </span>
 </div>
 </article>
@ -75,9 +85,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/tags/comments/index.html
+++ b/tags/comments/index.html
@ -9,10 +9,10 @@
 <link rel=canonical href=https://jpanther.github.io/Congo/tags/comments/>
 <link rel=alternate type=application/rss+xml href=https://jpanther.github.io/Congo/tags/comments/index.xml title=Congo>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="comments">
 <meta property="og:description" content>
 <meta property="og:type" content="website">
@ -20,8 +20,6 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="comments">
 <meta name=twitter:description content>
 <meta itemprop=name content="comments">
 <meta itemprop=description content>
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -31,38 +29,50 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
 </header>
 <main class=flex-grow>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/>Tags</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/comments/>comments</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <section class="prose dark:prose-light">
 <h1 class="mb-3 text-4xl font-extrabold">comments</h1>
 <section></section>
 </section>
 </header>
 <section>
 <h2 class="mt-12 text-2xl font-bold first:mt-8">2020</h2>
 <hr class="border-gray-400 border-dotted w-36">
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/partials/>Partials</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/partials/>Partials</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-3
+3 mins
 mins
 </span>
 </div>
 </article>
@ -75,9 +85,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/tags/config/index.html
+++ b/tags/config/index.html
@ -9,10 +9,10 @@
 <link rel=canonical href=https://jpanther.github.io/Congo/tags/config/>
 <link rel=alternate type=application/rss+xml href=https://jpanther.github.io/Congo/tags/config/index.xml title=Congo>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="config">
 <meta property="og:description" content>
 <meta property="og:type" content="website">
@ -20,8 +20,6 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="config">
 <meta name=twitter:description content>
 <meta itemprop=name content="config">
 <meta itemprop=description content>
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -31,49 +29,60 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
 </header>
 <main class=flex-grow>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/>Tags</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/config/>config</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <section class="prose dark:prose-light">
 <h1 class="mb-3 text-4xl font-extrabold">config</h1>
 <section></section>
 </section>
 </header>
 <section>
 <h2 class="mt-12 text-2xl font-bold first:mt-8">2020</h2>
 <hr class="border-gray-400 border-dotted w-36">
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/configuration/>Configuration</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/configuration/>Configuration</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-3
+5 mins
 mins
 </span>
 </div>
 </article>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/front-matter/>Front Matter</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/front-matter/>Front Matter</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-1
+1 min
 min
 </span>
 </div>
 </article>
@ -86,9 +95,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/tags/css/index.html
+++ b/tags/css/index.html
@ -9,10 +9,10 @@
 <link rel=canonical href=https://jpanther.github.io/Congo/tags/css/>
 <link rel=alternate type=application/rss+xml href=https://jpanther.github.io/Congo/tags/css/index.xml title=Congo>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="css">
 <meta property="og:description" content>
 <meta property="og:type" content="website">
@ -20,8 +20,6 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="css">
 <meta name=twitter:description content>
 <meta itemprop=name content="css">
 <meta itemprop=description content>
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -31,38 +29,50 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
 </header>
 <main class=flex-grow>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/>Tags</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/css/>css</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <section class="prose dark:prose-light">
 <h1 class="mb-3 text-4xl font-extrabold">css</h1>
 <section></section>
 </section>
 </header>
 <section>
 <h2 class="mt-12 text-2xl font-bold first:mt-8">2020</h2>
 <hr class="border-gray-400 border-dotted w-36">
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/advanced-customisation/>Advanced Customisation</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/advanced-customisation/>Advanced Customisation</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-2
+2 mins
 mins
 </span>
 </div>
 </article>
@ -70,16 +80,15 @@ mins
 <hr class="border-gray-400 border-dotted w-36">
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/samples/markdown-syntax/>Markdown Syntax Guide</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/samples/markdown-syntax/>Markdown Syntax Guide</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <time datetime="2019-03-11 00:00:00 +0000 UTC">
 11 March 2019
 </time>
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 <span title="Reading time">
-3
+3 mins
 mins
 </span>
 </div>
 </article>
@ -92,9 +101,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/tags/docs/index.html
+++ b/tags/docs/index.html
@ -9,10 +9,10 @@
 <link rel=canonical href=https://jpanther.github.io/Congo/tags/docs/>
 <link rel=alternate type=application/rss+xml href=https://jpanther.github.io/Congo/tags/docs/index.xml title=Congo>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="docs">
 <meta property="og:description" content>
 <meta property="og:type" content="website">
@ -20,8 +20,6 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="docs">
 <meta name=twitter:description content>
 <meta itemprop=name content="docs">
 <meta itemprop=description content>
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -31,115 +29,120 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
 </header>
 <main class=flex-grow>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/>Tags</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/docs/>docs</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <section class="prose dark:prose-light">
 <h1 class="mb-3 text-4xl font-extrabold">docs</h1>
 <section></section>
 </section>
 </header>
 <section>
 <h2 class="mt-12 text-2xl font-bold first:mt-8">2020</h2>
 <hr class="border-gray-400 border-dotted w-36">
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/installation/>Installation</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/installation/>Installation</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-2
+2 mins
 mins
 </span>
 </div>
 </article>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/getting-started/>Getting Started</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/getting-started/>Getting Started</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-2
+2 mins
 mins
 </span>
 </div>
 </article>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/configuration/>Configuration</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/configuration/>Configuration</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-3
+5 mins
 mins
 </span>
 </div>
 </article>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/homepage-layout/>Homepage Layout</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/homepage-layout/>Homepage Layout</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-2
+3 mins
 mins
 </span>
 </div>
 </article>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/front-matter/>Front Matter</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/front-matter/>Front Matter</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-1
+1 min
 min
 </span>
 </div>
 </article>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/shortcodes/>Shortcodes</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/shortcodes/>Shortcodes</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-2
+2 mins
 mins
 </span>
 </div>
 </article>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/partials/>Partials</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/partials/>Partials</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-3
+3 mins
 mins
 </span>
 </div>
 </article>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/advanced-customisation/>Advanced Customisation</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/advanced-customisation/>Advanced Customisation</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-2
+2 mins
 mins
 </span>
 </div>
 </article>
@ -152,9 +155,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/tags/docs/index.xml
+++ b/tags/docs/index.xml
@ -4,7 +4,7 @@ Install Hugo # You can find specific instructions for your platform in the offic
 Make sure you are using Hugo version 0.86.1 or later as the theme takes advantage of some of the latest Hugo features.
 Create a new site # Run the command hugo new site mywebsite to create a new Hugo site in a folder named mywebsite.</description></item><item><title>Getting Started</title><link>https://jpanther.github.io/Congo/docs/getting-started/</link><pubDate>Sat, 15 Aug 2020 00:00:00 +0000</pubDate><guid>https://jpanther.github.io/Congo/docs/getting-started/</guid><description>This section assumes you have already installed the Congo theme. The config files that ship with Congo contain all of the possible settings that the theme recognises. By default, many of these are commented out but you can simply uncomment them to activate or change a specific feature.
 A few things you need to set for a new installation:
-# config/_default/config.toml baseURL = &amp;#34;https://your_domain.com&amp;#34; languageCode = &amp;#34;en-AU&amp;#34; title = &amp;#34;My awesome website&amp;#34; It&amp;rsquo;s also useful to set the author configuration in the config/_default/author.</description></item><item><title>Configuration</title><link>https://jpanther.github.io/Congo/docs/configuration/</link><pubDate>Fri, 14 Aug 2020 00:00:00 +0000</pubDate><guid>https://jpanther.github.io/Congo/docs/configuration/</guid><description>Congo is a highly customisable theme and uses some of the latest Hugo features to simplify how it is configured.
+# config/_default/config.toml baseURL = &amp;#34;https://your_domain.com&amp;#34; languageCode = &amp;#34;en-AU&amp;#34; title = &amp;#34;My awesome website&amp;#34; [author] name = &amp;#34;Your name&amp;#34; image = &amp;#34;img/author.</description></item><item><title>Configuration</title><link>https://jpanther.github.io/Congo/docs/configuration/</link><pubDate>Fri, 14 Aug 2020 00:00:00 +0000</pubDate><guid>https://jpanther.github.io/Congo/docs/configuration/</guid><description>Congo is a highly customisable theme and uses some of the latest Hugo features to simplify how it is configured.
 The theme ships with a default configuration that gets you up and running with a basic blog or static website.
 Configuration files bundled with the theme are provided in TOML format as this is the default Hugo syntax. Feel free to convert your config to YAML or JSON if you wish.</description></item><item><title>Homepage Layout</title><link>https://jpanther.github.io/Congo/docs/homepage-layout/</link><pubDate>Thu, 13 Aug 2020 00:00:00 +0000</pubDate><guid>https://jpanther.github.io/Congo/docs/homepage-layout/</guid><description>Congo provides a fully flexible homepage layout. There are two main templates to choose from with additional settings to adjust the design. Alternatively, you can also provide your own template and have complete control over the homepage content.
 The layout of the homepage is controlled by the homepage.layout setting in the params.toml configuration file. Additionally, all layouts have the option to include a listing of recent articles.
--- a/tags/emoji/index.html
+++ b/tags/emoji/index.html
@ -9,10 +9,10 @@
 <link rel=canonical href=https://jpanther.github.io/Congo/tags/emoji/>
 <link rel=alternate type=application/rss+xml href=https://jpanther.github.io/Congo/tags/emoji/index.xml title=Congo>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="emoji">
 <meta property="og:description" content>
 <meta property="og:type" content="website">
@ -20,8 +20,6 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="emoji">
 <meta name=twitter:description content>
 <meta itemprop=name content="emoji">
 <meta itemprop=description content>
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -31,42 +29,54 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
 </header>
 <main class=flex-grow>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/>Tags</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/emoji/>emoji</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <section class="prose dark:prose-light">
 <h1 class="mb-3 text-4xl font-extrabold">emoji</h1>
 <section></section>
 </section>
 </header>
 <section>
 <h2 class="mt-12 text-2xl font-bold first:mt-8">2019</h2>
 <hr class="border-gray-400 border-dotted w-36">
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/samples/emoji-support/>Emoji Support</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/samples/emoji-support/>Emoji Support</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <time datetime="2019-03-05 00:00:00 +0000 UTC">
 5 March 2019
 </time>
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 <span title="Reading time">
-1
+1 min
 min
 </span>
 </div>
 </article>
@ -79,9 +89,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/tags/favicons/index.html
+++ b/tags/favicons/index.html
@ -9,10 +9,10 @@
 <link rel=canonical href=https://jpanther.github.io/Congo/tags/favicons/>
 <link rel=alternate type=application/rss+xml href=https://jpanther.github.io/Congo/tags/favicons/index.xml title=Congo>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="favicons">
 <meta property="og:description" content>
 <meta property="og:type" content="website">
@ -20,8 +20,6 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="favicons">
 <meta name=twitter:description content>
 <meta itemprop=name content="favicons">
 <meta itemprop=description content>
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -31,38 +29,50 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
 </header>
 <main class=flex-grow>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/>Tags</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/favicons/>favicons</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <section class="prose dark:prose-light">
 <h1 class="mb-3 text-4xl font-extrabold">favicons</h1>
 <section></section>
 </section>
 </header>
 <section>
 <h2 class="mt-12 text-2xl font-bold first:mt-8">2020</h2>
 <hr class="border-gray-400 border-dotted w-36">
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/partials/>Partials</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/partials/>Partials</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-3
+3 mins
 mins
 </span>
 </div>
 </article>
@ -75,9 +85,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/tags/front-matter/index.html
+++ b/tags/front-matter/index.html
@ -9,10 +9,10 @@
 <link rel=canonical href=https://jpanther.github.io/Congo/tags/front-matter/>
 <link rel=alternate type=application/rss+xml href=https://jpanther.github.io/Congo/tags/front-matter/index.xml title=Congo>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="front matter">
 <meta property="og:description" content>
 <meta property="og:type" content="website">
@ -20,8 +20,6 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="front matter">
 <meta name=twitter:description content>
 <meta itemprop=name content="front matter">
 <meta itemprop=description content>
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -31,38 +29,50 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
 </header>
 <main class=flex-grow>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/>Tags</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/front-matter/>front matter</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <section class="prose dark:prose-light">
 <h1 class="mb-3 text-4xl font-extrabold">front matter</h1>
 <section></section>
 </section>
 </header>
 <section>
 <h2 class="mt-12 text-2xl font-bold first:mt-8">2020</h2>
 <hr class="border-gray-400 border-dotted w-36">
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/front-matter/>Front Matter</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/front-matter/>Front Matter</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-1
+1 min
 min
 </span>
 </div>
 </article>
@ -75,9 +85,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/tags/homepage/index.html
+++ b/tags/homepage/index.html
@ -9,10 +9,10 @@
 <link rel=canonical href=https://jpanther.github.io/Congo/tags/homepage/>
 <link rel=alternate type=application/rss+xml href=https://jpanther.github.io/Congo/tags/homepage/index.xml title=Congo>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="homepage">
 <meta property="og:description" content>
 <meta property="og:type" content="website">
@ -20,8 +20,6 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="homepage">
 <meta name=twitter:description content>
 <meta itemprop=name content="homepage">
 <meta itemprop=description content>
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -31,38 +29,50 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
 </header>
 <main class=flex-grow>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/>Tags</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/homepage/>homepage</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <section class="prose dark:prose-light">
 <h1 class="mb-3 text-4xl font-extrabold">homepage</h1>
 <section></section>
 </section>
 </header>
 <section>
 <h2 class="mt-12 text-2xl font-bold first:mt-8">2020</h2>
 <hr class="border-gray-400 border-dotted w-36">
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/homepage-layout/>Homepage Layout</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/homepage-layout/>Homepage Layout</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-2
+3 mins
 mins
 </span>
 </div>
 </article>
@ -75,9 +85,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/tags/html/index.html
+++ b/tags/html/index.html
@ -9,10 +9,10 @@
 <link rel=canonical href=https://jpanther.github.io/Congo/tags/html/>
 <link rel=alternate type=application/rss+xml href=https://jpanther.github.io/Congo/tags/html/index.xml title=Congo>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="html">
 <meta property="og:description" content>
 <meta property="og:type" content="website">
@ -20,8 +20,6 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="html">
 <meta name=twitter:description content>
 <meta itemprop=name content="html">
 <meta itemprop=description content>
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -31,42 +29,54 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
 </header>
 <main class=flex-grow>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/>Tags</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/html/>html</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <section class="prose dark:prose-light">
 <h1 class="mb-3 text-4xl font-extrabold">html</h1>
 <section></section>
 </section>
 </header>
 <section>
 <h2 class="mt-12 text-2xl font-bold first:mt-8">2019</h2>
 <hr class="border-gray-400 border-dotted w-36">
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/samples/markdown-syntax/>Markdown Syntax Guide</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/samples/markdown-syntax/>Markdown Syntax Guide</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <time datetime="2019-03-11 00:00:00 +0000 UTC">
 11 March 2019
 </time>
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 <span title="Reading time">
-3
+3 mins
 mins
 </span>
 </div>
 </article>
@ -79,9 +89,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/tags/icon/index.html
+++ b/tags/icon/index.html
@ -9,10 +9,10 @@
 <link rel=canonical href=https://jpanther.github.io/Congo/tags/icon/>
 <link rel=alternate type=application/rss+xml href=https://jpanther.github.io/Congo/tags/icon/index.xml title=Congo>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="icon">
 <meta property="og:description" content>
 <meta property="og:type" content="website">
@ -20,8 +20,6 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="icon">
 <meta name=twitter:description content>
 <meta itemprop=name content="icon">
 <meta itemprop=description content>
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -31,49 +29,60 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
 </header>
 <main class=flex-grow>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/>Tags</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/icon/>icon</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <section class="prose dark:prose-light">
 <h1 class="mb-3 text-4xl font-extrabold">icon</h1>
 <section></section>
 </section>
 </header>
 <section>
 <h2 class="mt-12 text-2xl font-bold first:mt-8">2020</h2>
 <hr class="border-gray-400 border-dotted w-36">
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/shortcodes/>Shortcodes</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/shortcodes/>Shortcodes</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-2
+2 mins
 mins
 </span>
 </div>
 </article>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/partials/>Partials</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/partials/>Partials</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-3
+3 mins
 mins
 </span>
 </div>
 </article>
@ -86,9 +95,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/tags/index.html
+++ b/tags/index.html
@ -9,10 +9,10 @@
 <link rel=canonical href=https://jpanther.github.io/Congo/tags/>
 <link rel=alternate type=application/rss+xml href=https://jpanther.github.io/Congo/tags/index.xml title=Congo>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="Tags">
 <meta property="og:description" content>
 <meta property="og:type" content="website">
@ -20,8 +20,6 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="Tags">
 <meta name=twitter:description content>
 <meta itemprop=name content="Tags">
 <meta itemprop=description content>
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -31,222 +29,232 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
 </header>
 <main class=flex-grow>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/>Tags</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <section class="prose dark:prose-light">
 <h1 class="mb-3 text-4xl font-extrabold">Tags</h1>
 <section></section>
 </section>
 </header>
 <section class="flex flex-wrap -mx-2 overflow-hidden">
 <article class="w-full px-2 my-3 overflow-hidden sm:w-1/2 md:w-1/3 lg:w-1/4 xl:w-1/5">
 <h2>
-<a class="text-xl font-medium hover:underline" href=https://jpanther.github.io/Congo/tags/advanced/>advanced</a>
+<a class="text-xl font-medium hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/tags/advanced/>advanced</a>
 <span class="text-base text-gray-400">
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 1
 </span>
 </h2>
 </article>
 <article class="w-full px-2 my-3 overflow-hidden sm:w-1/2 md:w-1/3 lg:w-1/4 xl:w-1/5">
 <h2>
-<a class="text-xl font-medium hover:underline" href=https://jpanther.github.io/Congo/tags/analytics/>analytics</a>
+<a class="text-xl font-medium hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/tags/analytics/>analytics</a>
 <span class="text-base text-gray-400">
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 1
 </span>
 </h2>
 </article>
 <article class="w-full px-2 my-3 overflow-hidden sm:w-1/2 md:w-1/3 lg:w-1/4 xl:w-1/5">
 <h2>
-<a class="text-xl font-medium hover:underline" href=https://jpanther.github.io/Congo/tags/comments/>comments</a>
+<a class="text-xl font-medium hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/tags/comments/>comments</a>
 <span class="text-base text-gray-400">
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 1
 </span>
 </h2>
 </article>
 <article class="w-full px-2 my-3 overflow-hidden sm:w-1/2 md:w-1/3 lg:w-1/4 xl:w-1/5">
 <h2>
-<a class="text-xl font-medium hover:underline" href=https://jpanther.github.io/Congo/tags/config/>config</a>
+<a class="text-xl font-medium hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/tags/config/>config</a>
 <span class="text-base text-gray-400">
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 2
 </span>
 </h2>
 </article>
 <article class="w-full px-2 my-3 overflow-hidden sm:w-1/2 md:w-1/3 lg:w-1/4 xl:w-1/5">
 <h2>
-<a class="text-xl font-medium hover:underline" href=https://jpanther.github.io/Congo/tags/css/>css</a>
+<a class="text-xl font-medium hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/tags/css/>css</a>
 <span class="text-base text-gray-400">
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 2
 </span>
 </h2>
 </article>
 <article class="w-full px-2 my-3 overflow-hidden sm:w-1/2 md:w-1/3 lg:w-1/4 xl:w-1/5">
 <h2>
-<a class="text-xl font-medium hover:underline" href=https://jpanther.github.io/Congo/tags/docs/>docs</a>
+<a class="text-xl font-medium hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/tags/docs/>docs</a>
 <span class="text-base text-gray-400">
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 8
 </span>
 </h2>
 </article>
 <article class="w-full px-2 my-3 overflow-hidden sm:w-1/2 md:w-1/3 lg:w-1/4 xl:w-1/5">
 <h2>
-<a class="text-xl font-medium hover:underline" href=https://jpanther.github.io/Congo/tags/emoji/>emoji</a>
+<a class="text-xl font-medium hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/tags/emoji/>emoji</a>
 <span class="text-base text-gray-400">
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 1
 </span>
 </h2>
 </article>
 <article class="w-full px-2 my-3 overflow-hidden sm:w-1/2 md:w-1/3 lg:w-1/4 xl:w-1/5">
 <h2>
-<a class="text-xl font-medium hover:underline" href=https://jpanther.github.io/Congo/tags/favicons/>favicons</a>
+<a class="text-xl font-medium hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/tags/favicons/>favicons</a>
 <span class="text-base text-gray-400">
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 1
 </span>
 </h2>
 </article>
 <article class="w-full px-2 my-3 overflow-hidden sm:w-1/2 md:w-1/3 lg:w-1/4 xl:w-1/5">
 <h2>
-<a class="text-xl font-medium hover:underline" href=https://jpanther.github.io/Congo/tags/front-matter/>front matter</a>
+<a class="text-xl font-medium hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/tags/front-matter/>front matter</a>
 <span class="text-base text-gray-400">
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 1
 </span>
 </h2>
 </article>
 <article class="w-full px-2 my-3 overflow-hidden sm:w-1/2 md:w-1/3 lg:w-1/4 xl:w-1/5">
 <h2>
-<a class="text-xl font-medium hover:underline" href=https://jpanther.github.io/Congo/tags/homepage/>homepage</a>
+<a class="text-xl font-medium hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/tags/homepage/>homepage</a>
 <span class="text-base text-gray-400">
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 1
 </span>
 </h2>
 </article>
 <article class="w-full px-2 my-3 overflow-hidden sm:w-1/2 md:w-1/3 lg:w-1/4 xl:w-1/5">
 <h2>
-<a class="text-xl font-medium hover:underline" href=https://jpanther.github.io/Congo/tags/html/>html</a>
+<a class="text-xl font-medium hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/tags/html/>html</a>
 <span class="text-base text-gray-400">
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 1
 </span>
 </h2>
 </article>
 <article class="w-full px-2 my-3 overflow-hidden sm:w-1/2 md:w-1/3 lg:w-1/4 xl:w-1/5">
 <h2>
-<a class="text-xl font-medium hover:underline" href=https://jpanther.github.io/Congo/tags/icon/>icon</a>
+<a class="text-xl font-medium hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/tags/icon/>icon</a>
 <span class="text-base text-gray-400">
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 2
 </span>
 </h2>
 </article>
 <article class="w-full px-2 my-3 overflow-hidden sm:w-1/2 md:w-1/3 lg:w-1/4 xl:w-1/5">
 <h2>
-<a class="text-xl font-medium hover:underline" href=https://jpanther.github.io/Congo/tags/installation/>installation</a>
+<a class="text-xl font-medium hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/tags/installation/>installation</a>
 <span class="text-base text-gray-400">
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 2
 </span>
 </h2>
 </article>
 <article class="w-full px-2 my-3 overflow-hidden sm:w-1/2 md:w-1/3 lg:w-1/4 xl:w-1/5">
 <h2>
-<a class="text-xl font-medium hover:underline" href=https://jpanther.github.io/Congo/tags/layouts/>layouts</a>
+<a class="text-xl font-medium hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/tags/layouts/>layouts</a>
 <span class="text-base text-gray-400">
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 1
 </span>
 </h2>
 </article>
 <article class="w-full px-2 my-3 overflow-hidden sm:w-1/2 md:w-1/3 lg:w-1/4 xl:w-1/5">
 <h2>
-<a class="text-xl font-medium hover:underline" href=https://jpanther.github.io/Congo/tags/lead/>lead</a>
+<a class="text-xl font-medium hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/tags/lead/>lead</a>
 <span class="text-base text-gray-400">
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 1
 </span>
 </h2>
 </article>
 <article class="w-full px-2 my-3 overflow-hidden sm:w-1/2 md:w-1/3 lg:w-1/4 xl:w-1/5">
 <h2>
-<a class="text-xl font-medium hover:underline" href=https://jpanther.github.io/Congo/tags/markdown/>markdown</a>
+<a class="text-xl font-medium hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/tags/markdown/>markdown</a>
 <span class="text-base text-gray-400">
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 1
 </span>
 </h2>
 </article>
 <article class="w-full px-2 my-3 overflow-hidden sm:w-1/2 md:w-1/3 lg:w-1/4 xl:w-1/5">
 <h2>
-<a class="text-xl font-medium hover:underline" href=https://jpanther.github.io/Congo/tags/mermaid/>mermaid</a>
+<a class="text-xl font-medium hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/tags/mermaid/>mermaid</a>
 <span class="text-base text-gray-400">
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 1
 </span>
 </h2>
 </article>
 <article class="w-full px-2 my-3 overflow-hidden sm:w-1/2 md:w-1/3 lg:w-1/4 xl:w-1/5">
 <h2>
-<a class="text-xl font-medium hover:underline" href=https://jpanther.github.io/Congo/tags/partials/>partials</a>
+<a class="text-xl font-medium hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/tags/partials/>partials</a>
 <span class="text-base text-gray-400">
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 1
 </span>
 </h2>
 </article>
 <article class="w-full px-2 my-3 overflow-hidden sm:w-1/2 md:w-1/3 lg:w-1/4 xl:w-1/5">
 <h2>
-<a class="text-xl font-medium hover:underline" href=https://jpanther.github.io/Congo/tags/privacy/>privacy</a>
+<a class="text-xl font-medium hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/tags/privacy/>privacy</a>
 <span class="text-base text-gray-400">
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 2
 </span>
 </h2>
 </article>
 <article class="w-full px-2 my-3 overflow-hidden sm:w-1/2 md:w-1/3 lg:w-1/4 xl:w-1/5">
 <h2>
-<a class="text-xl font-medium hover:underline" href=https://jpanther.github.io/Congo/tags/sample/>sample</a>
+<a class="text-xl font-medium hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/tags/sample/>sample</a>
 <span class="text-base text-gray-400">
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 4
 </span>
 </h2>
 </article>
 <article class="w-full px-2 my-3 overflow-hidden sm:w-1/2 md:w-1/3 lg:w-1/4 xl:w-1/5">
 <h2>
-<a class="text-xl font-medium hover:underline" href=https://jpanther.github.io/Congo/tags/shortcodes/>shortcodes</a>
+<a class="text-xl font-medium hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/tags/shortcodes/>shortcodes</a>
 <span class="text-base text-gray-400">
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 2
 </span>
 </h2>
 </article>
 <article class="w-full px-2 my-3 overflow-hidden sm:w-1/2 md:w-1/3 lg:w-1/4 xl:w-1/5">
 <h2>
-<a class="text-xl font-medium hover:underline" href=https://jpanther.github.io/Congo/tags/users/>users</a>
+<a class="text-xl font-medium hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/tags/users/>users</a>
 <span class="text-base text-gray-400">
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 1
 </span>
 </h2>
@ -260,9 +268,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/tags/installation/index.html
+++ b/tags/installation/index.html
@ -9,10 +9,10 @@
 <link rel=canonical href=https://jpanther.github.io/Congo/tags/installation/>
 <link rel=alternate type=application/rss+xml href=https://jpanther.github.io/Congo/tags/installation/index.xml title=Congo>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="installation">
 <meta property="og:description" content>
 <meta property="og:type" content="website">
@ -20,8 +20,6 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="installation">
 <meta name=twitter:description content>
 <meta itemprop=name content="installation">
 <meta itemprop=description content>
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -31,49 +29,60 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
 </header>
 <main class=flex-grow>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/>Tags</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/installation/>installation</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <section class="prose dark:prose-light">
 <h1 class="mb-3 text-4xl font-extrabold">installation</h1>
 <section></section>
 </section>
 </header>
 <section>
 <h2 class="mt-12 text-2xl font-bold first:mt-8">2020</h2>
 <hr class="border-gray-400 border-dotted w-36">
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/installation/>Installation</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/installation/>Installation</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-2
+2 mins
 mins
 </span>
 </div>
 </article>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/getting-started/>Getting Started</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/getting-started/>Getting Started</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-2
+2 mins
 mins
 </span>
 </div>
 </article>
@ -86,9 +95,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/tags/installation/index.xml
+++ b/tags/installation/index.xml
@ -4,4 +4,4 @@ Install Hugo # You can find specific instructions for your platform in the offic
 Make sure you are using Hugo version 0.86.1 or later as the theme takes advantage of some of the latest Hugo features.
 Create a new site # Run the command hugo new site mywebsite to create a new Hugo site in a folder named mywebsite.</description></item><item><title>Getting Started</title><link>https://jpanther.github.io/Congo/docs/getting-started/</link><pubDate>Sat, 15 Aug 2020 00:00:00 +0000</pubDate><guid>https://jpanther.github.io/Congo/docs/getting-started/</guid><description>This section assumes you have already installed the Congo theme. The config files that ship with Congo contain all of the possible settings that the theme recognises. By default, many of these are commented out but you can simply uncomment them to activate or change a specific feature.
 A few things you need to set for a new installation:
-# config/_default/config.toml baseURL = &amp;#34;https://your_domain.com&amp;#34; languageCode = &amp;#34;en-AU&amp;#34; title = &amp;#34;My awesome website&amp;#34; It&amp;rsquo;s also useful to set the author configuration in the config/_default/author.</description></item></channel></rss>
+# config/_default/config.toml baseURL = &amp;#34;https://your_domain.com&amp;#34; languageCode = &amp;#34;en-AU&amp;#34; title = &amp;#34;My awesome website&amp;#34; [author] name = &amp;#34;Your name&amp;#34; image = &amp;#34;img/author.</description></item></channel></rss>
--- a/tags/layouts/index.html
+++ b/tags/layouts/index.html
@ -9,10 +9,10 @@
 <link rel=canonical href=https://jpanther.github.io/Congo/tags/layouts/>
 <link rel=alternate type=application/rss+xml href=https://jpanther.github.io/Congo/tags/layouts/index.xml title=Congo>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="layouts">
 <meta property="og:description" content>
 <meta property="og:type" content="website">
@ -20,8 +20,6 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="layouts">
 <meta name=twitter:description content>
 <meta itemprop=name content="layouts">
 <meta itemprop=description content>
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -31,38 +29,50 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
 </header>
 <main class=flex-grow>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/>Tags</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/layouts/>layouts</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <section class="prose dark:prose-light">
 <h1 class="mb-3 text-4xl font-extrabold">layouts</h1>
 <section></section>
 </section>
 </header>
 <section>
 <h2 class="mt-12 text-2xl font-bold first:mt-8">2020</h2>
 <hr class="border-gray-400 border-dotted w-36">
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/homepage-layout/>Homepage Layout</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/homepage-layout/>Homepage Layout</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-2
+3 mins
 mins
 </span>
 </div>
 </article>
@ -75,9 +85,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/tags/lead/index.html
+++ b/tags/lead/index.html
@ -9,10 +9,10 @@
 <link rel=canonical href=https://jpanther.github.io/Congo/tags/lead/>
 <link rel=alternate type=application/rss+xml href=https://jpanther.github.io/Congo/tags/lead/index.xml title=Congo>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="lead">
 <meta property="og:description" content>
 <meta property="og:type" content="website">
@ -20,8 +20,6 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="lead">
 <meta name=twitter:description content>
 <meta itemprop=name content="lead">
 <meta itemprop=description content>
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -31,38 +29,50 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
 </header>
 <main class=flex-grow>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/>Tags</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/lead/>lead</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <section class="prose dark:prose-light">
 <h1 class="mb-3 text-4xl font-extrabold">lead</h1>
 <section></section>
 </section>
 </header>
 <section>
 <h2 class="mt-12 text-2xl font-bold first:mt-8">2020</h2>
 <hr class="border-gray-400 border-dotted w-36">
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/shortcodes/>Shortcodes</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/shortcodes/>Shortcodes</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-2
+2 mins
 mins
 </span>
 </div>
 </article>
@ -75,9 +85,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/tags/markdown/index.html
+++ b/tags/markdown/index.html
@ -9,10 +9,10 @@
 <link rel=canonical href=https://jpanther.github.io/Congo/tags/markdown/>
 <link rel=alternate type=application/rss+xml href=https://jpanther.github.io/Congo/tags/markdown/index.xml title=Congo>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="markdown">
 <meta property="og:description" content>
 <meta property="og:type" content="website">
@ -20,8 +20,6 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="markdown">
 <meta name=twitter:description content>
 <meta itemprop=name content="markdown">
 <meta itemprop=description content>
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -31,42 +29,54 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
 </header>
 <main class=flex-grow>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/>Tags</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/markdown/>markdown</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <section class="prose dark:prose-light">
 <h1 class="mb-3 text-4xl font-extrabold">markdown</h1>
 <section></section>
 </section>
 </header>
 <section>
 <h2 class="mt-12 text-2xl font-bold first:mt-8">2019</h2>
 <hr class="border-gray-400 border-dotted w-36">
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/samples/markdown-syntax/>Markdown Syntax Guide</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/samples/markdown-syntax/>Markdown Syntax Guide</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <time datetime="2019-03-11 00:00:00 +0000 UTC">
 11 March 2019
 </time>
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 <span title="Reading time">
-3
+3 mins
 mins
 </span>
 </div>
 </article>
@ -79,9 +89,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/tags/mermaid/index.html
+++ b/tags/mermaid/index.html
@ -9,10 +9,10 @@
 <link rel=canonical href=https://jpanther.github.io/Congo/tags/mermaid/>
 <link rel=alternate type=application/rss+xml href=https://jpanther.github.io/Congo/tags/mermaid/index.xml title=Congo>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="mermaid">
 <meta property="og:description" content>
 <meta property="og:type" content="website">
@ -20,8 +20,6 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="mermaid">
 <meta name=twitter:description content>
 <meta itemprop=name content="mermaid">
 <meta itemprop=description content>
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -31,38 +29,50 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
 </header>
 <main class=flex-grow>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/>Tags</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/mermaid/>mermaid</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <section class="prose dark:prose-light">
 <h1 class="mb-3 text-4xl font-extrabold">mermaid</h1>
 <section></section>
 </section>
 </header>
 <section>
 <h2 class="mt-12 text-2xl font-bold first:mt-8">2020</h2>
 <hr class="border-gray-400 border-dotted w-36">
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/shortcodes/>Shortcodes</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/shortcodes/>Shortcodes</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-2
+2 mins
 mins
 </span>
 </div>
 </article>
@ -75,9 +85,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/tags/partials/index.html
+++ b/tags/partials/index.html
@ -9,10 +9,10 @@
 <link rel=canonical href=https://jpanther.github.io/Congo/tags/partials/>
 <link rel=alternate type=application/rss+xml href=https://jpanther.github.io/Congo/tags/partials/index.xml title=Congo>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="partials">
 <meta property="og:description" content>
 <meta property="og:type" content="website">
@ -20,8 +20,6 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="partials">
 <meta name=twitter:description content>
 <meta itemprop=name content="partials">
 <meta itemprop=description content>
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -31,38 +29,50 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
 </header>
 <main class=flex-grow>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/>Tags</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/partials/>partials</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <section class="prose dark:prose-light">
 <h1 class="mb-3 text-4xl font-extrabold">partials</h1>
 <section></section>
 </section>
 </header>
 <section>
 <h2 class="mt-12 text-2xl font-bold first:mt-8">2020</h2>
 <hr class="border-gray-400 border-dotted w-36">
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/partials/>Partials</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/partials/>Partials</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-3
+3 mins
 mins
 </span>
 </div>
 </article>
@ -75,9 +85,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/tags/privacy/index.html
+++ b/tags/privacy/index.html
@ -9,10 +9,10 @@
 <link rel=canonical href=https://jpanther.github.io/Congo/tags/privacy/>
 <link rel=alternate type=application/rss+xml href=https://jpanther.github.io/Congo/tags/privacy/index.xml title=Congo>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="privacy">
 <meta property="og:description" content>
 <meta property="og:type" content="website">
@ -20,8 +20,6 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="privacy">
 <meta name=twitter:description content>
 <meta itemprop=name content="privacy">
 <meta itemprop=description content>
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -31,38 +29,50 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
 </header>
 <main class=flex-grow>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/>Tags</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/privacy/>privacy</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <section class="prose dark:prose-light">
 <h1 class="mb-3 text-4xl font-extrabold">privacy</h1>
 <section></section>
 </section>
 </header>
 <section>
 <h2 class="mt-12 text-2xl font-bold first:mt-8">2020</h2>
 <hr class="border-gray-400 border-dotted w-36">
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/partials/>Partials</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/partials/>Partials</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-3
+3 mins
 mins
 </span>
 </div>
 </article>
@ -70,16 +80,15 @@ mins
 <hr class="border-gray-400 border-dotted w-36">
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/samples/rich-content/>Rich Content</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/samples/rich-content/>Rich Content</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <time datetime="2019-03-10 00:00:00 +0000 UTC">
 10 March 2019
 </time>
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 <span title="Reading time">
-1
+1 min
 min
 </span>
 </div>
 </article>
@ -92,9 +101,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/tags/sample/index.html
+++ b/tags/sample/index.html
@ -9,10 +9,10 @@
 <link rel=canonical href=https://jpanther.github.io/Congo/tags/sample/>
 <link rel=alternate type=application/rss+xml href=https://jpanther.github.io/Congo/tags/sample/index.xml title=Congo>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="sample">
 <meta property="og:description" content>
 <meta property="og:type" content="website">
@ -20,8 +20,6 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="sample">
 <meta name=twitter:description content>
 <meta itemprop=name content="sample">
 <meta itemprop=description content>
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -31,87 +29,96 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
 </header>
 <main class=flex-grow>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/>Tags</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/sample/>sample</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <section class="prose dark:prose-light">
 <h1 class="mb-3 text-4xl font-extrabold">sample</h1>
 <section></section>
 </section>
 </header>
 <section>
 <h2 class="mt-12 text-2xl font-bold first:mt-8">2019</h2>
 <hr class="border-gray-400 border-dotted w-36">
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/samples/markdown-syntax/>Markdown Syntax Guide</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/samples/markdown-syntax/>Markdown Syntax Guide</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <time datetime="2019-03-11 00:00:00 +0000 UTC">
 11 March 2019
 </time>
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 <span title="Reading time">
-3
+3 mins
 mins
 </span>
 </div>
 </article>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/samples/rich-content/>Rich Content</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/samples/rich-content/>Rich Content</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <time datetime="2019-03-10 00:00:00 +0000 UTC">
 10 March 2019
 </time>
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 <span title="Reading time">
-1
+1 min
 min
 </span>
 </div>
 </article>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/samples/math-typesetting/>Math Typesetting</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/samples/math-typesetting/>Math Typesetting</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <time datetime="2019-03-08 00:00:00 +0000 UTC">
 8 March 2019
 </time>
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 <span title="Reading time">
-1
+1 min
 min
 </span>
 </div>
 </article>
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/samples/emoji-support/>Emoji Support</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/samples/emoji-support/>Emoji Support</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <time datetime="2019-03-05 00:00:00 +0000 UTC">
 5 March 2019
 </time>
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 <span title="Reading time">
-1
+1 min
 min
 </span>
 </div>
 </article>
@ -124,9 +131,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/tags/shortcodes/index.html
+++ b/tags/shortcodes/index.html
@ -9,10 +9,10 @@
 <link rel=canonical href=https://jpanther.github.io/Congo/tags/shortcodes/>
 <link rel=alternate type=application/rss+xml href=https://jpanther.github.io/Congo/tags/shortcodes/index.xml title=Congo>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="shortcodes">
 <meta property="og:description" content>
 <meta property="og:type" content="website">
@ -20,8 +20,6 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="shortcodes">
 <meta name=twitter:description content>
 <meta itemprop=name content="shortcodes">
 <meta itemprop=description content>
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -31,38 +29,50 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
 </header>
 <main class=flex-grow>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/>Tags</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/shortcodes/>shortcodes</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <section class="prose dark:prose-light">
 <h1 class="mb-3 text-4xl font-extrabold">shortcodes</h1>
 <section></section>
 </section>
 </header>
 <section>
 <h2 class="mt-12 text-2xl font-bold first:mt-8">2020</h2>
 <hr class="border-gray-400 border-dotted w-36">
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/docs/shortcodes/>Shortcodes</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/docs/shortcodes/>Shortcodes</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <span title="Reading time">
-2
+2 mins
 mins
 </span>
 </div>
 </article>
@ -70,16 +80,15 @@ mins
 <hr class="border-gray-400 border-dotted w-36">
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/samples/rich-content/>Rich Content</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/samples/rich-content/>Rich Content</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 <time datetime="2019-03-10 00:00:00 +0000 UTC">
 10 March 2019
 </time>
-<span class=px-1>&#183;</span>
+<span class="px-1 text-primary-500">&#183;</span>
 <span title="Reading time">
-1
+1 min
 min
 </span>
 </div>
 </article>
@ -92,9 +101,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/tags/users/index.html
+++ b/tags/users/index.html
@ -9,10 +9,10 @@
 <link rel=canonical href=https://jpanther.github.io/Congo/tags/users/>
 <link rel=alternate type=application/rss+xml href=https://jpanther.github.io/Congo/tags/users/index.xml title=Congo>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="users">
 <meta property="og:description" content>
 <meta property="og:type" content="website">
@ -20,8 +20,6 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="users">
 <meta name=twitter:description content>
 <meta itemprop=name content="users">
 <meta itemprop=description content>
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -31,33 +29,46 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
 </header>
 <main class=flex-grow>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class=inline>
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/>Tags</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/tags/users/>users</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <section class="prose dark:prose-light">
 <h1 class="mb-3 text-4xl font-extrabold">users</h1>
 <section></section>
 </section>
 </header>
 <section>
 <h2 class="mt-12 text-2xl font-bold first:mt-8">2020</h2>
 <hr class="border-gray-400 border-dotted w-36">
 <article>
 <h3 class="mt-6 text-xl font-semibold">
-<a class=hover:underline href=https://jpanther.github.io/Congo/users/>Users</a>
+<a class="hover:underline underline-primary-500" href=https://jpanther.github.io/Congo/users/>Users</a>
 </h3>
 <div class="text-sm text-gray-400 dark:text-gray-500">
 </div>
@ -71,9 +82,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>
--- a/users/index.html
+++ b/users/index.html
@ -8,10 +8,10 @@
 <meta name=description content="Some real life Congo examples.">
 <link rel=canonical href=https://jpanther.github.io/Congo/users/>
 <link type=text/css rel=stylesheet href=https://jpanther.github.io/Congo/css/main.css>
-<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/apple-touch-icon.png>
+<link rel=apple-touch-icon sizes=180x180 href=https://jpanther.github.io/Congo/apple-touch-icon.png>
-<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/favicon-32x32.png>
+<link rel=icon type=image/png sizes=32x32 href=https://jpanther.github.io/Congo/favicon-32x32.png>
-<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/favicon-16x16.png>
+<link rel=icon type=image/png sizes=16x16 href=https://jpanther.github.io/Congo/favicon-16x16.png>
-<link rel=manifest href=https://jpanther.github.io/site.webmanifest>
+<link rel=manifest href=https://jpanther.github.io/Congo/site.webmanifest>
 <meta property="og:title" content="Users">
 <meta property="og:description" content="Some real life Congo examples.">
 <meta property="og:type" content="article">
@ -21,11 +21,7 @@
 <meta name=twitter:card content="summary">
 <meta name=twitter:title content="Users">
 <meta name=twitter:description content="Some real life Congo examples.">
-<meta itemprop=name content="Users">
+<script type=application/ld+json>{"@context":"https://schema.org","@type":"BlogPosting","articleSection":"Welcome to Congo! :tada:","name":"Users","headline":"Users","description":"Some real life Congo examples.","inLanguage":"en-AU","author":{"@type":"Person","name":"Congo"},"creator":{"@type":"Person","name":"Congo"},"copyrightHolder":"Congo","copyrightYear":"2020","dateCreated":"2020-08-14T00:00:00\u002b00:00","datePublished":"2020-08-14T00:00:00\u002b00:00","dateModified":"2020-08-14T00:00:00\u002b00:00","url":"https:\/\/jpanther.github.io\/Congo\/users\/","wordCount":"22","keywords":["users"]}</script>
 <meta itemprop=description content="Some real life Congo examples."><meta itemprop=datePublished content="2020-08-14T00:00:00+00:00">
 <meta itemprop=dateModified content="2020-08-14T00:00:00+00:00">
 <meta itemprop=wordCount content="22">
 <meta itemprop=keywords content="users,">
 <meta name=generator content="Hugo 0.87.0">
 <meta name=author content="Congo">
 <link href=https://twitter.com/ rel=me>
@ -35,18 +31,18 @@
 </head>
 <body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-white text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10">
 <div>
-<a class=hover:underline rel=me href=https://jpanther.github.io/Congo/>Congo</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" rel=me href=https://jpanther.github.io/Congo/>Congo</a>
 </div>
 <nav>
 <ul class="flex flex-col list-none sm:flex-row">
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/docs/ title=Documentation>Docs</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/docs/ title=Documentation>Docs</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=/Congo/samples/ title="Content Samples">Samples</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://jpanther.github.io/Congo/samples/ title="Content Samples">Samples</a>
 </li>
 <li class="text-right sm:mr-7 sm:last:mr-0">
-<a class=hover:underline href=https://github.com/jpanther/Congo title>GitHub</a>
+<a class="hover:underline underline-primary-500 underline-thickness-bold underline-offset-small" href=https://github.com/jpanther/Congo title>GitHub</a>
 </li>
 </ul>
 </nav>
@ -54,6 +50,14 @@
 <main class=flex-grow>
 <article class=max-w-prose>
 <header>
 <ol class="text-sm text-gray-400 dark:text-gray-500">
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
 </li>
 <li class="inline hidden">
 <a class="hover:underline underline-gray-300 dark:underline-gray-600" href=https://jpanther.github.io/Congo/users/>Users</a><span class="px-1 text-primary-500">/</span>
 </li>
 </ol>
 <h1 class="mt-0 text-4xl font-extrabold">Users</h1>
 <div class="mt-8 mb-12 text-base text-gray-400 dark:text-gray-500">
 </div>
@ -83,9 +87,9 @@ Congo
 </p>
 <p class="text-xs text-gray-300 dark:text-gray-600">
 Powered by
-<a class=hover:underline href=https://gohugo.io/ target=_blank>Hugo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank>Hugo</a>
 &
-<a class=hover:underline href=https://git.io/hugo-congo target=_blank>Congo</a>
+<a class="hover:underline underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank>Congo</a>
 </p>
 </footer>
 </body>