🔀 Merge branch 'dev' into stable

.gitignore

@@ -140,3 +140,4 @@ hugo.linux
 # End of https://www.toptal.com/developers/gitignore/api/hugo
 
 exampleSite/public/
+TODO

README.md

@@ -2,140 +2,90 @@
 
 Congo is designed to be a fast, lightweight theme for Hugo. It's based upon Tailwind CSS with a clean and minimalist design.
 
+🌏 [Demo site](https://jpanther.github.io/Congo/)  
+📑 [Theme documentation](https://jpanther.github.io/Congo/docs/)
+
+![Screenshot](https://raw.githubusercontent.com/jpanther/Congo/stable/images/screenshot.png)
+
 ## Features
 
-- Built with [Tailwind CSS JIT](https://tailwindcss.com/docs/just-in-time-mode) for minified stylesheets without any excess code
+- Built with Tailwind CSS JIT for minified stylesheets without any excess code
-- Theme can be easily edited using simple [Tailwind colour definitions and styles](https://tailwindcss.com/docs)
+- Fully responsive layout
-- Dark mode support (auto-switching based upon browser)
+- Dark mode (auto-switching based upon browser)
-- Highly customisable [configuration](#configuration)
+- Highly customisable configuration
-- Custom content types and menus
+- Multiple homepage layouts
-- Custom taxonomies
+- Flexible with any content types, taxonomies and menus
-- SVG social icons from [FontAwesome 5](https://fontawesome.com/)
+- Ability to link to posts on third-party websites
-- SEO friendly
+- Diagrams and visualisations using Mermaid JS
-- [Fathom Analytics](https://usefathom.com/ref/RLAJSV) and Google Analytics
+- SVG icons from FontAwesome 5
-- Favicons support - Generate using [favicon.io](https://favicon.io)
+- Heading anchors, Buttons, Badges and more
-- [Comments support](https://gohugo.io/content-management/comments/)
+- HTML and Emoji support in articles
+- SEO friendly with links for sharing to social media
+- RSS feeds
+- Fathom Analytics and Google Analytics support
+- Favicons support
+- Comments support
+- Advanced customisation using simple Tailwind colour definitions and styles
+- [Fully documented](https://jpanther.github.io/Congo/docs/)
+
+---
 
 ## Installation
 
-Simply follow the standard Hugo [Quick Start](https://gohugo.io/getting-started/quick-start/) procedure to get up and running quickly.
+This is a simplified set of instructions and assumes a basic understanding of building Hugo sites and installing themes. For detailed instructions, refer to the full [theme documentation](https://jpanther.github.io/Congo/docs/).
-
-Detailed instructions can be found below.
-
-### 1. Install Hugo
-
-You can find specific instructions for your platform in the official [Hugo docs](https://gohugo.io/getting-started/installing.).
-
-Make sure you are using **Hugo version 0.86.1** or later as the theme takes advantage of some of the latest Hugo features.
-
-### 2. Create a new site
-
-Run the command `hugo new site mywebsite` to create a new Hugo site in a folder named `mywebsite`.
-
-### 3. Download the Congo theme
 
 There are a couple of ways to install the Congo theme into your Hugo website. The git method is the easiest to keep the theme up-to-date, but you can also download and install manually if you don't have git available.
 
-#### Install using git
+### Install using git
 
 Change into the directory for your Hugo website, initialise a new repository and add Congo as a submodule.
 
 ```bash
 cd mywebsite
 git init
-git submodule add https://github.com/jpanther/Congo.git themes/congo
+git submodule add -b stable https://github.com/jpanther/Congo.git themes/congo
 ```
 
-_**Note:** You need to substitute `mywebsite` for the correct folder name you used in Step 2._
+### Install manually
 
-#### Install manually
+Download the latest release of the theme from: [https://github.com/jpanther/Congo/releases](https://github.com/jpanther/Congo/releases)
 
-Download the latest version of the theme from: [https://github.com/jpanther/Congo/archive/master.zip](https://github.com/jpanther/Congo/archive/master.zip)
+Extract the archive, rename the folder to `congo` and move it to the `themes/` directory inside your Hugo project.
 
-Extract the archive and you should have a folder named `Congo-master`.
+### Set up your configuration files
 
-Rename the folder to `congo` and move it to the `themes/` directory inside your `mywebsite` folder.
+In the root folder of your website, delete the `config.toml` file that was generated by Hugo. Copy the entire `config` folder from `themes/congo/config/` into the root of your website. This will ensure you have all the correct theme settings and will enable you to easily customise the theme.
-
-_**Note:** You need to substitute `mywebsite` for the correct folder name you used in Step 2._
-
-### 4. Add Congo to your configuration file
-
-Open the `config.toml` file in the root of your website and add `theme = "congo"`
 
 You're now all set up to use Congo. From here you can add some content and start the Hugo server.
 
-Refer to the Hugo docs for more information or read the next section to learn more about configuring the theme.
-
 ## Configuration
 
-Congo is a highly customisable theme and uses some of the latest Hugo features to simplify how it is configured.
+For all the theme options and detailed configuration instructions, refer to the [Congo docs](https://jpanther.github.io/Congo/docs/).
-
-The theme ships with a default configuration that gets you up and running with a basic blog or static website. This default configuration can be found in the `themes/congo/config/_default/` folder.
-
-> 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 as you wish.
-
-The default theme configuration can be overridden on a per-setting basis by copying the relevant setting from the `themes/congo/config/_default/` to your `config.toml` file in the root of your website. Any settings in your config file will take precedence over the theme defaults.
-
-### Getting started
-
-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:
 
 ```toml
-# config.toml
+# config/_default/config.toml
 
-theme = "congo"
 baseURL = "https://your_domain.com"
 languageCode = "en-AU"
 
 title = "My awesome website"
 ```
 
-It's also useful to add an author configuration by copying the settings from the `themes/congo/config/_default/author.toml` file. You can also add links to your profiles here to enable them in the theme.
+It's also useful to set the author configuration in the `config/_default/author.toml` file. You can also add links to your profiles here to enable them in the theme.
 
 ```toml
-# config.toml
+# config/_default/author.toml
 
 [author]
 name = "Your name"
-twitter = "https://twitter.com/username"
+links = [
+  { twitter = "https://twitter.com/username" }
+]
 ```
 
-### Organising content
+## Advanced customisation
-
-By default, Congo doesn'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 _pages_ for a static site, _posts_ for a blog, or _projects_ for a portfolio.
-
-The same logic applies to taxonomies. Some people prefer to use _tags_ and _categories_, others prefer to use _topics_.
-
-Hugo defaults to using posts, tags and categories out of the box and this will work fine if that's what you want. If you wish to customise this, however, you can do so by creating the following files:
-
-```toml
-# config.toml
-
-[taxonomies]
-topic = "topics"
-```
-
-This will replace the default _tags_ and _categories_ with _topics_. Refer to the [Hugo Taxonomy docs](https://gohugo.io/content-management/taxonomies/) for more information on naming taxonomies.
-
-When you create a new taxonomy, you will need to adjust the navigation links on the website to point to the new sections:
-
-```toml
-# config.toml
-
-[[menu.main]]
-  name = "Blog"
-  pageRef = "/posts/"
-  weight = 10
-
-[[menu.main]]
-  name = "Topics"
-  pageRef = "/topics/"
-  weight = 20
-```
-
-## Customising the theme
 
 There are a couple of ways you can make style changes to Congo.
 
@@ -190,6 +140,8 @@ npm run dev
 
 Now whenever you make a change, the (non-minified) CSS files will be rebuilt automatically. This mode is useful to run when using `hugo server` to preview your site during development. Remember to perform a full build before publishing your website.
 
+---
+
 ## Contributing
 
 Congo is still very much a work in progress. I intend to keep adding features and making changes as required.
@@ -199,3 +151,5 @@ Congo is still very much a work in progress. I intend to keep adding features an
 Feel free to get in touch with any issues or suggestions for new features you'd like to see. Please use GitHub issues for all bug reports and suggestions to help keep everything in one spot.
 
 If you're able to fix a bug or implement a new feature, I welcome PRs for this purpose.
+
+All development occurs on the `dev` branch and new PRs should be forked from here.

assets/css/main.css

@@ -9,20 +9,22 @@
 
 /* Heading anchors */
 .prose .heading-anchor {
-  @apply absolute top-0 w-6 no-underline opacity-0 -left-6;
+  @apply absolute top-0 no-underline opacity-0;
+  width: 1.1em;
+  left: -1.1em;
 }
 .prose .heading-anchor:hover {
-  @apply underline bg-transparent opacity-100 text-primary-600;
+  @apply underline bg-transparent text-primary-600;
 }
-.prose h2:focus > .heading-anchor,
+.prose .heading-anchor:hover,
+.prose .heading-anchor:focus,
 .prose h2:hover > .heading-anchor,
-.prose h3:focus > .heading-anchor,
 .prose h3:hover > .heading-anchor,
-.prose h4:focus > .heading-anchor,
 .prose h4:hover > .heading-anchor {
   @apply opacity-100;
 }
 
+/* Prose escape hatch */
 .no-prose > p {
   @apply mt-0 last:mb-0;
 }

assets/icons/codepen.svg

@@ -0,0 +1 @@
+<svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="codepen" class="svg-inline--fa fa-codepen fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M502.285 159.704l-234-156c-7.987-4.915-16.511-4.96-24.571 0l-234 156C3.714 163.703 0 170.847 0 177.989v155.999c0 7.143 3.714 14.286 9.715 18.286l234 156.022c7.987 4.915 16.511 4.96 24.571 0l234-156.022c6-3.999 9.715-11.143 9.715-18.286V177.989c-.001-7.142-3.715-14.286-9.716-18.285zM278 63.131l172.286 114.858-76.857 51.429L278 165.703V63.131zm-44 0v102.572l-95.429 63.715-76.857-51.429L234 63.131zM44 219.132l55.143 36.857L44 292.846v-73.714zm190 229.715L61.714 333.989l76.857-51.429L234 346.275v102.572zm22-140.858l-77.715-52 77.715-52 77.715 52-77.715 52zm22 140.858V346.275l95.429-63.715 76.857 51.429L278 448.847zm190-156.001l-55.143-36.857L468 219.132v73.714z"></path></svg>

assets/icons/dev.svg

@@ -0,0 +1 @@
+<svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="dev" class="svg-inline--fa fa-dev fa-w-14" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M120.12 208.29c-3.88-2.9-7.77-4.35-11.65-4.35H91.03v104.47h17.45c3.88 0 7.77-1.45 11.65-4.35 3.88-2.9 5.82-7.25 5.82-13.06v-69.65c-.01-5.8-1.96-10.16-5.83-13.06zM404.1 32H43.9C19.7 32 .06 51.59 0 75.8v360.4C.06 460.41 19.7 480 43.9 480h360.2c24.21 0 43.84-19.59 43.9-43.8V75.8c-.06-24.21-19.7-43.8-43.9-43.8zM154.2 291.19c0 18.81-11.61 47.31-48.36 47.25h-46.4V172.98h47.38c35.44 0 47.36 28.46 47.37 47.28l.01 70.93zm100.68-88.66H201.6v38.42h32.57v29.57H201.6v38.41h53.29v29.57h-62.18c-11.16.29-20.44-8.53-20.72-19.69V193.7c-.27-11.15 8.56-20.41 19.71-20.69h63.19l-.01 29.52zm103.64 115.29c-13.2 30.75-36.85 24.63-47.44 0l-38.53-144.8h32.57l29.71 113.72 29.57-113.72h32.58l-38.46 144.8z"></path></svg>

assets/icons/discord.svg

@@ -0,0 +1 @@
+<svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="discord" class="svg-inline--fa fa-discord fa-w-20" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><path fill="currentColor" d="M524.531,69.836a1.5,1.5,0,0,0-.764-.7A485.065,485.065,0,0,0,404.081,32.03a1.816,1.816,0,0,0-1.923.91,337.461,337.461,0,0,0-14.9,30.6,447.848,447.848,0,0,0-134.426,0,309.541,309.541,0,0,0-15.135-30.6,1.89,1.89,0,0,0-1.924-.91A483.689,483.689,0,0,0,116.085,69.137a1.712,1.712,0,0,0-.788.676C39.068,183.651,18.186,294.69,28.43,404.354a2.016,2.016,0,0,0,.765,1.375A487.666,487.666,0,0,0,176.02,479.918a1.9,1.9,0,0,0,2.063-.676A348.2,348.2,0,0,0,208.12,430.4a1.86,1.86,0,0,0-1.019-2.588,321.173,321.173,0,0,1-45.868-21.853,1.885,1.885,0,0,1-.185-3.126c3.082-2.309,6.166-4.711,9.109-7.137a1.819,1.819,0,0,1,1.9-.256c96.229,43.917,200.41,43.917,295.5,0a1.812,1.812,0,0,1,1.924.233c2.944,2.426,6.027,4.851,9.132,7.16a1.884,1.884,0,0,1-.162,3.126,301.407,301.407,0,0,1-45.89,21.83,1.875,1.875,0,0,0-1,2.611,391.055,391.055,0,0,0,30.014,48.815,1.864,1.864,0,0,0,2.063.7A486.048,486.048,0,0,0,610.7,405.729a1.882,1.882,0,0,0,.765-1.352C623.729,277.594,590.933,167.465,524.531,69.836ZM222.491,337.58c-28.972,0-52.844-26.587-52.844-59.239S193.056,219.1,222.491,219.1c29.665,0,53.306,26.82,52.843,59.239C275.334,310.993,251.924,337.58,222.491,337.58Zm195.38,0c-28.971,0-52.843-26.587-52.843-59.239S388.437,219.1,417.871,219.1c29.667,0,53.307,26.82,52.844,59.239C470.715,310.993,447.538,337.58,417.871,337.58Z"></path></svg>

assets/icons/dribbble.svg

@@ -0,0 +1 @@
+<svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="dribbble" class="svg-inline--fa fa-dribbble fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M256 8C119.252 8 8 119.252 8 256s111.252 248 248 248 248-111.252 248-248S392.748 8 256 8zm163.97 114.366c29.503 36.046 47.369 81.957 47.835 131.955-6.984-1.477-77.018-15.682-147.502-6.818-5.752-14.041-11.181-26.393-18.617-41.614 78.321-31.977 113.818-77.482 118.284-83.523zM396.421 97.87c-3.81 5.427-35.697 48.286-111.021 76.519-34.712-63.776-73.185-116.168-79.04-124.008 67.176-16.193 137.966 1.27 190.061 47.489zm-230.48-33.25c5.585 7.659 43.438 60.116 78.537 122.509-99.087 26.313-186.36 25.934-195.834 25.809C62.38 147.205 106.678 92.573 165.941 64.62zM44.17 256.323c0-2.166.043-4.322.108-6.473 9.268.19 111.92 1.513 217.706-30.146 6.064 11.868 11.857 23.915 17.174 35.949-76.599 21.575-146.194 83.527-180.531 142.306C64.794 360.405 44.17 310.73 44.17 256.323zm81.807 167.113c22.127-45.233 82.178-103.622 167.579-132.756 29.74 77.283 42.039 142.053 45.189 160.638-68.112 29.013-150.015 21.053-212.768-27.882zm248.38 8.489c-2.171-12.886-13.446-74.897-41.152-151.033 66.38-10.626 124.7 6.768 131.947 9.055-9.442 58.941-43.273 109.844-90.795 141.978z"></path></svg>

assets/icons/email.svg

@@ -0,0 +1 @@
+<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="at" class="svg-inline--fa fa-at fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M256 8C118.941 8 8 118.919 8 256c0 137.059 110.919 248 248 248 48.154 0 95.342-14.14 135.408-40.223 12.005-7.815 14.625-24.288 5.552-35.372l-10.177-12.433c-7.671-9.371-21.179-11.667-31.373-5.129C325.92 429.757 291.314 440 256 440c-101.458 0-184-82.542-184-184S154.542 72 256 72c100.139 0 184 57.619 184 160 0 38.786-21.093 79.742-58.17 83.693-17.349-.454-16.91-12.857-13.476-30.024l23.433-121.11C394.653 149.75 383.308 136 368.225 136h-44.981a13.518 13.518 0 0 0-13.432 11.993l-.01.092c-14.697-17.901-40.448-21.775-59.971-21.775-74.58 0-137.831 62.234-137.831 151.46 0 65.303 36.785 105.87 96 105.87 26.984 0 57.369-15.637 74.991-38.333 9.522 34.104 40.613 34.103 70.71 34.103C462.609 379.41 504 307.798 504 232 504 95.653 394.023 8 256 8zm-21.68 304.43c-22.249 0-36.07-15.623-36.07-40.771 0-44.993 30.779-72.729 58.63-72.729 22.292 0 35.601 15.241 35.601 40.77 0 45.061-33.875 72.73-58.161 72.73z"></path></svg>

assets/icons/facebook.svg

@@ -0,0 +1 @@
+<svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="facebook" class="svg-inline--fa fa-facebook fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M504 256C504 119 393 8 256 8S8 119 8 256c0 123.78 90.69 226.38 209.25 245V327.69h-63V256h63v-54.64c0-62.15 37-96.48 93.67-96.48 27.14 0 55.52 4.84 55.52 4.84v61h-31.28c-30.8 0-40.41 19.12-40.41 38.73V256h68.78l-11 71.69h-57.78V501C413.31 482.38 504 379.78 504 256z"></path></svg>

assets/icons/gitlab.svg

@@ -0,0 +1 @@
+<svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="gitlab" class="svg-inline--fa fa-gitlab fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M105.2 24.9c-3.1-8.9-15.7-8.9-18.9 0L29.8 199.7h132c-.1 0-56.6-174.8-56.6-174.8zM.9 287.7c-2.6 8 .3 16.9 7.1 22l247.9 184-226.2-294zm160.8-88l94.3 294 94.3-294zm349.4 88l-28.8-88-226.3 294 247.9-184c6.9-5.1 9.7-14 7.2-22zM425.7 24.9c-3.1-8.9-15.7-8.9-18.9 0l-56.6 174.8h132z"></path></svg>

assets/icons/instagram.svg

@@ -0,0 +1 @@
+<svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="instagram" class="svg-inline--fa fa-instagram fa-w-14" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M224.1 141c-63.6 0-114.9 51.3-114.9 114.9s51.3 114.9 114.9 114.9S339 319.5 339 255.9 287.7 141 224.1 141zm0 189.6c-41.1 0-74.7-33.5-74.7-74.7s33.5-74.7 74.7-74.7 74.7 33.5 74.7 74.7-33.6 74.7-74.7 74.7zm146.4-194.3c0 14.9-12 26.8-26.8 26.8-14.9 0-26.8-12-26.8-26.8s12-26.8 26.8-26.8 26.8 12 26.8 26.8zm76.1 27.2c-1.7-35.9-9.9-67.7-36.2-93.9-26.2-26.2-58-34.4-93.9-36.2-37-2.1-147.9-2.1-184.9 0-35.8 1.7-67.6 9.9-93.9 36.1s-34.4 58-36.2 93.9c-2.1 37-2.1 147.9 0 184.9 1.7 35.9 9.9 67.7 36.2 93.9s58 34.4 93.9 36.2c37 2.1 147.9 2.1 184.9 0 35.9-1.7 67.7-9.9 93.9-36.2 26.2-26.2 34.4-58 36.2-93.9 2.1-37 2.1-147.8 0-184.8zM398.8 388c-7.8 19.6-22.9 34.7-42.6 42.6-29.5 11.7-99.5 9-132.1 9s-102.7 2.6-132.1-9c-19.6-7.8-34.7-22.9-42.6-42.6-11.7-29.5-9-99.5-9-132.1s-2.6-102.7 9-132.1c7.8-19.6 22.9-34.7 42.6-42.6 29.5-11.7 99.5-9 132.1-9s102.7-2.6 132.1 9c19.6 7.8 34.7 22.9 42.6 42.6 11.7 29.5 9 99.5 9 132.1s2.7 102.7-9 132.1z"></path></svg>

assets/icons/lastfm.svg

@@ -0,0 +1 @@
+<svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="lastfm" class="svg-inline--fa fa-lastfm fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M225.8 367.1l-18.8-51s-30.5 34-76.2 34c-40.5 0-69.2-35.2-69.2-91.5 0-72.1 36.4-97.9 72.1-97.9 66.5 0 74.8 53.3 100.9 134.9 18.8 56.9 54 102.6 155.4 102.6 72.7 0 122-22.3 122-80.9 0-72.9-62.7-80.6-115-92.1-25.8-5.9-33.4-16.4-33.4-34 0-19.9 15.8-31.7 41.6-31.7 28.2 0 43.4 10.6 45.7 35.8l58.6-7c-4.7-52.8-41.1-74.5-100.9-74.5-52.8 0-104.4 19.9-104.4 83.9 0 39.9 19.4 65.1 68 76.8 44.9 10.6 79.8 13.8 79.8 45.7 0 21.7-21.1 30.5-61 30.5-59.2 0-83.9-31.1-97.9-73.9-32-96.8-43.6-163-161.3-163C45.7 113.8 0 168.3 0 261c0 89.1 45.7 137.2 127.9 137.2 66.2 0 97.9-31.1 97.9-31.1z"></path></svg>

assets/icons/link.svg

@@ -0,0 +1 @@
+<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="link" class="svg-inline--fa fa-link fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M326.612 185.391c59.747 59.809 58.927 155.698.36 214.59-.11.12-.24.25-.36.37l-67.2 67.2c-59.27 59.27-155.699 59.262-214.96 0-59.27-59.26-59.27-155.7 0-214.96l37.106-37.106c9.84-9.84 26.786-3.3 27.294 10.606.648 17.722 3.826 35.527 9.69 52.721 1.986 5.822.567 12.262-3.783 16.612l-13.087 13.087c-28.026 28.026-28.905 73.66-1.155 101.96 28.024 28.579 74.086 28.749 102.325.51l67.2-67.19c28.191-28.191 28.073-73.757 0-101.83-3.701-3.694-7.429-6.564-10.341-8.569a16.037 16.037 0 0 1-6.947-12.606c-.396-10.567 3.348-21.456 11.698-29.806l21.054-21.055c5.521-5.521 14.182-6.199 20.584-1.731a152.482 152.482 0 0 1 20.522 17.197zM467.547 44.449c-59.261-59.262-155.69-59.27-214.96 0l-67.2 67.2c-.12.12-.25.25-.36.37-58.566 58.892-59.387 154.781.36 214.59a152.454 152.454 0 0 0 20.521 17.196c6.402 4.468 15.064 3.789 20.584-1.731l21.054-21.055c8.35-8.35 12.094-19.239 11.698-29.806a16.037 16.037 0 0 0-6.947-12.606c-2.912-2.005-6.64-4.875-10.341-8.569-28.073-28.073-28.191-73.639 0-101.83l67.2-67.19c28.239-28.239 74.3-28.069 102.325.51 27.75 28.3 26.872 73.934-1.155 101.96l-13.087 13.087c-4.35 4.35-5.769 10.79-3.783 16.612 5.864 17.194 9.042 34.999 9.69 52.721.509 13.906 17.454 20.446 27.294 10.606l37.106-37.106c59.271-59.259 59.271-155.699.001-214.959z"></path></svg>

assets/icons/mastodon.svg

@@ -0,0 +1 @@
+<svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="mastodon" class="svg-inline--fa fa-mastodon fa-w-14" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M433 179.11c0-97.2-63.71-125.7-63.71-125.7-62.52-28.7-228.56-28.4-290.48 0 0 0-63.72 28.5-63.72 125.7 0 115.7-6.6 259.4 105.63 289.1 40.51 10.7 75.32 13 103.33 11.4 50.81-2.8 79.32-18.1 79.32-18.1l-1.7-36.9s-36.31 11.4-77.12 10.1c-40.41-1.4-83-4.4-89.63-54a102.54 102.54 0 0 1-.9-13.9c85.63 20.9 158.65 9.1 178.75 6.7 56.12-6.7 105-41.3 111.23-72.9 9.8-49.8 9-121.5 9-121.5zm-75.12 125.2h-46.63v-114.2c0-49.7-64-51.6-64 6.9v62.5h-46.33V197c0-58.5-64-56.6-64-6.9v114.2H90.19c0-122.1-5.2-147.9 18.41-175 25.9-28.9 79.82-30.8 103.83 6.1l11.6 19.5 11.6-19.5c24.11-37.1 78.12-34.8 103.83-6.1 23.71 27.3 18.4 53 18.4 175z"></path></svg>

assets/icons/medium.svg

@@ -0,0 +1 @@
+<svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="medium" class="svg-inline--fa fa-medium fa-w-14" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M0 32v448h448V32H0zm372.2 106.1l-24 23c-2.1 1.6-3.1 4.2-2.7 6.7v169.3c-.4 2.6.6 5.2 2.7 6.7l23.5 23v5.1h-118V367l24.3-23.6c2.4-2.4 2.4-3.1 2.4-6.7V199.8l-67.6 171.6h-9.1L125 199.8v115c-.7 4.8 1 9.7 4.4 13.2l31.6 38.3v5.1H71.2v-5.1l31.6-38.3c3.4-3.5 4.9-8.4 4.1-13.2v-133c.4-3.7-1-7.3-3.8-9.8L75 138.1V133h87.3l67.4 148L289 133.1h83.2v5z"></path></svg>

assets/icons/reddit.svg

@@ -0,0 +1 @@
+<svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="reddit" class="svg-inline--fa fa-reddit fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M201.5 305.5c-13.8 0-24.9-11.1-24.9-24.6 0-13.8 11.1-24.9 24.9-24.9 13.6 0 24.6 11.1 24.6 24.9 0 13.6-11.1 24.6-24.6 24.6zM504 256c0 137-111 248-248 248S8 393 8 256 119 8 256 8s248 111 248 248zm-132.3-41.2c-9.4 0-17.7 3.9-23.8 10-22.4-15.5-52.6-25.5-86.1-26.6l17.4-78.3 55.4 12.5c0 13.6 11.1 24.6 24.6 24.6 13.8 0 24.9-11.3 24.9-24.9s-11.1-24.9-24.9-24.9c-9.7 0-18 5.8-22.1 13.8l-61.2-13.6c-3-.8-6.1 1.4-6.9 4.4l-19.1 86.4c-33.2 1.4-63.1 11.3-85.5 26.8-6.1-6.4-14.7-10.2-24.1-10.2-34.9 0-46.3 46.9-14.4 62.8-1.1 5-1.7 10.2-1.7 15.5 0 52.6 59.2 95.2 132 95.2 73.1 0 132.3-42.6 132.3-95.2 0-5.3-.6-10.8-1.9-15.8 31.3-16 19.8-62.5-14.9-62.5zM302.8 331c-18.2 18.2-76.1 17.9-93.6 0-2.2-2.2-6.1-2.2-8.3 0-2.5 2.5-2.5 6.4 0 8.6 22.8 22.8 87.3 22.8 110.2 0 2.5-2.2 2.5-6.1 0-8.6-2.2-2.2-6.1-2.2-8.3 0zm7.7-75c-13.6 0-24.6 11.1-24.6 24.9 0 13.6 11.1 24.6 24.6 24.6 13.8 0 24.9-11.1 24.9-24.6 0-13.8-11-24.9-24.9-24.9z"></path></svg>

assets/icons/slack.svg

@@ -0,0 +1 @@
+<svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="slack" class="svg-inline--fa fa-slack fa-w-14" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M94.12 315.1c0 25.9-21.16 47.06-47.06 47.06S0 341 0 315.1c0-25.9 21.16-47.06 47.06-47.06h47.06v47.06zm23.72 0c0-25.9 21.16-47.06 47.06-47.06s47.06 21.16 47.06 47.06v117.84c0 25.9-21.16 47.06-47.06 47.06s-47.06-21.16-47.06-47.06V315.1zm47.06-188.98c-25.9 0-47.06-21.16-47.06-47.06S139 32 164.9 32s47.06 21.16 47.06 47.06v47.06H164.9zm0 23.72c25.9 0 47.06 21.16 47.06 47.06s-21.16 47.06-47.06 47.06H47.06C21.16 243.96 0 222.8 0 196.9s21.16-47.06 47.06-47.06H164.9zm188.98 47.06c0-25.9 21.16-47.06 47.06-47.06 25.9 0 47.06 21.16 47.06 47.06s-21.16 47.06-47.06 47.06h-47.06V196.9zm-23.72 0c0 25.9-21.16 47.06-47.06 47.06-25.9 0-47.06-21.16-47.06-47.06V79.06c0-25.9 21.16-47.06 47.06-47.06 25.9 0 47.06 21.16 47.06 47.06V196.9zM283.1 385.88c25.9 0 47.06 21.16 47.06 47.06 0 25.9-21.16 47.06-47.06 47.06-25.9 0-47.06-21.16-47.06-47.06v-47.06h47.06zm0-23.72c-25.9 0-47.06-21.16-47.06-47.06 0-25.9 21.16-47.06 47.06-47.06h117.84c25.9 0 47.06 21.16 47.06 47.06 0 25.9-21.16 47.06-47.06 47.06H283.1z"></path></svg>

assets/icons/snapchat.svg

@@ -0,0 +1 @@
+<svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="snapchat" class="svg-inline--fa fa-snapchat fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 496 512"><path fill="currentColor" d="M248 8C111 8 0 119 0 256s111 248 248 248 248-111 248-248S385 8 248 8zm169.5 338.9c-3.5 8.1-18.1 14-44.8 18.2-1.4 1.9-2.5 9.8-4.3 15.9-1.1 3.7-3.7 5.9-8.1 5.9h-.2c-6.2 0-12.8-2.9-25.8-2.9-17.6 0-23.7 4-37.4 13.7-14.5 10.3-28.4 19.1-49.2 18.2-21 1.6-38.6-11.2-48.5-18.2-13.8-9.7-19.8-13.7-37.4-13.7-12.5 0-20.4 3.1-25.8 3.1-5.4 0-7.5-3.3-8.3-6-1.8-6.1-2.9-14.1-4.3-16-13.8-2.1-44.8-7.5-45.5-21.4-.2-3.6 2.3-6.8 5.9-7.4 46.3-7.6 67.1-55.1 68-57.1 0-.1.1-.2.2-.3 2.5-5 3-9.2 1.6-12.5-3.4-7.9-17.9-10.7-24-13.2-15.8-6.2-18-13.4-17-18.3 1.6-8.5 14.4-13.8 21.9-10.3 5.9 2.8 11.2 4.2 15.7 4.2 3.3 0 5.5-.8 6.6-1.4-1.4-23.9-4.7-58 3.8-77.1C183.1 100 230.7 96 244.7 96c.6 0 6.1-.1 6.7-.1 34.7 0 68 17.8 84.3 54.3 8.5 19.1 5.2 53.1 3.8 77.1 1.1.6 2.9 1.3 5.7 1.4 4.3-.2 9.2-1.6 14.7-4.2 4-1.9 9.6-1.6 13.6 0 6.3 2.3 10.3 6.8 10.4 11.9.1 6.5-5.7 12.1-17.2 16.6-1.4.6-3.1 1.1-4.9 1.7-6.5 2.1-16.4 5.2-19 11.5-1.4 3.3-.8 7.5 1.6 12.5.1.1.1.2.2.3.9 2 21.7 49.5 68 57.1 4 1 7.1 5.5 4.9 10.8z"></path></svg>

assets/icons/soundcloud.svg

@@ -0,0 +1 @@
+<svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="soundcloud" class="svg-inline--fa fa-soundcloud fa-w-20" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><path fill="currentColor" d="M111.4 256.3l5.8 65-5.8 68.3c-.3 2.5-2.2 4.4-4.4 4.4s-4.2-1.9-4.2-4.4l-5.6-68.3 5.6-65c0-2.2 1.9-4.2 4.2-4.2 2.2 0 4.1 2 4.4 4.2zm21.4-45.6c-2.8 0-4.7 2.2-5 5l-5 105.6 5 68.3c.3 2.8 2.2 5 5 5 2.5 0 4.7-2.2 4.7-5l5.8-68.3-5.8-105.6c0-2.8-2.2-5-4.7-5zm25.5-24.1c-3.1 0-5.3 2.2-5.6 5.3l-4.4 130 4.4 67.8c.3 3.1 2.5 5.3 5.6 5.3 2.8 0 5.3-2.2 5.3-5.3l5.3-67.8-5.3-130c0-3.1-2.5-5.3-5.3-5.3zM7.2 283.2c-1.4 0-2.2 1.1-2.5 2.5L0 321.3l4.7 35c.3 1.4 1.1 2.5 2.5 2.5s2.2-1.1 2.5-2.5l5.6-35-5.6-35.6c-.3-1.4-1.1-2.5-2.5-2.5zm23.6-21.9c-1.4 0-2.5 1.1-2.5 2.5l-6.4 57.5 6.4 56.1c0 1.7 1.1 2.8 2.5 2.8s2.5-1.1 2.8-2.5l7.2-56.4-7.2-57.5c-.3-1.4-1.4-2.5-2.8-2.5zm25.3-11.4c-1.7 0-3.1 1.4-3.3 3.3L47 321.3l5.8 65.8c.3 1.7 1.7 3.1 3.3 3.1 1.7 0 3.1-1.4 3.1-3.1l6.9-65.8-6.9-68.1c0-1.9-1.4-3.3-3.1-3.3zm25.3-2.2c-1.9 0-3.6 1.4-3.6 3.6l-5.8 70 5.8 67.8c0 2.2 1.7 3.6 3.6 3.6s3.6-1.4 3.9-3.6l6.4-67.8-6.4-70c-.3-2.2-2-3.6-3.9-3.6zm241.4-110.9c-1.1-.8-2.8-1.4-4.2-1.4-2.2 0-4.2.8-5.6 1.9-1.9 1.7-3.1 4.2-3.3 6.7v.8l-3.3 176.7 1.7 32.5 1.7 31.7c.3 4.7 4.2 8.6 8.9 8.6s8.6-3.9 8.6-8.6l3.9-64.2-3.9-177.5c-.4-3-2-5.8-4.5-7.2zm-26.7 15.3c-1.4-.8-2.8-1.4-4.4-1.4s-3.1.6-4.4 1.4c-2.2 1.4-3.6 3.9-3.6 6.7l-.3 1.7-2.8 160.8s0 .3 3.1 65.6v.3c0 1.7.6 3.3 1.7 4.7 1.7 1.9 3.9 3.1 6.4 3.1 2.2 0 4.2-1.1 5.6-2.5 1.7-1.4 2.5-3.3 2.5-5.6l.3-6.7 3.1-58.6-3.3-162.8c-.3-2.8-1.7-5.3-3.9-6.7zm-111.4 22.5c-3.1 0-5.8 2.8-5.8 6.1l-4.4 140.6 4.4 67.2c.3 3.3 2.8 5.8 5.8 5.8 3.3 0 5.8-2.5 6.1-5.8l5-67.2-5-140.6c-.2-3.3-2.7-6.1-6.1-6.1zm376.7 62.8c-10.8 0-21.1 2.2-30.6 6.1-6.4-70.8-65.8-126.4-138.3-126.4-17.8 0-35 3.3-50.3 9.4-6.1 2.2-7.8 4.4-7.8 9.2v249.7c0 5 3.9 8.6 8.6 9.2h218.3c43.3 0 78.6-35 78.6-78.3.1-43.6-35.2-78.9-78.5-78.9zm-296.7-60.3c-4.2 0-7.5 3.3-7.8 7.8l-3.3 136.7 3.3 65.6c.3 4.2 3.6 7.5 7.8 7.5 4.2 0 7.5-3.3 7.5-7.5l3.9-65.6-3.9-136.7c-.3-4.5-3.3-7.8-7.5-7.8zm-53.6-7.8c-3.3 0-6.4 3.1-6.4 6.7l-3.9 145.3 3.9 66.9c.3 3.6 3.1 6.4 6.4 6.4 3.6 0 6.4-2.8 6.7-6.4l4.4-66.9-4.4-145.3c-.3-3.6-3.1-6.7-6.7-6.7zm26.7 3.4c-3.9 0-6.9 3.1-6.9 6.9L227 321.3l3.9 66.4c.3 3.9 3.1 6.9 6.9 6.9s6.9-3.1 6.9-6.9l4.2-66.4-4.2-141.7c0-3.9-3-6.9-6.9-6.9z"></path></svg>

assets/icons/steam.svg

@@ -0,0 +1 @@
+<svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="steam" class="svg-inline--fa fa-steam fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 496 512"><path fill="currentColor" d="M496 256c0 137-111.2 248-248.4 248-113.8 0-209.6-76.3-239-180.4l95.2 39.3c6.4 32.1 34.9 56.4 68.9 56.4 39.2 0 71.9-32.4 70.2-73.5l84.5-60.2c52.1 1.3 95.8-40.9 95.8-93.5 0-51.6-42-93.5-93.7-93.5s-93.7 42-93.7 93.5v1.2L176.6 279c-15.5-.9-30.7 3.4-43.5 12.1L0 236.1C10.2 108.4 117.1 8 247.6 8 384.8 8 496 119 496 256zM155.7 384.3l-30.5-12.6a52.79 52.79 0 0 0 27.2 25.8c26.9 11.2 57.8-1.6 69-28.4 5.4-13 5.5-27.3.1-40.3-5.4-13-15.5-23.2-28.5-28.6-12.9-5.4-26.7-5.2-38.9-.6l31.5 13c19.8 8.2 29.2 30.9 20.9 50.7-8.3 19.9-31 29.2-50.8 21zm173.8-129.9c-34.4 0-62.4-28-62.4-62.3s28-62.3 62.4-62.3 62.4 28 62.4 62.3-27.9 62.3-62.4 62.3zm.1-15.6c25.9 0 46.9-21 46.9-46.8 0-25.9-21-46.8-46.9-46.8s-46.9 21-46.9 46.8c.1 25.8 21.1 46.8 46.9 46.8z"></path></svg>

assets/icons/tiktok.svg

@@ -0,0 +1 @@
+<svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="tiktok" class="svg-inline--fa fa-tiktok fa-w-14" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M448,209.91a210.06,210.06,0,0,1-122.77-39.25V349.38A162.55,162.55,0,1,1,185,188.31V278.2a74.62,74.62,0,1,0,52.23,71.18V0l88,0a121.18,121.18,0,0,0,1.86,22.17h0A122.18,122.18,0,0,0,381,102.39a121.43,121.43,0,0,0,67,20.14Z"></path></svg>

assets/icons/twitch.svg

@@ -0,0 +1 @@
+<svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="twitch" class="svg-inline--fa fa-twitch fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M391.17,103.47H352.54v109.7h38.63ZM285,103H246.37V212.75H285ZM120.83,0,24.31,91.42V420.58H140.14V512l96.53-91.42h77.25L487.69,256V0ZM449.07,237.75l-77.22,73.12H294.61l-67.6,64v-64H140.14V36.58H449.07Z"></path></svg>

assets/icons/youtube.svg

@@ -0,0 +1 @@
+<svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="youtube" class="svg-inline--fa fa-youtube fa-w-18" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path fill="currentColor" d="M549.655 124.083c-6.281-23.65-24.787-42.276-48.284-48.597C458.781 64 288 64 288 64S117.22 64 74.629 75.486c-23.497 6.322-42.003 24.947-48.284 48.597-11.412 42.867-11.412 132.305-11.412 132.305s0 89.438 11.412 132.305c6.281 23.65 24.787 41.5 48.284 47.821C117.22 448 288 448 288 448s170.78 0 213.371-11.486c23.497-6.321 42.003-24.171 48.284-47.821 11.412-42.867 11.412-132.305 11.412-132.305s0-89.438-11.412-132.305zm-317.51 213.508V175.185l142.739 81.205-142.739 81.201z"></path></svg>

config/_default/author.toml

@@ -1,9 +1,34 @@
+# -- Site Author Details --
+# To display the author box below each article, configure the settings below.
+# The author image should be placed inside the `/static` folder.
+# Uncomment any links to enable them. The icons will be displayed in the order listed.
+
 [author]
   # name = "Your name here"
   # image = "/img/author.jpg"
-  # email = "hello@your_domain.com"
+  # links = [
-
+  #   { email = "mailto:hello@your_domain.com" },
-  # twitter = "https://twitter.com/username"
+  #   { link = "https://link-to-some-website.com/" },
-  # github = "https://github.com/username"
+  #   { codepen = "https://codepen.io/username" },
-  # keybase = "https://keybase.io/username"
+  #   { dev = "https://dev.to/username" },
-  # linkedin = "https://linkedin.com/in/username/"
+  #   { discord = "https://discord.gg/invitecode" },
+  #   { dribbble = "https://dribbble.com/username" },
+  #   { facebook = "https://facebook.com/username" },
+  #   { github = "https://github.com/username" },
+  #   { gitlab = "https://gitlab.com/username" },
+  #   { instagram = "https://instagram.com/username" },
+  #   { keybase = "https://keybase.io/username" },
+  #   { lastfm = "https://lastfm.com/user/username" },
+  #   { linkedin = "https://linkedin.com/in/username" },
+  #   { mastodon = "https://mastodon.instance/@username" },
+  #   { medium = "https://medium.com/username" },
+  #   { reddit = "https://reddit.com/user/username" },
+  #   { slack = "https://workspace.url/team/userid" },
+  #   { snapchat = "https://snapchat.com/add/username" },
+  #   { soundcloud = "https://soundcloud.com/username" },
+  #   { steam = "https://steamcommunity.com/profiles/userid" },
+  #   { tiktok = "https://tiktok.com/@username" },
+  #   { twitch = "https://twitch.tv/username" },
+  #   { twitter = "https://twitter.com/username" },
+  #   { youtube = "https://youtube.com/username" },
+  # ]

config/_default/config.toml

@@ -1,9 +1,23 @@
+# -- Site Configuration --
 theme = "congo"
+
+# Speficiy the base URL for the website.
 # baseURL = "https://your_domain.com/"
+
+# The language code of the language that the website is written in.
+# This can be a base language (ie. "en") or a specific variant (ie. "en-AU").
 languageCode = "en"
 
+# The website title. This will be displayed in the site header.
 title = "Congo"
+
+# A default copyright message is generated automatically.
+# Uncomment the line below to provide a custom copyright Markdown string.
 # copyright = "Copy, _right?_ :thinking_face:"
 
+# To automatically convert strings such as :bang: to emoji, set this to true.
 enableEmoji = true
+
+# Congo will generate a robots file that allows search engines to index
+# the entire site. If you don't want a robots file, set this to false.
 enableRobotsTXT = true

config/_default/markup.toml

@@ -1,5 +1,9 @@
-[highlight]
+# -- Markup --
-  noClasses = false
+# These settings are required for the theme to function.
 
+[goldmark]
 [goldmark.renderer]
   unsafe = true
+
+[highlight]
+  noClasses = false

config/_default/menus.toml

@@ -1,3 +1,15 @@
+# -- Main Menu --
+# The main menu is displayed at the top of the theme.
+# Acceptable parameters are name, pageRef, page, url, title, weight.
+# 
+# The simplest menu configuration is to provide:
+#   name = The name to be displayed for this menu link
+#   pageRef = The identifier of the page or section to link to
+#
+# By default the menu is ordered alphabetically. This can be
+# overridden by providing a weight value. The menu will then be
+# ordered by weight from lowest to highest.
+
 [[main]]
   name = "Blog"
   pageRef = "posts"

config/_default/params.toml

@@ -1,9 +1,39 @@
+# -- Theme Options --
+# These options control how the theme functions and allow you to
+# customise the display of your website.
+#
+# Refer to the README for more details about each of these parameters.
+
+[homepage]
+  layout = "page" # valid options: page, profile, custom
+  showList = false
+  listSections = ["blog"]
+
+[article]
+  showDate = true
+  dateFormat = "2 January 2006"
+  showAuthor = true
+  showDraftLabel = true
+  showHeadingAnchors = true
+  showPagination = true
+  showReadingTime = true
+  # sharingLinks = ["facebook", "twitter", "reddit", "linkedin", "email"]
+
+[list]
+  groupByYear = true
+
+[taxonomy]
+  showTermCount = true
+
+[sitemap]
+  excludedKinds = ["taxonomy", "term"]
+
+[fathomAnalytics]
+  # site = "ABC12345"
+  # domain = "llama.yoursite.com"
+
 [verification]
   # google = ""
   # bing = ""
   # pinterest = ""
   # yandex = ""
-
-[fathomAnalytics]
-  # site = "ABC12345"
-  # domain = "llama.yoursite.com"

data/sharing.json

@@ -0,0 +1,27 @@
+{
+  "email": {
+    "icon": "email",
+    "title": "Send via email",
+    "url": "mailto:?body=%s&subject=%s"
+  },
+  "facebook": {
+    "icon": "facebook",
+    "title": "Share on Facebook",
+    "url": "https://www.facebook.com/sharer/sharer.php?u=%s&quote=%s"
+  },
+  "linkedin": {
+    "icon": "linkedin",
+    "title": "Share on LinkedIn",
+    "url": "https://www.linkedin.com/shareArticle?mini=true&url=%s&title=%s"
+  },
+  "reddit": {
+    "icon": "reddit",
+    "title": "Submit to Reddit",
+    "url": "https://reddit.com/submit/?url=%s&resubmit=true&title=%s"
+  },
+  "twitter": {
+    "icon": "twitter",
+    "title": "Tweet on Twitter",
+    "url": "https://twitter.com/intent/tweet/?url=%s&text=%s"
+  }
+}

exampleSite/config.toml

@@ -1,28 +1,59 @@
+# Site configuration for the Congo demo site
+# --------------------------------------------------------------------------
+# IMPORTANT: You should not use this file as a template for configuration
+# as it does not contain all the required theme settings!
+#
+# Refer to the theme docs for configuration instructions if you're unsure.
+# https://github.com/jpanther/Congo#readme
+# --------------------------------------------------------------------------
+
 baseURL = "https://example.com"
 theme = "Congo"
 languageCode = "en-AU"
 title = "Congo"
+enableEmoji = true
 
 [author]
-  name = "Freddy Blogger"
+  name = "Congo"
-  image = "https://i.pravatar.cc/150?img=11"
+  image = "/img/author.jpg"
-  twitter = "https://twitter.com/"
+  links = [
-  github = "https://github.com/"
+    { twitter = "https://twitter.com/" },
-  linkedin = "https://linkedin.com/"
+    { facebook = "https://facebook.com/" },
-
+    { linkedin = "https://linkedin.com/" },
-[[menu.main]]
+    { youtube = "https://youtube.com/" },
-  name = "Blog"
+  ]
-  pageRef = "blog"
-  weight = 10
-[[menu.main]]
-  name = "About"
-  pageRef = "about"
-  weight = 20
-[[menu.main]]
-  name = "Tags"
-  url = "tags"
-  weight = 30
 
 [taxonomies]
-  category = "categories"
   tag = "tags"
+
+[params.homepage]
+  layout = "custom"
+  showList = true
+  listSections = "samples"
+
+[params.list]
+  groupByYear = false
+
+[[menu.main]]
+  name = "Docs"
+  pageRef = "docs"
+  weight = 10
+[[menu.main]]
+  name = "Samples"
+  pageRef = "samples"
+  weight = 20
+# [[menu.main]]
+#   name = "Users"
+#   pageRef = "users"
+#   weight = 30
+[[menu.main]]
+  name = "GitHub"
+  url = "https://github.com/jpanther/Congo"
+  weight = 40
+
+[markup.goldmark]
+[markup.goldmark.renderer]
+  unsafe = true
+
+[markup.highlight]
+  noClasses = false

exampleSite/content/_index.md

@@ -1,14 +1,14 @@
 ---
-title: "Welcome to Congo! 🎉"
+title: "Welcome to Congo! :tada:"
-description: "This is a demo of the Congo theme for Hugo"
+description: "This is a demo of the Congo theme for Hugo."
 ---
 
 {{< lead >}}
 A simple, lightweight theme for Hugo built with Tailwind CSS.
 {{< /lead >}}
 
-This is the homepage. It's just plain Markdown content and can render whatever you wish.
+This is a demo site built entirely using Congo. It also contains a complete set of [theme documentation](/docs/). 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.
 
-Perhaps you'll link to an [about](/about) page, or direct people to check out your [blog posts](/post). It's really up to you.
+Explore the [sample pages](/samples/) to get a feel for what Congo can do. If you like what you see, check out the project on [Github](https://github.com/jpanther/Congo) or read the [Installation guide](/docs/installation/) to get started.
 
 {{< figure src="mountains.jpg" caption="Photo by [Anna Scarfiello](https://unsplash.com/@little_anne?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText) on [Unsplash](https://unsplash.com/?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText)." >}}

exampleSite/content/about.md

@@ -1,23 +0,0 @@
----
-title: "About"
-description: "Hugo, the world's fastest framework for building websites"
-date: 2019-02-28
----
-
-Written in Go, Hugo is an open source static site generator available under the [Apache Licence 2.0.](https://github.com/gohugoio/hugo/blob/master/LICENSE) Hugo supports TOML, YAML and JSON data file types, Markdown and HTML content files and uses shortcodes to add rich content. Other notable features are taxonomies, multilingual mode, image processing, custom output formats, HTML/CSS/JS minification and support for Sass SCSS workflows.
-
-Hugo makes use of a variety of open source projects including:
-
-- https://github.com/yuin/goldmark
-- https://github.com/alecthomas/chroma
-- https://github.com/muesli/smartcrop
-- https://github.com/spf13/cobra
-- https://github.com/spf13/viper
-
-Hugo is ideal for blogs, corporate websites, creative portfolios, online magazines, single page applications or even a website with thousands of pages.
-
-Hugo is for people who want to hand code their own website without worrying about setting up complicated runtimes, dependencies and databases.
-
-Websites built with Hugo are extremely fast, secure and can be deployed anywhere including, AWS, GitHub Pages, Heroku, Netlify and any other hosting provider.
-
-Learn more and contribute on [GitHub](https://github.com/gohugoio).

exampleSite/content/blog/_index.md

@@ -1,4 +0,0 @@
----
-title: "Blog"
-description: "My life in words."
----

exampleSite/content/docs/_index.md

@@ -0,0 +1,14 @@
+---
+title: "Documentation"
+description: "Learn how to use Congo and its features."
+---
+
+{{< lead >}}
+Simple, yet powerful. Learn how to use Congo and its features.
+{{< /lead >}}
+
+{{< figure src="screenshot.png" >}}
+
+This section contains everything you need to know about Congo. If you're new, check out the [Installation](/docs/installation/) guide to begin or visit the [Samples](/samples/) section to see what Congo can do.
+
+---

exampleSite/content/docs/advanced-customisation.md

@@ -0,0 +1,65 @@
+---
+title: "Advanced Customisation"
+date: 2020-08-09
+draft: false
+description: "Learn how to build Congo manually."
+slug: "advanced-customisation"
+tags: ["advanced", "css", "docs"]
+showDate: false
+showAuthor: false
+---
+
+There are a couple of ways you can make style changes to Congo.
+
+If you just need to add or override some simple styles, you can do so by creating a `custom.css` file in your project's `static/css/` folder. This file will be loaded automatically after the theme's default styles.
+
+Alternatively, if you'd like to make a major change, you can take advantage of Tailwind CSS's JIT compiler and rebuild the entire theme CSS from scratch.
+
+{{< alert >}}
+**Note:** Building the theme manually is intended for advanced users.
+{{< /alert >}}
+
+Change into the `themes/congo/` folder and install the project dependencies.
+
+```bash
+npm install
+```
+
+Once installed, you can edit the `themes/congo/tailwind.config.js` to change the styles that are applied throughout the theme. You can also adjust specific styles in `themes/congo/assets/css/main.css`.
+
+To allow for easy theme colour changes, Congo defines a `primary` and `secondary` colour palette that is used throughout the theme. In order to change the colour across the entire theme, simply edit the `tailwind.config.js` file accordingly.
+
+For example, to change to a green colour scheme, you could apply these changes:
+
+```js
+  // themes/congo/tailwind.config.js
+
+  theme: {
+    colors: {
+      transparent: "transparent",
+      white: colors.white,
+      gray: colors.gray,
+      primary: colors.lime,
+      secondary: colors.teal,
+    },
+    ...
+  }
+```
+
+For a full list of colours available, and their corresponding configuration values, see the official [Tailwind docs](https://tailwindcss.com/docs/customizing-colors#color-palette-reference).
+
+After editing the configuration, you need to rebuild the theme's stylesheets.
+
+```bash
+npm run build
+```
+
+This will automatically output a minified CSS file to `/themes/congo/static/css/main.css`.
+
+To aid with testing style changes, you can also run the Tailwind JIT comiler in watch mode.
+
+```bash
+npm run dev
+```
+
+Now whenever you make a change, the (non-minified) CSS files will be rebuilt automatically. This mode is useful to run when using `hugo server` to preview your site during development. Remember to perform a full build before publishing your website.

exampleSite/content/docs/configuration.md

@@ -0,0 +1,53 @@
+---
+title: "Configuration"
+date: 2020-08-14
+draft: false
+description: "All the configuration variables available in Congo."
+slug: "configuration"
+tags: ["config", "docs"]
+showDate: false
+showAuthor: false
+---
+
+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.
+
+The default theme configuration is documented in each file so you can freely adjust the settings to meet your needs.
+
+{{< alert >}}
+As outlined in the [installation instructions](/docs/installation/#set-up-your-configuration-files), you should adjust your theme configuration by modifying the files in the `config/_default/` folder of your Hugo project and delete the `config.toml` file in your project root.
+{{< /alert >}}
+
+## Parameters
+
+Congo provides a large number of configuration parameters that control how the theme functions. The table below outlines every available parameter in the `config/_default/params.toml` file.
+
+Many of the article defaults here can be overridden on a per article basis by specifying it in the front matter. Refer to the [Front Matter](/docs/front-matter/) section for further details.
+
+<!-- prettier-ignore-start -->
+|Name|Type|Default|Description|
+| --- | --- | --- | --- |
+|`homepage.layout`|string|`"page"`|The layout of the homepage. Valid values are `page`, `profile` or `custom`. When set to `custom`, you must provide your own layout by creating a `/layouts/partials/home/custom.html` file. Refer to the [Homepage Layout](/docs/homepage-layout/) section for more details.|
+|`homepage.showList`|boolean|`false`|Whether or not recent articles are listed on the homepage beneath the page content. Refer to the [Recent Articles](/docs/homepage-layout/#recent-articles) docs for more details.|
+|`homepage.listSections`|array of strings|`["blog"]`|The sections of content to include in the recent list when `homepage.showList` is `true`.|
+|`article.showDate`|boolean|`true`|Whether or not article dates are displayed.|
+|`article.dateFormat`|string|`"2 January 2006"`|How article dates are formatted. Refer to the [Hugo docs](https://gohugo.io/functions/format/#gos-layout-string) for acceptable formats.|
+|`article.showAuthor`|boolean|`true`|Whether or not the author box is displayed in the article footer.|
+|`article.showDraftLabel`|boolean|`true`|Whether or not the draft indicator is shown next to articles when site is built with `--buildDrafts`.|
+|`article.showHeadingAnchors`|boolean|`true`|Whether or not heading anchor links are displayed alongside headings within articles.|
+|`article.showPagination`|boolean|`true`|Whether or not the next/previous article links are displayed in the article footer.|
+|`article.showReadingTime`|boolean|`true`|Whether or not article reading times are displayed.|
+|`article.sharingLinks`|array of strings|_Not set_|Which sharing links to display at the end of each article. When not provided, or set to `false` no links will be displayed.|
+|`list.groupByYear`|boolean|`true`|Whether or not articles are grouped under years in the article listing.|
+|`sitemap.excludedKinds`|array of strings|`["taxonomy", "term"]`|Kinds of content that should be excluded from the generated `/sitemap.xml` file. Refer to the [Hugo docs](https://gohugo.io/templates/section-templates/#page-kinds) for acceptable values.|
+|`taxonomy.showTermCount`|boolean|`true`|Whether or not the number of articles within a taxonomy term is displayed on the taxonomy listing.|
+|`fathomAnalytics.site`|string|_Not set_|The site code generated by Fathom Analytics for the website. Refer to the [Analytics docs](#analyticshtml) below for more details.|
+|`fathomAnalytics.domain`|string|_Not set_|If using a custom domain with Fathom Analytics, provide it here to serve `script.js` from the custom domain.|
+|`verification.google`|string|_Not set_|The site verification string provided by Google to be included in the site metadata.|
+|`verification.bing`|string|_Not set_|The site verification string provided by Bing to be included in the site metadata.|
+|`verification.pinterest`|string|_Not set_|The site verification string provided by Pinterest to be included in the site metadata.|
+|`verification.yandex`|string|_Not set_|The site verification string provided by Yandex to be included in the site metadata.|
+<!-- prettier-ignore-end -->

exampleSite/content/docs/front-matter.md

@@ -0,0 +1,26 @@
+---
+title: "Front Matter"
+date: 2020-08-12
+draft: false
+description: "All the front matter variables available in Congo."
+slug: "front-matter"
+tags: ["front matter", "config", "docs"]
+showDate: false
+showAuthor: false
+---
+
+In addition to the [default Hugo front matter parameters](https://gohugo.io/content-management/front-matter/#front-matter-variables), Congo adds a number of additional options to customise the presentation of individual articles. All the available theme parameters are listed below.
+
+Front matter parameter default values are inherited from the theme's [base configuration](/docs/configuration/), so you only need to specify these parameters in your front matter when you want to override the default.
+
+<!-- prettier-ignore-start -->
+|Name|Type|Default|Description|
+| --- | --- | --- | --- |
+|`externalUrl`|string|_Not set_|If this article is published on a third-party website, the URL to this article. Providing a URL will prevent a content page being generated and any references to this article will link directly to the third-party website.|
+|`showDate`|boolean|`article.showDate`|Whether or not article dates are displayed.|
+|`showAuthor`|boolean|`article.showAuthor`|Whether or not the author box is displayed in the article footer.|
+|`showHeadingAnchors`|boolean|`article.showHeadingAnchors`|Whether or not heading anchor links are displayed alongside headings within this article.|
+|`showPagination`|boolean|`article.showPagination`|Whether or not the next/previous article links are displayed in the article footer.|
+|`showReadingTime`|boolean|`article.showReadingTime`|Whether or not article reading times are displayed.|
+|`xml`|boolean|`true` unless excluded by `sitemap.excludedKinds`|Whether or not this article is included in the generated `/sitemap.xml` file.|
+<!-- prettier-ignore-end -->

exampleSite/content/docs/getting-started.md

@@ -0,0 +1,73 @@
+---
+title: "Getting Started"
+date: 2020-08-15
+draft: false
+description: "All the front matter variables available in Congo."
+slug: "getting-started"
+tags: ["installation", "docs"]
+showDate: false
+showAuthor: false
+---
+
+{{< alert >}}
+This section assumes you have already [installed the Congo theme](/docs/installation/).
+{{< /alert >}}
+
+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:
+
+```toml
+# config/_default/config.toml
+
+baseURL = "https://your_domain.com"
+languageCode = "en-AU"
+
+title = "My awesome website"
+```
+
+It's also useful to set the author configuration in the `config/_default/author.toml` file. You can also add links to your profiles here to enable them in the theme.
+
+```toml
+# config/_default/author.toml
+
+[author]
+name = "Your name"
+links = [
+  { twitter = "https://twitter.com/username" }
+]
+```
+
+## Organising content
+
+By default, Congo doesn'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 _pages_ for a static site, _posts_ for a blog, or _projects_ for a portfolio.
+
+The same logic applies to taxonomies. Some people prefer to use _tags_ and _categories_, others prefer to use _topics_.
+
+Hugo defaults to using posts, tags and categories out of the box and this will work fine if that's what you want. If you wish to customise this, however, you can do so by creating the following files:
+
+```toml
+# config/_default/taxonomies.toml
+
+topic = "topics"
+```
+
+This will replace the default _tags_ and _categories_ with _topics_. Refer to the [Hugo Taxonomy docs](https://gohugo.io/content-management/taxonomies/) for more information on naming taxonomies.
+
+When you create a new taxonomy, you will need to adjust the navigation links on the website to point to the new sections:
+
+```toml
+# config/_default/menus.toml
+
+[[main]]
+  name = "Blog"
+  pageRef = "posts"
+  weight = 10
+
+[[main]]
+  name = "Topics"
+  pageRef = "topics"
+  weight = 20
+```
+
+These steps are the bare minimum configuration. If you now run `hugo server` you will be presented with a blank Congo website. Detailed configuration is covered in the [Configuration](/docs/configuration/) section.

exampleSite/content/docs/homepage-layout/index.md

@@ -0,0 +1,48 @@
+---
+title: "Homepage Layout"
+date: 2020-08-13
+draft: false
+description: "Configuring the homepage layout in the Congo theme."
+slug: "homepage-layout"
+tags: ["homepage", "layouts", "docs"]
+showDate: false
+showAuthor: false
+---
+
+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.
+
+## Page layout
+
+The default layout is the page layout. It's simply a normal content page that displays your Markdown content. It's great for static websites and provides a lot of flexibility.
+
+![Profile layout](home-page.jpg)
+
+To enable the page layout, set `homepage.layout = "page"` in the `params.toml` configuration file.
+
+## Profile layout
+
+The profile layout is great for personal websites and blogs. It puts the author's details front and centre by providing an image and links to social profiles.
+
+The author information is provided in the `author.toml` configuration file. Additionally, any Markdown content that is provided in the homepage content will be placed below the author profile. This allows extra flexibility for displaying a bio or other custom content using shortcodes.
+
+![Profile layout](home-profile.jpg)
+
+To enable the profile layout, set `homepage.layout = "profile"` in the `params.toml` configuration file.
+
+## Custom layout
+
+If the built-in homepage layouts aren'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.
+
+To enable the custom layout, set `homepage.layout = "custom"` in the `params.toml` configuration file.
+
+With the configuration value set, create a new `custom.html` file and place it in `layouts/partials/home/custom.html`. Now whatever is in the `custom.html` 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.
+
+## Recent articles
+
+All homepage layouts have the option of displaying recent articles below the main page content. To enable this, simply set the `homepage.showList` setting to `true` in the `params.toml` configuration file.
+
+![Profile layout with recent articles](home-profile-list.jpg)
+
+The articles listed in this section are derived from the `homepage.listSections` setting which allows for whatever content types you are using on your website. For instance, if you had content sections for _posts_ and _projects_ you could set this setting to `["posts", "projects"]` 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: `["blog"]`.

exampleSite/content/docs/installation.md

@@ -0,0 +1,62 @@
+---
+title: "Installation"
+date: 2020-08-16
+draft: false
+description: "How to install the Congo theme."
+slug: "installation"
+tags: ["installation", "docs"]
+showDate: false
+showAuthor: false
+---
+
+Simply follow the standard Hugo [Quick Start](https://gohugo.io/getting-started/quick-start/) procedure to get up and running quickly.
+
+Detailed instructions can be found below.
+
+## Install Hugo
+
+You can find specific instructions for your platform in the official [Hugo docs](https://gohugo.io/getting-started/installing.).
+
+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`.
+
+## Download the Congo theme
+
+There are a couple of ways to install the Congo theme into your Hugo website. The git method is the easiest to keep the theme up-to-date, but you can also download and install manually if you don't have git available.
+
+### Install using git
+
+Change into the directory for your Hugo website, initialise a new repository and add Congo as a submodule.
+
+```bash
+cd mywebsite
+git init
+git submodule add -b stable https://github.com/jpanther/Congo.git themes/congo
+```
+
+{{< alert >}}
+**Note:** You need to substitute `mywebsite` for the correct folder name you used in Step 2.
+{{< /alert >}}
+
+### Install manually
+
+Download the latest release of the theme.
+
+{{< button href="https://github.com/jpanther/Congo/releases" target="_blank" >}}Download from Github{{< /button >}}
+
+Extract the archive, rename the folder to `congo` and move it to the `themes/` directory inside your your `mywebsite` folder.
+
+{{< alert >}}
+**Note:** You need to substitute `mywebsite` for the correct folder name you used in Step 2.
+{{< /alert >}}
+
+## Set up your configuration files
+
+In the root folder of your website, delete the `config.toml` file that was generated by Hugo. Copy the entire `config` folder from `themes/congo/config/` into the root of your website. This will ensure you have all the correct theme settings and will enable you to easily customise the theme.
+
+You're now all set up to use Congo. From here you can add some content and start the Hugo server.
+
+Refer to the Hugo docs for more information or read the next section to learn more about configuring the theme.

exampleSite/content/docs/partials.md

@@ -0,0 +1,91 @@
+---
+title: "Partials"
+date: 2020-08-10
+draft: false
+description: "All the partials available in Congo."
+slug: "partials"
+tags: ["partials", "analytics", "privacy", "comments", "favicons", "icon", "docs"]
+showDate: false
+showAuthor: false
+---
+
+## Analytics
+
+Congo provides built-in support for Fathom Analytics and Google Analytics. Fathom is a paid alternative to Google Analytics that respects user privacy. If you're interested you can use this affiliate link to [receive $10 credit](https://usefathom.com/ref/RLAJSV) and try the service.
+
+### Fathom Analytics
+
+To enable Fathom Analytics support, simply provide your Fathom site code in the `config/_default/params.toml` file. If you also use the custom domain feature of Fathom and would like to serve their script from your domain, you can also additionally provide the `domain` configuration value. If you don't provide a `domain` value, the script will load directly from Fathom DNS.
+
+```toml
+# config/_default/params.toml
+
+[fathomAnalytics]
+  site = "ABC12345"
+  domain = "llama.yoursite.com"
+```
+
+### Google Analytics
+
+Google Analytics support is provided through the internal Hugo partial. Simply provide the `googleAnalytics` key in the `config/_default/config.toml` file and the script will be added automatically.
+
+```toml
+# config/_default/config.toml
+
+googleAnalytics = "UA-PROPERTY_ID"
+```
+
+### Custom analytics providers
+
+If you wish to use a different analytics provider on your website you can also override the analytics partial and provide your own script. Simply create the file `layouts/partials/analytics.html` in your project and it will automatically include it in the `<head>` of the website.
+
+## Comments
+
+To add comments to your articles, Congo includes support for a comments partial that is included at the base of each article page. Simply provide a `layouts/partials/comments.html` which contains the code required to display your chosen comments.
+
+You can use either the built-in Hugo Disqus template, or provide your own custom code. Refer to the [Hugo docs](https://gohugo.io/content-management/comments/) for further information.
+
+## Favicons
+
+Congo provides a default set of blank favicons to get started but you can provide your own assets to override them. The easiest way to obtain new favicon assets is to generate them using a third-party provider like [favicon.io](https://favicon.io).
+
+Icon assets should be placed directly in the `static/` folder of your website and named as per the listing below. If you use [favicon.io](https://favicon.io), these will be the filenames that are automatically generated for you, but you can provide your own assets if you wish.
+
+```shell
+static/
+├─ android-chrome-192x192.png
+├─ android-chrome-512x512.png
+├─ apple-touch-icon.png
+├─ favicon-16x16.png
+├─ favicon-32x32.png
+├─ favicon.ico
+└─ site.webmanifest
+```
+
+Alternatively, you can also completely override the default favicon behaviour and provide your own favicon HTML tags and assets. Simply provide a `layouts/partials/favicons.html` file in your project and this will be injected into the site `<head>` in place of the default assets.
+
+## Icon
+
+Similar to the [icon shortcode](/docs/shortcodes/#icon), you can include icons in your own templates and partials by using Congo's `icon.html` partial. The partial takes one parameter which is the name of the icon to be included.
+
+**Example:**
+
+```go
+  {{ partial "icon.html" "github" }}
+```
+
+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 `assets/icons/`.
+
+## Extensions
+
+Congo also provides for a number of extension partials that allow for expanding upon base functionality.
+
+### Article link
+
+If you wish to insert additional code after article links, create a `layouts/partials/extend-article-link.html` file. This is especially powerful when combined with the [`badge`](/docs/shortcodes/#badge) shortcode which can be used to highlight metadata for certain articles.
+
+### Head and Footer
+
+The theme allows for inserting additional code directly into the `<head>` and `<footer>` sections of the template. These can be useful for providing scripts or other logic that isn't part of the theme.
+
+Simply create either `layouts/partials/extend-head.html` or `layouts/partials/extend-footer.html` and these will automatically be included in your website build. Both partials are injected as the last items in `<head>` and `<footer>` so they can be used to override theme defaults.

exampleSite/content/docs/shortcodes.md

@@ -0,0 +1,118 @@
+---
+title: "Shortcodes"
+date: 2020-08-11
+draft: false
+description: "All the shortcodes available in Congo."
+slug: "shortcodes"
+tags: ["shortcodes", "mermaid", "icon", "lead", "docs"]
+showDate: false
+showAuthor: false
+---
+
+In addition to all the [default Hugo shortcodes](https://gohugo.io/content-management/shortcodes/), Congo adds a few extras for additional functionality.
+
+## Alert
+
+`alert` outputs its contents as a stylised message box within your article. It's useful for drawing attention to important information that you don't want the reader to miss.
+
+The input is written in Markdown so you can format it however you please.
+
+**Example:**
+
+```md
+{{</* alert */>}}
+**Warning!** This action is destructive!
+{{</* /alert */>}}
+```
+
+{{< alert >}}
+**Warning!** This action is destructive!
+{{< /alert >}}
+
+## Badge
+
+`badge` outputs a styled badge component which is useful for displaying metadata.
+
+**Example:**
+
+```md
+{{</* badge */>}}
+New article!
+{{</* /badge */>}}
+```
+
+{{< badge >}}
+New article!
+{{< /badge >}}
+
+## Button
+
+`button` outputs a styled button component which can be used to highlight a primary action. It has two optional variables `href` and `target` which can be used to specify the URL and target of the link.
+
+**Example:**
+
+```md
+{{</* button href="#button" target="_self" */>}}
+Call to action
+{{</* /button */>}}
+```
+
+{{< button href="#button" target="_self" >}}
+Call to action
+{{< /button >}}
+
+## Icon
+
+`icon` outputs an SVG icon and takes the icon name as its only parameter. The icon is scaled to match the current text size.
+
+**Example:**
+
+```md
+{{</* icon "github" */>}}
+```
+
+**Output:** {{< icon "github" >}}
+
+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 `/assets/icons/` and reference them using the `icon` shortcode passing in the icon's filename (without the `.svg.` extension).
+
+Icons can also be used in partials by calling the [icon partial](/docs/partials/#icon).
+
+## Lead
+
+`lead` 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 `lead` shortcode.
+
+**Example:**
+
+```md
+{{</* lead */>}}
+When life gives you lemons, make lemonade.
+{{</* /lead */>}}
+```
+
+{{< lead >}}
+When life gives you lemons, make lemonade.
+{{< /lead >}}
+
+## Mermaid
+
+`mermaid` allows you to draw detailed diagrams and visualisations using text. It uses MermaidJS under the hood and supports a wide variety of diagrams, charts and other output formats.
+
+Simply write your Mermaid syntax within the `mermaid` shortcode and let the plugin do the rest.
+
+Refer to the [official Mermaid docs](https://mermaid-js.github.io/) for details on syntax and supported diagram types.
+
+**Example:**
+
+```md
+{{</* mermaid */>}}
+graph LR;
+A[Lemons]-->B[Lemonade];
+B-->C[Profit]
+{{</* /mermaid */>}}
+```
+
+{{< mermaid >}}
+graph LR;
+A[Lemons]-->B[Lemonade];
+B-->C[Profit]
+{{< /mermaid >}}

exampleSite/content/samples/_index.md

@@ -0,0 +1,16 @@
+---
+title: "Content Samples"
+description: "See what's possible with Congo."
+---
+
+{{< lead >}}
+Congo brings your content to life. :heart_eyes:
+{{< /lead >}}
+
+This section contains some demo pages that show how Congo renders different types of content. These pages come from Hugo's official [hugoBasicExample](https://github.com/gohugoio/hugoBasicExample) repository.
+
+You can also see an example [taxonomy listing](/tags/) page.
+
+_**Sidenote:** This page is just a standard Congo article listing and Hugo has been configured to generate a `samples` content type._
+
+---

exampleSite/content/samples/emoji-support.md

@@ -2,7 +2,7 @@
 title: "Emoji Support"
 date: 2019-03-05
 description: "Guide to emoji usage in Hugo"
-tags: ["emoji"]
+tags: ["emoji", "sample"]
 ---
 
 Emoji can be enabled in a Hugo project in a number of ways.

exampleSite/content/samples/markdown-syntax.md

@@ -2,8 +2,7 @@
 title: "Markdown Syntax Guide"
 date: 2019-03-11
 description: "Sample article showcasing basic Markdown syntax and formatting for HTML elements."
-tags: ["markdown", "css", "html"]
+tags: ["markdown", "css", "html", "sample"]
-categories: ["themes", "syntax"]
 ---
 
 This article offers a sample of basic Markdown syntax that can be used in Hugo content files, also it shows whether basic HTML elements are decorated with CSS in a Hugo theme.
@@ -141,6 +140,6 @@ H<sub>2</sub>O
 
 X<sup>n</sup> + Y<sup>n</sup> = Z<sup>n</sup>
 
-Press <kbd><kbd>CTRL</kbd>+<kbd>ALT</kbd>+<kbd>Delete</kbd></kbd> to end the session.
+Press <kbd>CTRL</kbd>+<kbd>ALT</kbd>+<kbd>Delete</kbd> to end the session.
 
 Most <mark>salamanders</mark> are nocturnal, and hunt for insects, worms, and other small creatures.

exampleSite/content/samples/math-typesetting.md

@@ -4,13 +4,14 @@ title: Math Typesetting
 date: 2019-03-08
 description: A brief guide to setup KaTeX
 math: true
+tags: ["sample"]
 ---
 
 Mathematical notation in a Hugo project can be enabled by using third party JavaScript libraries.
 
 <!--more-->
 
-In this example we will be using [KaTeX](https://katex.org/)
+In this example we will be using [KaTeX](https://katex.org/).
 
 - Create a partial under `/layouts/partials/math.html`
 - Within this partial reference the [Auto-render Extension](https://katex.org/docs/autorender.html) or host these scripts locally.
@@ -27,24 +28,17 @@ In this example we will be using [KaTeX](https://katex.org/)
 
 **Note:** Use the online reference of [Supported TeX Functions](https://katex.org/docs/supported.html)
 
-{{< math.inline >}}
-{{ if or .Page.Params.math .Site.Params.math }}
-
 <!-- KaTeX -->
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.min.css" integrity="sha384-zB1R0rpPzHqg7Kpt0Aljp8JPLqbXI3bhnPWROx27a9N0Ll6ZP/+DiW/UqRcLbRjq" crossorigin="anonymous">
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.13.13/dist/katex.min.css" integrity="sha384-RZU/ijkSsFbcmivfdRBQDtwuwVqK7GMOw6IMvKyeWL2K5UAlyp6WonmB8m7Jd0Hn" crossorigin="anonymous">
-<script defer src="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.min.js" integrity="sha384-y23I5Q6l+B6vatafAwxRu/0oK/79VlbSz7Q9aiSZUvyWYIYsd+qj+o24G5ZU2zJz" crossorigin="anonymous"></script>
+<script defer src="https://cdn.jsdelivr.net/npm/katex@0.13.13/dist/katex.min.js" integrity="sha384-pK1WpvzWVBQiP0/GjnvRxV4mOb0oxFuyRxJlk6vVw146n3egcN5C925NCP7a7BY8" crossorigin="anonymous"></script>
-<script defer src="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/contrib/auto-render.min.js" integrity="sha384-kWPLUVMOks5AQFrykwIup5lo0m3iMkkHrD0uJ4H5cjeGihAutqP0yW0J6dpFiVkI" crossorigin="anonymous" onload="renderMathInElement(document.body);"></script>
+<script defer src="https://cdn.jsdelivr.net/npm/katex@0.13.13/dist/contrib/auto-render.min.js" integrity="sha384-vZTG03m+2yp6N6BNi5iM4rW4oIwk5DfcNdFfxkk9ZWpDriOkXX8voJBFrAO7MpVl" crossorigin="anonymous"
-{{ end }}
+    onload="renderMathInElement(document.body);"></script>
-{{</ math.inline >}}
 
 ### Examples
 
-{{< math.inline >}}
-
 <p>
 Inline math: \(\varphi = \dfrac{1+\sqrt5}{2}= 1.6180339887…\)
 </p>
-{{</ math.inline >}}
 
 Block math:
 

exampleSite/content/samples/placeholder-text.md

@@ -1,8 +1,10 @@
 ---
 title: "Placeholder Text"
 date: "2019-03-09"
+draft: true
 description: "Lorem Ipsum Dolor Si Amet"
-tags: ["markdown", "text"]
+tags: ["markdown", "text", "sample"]
+xml: false
 ---
 
 Lorem est tota propiore conpellat pectoribus de pectora summo. <!--more-->Redit teque digerit hominumque toris verebor lumina non cervice subde tollit usus habet Arctonque, furores quas nec ferunt. Quoque montibus nunc caluere tempus inhospita parcite confusaque translucet patri vestro qui optatis lumine cognoscere flos nubis! Fronde ipsamque patulos Dryopen deorum.

exampleSite/content/samples/rich-content.md

@@ -2,7 +2,7 @@
 title: "Rich Content"
 date: 2019-03-10
 description: "A brief description of Hugo Shortcodes"
-tags: ["shortcodes", "privacy"]
+tags: ["shortcodes", "privacy", "sample"]
 ---
 
 Hugo ships with several [Built-in Shortcodes](https://gohugo.io/content-management/shortcodes/#use-hugos-built-in-shortcodes) for rich content, along with a [Privacy Config](https://gohugo.io/about/hugo-and-gdpr/) and a set of Simple Shortcodes that enable static and no-JS versions of various social media embeds.

exampleSite/content/users.md

@@ -0,0 +1,20 @@
+---
+title: "Users"
+date: 2020-08-14
+draft: false
+description: "Some real life Congo examples."
+slug: "users"
+tags: ["users"]
+showDate: false
+showAuthor: false
+showReadingTime: false
+---
+
+{{< lead >}}
+Real websites that are built with Congo.
+{{< /lead >}}
+
+| Website | Details |
+| ------- | ------- |
+
+**Congo user?** To add your site to this list, [submit a pull request](https://github.com/jpanther/Congo/blob/dev/exampleSite/content/users.md).

exampleSite/layouts/partials/home/custom.html

@@ -0,0 +1,38 @@
+<script type="text/javascript">
+  function switchLayout() {
+    var pageDiv = document.getElementById("page");
+    var profileDiv = document.getElementById("profile");
+    var layoutSpan = document.getElementById("layout");
+    if (pageDiv.style.display === "none") {
+      pageDiv.style.display = "block";
+      profileDiv.style.display = "none";
+      layoutSpan.innerHTML = "page";
+    } else {
+      pageDiv.style.display = "none";
+      profileDiv.style.display = "block";
+      layoutSpan.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">
+    {{ partial "icon.html" "exclamation-triangle" }}
+  </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" class="">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">
+  {{ partial "partials/home/page.html" . }}
+</div>
+<div id="profile" style="display: none">
+  {{ partial "partials/home/profile.html" . }}
+</div>

layouts/_default/_markup/render-heading.html

@@ -0,0 +1 @@
+<h{{ .Level }} id="{{ .Anchor | safeURL }}">{{ .Text | safeHTML }} {{ if .Page.Params.showHeadingAnchors | default (.Page.Site.Params.article.showHeadingAnchors | default true) }}<a class="heading-anchor" href="#{{ .Anchor | safeURL }}" aria-label="Anchor">#</a>{{ end }}</h{{ .Level }}>

layouts/_default/baseof.html

@@ -2,7 +2,7 @@
 <html lang="{{ with .Site.LanguageCode }}{{ . }}{{ else }}en{{ end }}">
   {{- partial "head.html" . -}}
   <body
-    class="flex flex-col h-screen px-8 text-lg leading-7 text-grey-900 sm:px-14 md:px-24 lg:px-32 dark:bg-gray-800 dark:text-white"
+    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"
   >
     {{- partial "header.html" . -}}
     <main class="flex-grow">{{- block "main" . }}{{- end }}</main>

layouts/_default/list.html

@@ -1,13 +1,23 @@
 {{ define "main" }}
   {{ partial "section-heading.html" . }}
+  {{ if gt .Pages 0 }}
     <section>
       {{ range (.Paginate (.Pages.GroupByDate "2006")).PageGroups }}
+        {{ if $.Site.Params.list.groupByYear }}
           <h2 class="mt-12 text-2xl font-bold first:mt-8">{{ .Key }}</h2>
           <hr class="border-gray-400 border-dotted w-36" />
+        {{ end }}
         {{ range .Pages }}
           {{ partial "article-link.html" . }}
         {{ end }}
       {{ end }}
     </section>
     {{ partial "pagination.html" . }}
+  {{ else }}
+    <section class="mt-10 prose dark:prose-light">
+      <p class="py-8 border-t">
+        <em>There's no articles to list here yet.</em>
+      </p>
+    </section>
+  {{ end }}
 {{ end }}

layouts/_default/single.html

@@ -1,16 +1,25 @@
 {{ define "main" }}
   <article class="max-w-prose">
     <header>
-      <h1 class="mt-0 text-4xl font-extrabold">{{ .Title }}</h1>
+      <h1 class="mt-0 text-4xl font-extrabold">{{ .Title | emojify }}</h1>
       <div class="mt-8 mb-12 text-base text-gray-400 dark:text-gray-500">
-        {{ partial "meta.html" . }}
+        {{ partial "article-meta.html" . }}
+        {{ if and .Draft .Site.Params.article.showDraftLabel }}
+          <span
+            class="ml-2 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"
+          >
+            Draft
+          </span>
+        {{ end }}
       </div>
     </header>
     <section class="prose dark:prose-light">
-      {{ partial "heading-anchor.html" .Content | emojify }}
+      {{ .Content | emojify }}
     </section>
-    <footer>
+    <footer class="pt-8">
-      {{ partialCached "author.html" . }}
+      {{ partial "author.html" . }}
+      {{ partial "sharing-links.html" . }}
+      {{ partial "article-pagination.html" . }}
     </footer>
     {{/* Comments */}}
     {{ if templates.Exists "partials/comments.html" }}

layouts/_default/sitemap.xml

@@ -1,10 +1,9 @@
 {{ printf "<?xml version=\"1.0\" encoding=\"utf-8\" standalone=\"yes\"?>" | safeHTML }}
 <urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
   xmlns:xhtml="http://www.w3.org/1999/xhtml">
-  {{ $excludedKinds := slice "taxonomy" "term" }}
   {{ range .Data.Pages }}
-    {{ if not (in $excludedKinds .Kind) }}
+    {{ if not (in .Site.Params.sitemap.excludedKinds .Kind) }}
-      {{ if not (isset .Params "externalurl") }}
+      {{ if and (.Param "xml" | default true) (not (isset .Params "externalUrl")) }}
         {{- if .Permalink -}}
           <url>
             <loc>{{ .Permalink }}</loc>{{ if not .Lastmod.IsZero }}

layouts/_default/taxonomy.html

@@ -7,10 +7,12 @@
           <a class="text-xl font-medium hover:underline" href="{{ .Page.Permalink }}"
             >{{ .Page.Title }}</a
           >
+          {{ if $.Site.Params.taxonomy.showTermCount | default true }}
             <span class="text-base text-gray-400">
               <span class="px-1">&middot;</span>
               {{ .Count }}
             </span>
+          {{ end }}
         </h2>
       </article>
     {{ end }}

layouts/index.html

@@ -1,8 +1,16 @@
 {{ define "main" }}
-  <article class="max-w-full prose dark:prose-light">
+  {{ $partial := print "partials/home/" .Site.Params.homepage.layout ".html" }}
-    <header>
+  {{ if templates.Exists $partial }}
-      <h1>{{ .Title }}</h1>
+    {{ partial $partial . }}
-    </header>
+  {{ else }}
-    <section>{{ .Content | emojify }}</section>
+    {{ partial "partials/home/page.html" . }}
-  </article>
+  {{ end }}
+  {{ if .Site.Params.homepage.showList | default false }}
+    <section>
+      <h2 class="text-2xl font-extrabold">Recent</h2>
+      {{ range first 5 (.Paginate (where .Site.RegularPages "Type" "in" .Site.Params.homepage.listSections)).Pages }}
+        {{ partial "article-link.html" . }}
+      {{ end }}
+    </section>
+  {{ end }}
 {{ end }}

layouts/partials/article-link.html

@@ -1,7 +1,7 @@
 <article>
   <h3 class="mt-6 text-xl font-semibold">
-    {{ if isset .Params "externalurl" }}
+    {{ if isset .Params "externalUrl" }}
-      <a class="hover:underline" href="{{ .Params.externalurl }}" target="_blank" rel="external"
+      <a class="hover:underline" href="{{ .Params.externalUrl }}" target="_blank" rel="external"
         >{{ .Title }}</a
       >
       <span
@@ -13,11 +13,14 @@
     {{ else }}
       <a class="hover:underline" href="{{ .Permalink }}">{{ .Title }}</a>
     {{ end }}
+    {{ if and .Draft .Site.Params.article.showDraftLabel }}
+      {{ partial "badge.html" "Draft" }}
+    {{ end }}
     {{ if templates.Exists "partials/extend-article-link.html" }}
       {{ partial "extend-article-link.html" . }}
     {{ end }}
   </h3>
   <div class="text-sm text-gray-400 dark:text-gray-500">
-    {{ partial "meta.html" . }}
+    {{ partial "article-meta.html" . }}
   </div>
 </article>

layouts/partials/article-meta.html

@@ -0,0 +1,18 @@
+{{ if .Params.showDate | default (.Site.Params.article.showDate | default true) }}
+  <time datetime="{{ .Date }}">
+    {{ .Date.Format .Site.Params.article.dateFormat | default "2 January 2006" }}
+  </time>
+{{ end }}
+{{ if and
+  (.Params.showDate | default (.Site.Params.article.showDate | default true))
+  (.Params.showReadingTime | default (.Site.Params.article.showReadingTime | default true))
+  (ne .ReadingTime 0)
+}}
+  <span class="px-1">&middot;</span>
+{{ end }}
+{{ if and (.Params.showReadingTime | default (.Site.Params.article.showReadingTime | default true)) (ne .ReadingTime 0) }}
+  <span title="Reading time">
+    {{ .ReadingTime }}
+    min{{ if gt .ReadingTime 1 }}s{{ end }}
+  </span>
+{{ end }}

layouts/partials/article-pagination.html

@@ -0,0 +1,45 @@
+{{ if .Params.showPagination | default (.Site.Params.article.showPagination | default true) }}
+  {{ if or .NextInSection .PrevInSection }}
+    <div class="pt-8">
+      <hr class="border-gray-300 border-dotted dark:border-gray-600" />
+      <div class="flex justify-between pt-3">
+        <span>
+          {{ if .NextInSection }}
+            <a class="flex" href="{{ .NextInSection.Permalink }}">
+              <span class="mr-3">&larr;</span>
+              <span class="flex flex-col">
+                <span class="button__text">{{ .NextInSection.Title }}</span>
+                {{ if .Params.showDate | default (.Site.Params.article.showDate | default true) }}
+                  <time
+                    class="-mt-1 text-xs text-gray-400 dark:text-gray-500"
+                    datetime="{{ .Date }}"
+                  >
+                    {{ .Date.Format .Site.Params.article.dateFormat | default "2 January 2006" }}
+                  </time>
+                {{ end }}
+              </span>
+            </a>
+          {{ end }}
+        </span>
+        <span>
+          {{ if .PrevInSection }}
+            <a class="flex text-right" href="{{ .PrevInSection.Permalink }}">
+              <span class="flex flex-col">
+                <span>{{ .PrevInSection.Title }}</span>
+                {{ if .Params.showDate | default (.Site.Params.article.showDate | default true) }}
+                  <time
+                    class="-mt-1 text-xs text-gray-400 dark:text-gray-500"
+                    datetime="{{ .Date }}"
+                  >
+                    {{ .Date.Format .Site.Params.article.dateFormat | default "2 January 2006" }}
+                  </time>
+                {{ end }}
+              </span>
+              <span class="ml-3">&rarr;</span>
+            </a>
+          {{ end }}
+        </span>
+      </div>
+    </div>
+  {{ end }}
+{{ end }}

layouts/partials/author-links.html

@@ -0,0 +1,16 @@
+{{ with .Site.Author.links }}
+  <div class="flex flex-wrap text-gray-400 dark:text-gray-500">
+    {{ range $links := . }}
+      {{ range $name, $url := $links }}
+        <a
+          class="px-1 hover:text-primary-700 dark:hover:text-primary-400"
+          href="{{ $url }}"
+          target="_blank"
+          alt="{{ $name | title }}"
+          rel="me"
+          >{{ partial "icon.html" $name }}</a
+        >
+      {{ end }}
+    {{ end }}
+  </div>
+{{ end }}

layouts/partials/author.html

@@ -1,4 +1,5 @@
-<div class="flex items-center pt-8">
+{{ if .Params.showAuthor | default (.Site.Params.article.showAuthor | default true) }}
+  <div class="flex items-center">
     {{ with .Site.Author.image }}
       <img class="w-24 h-24 !mt-0 !mb-0 mr-4 rounded-full" src="{{ . }}" />
     {{ end }}
@@ -8,43 +9,7 @@
           {{ . }}
         </div>
       {{ end }}
-    <div class="flex text-lg text-gray-400 dark:text-gray-500">
+      {{ partialCached "author-links.html" . }}
-      {{ with .Site.Author.twitter }}
-        <a
-          class="mr-2 hover:text-primary-700 dark:hover:text-primary-400"
-          href="{{ . }}"
-          target="_blank"
-          title="Twitter"
-          >{{ partial "icon.html" "twitter-brands" }}</a
-        >
-      {{ end }}
-      {{ with .Site.Author.github }}
-        <a
-          class="mr-2 hover:text-primary-700 dark:hover:text-primary-400"
-          href="{{ . }}"
-          target="_blank"
-          title="GitHub"
-          >{{ partial "icon.html" "github-brands" }}</a
-        >
-      {{ end }}
-      {{ with .Site.Author.keybase }}
-        <a
-          class="mr-2 hover:text-primary-700 dark:hover:text-primary-400"
-          href="{{ . }}"
-          target="_blank"
-          title="Keybase"
-          >{{ partial "icon.html" "keybase-brands" }}</a
-        >
-      {{ end }}
-      {{ with .Site.Author.linkedin }}
-        <a
-          class="mr-2 hover:text-primary-700 dark:hover:text-primary-400"
-          href="{{ . }}"
-          target="_blank"
-          title="Linkedin"
-          >{{ partial "icon.html" "linkedin-brands" }}</a
-        >
-      {{ end }}
     </div>
   </div>
-</div>
+{{ end }}

layouts/partials/badge.html

@@ -0,0 +1,5 @@
+<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"
+>
+  {{ . }}
+</span>

layouts/partials/footer.html

@@ -18,12 +18,11 @@
       <a class="hover:underline" href="https://git.io/hugo-congo" target="_blank">Congo</a>
     </p>
   {{ end }}
-</footer>
+  {{/* Extend footer - eg. for extra scripts, etc. */}}
-
+  {{ if templates.Exists "partials/extend-footer.html" }}
-{{/* Extend footer - eg. for extra scripts, etc. */}}
-{{ if templates.Exists "partials/extend-footer.html" }}
     {{ partialCached "extend-footer.html" . }}
-{{ end }}
+  {{ end }}
+</footer>
 
 {{/* Include mermaid.js only on pages that use the shortcode */}}
 {{- if (in (string .Content) "class=\"mermaid\"") -}}

layouts/partials/head.html

@@ -22,18 +22,24 @@
   {{ with .Site.Params.keywords -}}
     <meta name="keywords" content="{{ . }}" />
   {{- end }}
-  <base href="{{ .Site.BaseURL }}" />
   <link rel="canonical" href="{{ .Permalink }}" />
+  {{ range .AlternativeOutputFormats -}}
+    {{ printf `<link rel="%s" type="%s" href="%s" title="%s" />` .Rel .MediaType.Type .Permalink $.Site.Title | safeHTML }}
+  {{ end -}}
   {{/* Styles */}}
   <link type="text/css" rel="stylesheet" href="{{ "css/main.css" | absURL }}" />
   {{ if (fileExists "static/css/custom.css") -}}
     <link type="text/css" rel="stylesheet" href="{{ "css/custom.css" | absURL }}" />
   {{- end }}
   {{/* Icons */}}
+  {{ if templates.Exists "partials/favicons.html" }}
+    {{ partialCached "favicons.html" .Site }}
+  {{ else }}
     <link rel="apple-touch-icon" sizes="180x180" href="{{ "/apple-touch-icon.png" | absURL }}" />
     <link rel="icon" type="image/png" sizes="32x32" href="{{ "/favicon-32x32.png" | absURL }}" />
     <link rel="icon" type="image/png" sizes="16x16" href="{{ "/favicon-16x16.png" | absURL }}" />
     <link rel="manifest" href="{{ "/site.webmanifest" | absURL }}" />
+  {{ end }}
   {{/* Site Verification */}}
   {{ with .Site.Params.verification.google }}
     <meta name="google-site-verification" content="{{ . }}" />
@@ -50,15 +56,19 @@
   {{/* Social */}}
   {{ template "_internal/opengraph.html" . }}
   {{ template "_internal/twitter_cards.html" . }}
+  {{/* Schema */}}
+  {{ template "_internal/schema.html" . }}
   {{/* Generator */}}
+  {{ if .Site.Params.attribution | default true }}
     {{ hugo.Generator }}
+  {{ end }}
   {{/* Me */}}
   {{ with .Site.Author.name }}<meta name="author" content="{{ . }}" />{{ end }}
-  {{ with .Site.Author.email }}<link href="mailto:{{ . }}" rel="me" />{{ end }}
+  {{ with .Site.Author.links }}
-  {{ with .Site.Author.twitter }}<link href="{{ . }}" rel="me" />{{ end }}
+    {{ range $links := . }}
-  {{ with .Site.Author.keybase }}<link href="{{ . }}" rel="me" />{{ end }}
+      {{ range $name, $url := $links }}<link href="{{ $url }}" rel="me" />{{ end }}
-  {{ with .Site.Author.github }}<link href="{{ . }}" rel="me" />{{ end }}
+    {{ end }}
-  {{ with .Site.Author.linkedin }}<link href="{{ . }}" rel="me" />{{ end }}
+  {{ end }}
   {{/* Analytics */}}
   {{ partialCached "analytics.html" .Site }}
   {{/* Extend head - eg. for custom analytics scripts, etc. */}}

layouts/partials/header.html

@@ -1,11 +1,11 @@
-<header class="flex justify-between py-10 font-semibold ">
+<header class="flex justify-between py-6 font-semibold sm:py-10">
   <div>
     <a class="hover:underline" rel="me" href="{{ .Site.BaseURL }}">{{ .Site.Title }}</a>
   </div>
   <nav>
-    <ul class="flex list-none">
+    <ul class="flex flex-col list-none sm:flex-row">
       {{ range .Site.Menus.main }}
-        <li class="mr-7 last:mr-0">
+        <li class="text-right sm:mr-7 sm:last:mr-0">
           <a class="hover:underline" href="{{ .URL }}" title="{{ .Title }}">{{ .Name }}</a>
         </li>
       {{ end }}

layouts/partials/heading-anchor.html

@@ -1 +0,0 @@
-{{ . | replaceRE "(<h[2-4] id=\"([^\"]+)\".+)(</h[2-9]+>)" `${1}&nbsp;<a class="heading-anchor" href="#${2}" aria-label="Anchor">#</a> ${3}` | safeHTML }}

layouts/partials/home/page.html

@@ -0,0 +1,8 @@
+<article class="max-w-full prose dark:prose-light">
+  {{ with .Title }}
+    <header>
+      <h1>{{ . | emojify }}</h1>
+    </header>
+  {{ end }}
+  <section>{{ .Content | emojify }}</section>
+</article>

layouts/partials/home/profile.html

@@ -0,0 +1,21 @@
+<article
+  class="flex flex-col items-center justify-center text-center
+  {{ if not .Site.Params.homepage.showList -}}
+    h-full
+  {{- else -}}
+    mb-8
+  {{- end }}"
+>
+  <header class="flex flex-col items-center mb-3">
+    {{ with .Site.Author.image }}
+      <img class="mb-2 rounded-full w-36 h-36" src="{{ . }}" />
+    {{ end }}
+    <h1 class="text-4xl font-extrabold">
+      {{ .Site.Author.name | default .Site.Title }}
+    </h1>
+    <div class="mt-1 text-2xl">
+      {{ partialCached "author-links.html" . }}
+    </div>
+  </header>
+  <section class="prose dark:prose-light">{{ .Content | emojify }}</section>
+</article>

layouts/partials/icon.html

@@ -1,4 +1,6 @@
 <span class="relative inline-block align-text-bottom icon">
   {{ $icon := resources.Get (print "icons/" . ".svg") }}
-  {{ $icon | safeHTML }}
+  {{ if $icon }}
+    {{ $icon.Content | safeHTML }}
+  {{ end }}
 </span>

layouts/partials/meta.html

@@ -1,8 +0,0 @@
-<time datetime="{{ .Date }}">{{ .Date.Format "2 January 2006" }}</time>
-{{ if ne .ReadingTime 0 }}
-  <span class="px-1">&middot;</span>
-  <span title="Reading time">
-    {{ .ReadingTime }}
-    min{{ if gt .ReadingTime 1 }}s{{ end }}
-  </span>
-{{ end }}

layouts/partials/pagination.html

@@ -1,41 +1,34 @@
-<!-- See: https://glennmccomb.com/articles/how-to-build-custom-hugo-pagination/ -->
-<!-- Assign .Paginator object to a $paginator variable -->
 {{ $paginator := .Paginator }}
-<!-- If there's more than one page. -->
 {{ if gt $paginator.TotalPages 1 }}
-  <ul class="Pagination">
+  <ul class="flex flex-row mt-8">
-    <!-- Previous page. -->
     {{ if $paginator.HasPrev }}
-      <li class="Pagination-item Pagination-item--previous">
+      <li>
         <a
           href="{{ $paginator.Prev.URL }}"
-          class="Pagination-itemLink Pagination-itemLink--previous"
+          class="mx-1 block min-w-[1.8rem] text-center hover:bg-primary-600 hover:text-white rounded"
           rel="prev"
         >
           &larr;
         </a>
       </li>
     {{ end }}
-
-
-    <!-- Page numbers. -->
     {{ range $paginator.Pagers }}
-      <li
+      <li>
-        class="Pagination-item{{ if eq . $paginator }}
+        <a
-          Pagination-item--current
+          href="{{ .URL }}"
+          class="mx-1 block min-w-[1.8rem] text-center hover:bg-primary-600 hover:text-white rounded {{ if eq . $paginator }}
+            bg-primary-200 dark:bg-primary-400 dark:text-gray-800
           {{ end }}"
         >
-        <a href="{{ .URL }}" class="Pagination-itemLink"> {{ .PageNumber }} </a>
+          {{ .PageNumber }}
+        </a>
       </li>
     {{ end }}
-
-
-    <!-- Next page. -->
     {{ if $paginator.HasNext }}
-      <li class="Pagination-item Pagination-item--next">
+      <li>
         <a
           href="{{ $paginator.Next.URL }}"
-          class="Pagination-itemLink Pagination-itemLink--next"
+          class="mx-1 block min-w-[1.8rem] text-center hover:bg-primary-600 hover:text-white rounded"
           rel="next"
         >
           &rarr;

layouts/partials/section-heading.html

@@ -1,4 +1,4 @@
-<section>
+<section class="prose dark:prose-light">
   <h1 class="mb-3 text-4xl font-extrabold">{{ .Title }}</h1>
-  <p class="mt-8 mb-12 text-gray-400 dark:text-gray-500">{{ .Description }}</p>
+  <section>{{ .Content }}</section>
 </section>

layouts/partials/sharing-links.html

@@ -0,0 +1,15 @@
+{{ with .Site.Params.article.sharingLinks }}
+  {{ $links := site.Data.sharing }}
+  <section class="flex flex-row flex-wrap justify-center pt-4 text-xl">
+    {{ range . }}
+      {{ with index $links . }}
+        <a
+          class="bg-gray-300 text-gray-700 dark:bg-gray-700 dark:text-gray-300 dark:hover:bg-primary-400 dark:hover:text-gray-800 m-1 hover:bg-primary-500 hover:text-white rounded min-w-[2.4rem] inline-block text-center p-1"
+          href="{{ printf .url $.Permalink $.Title }}"
+          title="{{ .title }}"
+          >{{ partial "icon.html" .icon }}</a
+        >
+      {{ end }}
+    {{ end }}
+  </section>
+{{ end }}

layouts/shortcodes/alert.html

@@ -1,6 +1,6 @@
 <div class="flex px-4 py-3 rounded-md bg-primary-100 dark:bg-primary-900">
   <span class="pr-3 text-primary-400">
-    {{ partial "icon.html" "exclamation-triangle-solid" }}
+    {{ partial "icon.html" "exclamation-triangle" }}
   </span>
   <span class="no-prose dark:text-gray-300">
     {{- .Inner | markdownify -}}

layouts/shortcodes/badge.html

@@ -0,0 +1 @@
+{{ partial "badge.html" .Inner }}

layouts/shortcodes/button.html

@@ -0,0 +1,7 @@
+<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"
+  {{ with .Get "href" }}href="{{ . }}"{{ end }}
+  {{ with .Get "target" }}target="{{ . }}"{{ end }}
+  role="button"
+  >{{ .Inner }}
+</a>

layouts/shortcodes/icon.html

@@ -1,4 +1,8 @@
 <span class="relative inline-block align-text-bottom icon">
-  {{ $icon := resources.Get (print "icons/" . ".svg") }}
+  {{ $icon := resources.Get (printf "icons/%s.svg" ($.Get 0)) }}
-  {{ $icon | safeHTML }}
+  {{ if $icon }}
+    {{ $icon.Content | safeHTML }}
+  {{ else }}
+    <em>Icon not found.</em>
+  {{ end }}
 </span>

package.json

@@ -5,7 +5,8 @@
   "main": "index.js",
   "scripts": {
     "dev": "NODE_ENV=development ./node_modules/tailwindcss/lib/cli.js -i ./assets/css/main.css -o ./static/css/main.css --jit -w",
-    "build": "NODE_ENV=production ./node_modules/tailwindcss/lib/cli.js -i ./assets/css/main.css -o ./static/css/main.css --jit --minify"
+    "build": "NODE_ENV=production ./node_modules/tailwindcss/lib/cli.js -i ./assets/css/main.css -o ./static/css/main.css --jit --minify",
+    "example": "hugo server --source exampleSite --themesDir ../.. --buildDrafts"
   },
   "repository": {
     "type": "git",

tailwind.config.js

@@ -46,6 +46,9 @@ module.exports = {
               code: {
                 color: theme("colors.secondary.700"),
               },
+              "pre code": {
+                color: theme("colors.gray.700"),
+              },
               pre: {
                 backgroundColor: theme("colors.gray.50"),
               },
@@ -56,6 +59,11 @@ module.exports = {
                 fontSize: "0.9rem",
                 fontWeight: "600",
               },
+              mark: {
+                backgroundColor: theme("colors.secondary.200"),
+                padding: "0.1rem 0.2rem",
+                borderRadius: "0.12rem",
+              },
             },
           ],
         },
@@ -107,6 +115,9 @@ module.exports = {
                 color: theme("colors.gray.200"),
                 backgroundColor: theme("colors.gray.700"),
               },
+              "pre code": {
+                color: theme("colors.gray.200"),
+              },
               thead: {
                 color: theme("colors.white"),
                 borderBottomColor: theme("colors.gray.400"),
@@ -118,6 +129,9 @@ module.exports = {
                 backgroundColor: theme("colors.gray.700"),
                 color: theme("colors.gray.300"),
               },
+              mark: {
+                backgroundColor: theme("colors.secondary.400"),
+              },
             },
           ],
         },