Merge branch 'master' into fix/relative_images

README.md

@@ -8,7 +8,7 @@
 See the live demo (of the default configuration) here:
 https://pawroman.github.io/zola-theme-terminimal/
 
-Tested with Zola v0.16.1. Please note that earlier versions might not work because of breaking changes across Zola versions.
+Tested with Zola v0.17.2. Please note that earlier versions might not work because of breaking changes across Zola versions.
 
 #### Fork disclaimer
 
@@ -18,49 +18,18 @@ https://github.com/panr/hugo-theme-terminal
 
 Many thanks for that outstanding original theme, Radek!
 
-## Changes compared to the original theme
+For more information about this fork and the differences to the original theme, please see:
+[Changes compared to the original theme](#changes-compared-to-the-original-theme) below.
 
-- Slight changes in the layout and styling.
-    - Content has been centered (instead of left-aligned).
-    - The header stripes have been spaced out.
-    - Tweaks to pagination, especially on mobile (small screens).
-    - The post title underline is dashed instead of doubly-dotted.
-    - All links are underlined, as per
-      [Brutalist Web Design Guidelines](https://www.brutalist-web.design/).
-    - Tweaks to header font sizes.
-    - Minor footer tweaks.
+## Versioning
 
-- Absolutely **no JavaScript**.
-    - No JavaScript needed to pre-process anything.
-      Zola with its Sass pre-processor is the only dependency.
-    - There's no menu trigger.
-    - Things load crazy fast, as it's all static content.
-    - Prism.js syntax highlighting is not supported (you can use
-      [Zola's](https://www.getzola.org/documentation/content/syntax-highlighting/)).
-
-- All references to social media (e.g. Twitter, OpenGraph) have been removed.
-
-- All references to external URLs (e.g. Google CDN) have been removed.
-  This theme's static assets are meant to be served from where it's hosted.
-
-- [Hack](https://github.com/source-foundry/Hack) is the default font.
-
-- The default color theme is blue (original uses orange).
-
-### New features
-
-- You can pick the accent color as well as background color.
-  There's a new `dark` background. See [Configuration](#configuration)
-  below for details.
-- Active "section" links will change color indicating the
-  active section. This is all static, done at template level. 
+This theme used to be non-versioned, e.g. you'd pull the master branch, and occasionally new features or fixes would
+be released.
 
-## Features retained from the original
+Starting from version v1.0.0, the project adopted [Semantic Versioning](https://semver.org/).
 
-- 5 color themes, depending on your preference:
-  blue (default), green, orange, pink, red.
-- The shortcodes `image` and `figure` (See [Shortcodes](#shortcodes)).
-- Fully responsive.
+Please check the [GitHub releases](https://github.com/pawroman/zola-theme-terminimal/releases) to see a change log
+and work out if there's any breaking changes.
 
 ## How to start
 
@@ -117,7 +86,7 @@ Example:
 
 Same as `image`, but with a few extra optional arguments:
 
-- **`caption`**
+- **`caption`** (supports markdown)
 - **`caption_position`** (center \[default\] | left | right)
 - **`caption_style`**
 
@@ -128,12 +97,44 @@ Example:
           style="width: 25%;",
           position="right",
           caption_position="left",
-          caption="Ferris, the (unofficial) Rust mascot",
-          caption_style="font-weight: bold; font-style: italic;") }}
+          caption="**Ferris**, the (unofficial) Rust mascot",
+          caption_style="font-style: italic;") }}
+```
+
+## OpenGraph
+
+To add an image to a post, set the `og_image` extra option to the desired image
+in the same directory of the markdown file:
+
+```toml
+[extra]
+og_image = "colocated_image.png"
+```
+
+Additionally, for the section pages and for posts to have a fallback image, add
+`default_og_image` to the `[extra]` section:
+
+```toml
+[extra]
+default_og_image = "static/ocean.jpg"
 ```
 
 ## Configuration
 
+### Only show the post's description
+
+On each post you can specify the following:
+
+```toml
+description = "test description"
+
+[extra]
+show_only_description = true
+```
+
+This will render `test description` under this
+particular post on the homepage instead of a summary.
+
 ### Colors
 
 Both the accent colors and background colors are
@@ -149,13 +150,14 @@ of your `config.toml`:
 [extra]
 
 # One of: blue, green, orange, pink, red.
-# Defaults to blue. 
+# Defaults to blue.
+# Append -light for light themes, e.g. blue-light
+# Or append -auto, e.g. blue-auto
 accent_color = "green"
 
-# One of: blue, dark, green, orange, pink, red.
-# Enabling dark background will also modify primary font color
-# to be darker.
-# Defaults to accent color (or, if not accent color specified, to blue). 
+# One of: blue, dark, green, orange, pink, red, light, auto
+# Enabling dark background will also modify primary font color to be darker.
+# Defaults to accent color (or, if not accent color specified, to blue).
 background_color = "dark"
 ```
 
@@ -366,6 +368,52 @@ base template, `index.html`, create file like this in `templates/index.html`:
 If you spot any bugs or wish to contribute new features, please create a new
 [Pull Request](https://github.com/pawroman/zola-theme-terminimal/pulls).
 
+## Changes compared to the original theme
+
+This theme has been forked from https://github.com/panr/hugo-theme-terminal
+
+- Slight changes in the layout and styling.
+  - Content has been centered (instead of left-aligned).
+  - The header stripes have been spaced out.
+  - Tweaks to pagination, especially on mobile (small screens).
+  - The post title underline is dashed instead of doubly-dotted.
+  - All links are underlined, as per
+    [Brutalist Web Design Guidelines](https://www.brutalist-web.design/).
+  - Tweaks to header font sizes.
+  - Minor footer tweaks.
+
+- Absolutely **no JavaScript**.
+  - No JavaScript needed to pre-process anything.
+    Zola with its Sass pre-processor is the only dependency.
+  - There's no menu trigger.
+  - Things load crazy fast, as it's all static content.
+  - Prism.js syntax highlighting is not supported (you can use
+    [Zola's](https://www.getzola.org/documentation/content/syntax-highlighting/)).
+
+- All references to social media (e.g. Twitter) have been removed.
+
+- All references to external URLs (e.g. Google CDN) have been removed.
+  This theme's static assets are meant to be served from where it's hosted.
+
+- [Hack](https://github.com/source-foundry/Hack) is the default font.
+
+- The default color theme is blue (original uses orange).
+
+### New features
+
+- You can pick the accent color as well as background color.
+  There's a new `dark` background. See [Configuration](#configuration)
+  below for details.
+- Active "section" links will change color indicating the
+  active section. This is all static, done at template level.
+
+### Features retained from the original
+
+- 5 color themes, depending on your preference:
+  blue (default), green, orange, pink, red.
+- The shortcodes `image` and `figure` (See [Shortcodes](#shortcodes)).
+- Fully responsive.
+
 ## License
 
 Copyright © 2019 Paweł Romanowski (pawroman)

config.toml

@@ -5,6 +5,12 @@ title = "Zola Terminimal theme"
 # Sass compilation is required
 compile_sass = true
 
+# The theme supports feeds (RSS and ATOM)
+generate_feed = true
+
+# Use `rss.xml` for RSS feeds and `atom.xml` for ATOM.
+feed_filename = "atom.xml"
+
 # Optional: enable tags
 taxonomies = [
     {name = "tags"}
@@ -19,11 +25,12 @@ highlight_theme = "boron"
 
 # One of: blue, green, orange, pink, red.
 # Defaults to blue.
+# Append -light for light themes, e.g. blue-light
+# Or append -auto, e.g. blue-auto
 accent_color = "blue"
 
-# One of: blue, dark, green, orange, pink, red.
-# Enabling dark background will also modify primary font color
-# to be darker.
+# One of: blue, dark, green, orange, pink, red, light, auto
+# Enabling dark background will also modify primary font color to be darker.
 # Defaults to accent color (or, if not accent color specified, to blue).
 background_color = "blue"
 
@@ -89,3 +96,8 @@ use_full_hack_font = false
 #
 # Note that the main (index) page only has the main title.
 page_titles = "main_only"
+
+# Optional: default image to use for OpenGraph.
+#           If the page doesnt set og_image, use this one as fallback. Usefull
+#           for indexes and taxonomies' pages.
+#default_og_image = "static/ocean.jpg"

content/welcome-terminimal-theme.md

@@ -77,16 +77,16 @@ figure(src="http://rustacean.net/assets/rustacean-flat-gesture.png",
        style="width: 25%;",
        position="center",
        caption_position="left",
-       caption="Ferris, the (unofficial) Rust mascot",
+       caption="**Ferris**, the (unofficial) Rust mascot",
        caption_style="font-weight: bold; font-style: italic;")
 ```
 
 {{ figure(src="http://rustacean.net/assets/rustacean-flat-gesture.png",
           style="width: 25%;",
           position="center",
           caption_position="left",
-          caption="Ferris, the (unofficial) Rust mascot",
-          caption_style="font-weight: bold; font-style: italic;") }}
+          caption="**Ferris**, the (unofficial) Rust mascot",
+          caption_style="font-style: italic;") }}
 
 ---
 

sass/color/background_auto.scss

@@ -0,0 +1,14 @@
+:root {
+
+  @media (prefers-color-scheme: light) {
+    --background: white;
+
+    --color: #101010;
+  }
+
+  @media (prefers-color-scheme: dark) {
+    --background: #101010;
+
+    --color: #A9B7C6;
+  }
+}

sass/color/background_light.scss

@@ -0,0 +1,3 @@
+:root {
+  --background: #f0f0f0;
+}

sass/color/blue-auto.scss

@@ -0,0 +1,29 @@
+:root {
+  @media (prefers-color-scheme: dark) {
+    --accent: rgb(35,176,255);
+    --accent-alpha-70: rgba(35,176,255,.7);
+    --accent-alpha-20: rgba(35,176,255,.2);
+
+    --background: #101010;
+    --color: #f0f0f0;
+    --border-color: rgba(255,240,224,.125);
+
+    div.logo {
+      color: black;
+    }
+
+  }
+  @media (prefers-color-scheme: light) {
+    --accent: rgb(32,128,192);
+    --accent-alpha-70: rgba(32,128,192,.7);
+    --accent-alpha-20: rgba(32,128,192,.2);
+
+    --background: white;
+    --color: #201030;
+    --border-color: rgba(0,0,16,.125);
+
+    div.logo {
+      color: white;
+    }
+  }
+}

sass/color/blue-light.scss

@@ -0,0 +1,12 @@
+:root {
+  --accent: rgb(32,128,192);
+  --accent-alpha-70: rgba(32,128,192,.7);
+  --accent-alpha-20: rgba(32,128,192,.2);
+
+  --background: white;
+  --color: #1D212C;
+  --border-color: rgba(0, 0, 0, .1);
+  div.logo {
+    color: white;
+  }
+}

sass/color/green-auto.scss

@@ -0,0 +1,29 @@
+:root {
+  @media (prefers-color-scheme: dark) {
+    --accent: rgb(120,226,160);
+    --accent-alpha-70: rgba(120,226,160,.7);
+    --accent-alpha-20: rgba(120,226,160,.2);
+
+    --background: #101010;
+    --color: #f0f0f0;
+    --border-color: rgba(255,240,224,.125);
+
+    div.logo {
+      color: black;
+    }
+
+  }
+  @media (prefers-color-scheme: light) {
+    --accent: rgb(24, 192, 128);
+    --accent-alpha-70: rgba(24, 192, 128,.7);
+    --accent-alpha-20: rgba(24, 192, 128,.2);
+
+    --background: white;
+    --color: #201030;
+    --border-color: rgba(0,0,16,.125);
+
+    div.logo {
+      color: white;
+    }
+  }
+}

sass/color/green-light.scss

@@ -0,0 +1,12 @@
+:root {
+  --accent: rgb(24, 192, 128);
+  --accent-alpha-70: rgba(24, 192, 128,.7);
+  --accent-alpha-20: rgba(24, 192, 128,.2);
+
+  --background: white;
+  --color: #1D212C;
+  --border-color: rgba(0, 0, 0, .1);
+  div.logo {
+    color: white;
+  }
+}

sass/color/orange-auto.scss

@@ -0,0 +1,29 @@
+:root {
+  @media (prefers-color-scheme: dark) {
+    --accent: rgb(255,168,106);
+    --accent-alpha-70: rgba(255,168,106,.7);
+    --accent-alpha-20: rgba(255,168,106,.2);
+
+    --background: #101010;
+    --color: #f0f0f0;
+    --border-color: rgba(255,240,224,.125);
+
+    div.logo {
+      color: black;
+    }
+
+  }
+  @media (prefers-color-scheme: light) {
+    --accent: rgb(240,128,48);
+    --accent-alpha-70: rgba(240,128,48,.7);
+    --accent-alpha-20: rgba(240,128,48,.2);
+
+    --background: white;
+    --color: #201030;
+    --border-color: rgba(0,0,16,.125);
+
+    div.logo {
+      color: white;
+    }
+  }
+}