Personalize the personal site

.travis.yml

@@ -3,14 +3,15 @@ language: generic
 
 before_install:
   - sudo apt-get update
-  - sudo apt-get install python3
-  - sudo apt-get install ruby wget graphviz
+  - sudo apt-get install python3 git
+  - sudo apt-get install ruby go jq wget graphviz
   - wget "https://github.com/gohugoio/hugo/releases/download/v${HUGO_RELEASE}/hugo_extended_${HUGO_RELEASE}_Linux-64bit.deb"
   - sudo dpkg -i *.deb
   - sudo gem install asciidoctor asciidoctor-diagram
+  - git clone https://git.sr.ht/~sircmpwn/openring && cd openring && go build
 
 script:
-  - hugo
+  - make build
 
 env:
   global:

Makefile

@@ -0,0 +1,11 @@
+.PHONY = build
+build: build-openring
+	hugo
+
+.PHONY = build-openring
+build-openring:
+	./bin/openring-create
+
+.PHONY = serve
+serve: build-openring
+	hugo serve --buildFuture

README.adoc

@@ -1,13 +1,13 @@
 = blog
 
-My blog.
+My blog featuring a fairly customized version of https://github.com/foo-dogsquared/hugo-theme-more-contentful/[my More Contentful Hugo theme].
 
 
 
 
 == Getting started
 
-Though, it's obvious but hey.
+Though, it's obvious but then again, you may not remember how to do well in a year.
 
 
 === Prerequisites
@@ -16,6 +16,7 @@ Though, it's obvious but hey.
 * Hugo
 * https://golang.org/[Go] runtime
 * https://asciidoctor.org/[Asciidoctor]
+* https://git.sr.ht/~sircmpwn/openring/[openring] (you can easily compile one yourself with the Go toolchain)
 
 
 === Setting up

assets/scss/extend.scss

@@ -2,6 +2,20 @@
   --accented-border-style: var(--base0C) solid 1px;
 }
 
