Merge pull request #92 from markdumay/develop

Fix spacing of blog captions #87

README.md

@@ -110,7 +110,7 @@ The main site configuration is available in `./config/_default`. Some remarks:
 
 - **Menu items** - `menus/menus.en.toml` contains language-specific items for the navigation bar and social media links for the home page's footer.
 - **Content** - Ensure the `mainSections` in `config.toml` is synchronized with the `content` folder, default values are `["blog", "projects"]`.
-- **Theme color** - Update `themeColor` and `themeOpacity` within the `[style]` section of `params.toml` to update the site's primary color and opacity. You can use the [WCAG Color Contrast Checker][contrast_checker] to validate the contrast ratio of your color to improve accessibility.
+- **Theme style** - Update `themeColor` and `themeOpacity` within the `[style]` section of `params.toml` to update the site's primary color and opacity. You can use the [WCAG Color Contrast Checker][contrast_checker] to validate the contrast ratio of your color to improve accessibility. Additionally, set `themeFont` and `themeFontPath` to override the default font.
 - **Comments** - Comments are powered by [utterances][utterances], a lightweight comments widget built on GitHub issues. Update the `repo`  of the `[comments]` section of `params.toml`.
 - **Security policy** - The theme uses rather strict security policies by default. Be sure to include references to external sources in the header configuration to avoid broken links. The settings of the local development server are defined in `server.toml`. Similar settings are defined in the `netlify.toml` file provided in the repository's root when deploying to [Netlify][netlify].
 

assets/scss/app.scss

@@ -1,5 +1,6 @@
 // Define template variables 
 $themeColor:                    {{ site.Params.style.themeColor | default "#007bff" }};
+$themeFont:                     {{ site.Params.style.themeFont | default "Inter" }};
 $carousel-control-prev-icon-bg: url("/img/carousel_prev.svg") !default;
 $carousel-control-next-icon-bg: url("/img/carousel_next.svg") !default;
 

assets/scss/common/_variables.scss

@@ -8,7 +8,7 @@ $fa-font-path:                  "../fonts";
 // Remove the border from the focused navigation toggler
 $navbar-toggler-focus-width:    0 !default;
 
-$font-family-sans-serif:        "Inter", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !default;
+$font-family-sans-serif:        $themeFont, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !default;
 $headings-font-weight:          600 !default;
 $font-weight-lighter:           lighter !default;
 $font-weight-light:             200 !default;

config/_default/params.toml

@@ -46,6 +46,8 @@ schemaSection = "blog"
 [style]
     themeColor = "#D43900" #00b0f0
     themeOpacity = "10"
+    themeFont = "Inter"
+    themeFontPath = "https://fonts.googleapis.com/css2?family=Inter:wght@200;300;600&display=swap"
 
 [main]
     featurePhoto = "/img/sunrise.jpg" # source: https://unsplash.com/photos/ZX6BPboJrYk

content/en/blog/rich-content.md

@@ -3,7 +3,7 @@ author: "Hugo Authors"
 title: "Rich Content"
 date: 2021-07-13
 description: "A brief description of Hugo Shortcodes"
-tags: ["shortcodes", "privacy"]
+tags: ["shortcode", "privacy"]
 thumbnail: img/flowers.jpg # https://picsum.photos/id/106/2592/1728
 photoCredits: <a href="https://unsplash.com/@flutterhappy">Arvee Marie</a>
 photoSource: <a href="https://unsplash.com/photos/YnfGtpt2gf4">Unsplash</a>

content/nl/blog/rich-content.md

@@ -4,7 +4,7 @@ slug: "multimedia"
 title: "Multimedia"
 date: 2021-07-13
 description: "Een overzicht van enkele Hugo Shortcodes"
-tags: ["shortcodes", "privacy"]
+tags: ["shortcode", "privacy"]
 thumbnail: img/flowers.jpg # https://picsum.photos/id/106/2592/1728
 photoCredits: <a href="https://unsplash.com/@flutterhappy">Arvee Marie</a>
 photoSource: <a href="https://unsplash.com/photos/YnfGtpt2gf4">Unsplash</a>

i18n/de.yaml

