From f473911576e64f312cffeb62e14bd677375076e4 Mon Sep 17 00:00:00 2001
From: Quentin Duchemin <quentinduchemin@tuta.io>
Date: Tue, 25 May 2021 02:39:24 +0200
Subject: [PATCH] Add external links in navbar

---
 README.md                                  |  4 +++-
 config.yaml                                |  7 +++++++
 themes/chosto/layouts/partials/head.html   |  5 +++++
 themes/chosto/layouts/partials/header.html |  2 +-
 themes/chosto/layouts/partials/navbar.html | 24 +++++++++++++++++-----
 5 files changed, 35 insertions(+), 7 deletions(-)

diff --git a/README.md b/README.md
index 7425462..09afd3e 100644
--- a/README.md
+++ b/README.md
@@ -8,10 +8,12 @@ It contains a theme coded specifically for the blog, with examples taken from Hu
 
 Hugo is really powerful yet pretty light and really fast. I do like the way templating is used to achieve very elegant tricks. In the past we would have used databases and dynamic languages like PHP for the same result.
 
-I think that using Wordpress for a little static blog is no longer relevant and I am really enthousiastic about projects like Hugo. Additionnally, the community seems very friendly. Other static CMS such as Ghost have an economic model that I don't like (eg you have to pay for plugins) and Grav is great but not so artisanal. The learning curve is pretty high and you're encouraged to use an existing theme with the PHP admin interface.
+I think that using Wordpress for a little static blog is no longer relevant and I am really enthousiastic about projects like Hugo. Additionnally, the community seems very friendly. Other static/flatfile CMS such as Ghost have an economic model that I don't like (eg you have to pay for plugins) and Grav is great but not so artisanal : the learning curve is pretty high and you stll need PHP.
 
 With Hugo, I really have the sensation of minimizing the ressources I use while totally understanding what I am doing (even if I am doing it badly).
 
+TBH I haven't heard of Zola when starting this blog. Maybe today I would choose Zola, because it seems less complex and making more sense (eg with its templating language), but I'm still happy with my theme.
+
 ## Building
 
 Just run `hugo` and serve the `public` directory.
diff --git a/config.yaml b/config.yaml
index ac09311..14c2d5c 100644
--- a/config.yaml
+++ b/config.yaml
@@ -32,3 +32,10 @@ privacy:
 
 theme:
   - chosto
+
+params:
+  github: https://github.com/Chostakovitch
+  mastodon: https://framapiaf.org/@chosto
+  gitea: https://git.chosto.me
+  mail: mailto:quentinduchemin@tuta.io
+  funkwhale: https://music.chosto.me/@Chosto/
diff --git a/themes/chosto/layouts/partials/head.html b/themes/chosto/layouts/partials/head.html
index 521a8c9..be8f278 100644
--- a/themes/chosto/layouts/partials/head.html
+++ b/themes/chosto/layouts/partials/head.html
@@ -5,6 +5,11 @@
   {{ $styleCustom := resources.Get "css/custom.css" }}
   <link rel="stylesheet" href="{{ $styleBulma.Permalink }}">
   <link rel="stylesheet" href="{{ $styleCustom.Permalink }}">
+  <!-- tbh I am too lazy to extend Bulma, so put dirty CSS directives here to be able to use Hugo templating system -->
+  <style>
+    {{ $bg := resources.Get "img/hero_home.png" }}
+    .has-bg-img { background: url('{{ $bg.Permalink }}')center center; background-size:cover; }
+  </style>
   <title>
       {{ .Site.Title }}
   </title>
diff --git a/themes/chosto/layouts/partials/header.html b/themes/chosto/layouts/partials/header.html
index a4af09b..a6a48a9 100644
--- a/themes/chosto/layouts/partials/header.html
+++ b/themes/chosto/layouts/partials/header.html
@@ -1,5 +1,5 @@
 <header>
-  <section class="hero is-primary is-medium">
+  <section class="hero is-primary is-medium has-bg-img">
     <div class="hero-body has-text-centered">
       <p class="title is-1 is-uppercase">{{ .Title }}</p>
       {{ with .Params.subtitle }}
diff --git a/themes/chosto/layouts/partials/navbar.html b/themes/chosto/layouts/partials/navbar.html
index 1022757..977576e 100644
--- a/themes/chosto/layouts/partials/navbar.html
+++ b/themes/chosto/layouts/partials/navbar.html
@@ -44,30 +44,44 @@
     <!-- start/end menu shares the exact same code, just not the same position, factorize with a loop -->
     {{ $currentPage := . }}
     {{ range (slice "start" "end")}}
-    {{ $menu_name := . }}
+    {{ $menuName := . }}
     <div class="navbar-{{ . }} mr-2">
       <!-- now get the menu if it exists -->
-      {{ with index $.Site.Menus $menu_name }}
+      {{ with index $.Site.Menus $menuName }}
       <!-- and range over its pages -->
       {{ range . }}
       {{ if .HasChildren }}
-      <div class="navbar-item has-dropdown is-hoverable {{ if $currentPage.HasMenuCurrent $menu_name . }}is-active is-tab{{ end }}">
+      <div class="navbar-item has-dropdown is-hoverable {{ if $currentPage.HasMenuCurrent $menuName . }}is-active is-tab{{ end }}">
         <a class="navbar-link">
           {{ .Pre }}
           <span>{{ .Name }}</span>
         </a>
         <div class="navbar-dropdown">
           {{ range .Children }}
-          <a class="navbar-item {{ if $currentPage.IsMenuCurrent $menu_name . }}is-active is-tab{{ end }}" href="{{ .URL }}">{{ .Name }}</a>
+          <a class="navbar-item {{ if $currentPage.IsMenuCurrent $menuName . }}is-active is-tab{{ end }}" href="{{ .URL }}">{{ .Name }}</a>
           {{ end }}
         </div>
       </div>
       {{ else }}
-      <a class="navbar-item {{ if $currentPage.IsMenuCurrent $menu_name . }}is-active is-tab{{ end }}" href="{{ .URL }}">{{ .Name }}</a>
+      <a class="navbar-item {{ if $currentPage.IsMenuCurrent $menuName . }}is-active is-tab{{ end }}" href="{{ .URL }}">{{ .Name }}</a>
       {{ end }}
       {{ end }}
     {{ end }}
   </div>
     {{ end }}
+  <div class="navbar-end ml-0 mr-4">
+    <!-- Each item should have a corresponding assets/img/x.png and link in config.yaml -->
+    {{ range (slice "github" "mastodon" "gitea" "mail" "funkwhale" )}}
+      {{ $imageName := . }}
+      <!-- Get image and resize to logo size -->
+      {{ $imagePath := printf "img/%s.png" $imageName }}
+      {{ $image := resources.Get $imagePath }}
+      {{ $image32 := $image.Resize "32x" }}
+      <!-- Get logo link in site params (index allows to use a dynamic parameter name) -->
+      <a class="navbar-item" href="{{ index $.Site.Params $imageName }}">
+        <img src="{{ $image32.Permalink }}">
+      </a>
+    {{ end }}
+  </div>
   </div>
 </nav>