+// Base
+footer {
+  margin-bottom: 1.5em;
+  > * {
+    margin-top: 1em;
+    margin-bottom: 0;
+  }
+}
+
+// Layouts
+.site__socials {
+  margin-top: 1em;
+}
+
 .post__meta--single {
   p > span:first-child {
     white-space: nowrap;
@@ -52,6 +66,10 @@ code[class*="language-"], pre[class*="language-"] {
     color: var(--base00);
     font-size: 0.9em;
     padding: 0.5em;
+
+    &::selection {
+      background: var(--base07);
+    }
   }
 
   > *.content {
@@ -74,3 +92,11 @@ code[class*="language-"], pre[class*="language-"] {
     justify-content: center;
   }
 }
+
+@media all and (max-width: 860px) {
+  .imageblock {
+    > .content {
+      width: 100% !important;
+    }
+  }
+}

assets/templates/openring-input.html

@@ -0,0 +1,53 @@
+<hr/>
+<section class="webring">
+  <h3>Posts from other blogs I follow</h3>
+  <section class="articles">
+    {{range .Articles}}
+    <div class="webring__article">
+      <a class="webring__title" href="{{.Link}}" target="_blank" rel="noopener">{{.Title}}</a>
+      <span class="webring__metadata">
+        <small class="webring__source">
+          via <a href="{{.SourceLink}}">{{.SourceTitle}}</a>
+        </small>
+        {{- if ne (datef "2006-01-02" .Date) "0001-01-01" }}
+        <small class="webring__date">- <date datetime="{{ .Date }}">{{.Date | datef "2006-01-02"}}</date></small>
+        {{- end }}
+      </span>
+    </div>
+    {{end}}
+  </section>
+  <p class="webring__attribution">
+    Generated by
+    <a href="https://git.sr.ht/~sircmpwn/openring">openring</a>
+  </p>
+</section>
+<style>
+.webring .articles {
+  margin: -0.5rem;
+}
+
+.webring__title {
+  margin: 0;
+}
+
+.webring__article {
+  flex: 1 1 0;
+  display: flex;
+  flex-direction: column;
+  margin: 0.5rem;
+  padding: 0.5rem;
+  background: var(--base01);
+  min-width: 9rem;
+}
+
+.webring__summary {
+  font-size: 0.8rem;
+  flex: 1 1 0;
+}
+
+.webring__attribution {
+  text-align: right;
+  font-size: 0.8rem;
+  color: var(--base03);
+}
+</style>

bin/openring-create

@@ -0,0 +1,22 @@
+#!/usr/bin/env bash
+
+LIMIT=5
+INPUT_TEMP="./assets/templates/openring-input.html"
+OUTPUT="./layouts/partials/openring.html"
+DATA="data/blogs.json"
+
+# Checks whether it is locally compiled or not.
+if [[ -a ./openring ]]; then
+    OPENRING="./openring/openring";
+else
+    OPENRING="openring";
+fi
+
+for feed in $(jq ".[]" "$DATA" | shuf --head-count $LIMIT); do
+    OPENRING="$OPENRING -s $feed";
+done
+
+OPENRING="$OPENRING -n $LIMIT < $INPUT_TEMP > $OUTPUT"
+
+echo "$OPENRING"
+eval $OPENRING

config.toml

@@ -1,6 +1,7 @@
 baseURL = "https://foo-dogsquared.github.io/"
 languageCode = "en-us"
 title = "Gabriel Arazas"
+enableGitInfo = true
 summaryLength = 0
 paginate = 40
 copyright = """
@@ -56,7 +57,7 @@ canonifyURLs = true
 [menu]
     [[menu.main]]
         identifier = "about"
-        name = "About"
+        name = "About me"
         url = "about/"
 
     [[menu.main]]
@@ -96,3 +97,6 @@ canonifyURLs = true
 [params]
     mainSections = ["posts", "projects"]
     toc = true
+    extraNotes = """
+    This site uses [Prism](https://prismjs.com/), [MathJax](https://www.mathjax.org/), and [GoatCounter analytics](https://foo-dogsquared.goatcounter.com/).
+    """

content/_index.adoc

@@ -13,7 +13,7 @@ You can see more what's my deal on xref:about.adoc[another page] because I want
 Welcome to my small home on the deepest corners of the internet, by the way.
 Have a seat and take a look in my digital cavern.
 
-.Here's my first productive digital art painting.
+.Here's my first productive digital art painting placeholder created with Krita.
 image::pp.webp[width=60%]
 
 {{< links >}}

data/blogs.json

@@ -0,0 +1,15 @@
+[
+    "https://alex-hhh.github.io/feeds/all.rss.xml",
+    "https://blog.yoshuawuyts.com/rss.xml",
+    "https://brettgilio.com/rss.xml",
+    "http://distill.pub/rss.xml",
+    "https://drewdevault.com/feed.xml",
+    "https://emersion.fr/blog/rss.xml",
+    "https://fasterthanli.me/index.xml",
+    "https://guix.gnu.org/feeds/blog.atom",
+    "https://kde.org/announcements/index.xml",
+    "https://ma.ttias.be/cronweekly/index.xml",
+    "https://protesilaos.com/codelog.xml",
+    "https://sachachua.com/blog/feed/",
+    "https://www.malloc47.com/rss.xml"
+]

layouts/_default/baseof.html

@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html lang="{{ .Site.LanguageCode | default "en" }}">
+  {{- partial "head.html" . -}}
+  <body>
+    {{- partial "components/theme-button.html" . }}
+    {{- partial "header.html" . -}}
+    {{- block "main" . }}{{- end }}
+    {{- partial "footer.html" . -}}
+    {{- if hugo.IsProduction -}}
+    <script data-goatcounter="https://foo-dogsquared.goatcounter.com/count" async src="//gc.zgo.at/count.js"></script>
+    {{- end }}
+  </body>
+</html>
+

layouts/_default/single.html

@@ -4,10 +4,10 @@
     <header>
         <h1>{{ .Title }}</h1>
     </header>
-    {{ partial "partials/components/post-meta.html" . }}
+    {{- partial "partials/components/post-meta.html" . }}
 
-    {{ $is_toc := cond (ne .Params.toc nil) .Params.toc $.Site.Params.toc }}
-    {{ if (and $is_toc (gt (countrunes .TableOfContents) 0)) }}
+    {{- $is_toc := cond (ne .Params.toc nil) .Params.toc $.Site.Params.toc }}
+    {{- if (and $is_toc (gt (countrunes .TableOfContents) 0)) }}
     <style>
     #TableOfContents:not(:empty)::before {
       content: "{{ i18n "table_of_contents" }}";
@@ -27,66 +27,70 @@
         {{- with .Params.author }}
         {{- $names := slice }}
         {{- range . }}{{ $names = $names | append .name }}{{ end }}
-        <!-- List the author(s) of the article. -->
         <p data-content-author="{{ jsonify $names }}">
         <span>{{ i18n "published_by" }}</span>
         <span>{{ delimit $names ", " (printf " %s " (i18n "and")) }}</span>
         </p>
-        {{- end }}
+        {{- end -}}
 
+        {{- /* Only show the creation date if the `date` field is valid. */ -}}
         {{- if ne (.PublishDate.Format "2006") "0001" -}}
-        <!-- Only show the creation date if the `date` field is valid. -->
         <p data-content-publication-date="{{ .PublishDate }}">
-        <!-- Creation date. -->
           <span>Published:</span>
           <span><time datetime="{{ .PublishDate.Format $timeFmt }}">{{ .PublishDate.Format $timeFmt }}</time></span>
         </p>
         {{- end }}
 
+        {{- /* Publication date */ -}}
         {{- if and (ne (.Date.Format "2006") "0001") (ne .Date .PublishDate) -}}
-        <!-- Publication date. -->
         <p data-content-creation-date="{{ .Date }}">
             <span>Created:</span>
             <span><time datetime="{{ .Date.Format "2006-01-02 15:04:05 -0700" }}">{{ .Date.Format $timeFmt }}</time></span>
         </p>
         {{- end }}
 
-        <!-- Modification date (will only appear if the publication date is less than the modified date.) -->
+        {{- /* Modification date (will only appear if the publication date is less than the modified date.) */ -}}
         {{- if ne .Date .Lastmod }}
         <p data-content-modification-date="{{ .Lastmod }}">
             <span>{{ i18n "updated_on" }}:</span>
             <span><time datetime="{{ .Lastmod.Format "2006-01-02 15:04:05 -0700" }}">{{ .Lastmod.Format $timeFmt }}</time></span>
-        </tr>
+        </p>
         {{- end }}
 
-       <!-- Link the translated versions if the article has at least one translated page. -->
+        {{- /* Link the translated versions if the article has at least one translated page. */ -}}
         {{- if .IsTranslated }}
         {{- $lang_links := slice }}
         {{- $langs := slice }}
         {{- range .Translations }}
           {{- $lang := cond (ne .Language.LanguageName nil) .Language.LanguageName .Lang }}
-          {{ $lang_links = $lang_links | append (printf "<a href=%s>%s</a>" .Permalink $lang) }}
-          {{ $langs = $langs | append $lang }}
+          {{- $lang_links = $lang_links | append (printf "<a href=%s>%s</a>" .Permalink $lang) }}
+          {{- $langs = $langs | append $lang }}
         {{- end }}
         <p data-content-translations="{{ jsonify $langs }}">
             <span>{{ i18n "available_translations" }}:</span>
             <span>{{ delimit $lang_links "," (printf " %s " (i18n "and")) }}</span>
-        </tr>
+        </p>
         {{- end }}
 
-        {{ with .Params.tags }}
-          <p>
-              <span>Topic:</span>
-          {{ $tags := slice }}
+        {{- with .Params.tags }}
+          {{- $tags := slice }}
           {{- range $index, $tag := . }}
-            {{ $tag := printf `<a href="%s#%s">%s</a>` ("/tags" | relLangURL) ($tag | urlize) $tag }}
-            {{ $tags = $tags | append $tag }}
-          {{ end }}
+            {{- $tag := printf `<a href="%s#%s">%s</a>` ("/tags" | relLangURL) ($tag | urlize) $tag }}
+            {{- $tags = $tags | append $tag }}
+          {{- end }}
+          <p data-content-tags="{{ jsonify $tags }}">
+            <span>Topic:</span>
             <span>{{ delimit $tags "." }}</span>
-          </tr>
+          </p>
         {{- end -}}
-      </tbody>
-    </table>
+
+        {{- with .GitInfo }}
+          <p data-content-hash="{{ .Hash }}">
+            <span>Hash:</span>
+            <span>{{ .Hash }}</span>
+          </p>
+        {{- end -}}
+    </div>
 </article>
 
 {{ end }}

layouts/index.html

@@ -2,10 +2,5 @@
 <hr>
 {{ .Content }}
 
-{{- /* The homepage should show only pages from the given sections (with `$.Site.Params.mainSections`).
-Otherwise, we take the pages of a section. */ -}}
-{{- $pages := .Pages }}
-{{- if .IsHome }}
-{{- $pages = where $.Site.RegularPages "Type" "in" $.Site.Params.mainSections }}
-{{- end }}
+{{- partial "openring.html" . }}
 {{- end }}

layouts/partials/footer.html

@@ -0,0 +1,50 @@
+<hr>
+<footer>
+<!-- A convenient back to top link. -->
+<p><a href="#top">{{ i18n "back_to_top" | default "Back to top" }}</a></p>
+
+<!-- Linking to other languages' homepage. -->
+{{ if $.Site.IsMultiLingual }}
+  <p>{{ i18n "multilingual" }}:
+  <span class="list site__languages">
+  {{ range $.Site.Languages }}
+    <a href="{{ . | relURL }}" hreflang="{{ .Lang }}">{{ with .LanguageName }}{{ . }}{{ else }}{{ .Lang }}{{ end }}</a>
+  {{ end }}
+  </span>
+</p>
+{{ end }}
+
+
+<!-- List all of the social media links -->
+{{ with (index $.Site.Data "more-contentful").contacts }}
+<ul class="list site__socials">
+  {{ $useImage := index . "useImage" | default false }}
+
+  {{ $links := sort .links "id" "asc" }}
+  {{ $links = sort $links "weight" "asc" }}
+  {{- range $links -}}
+  <li>
+    <a {{ if $useImage }}class="site__social-icon"{{ end }} rel="me" href="{{ .url | absLangURL }}" aria-label="{{ with .name }}{{ . }}{{ else }}{{ .id }}{{ end }}">
+    {{- if $useImage }}
+      {{- partial "components/icon.html" (dict "id" .id "output" "icons/brand/%s.svg" "template" "templates/simple-icon.svg") }}
+    {{- else }}
+      {{- .name }}
+    {{- end }}
+    </a>
+  </li>
+  {{- end -}}
+</ul>
+{{ end }}
+
+
+<!-- Copyright info. -->
+<p>{{ with $.Site.Copyright }}{{ . | markdownify }}{{ else }}© {{ now.Year }} {{ with $.Site.Author.name }}{{ . }}{{ else }}{{ $.Site.Title }}{{ end }}{{ end }}</p>
+
+{{- /* Extra notes */ -}}
+{{- with $.Site.Params.extraNotes }}
+<p>{{ trim . " " | markdownify }}</p>
+{{- end }}
+
+<small>Generated on {{ now.Format "2006-01-02 15:04:05 -0700" }}</small>
+</footer>
+

layouts/partials/openring.html

@@ -0,0 +1,90 @@
+<hr/>
+<section class="webring">
+  <h3>Posts from other blogs I follow</h3>
+  <section class="articles">
+    
+    <div class="webring__article">
+      <a class="webring__title" href="https://ma.ttias.be/cronweekly/issue-155/" target="_blank" rel="noopener">cron.weekly issue #155: Fedora, pandoc, youtube-dl, vdx &amp; more</a>
+      <span class="webring__metadata">
+        <small class="webring__source">
+          via <a href="https://ma.ttias.be/cronweekly/">The cron.weekly newsletter on ma.ttias.be</a>
+        </small>
+        <small class="webring__date">- <date datetime="2020-11-01 06:50:00 &#43;0100 &#43;0100">2020-11-01</date></small>
+      </span>
+    </div>
+    
+    <div class="webring__article">
+      <a class="webring__title" href="https://kde.org/announcements/plasma-5.20.2/" target="_blank" rel="noopener">KDE Plasma 5.20.2, bugfix Release for October</a>
+      <span class="webring__metadata">
+        <small class="webring__source">
+          via <a href="https://kde.org/announcements/">Announcements on KDE</a>
+        </small>
+        <small class="webring__date">- <date datetime="2020-10-27 00:00:00 &#43;0000 &#43;0000">2020-10-27</date></small>
+      </span>
+    </div>
+    
+    <div class="webring__article">
+      <a class="webring__title" href="https://protesilaos.com/codelog/2020-10-24-org-export-dispatcher-face/" target="_blank" rel="noopener">Org’s export dispatcher has a new face for its keys</a>
+      <span class="webring__metadata">
+        <small class="webring__source">
+          via <a href="https://protesilaos.com/codelog.xml">Protesilaos Stavrou: Coding blog</a>
+        </small>
+        <small class="webring__date">- <date datetime="2020-10-24 00:00:00 &#43;0000 &#43;0000">2020-10-24</date></small>
+      </span>
+    </div>
+    
+    <div class="webring__article">
+      <a class="webring__title" href="https://blog.yoshuawuyts.com/rust-2021/" target="_blank" rel="noopener">Rust 2021</a>
+      <span class="webring__metadata">
+        <small class="webring__source">
+          via <a href="https://blog.yoshuawuyts.com">Yoshua Wuyts — Blog</a>
+        </small>
+        <small class="webring__date">- <date datetime="2020-09-24 00:00:00 &#43;0000 &#43;0000">2020-09-24</date></small>
+      </span>
+    </div>
+    
+    <div class="webring__article">
+      <a class="webring__title" href="https://alex-hhh.github.io/2020/10/world-map-using-plot.html?utm_source=all&amp;utm_medium=RSS" target="_blank" rel="noopener">Rendering the World Map Using the Racket Plot Package</a>
+      <span class="webring__metadata">
+        <small class="webring__source">
+          via <a href="https://alex-hhh.github.io/index.html">The Blog of Alex Harsányi: The Blog of Alex Harsányi</a>
+        </small>
+      </span>
+    </div>
+    
+  </section>
+  <p class="webring__attribution">
+    Generated by
+    <a href="https://git.sr.ht/~sircmpwn/openring">openring</a>
+  </p>
+</section>
+<style>
+.webring .articles {
+  margin: -0.5rem;
+}
+
+.webring__title {
+  margin: 0;
+}
+
+.webring__article {
+  flex: 1 1 0;
+  display: flex;
+  flex-direction: column;
+  margin: 0.5rem;
+  padding: 0.5rem;
+  background: var(--base01);
+  min-width: 9rem;
+}
+
+.webring__summary {
+  font-size: 0.8rem;
+  flex: 1 1 0;
+}
+
+.webring__attribution {
+  text-align: right;
+  font-size: 0.8rem;
+  color: var(--base03);
+}
+</style>

layouts/shortcodes/links.html

@@ -1,6 +1,6 @@
-<ul style="display: flex; flex-flow: row wrap; justify-content: space-around; list-style: none">
+<div style="margin: 1em auto; display: flex; flex-flow: row wrap; justify-content: space-around;">
 {{ range $.Site.Menus.links }}
-<li><a style="font-size: 1.5em" href="{{ .URL }}" rel="me">{{ .Name }}</a></li>
+<a style="font-size: 1.5em" href="{{ .URL }}" rel="me">{{ .Name }}</a>
 {{ end }}
-</ul>
+</div>