@@ -0,0 +1,108 @@
+# Content
+- id: postedOnDate
+  translation: "Veröffentlicht am {{ . }}"
+- id: lastModified
+  translation: "(Zuletzt verändert am {{ . }})"
+- id: translationsLabel
+  translation: "Andere Sprachen: "
+- id: translationsSeparator
+  translation: ", "
+- id: readMore
+  translation: "Weiterlesen"
+- id: morePosts
+  translation: "Weitere Beiträge"
+- id: olderPosts
+  translation: "Ältere Beiträge"
+- id: recentPosts
+  translation: "Aktuelle Beiträge"
+- id: newerPosts
+  translation: "Neuere Beiträge"
+- id: previousPost
+  translation: "Vorheriger Beitrag"
+- id: nextPost
+  translation: "Nächster Beitrag"
+- id: read
+  translation: "Lesezeit"
+- id: minutesShort
+  translation: "Min."
+- id: words
+  translation: "Wörter"
+- id: copyright
+  translation: "Copyright"
+- id: photoBy
+  translation: "Foto von"
+- id: photoOn
+  translation: "auf"
+- id: article
+  translation: "Artikel"
+- id: articles
+  translation: "Artikel"
+- id: paginationPrevious
+  translation: "Vorherige"
+- id: paginationNext
+  translation: "Nächste"
+- id: paginationFirst
+  translation: "Erste"
+- id: paginationLast
+  translation: "Letzte"
+
+# 404 page
+- id: pageNotFound
+  translation: "Ups! Diese Seite existiert nicht. Versuche es über die"
+- id: pageNotFoundTitle
+  translation: "Nicht gefunden"
+- id: pageNotFoundHome
+  translation: "Startseite"
+
+
+# Navigation
+- id: toggleNavigation
+  translation: "Navigation umschalten"
+- id: languageSwitcherLabel
+  translation: "Sprache"
+- id: gcseLabelShort
+  translation: "Suche"
+- id: gcseLabelLong
+  translation: "Suche {{ .Site.Title }}"
+- id: gcseClose
+  translation: "Schließen"
+
+# Staticman
+- id: noComment
+  translation: "Kein Kommentar"
+- id: oneComment
+  translation: "Kommentar"
+- id: moreComment
+  translation: "Kommentare"
+- id: useMarkdown
+  translation: "Du kannst Markdown-Syntax benutzen"
+- id: yourName
+  translation: "Dein Name"
+- id: yourEmail
+  translation: "Deine E-Mail-Adresse"
+- id: yourWebsite
+  translation: "Deine Webseite"
+
+# Delayed Disqus
+- id: show
+  translation: "Zeige"
+- id: comments
+  translation: "Kommentare"
+
+# Related posts
+- id: seeAlso
+  translation: "Siehe auch"
+
+# Table of contents
+- id: toc
+  translation: "Auf dieser Seite"
+
+# Search
+- id: ui_search
+  translation: "Durchsuche diese Seite..."
+- id: ui_no_results
+  translation: "Keine Ergebnisse für"
+
+# Draft
+- id: draft
+  translation: "Entwurf"

i18n/en.yaml

@@ -37,7 +37,14 @@
   translation: "Article"
 - id: articles
   translation: "Articles"
-
+- id: paginationPrevious
+  translation: "Previous"
+- id: paginationNext
+  translation: "Next"
+- id: paginationFirst
+  translation: "First"
+- id: paginationLast
+  translation: "Last"
 
 # 404 page
 - id: pageNotFound

i18n/nl.yaml

@@ -37,7 +37,14 @@
   translation: "Artikel"
 - id: articles
   translation: "Artikelen"
-
+- id: paginationPrevious
+  translation: "Vorige"
+- id: paginationNext
+  translation: "Volgende"
+- id: paginationFirst
+  translation: "Eerste"
+- id: paginationLast
+  translation: "Laatste"
 
 # 404 page
 - id: pageNotFound

layouts/partials/assets/blog-card.html

@@ -8,10 +8,10 @@
         <p class="card-text">
             <small class="text-muted text-uppercase">
                 {{- partial "utilities/date.html" (dict "date" .Date "format" "long") -}}
