Remove trailing HTML space around Hugo comments

themes/chosto/archetypes/section.md

@@ -4,4 +4,4 @@ subtitle:
 code:
 draft: true
 ---
-{{/* We use sections to define "cases", i.e. serie of articles about a topic */}}
+{{- /* We use sections to define "cases", i.e. serie of articles about a topic */}}

themes/chosto/layouts/_default/_markup/render-heading.html

@@ -1,2 +1,2 @@
-{{/* Overwrite default title rendering to add anchor */}}
+{{- /* Overwrite default title rendering to add anchor */}}
 <h{{ .Level }} id="{{ .Anchor | safeURL }}">{{ .Text | safeHTML }} <a href="#{{ .Anchor | safeURL }}">¶</a></h{{ .Level }}>

themes/chosto/layouts/_default/list.html

@@ -1,11 +1,11 @@
 {{ define "main" }}
-{{/* Default list used for homepage and taxonomy pages (e.g. tags),
+{{- /* Default list used for homepage and taxonomy pages (e.g. tags),
   but not for sections (see section.html template) */}}
 <div class="section pt-5">
   <div class="container is-max-widescreen">
     <main>
       <div class="columns is-multiline">
-        {{/* Custom paginator with only blog posts (e.g. avoid "À propos") which
+        {{- /* Custom paginator with only blog posts (e.g. avoid "À propos") which
           are already written (avoid "incoming" posts of thematic series),
           ordered from newest to oldest */}}
         {{ $paginator := .Paginate 

themes/chosto/layouts/_default/section.html

@@ -2,7 +2,7 @@
 <div class="section">
   <div class="container is-max-widescreen">
     <main>
-      {{/* A section _index.md may have a content, describing its theme */}}
+      {{- /* A section _index.md may have a content, describing its theme */}}
       {{ with .Content }}
       <article class="message mt-5 mb-5">
         <div class="message-body content">
@@ -10,7 +10,7 @@
         </div>
       </article>
       {{ end }}
-      {{/* Then simply show posts belonging to the section,
+      {{- /* Then simply show posts belonging to the section,
         but contrary to index and taxonomy, show oldest to newest,
         to keep a sense of progression */}}
       <div class="columns is-multiline">

themes/chosto/layouts/_default/single.html

@@ -1,14 +1,14 @@
 {{ define "main" }}
 <div class="section">
-  {{/*
+  {{- /*
   If the current page is a blog post and belongs to a thematic serie, add a side menu
   with all other blog posts belonging to that case, emphasis to the current.
   Still use empty container if nothing to show for homogeneous layout
   */}}
-  {{/* is-desktop stacks vertically columns for tablets and mobiles. is-8 is a
+  {{- /* is-desktop stacks vertically columns for tablets and mobiles. is-8 is a
   maximum gap of 2rem between columns */}}
   <div class="columns is-variable is-desktop is-8">
-    {{/* To ease reading, the content is a bit wider for small screens
+    {{- /* To ease reading, the content is a bit wider for small screens
     but not too wide for big screens */}}
     <aside class="menu column mt-2 is-one-fifth-desktop is-one-fifth-fullhd is-full-tablet is-full-mobile">
       {{ if (and .IsPage (eq .FirstSection.Section "posts"))}}
@@ -18,18 +18,18 @@
         <a href="{{ .Permalink }}">{{ .Params.Title }}</a>
       </p>
       <div class="menu-list">
-        {{/* Get all posts belonging to the current thematic serie, sorted by date */}}
+        {{- /* Get all posts belonging to the current thematic serie, sorted by date */}}
         {{ $posts := (where $.Site.RegularPages "CurrentSection.Params.Code" "==" $.CurrentSection.Params.Code )}}
         {{ $postsSorted := (sort $posts "Date" )}}
         {{ range $postsSorted }}
-        {{/* Show titles for incoming posts, but do not make them clickable. Note
+        {{- /* Show titles for incoming posts, but do not make them clickable. Note
              that they will still be accessible by crafting the URL by hand. This 
              is **not** a security, just a nice way to tease stuff. To really hide
              something it should be marked as "draft: true" so the page is not built. */}}
         {{ if eq .Params.incoming true }}
         <a class="disabled">{{ .Title }} <i class="has-text-grey">(à venir)</i></a>
         {{ else }}
-        {{/* Otherwise link to the posts, highlightning the current one */}}
+        {{- /* Otherwise link to the posts, highlightning the current one */}}
         <a {{ if eq $.Title .Title }} class="is-active" {{ end }} href="{{ .Permalink }}">{{ .Title }}</a>
         {{ end }}
         {{ end }}
@@ -41,20 +41,20 @@
     <section class="column content is-three-fifths-desktop is-three-fifths-fullhd is-full-tablet is-full-mobile">
       <div>
         <article>
-          {{/* If this is part of a thematic serie, remind it so it is clear */}}
+          {{- /* If this is part of a thematic serie, remind it so it is clear */}}
           {{ if (and .IsPage (eq .FirstSection.Section "posts"))}}
           {{ with .CurrentSection }}
           {{ if .Params.Title }}
           <div class="message is-info">
             <div class="message-body content">
-              Le billet que vous lisez fait partie du dossier « <a href="{{ .Permalink }}">{{ .Params.Title }}</a> ». Le
+              Le billet que vous lisez fait partie de la série « <a href="{{ .Permalink }}">{{ .Params.Title }}</a> ». Le
               menu sur la gauche permet de naviguer entre ses parties. Bonne lecture ! 😄
             </div>
           </div>
           {{ end }}
           {{ end }}
           {{ end }}
-          {{/* First thing is a legend for the hero image, if it exists */}}
+          {{- /* First thing is a legend for the hero image, if it exists */}}
           {{ with .Params.imgExplanation }}
           <div class="message">
             <div class="message-body content is-italic">
@@ -62,7 +62,7 @@
             </div>
           </div>
           {{ end }}
-          {{/* Second, an introductive message before ToC, if it exists */}}
+          {{- /* Second, an introductive message before ToC, if it exists */}}
           {{ with .Params.intro | markdownify | safeHTML }}
           <div class="message is-dark">
             <div class="message-body">
@@ -70,16 +70,17 @@
             </div>
           </div>
           {{ end }}
-          {{/* Then, ToC if text has more than 600 words and not explicitly asked not to */}}
+          {{- /* Then, ToC if text has more than 600 words and not explicitly asked not to */}}
           {{ if (and (not .Params.notoc) (gt .WordCount 600)) }}
           <div class="message is-link">
             <div class="message-header">Sommaire</div>
-            {{/* Appreciate this horrible trick, even a 2000's HTML generator won't generate such code */}}
+            {{- /* Appreciate this horrible trick, even a 2000's HTML generator won't generate such code */}}
             <div class="message-body has-text-left pt-1">
               {{ .TableOfContents | replaceRE "<a" "<a style='text-decoration:none;'" | safeHTML }}</div>
           </div>
           {{ end }}
-          {{/* Finally, content! */}}
+          {{- /* Finally, content! */}}
+          {{- /* #TODO add replacement of spaces by non-breaking spaces for french ponctuation */}}
           {{ .Content }}
         </article>
       </div>

themes/chosto/layouts/_default/summary.html

@@ -12,7 +12,7 @@
   <div class="columns is-flex-direction-column card-content pb-0" style="height:100%;">
     <div class="column is-flex-grow-0 has-text-centered pb-0">
       <a class="title is-4 mb-0" href="{{.Permalink}}">
-        {{/*
+        {{- /*
       Well, I am a beginner with Hugo so this is probably like crushing a banana with a rocket.
       When a post belongs to a "case" (i.e. a section with a code, I'd like to have [INDEX/TOTAL] printed in title.
       An when a post is on its own, don't print anything.
@@ -40,7 +40,7 @@
       <hr class="my-0">
     </div>
     <div class="column py-0">
-      {{/* If a special summary (before ToC) have been defined,
+      {{- /* If a special summary (before ToC) have been defined,
       prefer using it because it has more chances to be a better summary */}}
       {{ if (isset .Params "summary" )}}
       {{ .Params.summary }}

themes/chosto/layouts/partials/head.html

@@ -5,26 +5,26 @@
   {{ $styleCustom := resources.Get "css/custom.css" }}
   <link rel="stylesheet" href="{{ $styleBulma.Permalink }}">
   <link rel="stylesheet" href="{{ $styleCustom.Permalink }}">
-  {{/* RSS feed */}}
+  {{- /* RSS feed */}}
   {{ range .AlternativeOutputFormats -}}
   {{ printf `<link rel="%s" type="%s" href="%s" title="%s" />` .Rel .MediaType.Type .Permalink $.Site.Title | safeHTML }}
   {{ end -}}
-  {{/* Default to home image */}}
+  {{- /* Default to home image */}}
   {{ $originalImage := resources.Get "img/home.jpg" }}
-  {{/* If header image exists in current context, use it instead */}}
+  {{- /* If header image exists in current context, use it instead */}}
   {{ with .Resources.GetMatch "top.jpg" }}
   {{ $originalImage = . }}
   {{ end }}
   {{ $image := $originalImage.Resize "3000x" }}
   {{ $image = $image | images.Filter (images.GaussianBlur 7) }}
-  {{/* tbh I am too lazy to extend Bulma, so put dirty CSS directives here to be able to use Hugo templating system */}}
+  {{- /* tbh I am too lazy to extend Bulma, so put dirty CSS directives here to be able to use Hugo templating system */}}
   <style>
     .has-bg-img {
       background: url('{{ $image.Permalink }}')center center;
       background-size: cover;
     }
   </style>
-  {{/* Favico */}}
+  {{- /* Favico */}}
   <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon">
   <link rel="apple-touch-icon" sizes="152x152" href="/apple-touch-icon.png">
   <link rel="apple-touch-icon" sizes="60x60" href="/apple-touch-icon-60x60.png">

themes/chosto/layouts/partials/header.html

@@ -1,6 +1,6 @@
-{{/* Allow to skip heading, for example in an about page */}}
+{{- /* Allow to skip heading, for example in an about page */}}
 {{ if not .Params.noheader }}
-{{/* Display background only for regular pages, or home */}}
+{{- /* Display background only for regular pages, or home */}}
 {{ $background := in "page home" .Kind }}
 {{ $page := eq "page" .Kind }}
 {{ $home := eq "home" .Kind }}
@@ -37,7 +37,7 @@
           {{ end }}
         </div>
       </div>
-      {{/* Words and date stuff makes sens only for blog posts, not other pages */}}
+      {{- /* Words and date stuff makes sens only for blog posts, not other pages */}}
       {{ if (and .IsPage (eq .FirstSection.Section "posts"))}}
       <div class="hero-foot mb-5 mx-5 content">
         <div class="level">

themes/chosto/layouts/partials/navbar.html

@@ -17,7 +17,7 @@
     </a>
   </div>
   <div id="navbar" class="navbar-menu">
-    {{/* In case of another navbar-start right after */}}
+    {{- /* In case of another navbar-start right after */}}
     <div class="navbar-start mr-0">
       <div class="navbar-item has-dropdown is-hoverable">
         <a class="navbar-link">
@@ -47,14 +47,14 @@
         </div>
       </div>
     </div>
-    {{/* start/end menu shares the exact same code, just not the same position, factorize with a loop */}}
+    {{- /* start/end menu shares the exact same code, just not the same position, factorize with a loop */}}
     {{ $currentPage := . }}
     {{ range (slice "start" "end")}}
     {{ $menuName := . }}
     <div class="navbar-{{ . }} mr-2">
-      {{/* now get the menu if it exists */}}
+      {{- /* now get the menu if it exists */}}
       {{ with index $.Site.Menus $menuName }}
-      {{/* and range over its pages */}}
+      {{- /* and range over its pages */}}
       {{ range . }}
       {{ if .HasChildren }}
       <div class="navbar-item has-dropdown is-hoverable {{ if $currentPage.HasMenuCurrent $menuName . }}is-active is-tab{{ end }}">
@@ -79,14 +79,14 @@
       <div class="level">
         <div class="level-left">
           <div class="level-item">
-            {{/* Each item should have a corresponding assets/img/x.png and link in config.yaml */}}
+            {{- /* Each item should have a corresponding assets/img/x.png and link in config.yaml */}}
             {{ range (slice "rss" "mastodon" "peertube" "funkwhale" "gitea" "mail" )}}
             {{ $imageName := . }}
-            {{/* Get image and resize to logo size */}}
+            {{- /* Get image and resize to logo size */}}
             {{ $imagePath := printf "img/%s.png" $imageName }}
             {{ $image := resources.Get $imagePath }}
             {{ $imageResized := $image.Resize "64x" }}
-            {{/* Get logo link in site params (index allows to use a dynamic parameter name) */}}
+            {{- /* 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="{{ $imageResized.Permalink }}">
             </a>

themes/chosto/layouts/partials/pagination.html

@@ -9,7 +9,7 @@
   {{- range $pag.Pagers -}}
   {{- $right := sub .TotalPages .PageNumber -}}
   {{- $showNumber := or (le .PageNumber 1) (eq $right 0) -}}
-  {{- $showNumber := or $showNumber (le .TotalPages 5) -}}{{/* Issue #7523 */}}
+  {{- $showNumber := or $showNumber (le .TotalPages 5) -}}{{- /* Issue #7523 */}}
   {{- $showNumber := or $showNumber (and (gt .PageNumber (sub $pag.PageNumber 3)) (lt .PageNumber (add $pag.PageNumber 3))) -}}
   {{- if $showNumber -}}
     {{- $ellipsed = false -}}

themes/chosto/layouts/shortcodes/figure.html

@@ -1,4 +1,4 @@
-{{/*
+{{- /*
     Source : https://gist.github.com/cpbotha/deb310eed14308fe26f7b7d0fabeb34d
     
     figure with auto-resizing and srcset v2020-05-10
@@ -28,10 +28,10 @@
     
     */}}
     
-    {{/* hugo will resize to all of these sizes that are smaller than your original. configure if you like! */}}
+    {{- /* hugo will resize to all of these sizes that are smaller than your original. configure if you like! */}}
     {{ $sizes := (slice "480" "800" "1200" "1500") }}
     
-    {{/* get file that matches the filename as specified as src="" in shortcode */}}
+    {{- /* get file that matches the filename as specified as src="" in shortcode */}}
     {{ $src := .Page.Resources.GetMatch (printf "*%s*" (.Get "src")) }}
     
     <figure{{ with .Get "class" }} class="{{ . }}"{{ end }}>
@@ -41,20 +41,20 @@
         <img
             {{ if $src }}
                 sizes="(min-width: 35em) 1200px, 100vw"
-                {{/* only srcset images smaller than or equal to the src (original) image size, as Hugo will upscale small images */}}  
+                {{- /* only srcset images smaller than or equal to the src (original) image size, as Hugo will upscale small images */}}  
                 srcset='
                 {{ range $sizes }}
                        {{ if ge $src.Width . }}{{ ($src.Resize (printf "%sx" .)).Permalink }} {{ (printf "%sw" .) }},{{ end }}
                 {{ end }}'
     
-                {{/* when no support for srcset (old browsers, RSS), we load small (800px) */}}
+                {{- /* when no support for srcset (old browsers, RSS), we load small (800px) */}}
-                {{/* if image smaller than 800, then load the image itself */}}
+                {{- /* if image smaller than 800, then load the image itself */}}
                 {{ if ge $src.Width "800" }}src="{{ ($src.Resize "800x").Permalink }}"
                 {{ else }}src="{{ $src.Permalink }}"
                 {{ end }}
     
             {{ else }}
-                {{/* fall back to stock hugo behaviour when image is not available in bundle */}}
+                {{- /* fall back to stock hugo behaviour when image is not available in bundle */}}
                 src="{{ .Get "src" }}"
             {{ end }}
     
@@ -63,7 +63,7 @@
             {{- end -}}
             {{- with .Get "width" }} width="{{ . }}"{{ end -}}
             {{- with .Get "height" }} height="{{ . }}"{{ end -}}
-        /> {{/* Closing img tag */}}
+        /> {{- /* Closing img tag */}}
         {{- if .Get "link" }}</a>{{ end -}}
         {{- if or (or (.Get "title") (.Get "caption")) (.Get "attr") -}}
             <figcaption>

themes/chosto/static/css/custom.css

@@ -9,19 +9,19 @@
   font-display: swap;
 }
 
-/* Trick which changes nothing visually but makes the footnote anchors
+/* Trick which changes nothing visually but makes the footnote anchors,
-virtually 40% and 10% for headings lower. 
+superscript backlinks and headings anchor virtually lower.
 Otherwise the fixed navbar is just above the footnote link when going 
 back from the bottom. That way, either footnotes or anchors are in 
 the middle of the page, making navigation easier */
 sup[id*=fn] {
-  padding-top: 40% !important;
+  padding-top: 20% !important;
-  margin-top: -40% !important;
+  margin-top: -20% !important;
 }
 
 li[id*=fn] {
-  padding-top: 40% !important;
+  padding-top: 15% !important;
-  margin-top: -40% !important;
+  margin-top: -15% !important;
 }
 
 h1, h2, h3, h4, h5, h6 {