Again lot of cosmetic changes

.gitignore

@@ -1,3 +1,4 @@
 resources
 public
 .hugo_build.lock
+bulma

themes/chosto/layouts/_default/single.html

@@ -29,9 +29,9 @@
       {{ else }}
       <div class="container content is-max-desktop">
       {{ end }}
-      <section class="column content">
+      <section class="column content mx-6">
         <div>
-          <article class="mx-6">
+          <article>
             <!-- First thing is a legend for the hero image, if it exists -->
             {{ with .Params.imgExplanation }}
             <article class="message mb-5">
@@ -40,9 +40,17 @@
               </div>
             </article>
             {{ end }}
-            <!-- Second, a summary before ToC, if it exists -->
+            <!-- Second, a summary, if it exists -->
             {{ with .Params.summary }}
-            <div class="message is-primary">
+            <div class="message is-info">
+              <div class="message-body">
+                {{ . }}
+              </div>
+            </div>
+            {{ end }}
+            <!-- Third, an introductive message before ToC, if it exists -->
+            {{ with .Params.intro }}
+            <div class="message is-dark">
               <div class="message-body">
                 {{ . }}
               </div>
@@ -50,7 +58,7 @@
             {{ end }}
             <!-- 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-info">
+            <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 -->
               <div class="message-body pt-1">{{ .TableOfContents | replaceRE "<a" "<a style='text-decoration:none;'" | safeHTML }}</div>
@@ -60,18 +68,19 @@
             {{ .Content }}
           </article>
         </div>
-        <aside class="container level my-5">
+        <hr/>
+        <aside class="container level my-5 is-mobile">
           <div class="level-left">
             {{ with .PrevInSection }}
             <div class="level-item">
-              <a class="button is-info" href="{{ .Permalink }}">&laquo;&nbsp;{{ .Title }}</a>
+              <a class="button is-link is-light is-medium is-responsive has-text-weight-bold" href="{{ .Permalink }}">&laquo;&nbsp;{{ .Title }}</a>
             </div>
             {{ end }}
           </div>
           <div class="level-right">
             {{ with .NextInSection }}
             <div class="level-item">
-              <a class="button is-info" href="{{ .Permalink }}">{{ .Title }}&nbsp;&raquo;</a>
+              <a class="button is-link is-light is-medium is-responsive has-text-weight-bold" href="{{ .Permalink }}">{{ .Title }}&nbsp;&raquo;</a>
             </div>
             {{ end }}
           </div>

themes/chosto/layouts/partials/navbar.html

@@ -40,7 +40,7 @@
         <div class="navbar-dropdown">
           {{ range where .Site.Pages "Params.Code" "!=" nil }}
           <a class="navbar-item {{ if eq $.Permalink .Page.Permalink }}is-active{{ end }}" href="{{ .Page.Permalink }}">
-            {{ .Title | humanize }}
+            {{ .Title }}
             {{ $casePosts := where .Site.RegularPages "CurrentSection.Params.Code" "==" .Params.Code }}
             <span class="tag ml-2 is-rounded">{{ len $casePosts }}</span>
           </a>

themes/chosto/layouts/partials/pagination.html

@@ -1,6 +1,6 @@
 {{ $pag := . }}
 {{ if gt $pag.TotalPages 1 -}}
-<nav class="mt-5 pagination is-centered" role="navigation" aria-label="pagination">
+<nav class="mt-6 pagination is-centered" role="navigation" aria-label="pagination">
   {{ with $pag.First -}}
   <ul class="pagination-list">
   {{ end -}}

themes/chosto/static/css/custom.css

@@ -1,3 +1,14 @@
+@font-face {
+  font-family: 'Nunito';
+  src: 
+      url('../font/Nunito-Regular.woff2') format('woff2'),
+      url('../font/Nunito-Regular.woff') format('woff'),
+      url('../font/Nunito-Regular.ttf') format('truetype');
+  font-weight: normal;
+  font-style: normal;
+  font-display: swap;
+}
+
 .has-equal-height {
     height: 100%;
     display: flex;
@@ -7,3 +18,7 @@
 .content {
   text-align: justify;
 }
+
+.navbar-dropdown {
+  font-size: 1rem;
+}