-                &bull; {{ .ReadingTime }}&nbsp;{{ i18n "minutesShort" }} {{ i18n "read" }}
+                &nbsp;&bull; {{ .ReadingTime }} {{ i18n "minutesShort" }} {{ i18n "read" }}
                 {{ if isset .Params "tags" -}}
-                    {{ range first 1 .Params.tags -}}
-                        &bull; <a href="{{ $.Site.BaseURL }}tags/{{ . | urlize }}" class="text-decoration-none text-primary" aria-label="Tag: {{ . }}">{{ . }}</a>
+                    {{ range first 1 (.GetTerms "tags") -}}
+                        &bull; <a href="{{ (path.Join .Page.RelPermalink) | relURL }}" class="text-decoration-none text-primary" aria-label="Tag: {{ .LinkTitle }}">{{ .LinkTitle }}</a>
                     {{ end -}}
                 {{ end -}}
             </small>

layouts/partials/assets/pagination.html

@@ -39,22 +39,22 @@
     {{- with .First }}
       {{- if ne $currentPageNumber .PageNumber }}
       <li class="page-item">
-        <a href="{{ .URL }}" aria-label="First" class="page-link" role="button"><span aria-hidden="true"><i class="fas fa-angle-double-left"></i></span></a>
+        <a href="{{ .URL }}" aria-label="{{ T "paginationFirst" }}" class="page-link" role="button"><span aria-hidden="true"><i class="fas fa-angle-double-left"></i></span></a>
       </li>
       {{- else }}
       <li class="page-item disabled">
-        <a aria-disabled="true" aria-label="First" class="page-link" role="button" tabindex="-1"><span aria-hidden="true"><i class="fas fa-angle-double-left"></i></span></a>
+        <a aria-disabled="true" aria-label="{{ T "paginationFirst" }}" class="page-link" role="button" tabindex="-1"><span aria-hidden="true"><i class="fas fa-angle-double-left"></i></span></a>
       </li>
       {{- end }}
     {{- end }}
 
     {{- with .Prev }}
       <li class="page-item">
-        <a href="{{ .URL }}" aria-label="Previous" class="page-link" role="button"><span aria-hidden="true">Previous</span></a>
+        <a href="{{ .URL }}" aria-label="{{ T "paginationPrevious" }}" class="page-link" role="button"><span aria-hidden="true">{{ T "paginationPrevious" }}</span></a>
       </li>
     {{- else }}
       <li class="page-item disabled">
-        <a aria-disabled="true" aria-label="Previous" class="page-link" role="button" tabindex="-1"><span aria-hidden="true">Previous</span></a>
+        <a aria-disabled="true" aria-label="{{ T "paginationPrevious" }}" class="page-link" role="button" tabindex="-1"><span aria-hidden="true">{{ T "paginationPrevious" }}</span></a>
       </li>
     {{- end }}
 
@@ -79,22 +79,22 @@
 
     {{- with .Next }}
       <li class="page-item">
-        <a href="{{ .URL }}" aria-label="Next" class="page-link" role="button"><span aria-hidden="true">Next</span></a>
+        <a href="{{ .URL }}" aria-label="{{ T "paginationNext" }}" class="page-link" role="button"><span aria-hidden="true">{{ T "paginationNext" }}</span></a>
       </li>
     {{- else }}
       <li class="page-item disabled">
-        <a aria-disabled="true" aria-label="Next" class="page-link" role="button" tabindex="-1"><span aria-hidden="true">Next</span></a>
+        <a aria-disabled="true" aria-label="{{ T "paginationNext" }}" class="page-link" role="button" tabindex="-1"><span aria-hidden="true">{{ T "paginationNext" }}</span></a>
       </li>
     {{- end }}
 
     {{- with .Last }}
       {{- if ne $currentPageNumber .PageNumber }}
       <li class="page-item">
-        <a href="{{ .URL }}" aria-label="Last" class="page-link" role="button"><span aria-hidden="true"><i class="fas fa-angle-double-right"></i></span></a>
+        <a href="{{ .URL }}" aria-label="{{ T "paginationLast" }}" class="page-link" role="button"><span aria-hidden="true"><i class="fas fa-angle-double-right"></i></span></a>
       </li>
       {{- else }}
       <li class="page-item disabled">
-        <a aria-disabled="true" aria-label="Last" class="page-link" role="button" tabindex="-1"><span aria-hidden="true"><i class="fas fa-angle-double-right"></i></span></a>
+        <a aria-disabled="true" aria-label="{{ T "paginationLast" }}" class="page-link" role="button" tabindex="-1"><span aria-hidden="true"><i class="fas fa-angle-double-right"></i></span></a>
       </li>
       {{- end }}
     {{- end }}
@@ -110,14 +110,14 @@
     {{- with .First }}
       {{- if ne $currentPageNumber .PageNumber }}
       <li class="page-item">
-        <a href="{{ .URL }}" aria-label="First" class="page-link" role="button"><span aria-hidden="true">Previous</span></a>
+        <a href="{{ .URL }}" aria-label="{{ T "paginationFirst" }}" class="page-link" role="button"><span aria-hidden="true">{{ T "paginationFirst" }}</span></a>
       </li>
       {{- end }}
     {{- end }}
 
     {{- with .Prev }}
       <li class="page-item">
-        <a href="{{ .URL }}" aria-label="Previous" class="page-link" role="button"><span aria-hidden="true">Previous</span></a>
+        <a href="{{ .URL }}" aria-label="{{ T "paginationPrevious" }}" class="page-link" role="button"><span aria-hidden="true">{{ T "paginationPrevious" }}</span></a>
       </li>
     {{- end }}
 
@@ -142,16 +142,16 @@
 
     {{- with .Next }}
       <li class="page-item">
-        <a href="{{ .URL }}" aria-label="Next" class="page-link" role="button"><span aria-hidden="true">Next</span></a>
+        <a href="{{ .URL }}" aria-label="{{ T "paginationNext" }}" class="page-link" role="button"><span aria-hidden="true">{{ T "paginationNext" }}</span></a>
       </li>
     {{- end }}
 
     {{- with .Last }}
       {{- if ne $currentPageNumber .PageNumber }}
       <li class="page-item">
-        <a href="{{ .URL }}" aria-label="Last" class="page-link" role="button"><span aria-hidden="true"><i class="fas fa-angle-double-right"></i></span></a>
+        <a href="{{ .URL }}" aria-label="{{ T "paginationLast" }}" class="page-link" role="button"><span aria-hidden="true"><i class="fas fa-angle-double-right"></i></span></a>
       </li>
       {{- end }}
     {{- end }}
   {{- end }}
-{{- end -}}
+{{- end -}}

layouts/partials/assets/project-card.html

@@ -9,9 +9,9 @@
             
                 {{ if isset .Params "tags" }}
                     <small class="text-muted text-uppercase">
-                        {{ range $index, $element := .Params.tags }}
+                        {{ range $index, $element := (.GetTerms "tags") }}
                             {{ if gt $index 0 }}&bull; {{ end }}
-                            <a href="{{ $.Site.BaseURL }}tags/{{ . | urlize }}" class="text-decoration-none text-primary" aria-label="Tag: {{ . }}">{{ . }}</a>
+                            <a href="{{ (path.Join .Page.RelPermalink) | relURL }}" class="text-decoration-none text-primary" aria-label="Tag: {{ .LinkTitle }}">{{ .LinkTitle }}</a>
                         {{ end }}
                     </small>
                 {{ end }}            

layouts/partials/head/stylesheet.html

@@ -8,4 +8,4 @@
 {{ end -}}
     <link rel="preconnect" href="https://fonts.googleapis.com"> 
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> 
-    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@200;300;600&display=swap">
+    <link rel="stylesheet" href="{{ site.Params.style.themeFontPath | default "https://fonts.googleapis.com/css2?family=Inter:wght@200;300;600&display=swap" }}">

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "@markdumay/hugo-theme-hinode",
-  "version": "0.7.5",
+  "version": "0.7.8",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "@markdumay/hugo-theme-hinode",
-      "version": "0.7.5",
+      "version": "0.7.8",
       "hasInstallScript": true,
       "license": "MIT",
       "devDependencies": {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@markdumay/hugo-theme-hinode",
-  "version": "0.7.5",
+  "version": "0.7.8",
   "description": "Hinode is a clean blog theme for Hugo, an open-source static site generator",
   "main": "index.js",
   "publishConfig": {