DRAFTS

assets/static/css/bcarlin.css

@@ -236,7 +236,9 @@ body {
 main {
   .translations {
     text-align: end;
-    margin-bottom: 0.3em;
+    margin-block-end: 0.3em;
+    padding-inline-end: 2em;
+    font-size: 0.9em;
 
     a {
       text-decoration: none;
@@ -266,7 +268,48 @@ main {
       }
     }
 
-    ul > li {
+    section.table-of-contents {
+      font-size: 0.9em;
+      margin-block-end: 2em;
+      margin-inline-start: 1em;
+      padding-inline-start: 1em;
+      border-inline-start: 1px solid var(--pico-muted-color);
+
+
+      p {
+        margin-bottom: 0; /* reset pico styles */
+        margin-block-end: 0.2em;
+        font-weight: bold;
+      }
+
+      nav {
+        ol {
+          &:last-of-type {
+            margin-right: initial; /* reset pico styles */
+          }
+
+          &:first-of-type {
+            margin-left: initial; /* reset pico styles */
+          }
+          
+          li {
+            display: list-item; /* reset pico styles */
+            padding: initial; /* reset pico styles */
+            list-style-type: none;
+
+            ol {
+              margin-inline-start: 1em !important;
+            }
+          }
+        }
+      }
+    }
+
+    :where(ol,ul) li {
+      margin-bottom: 0;;
+    }
+
+    ul li {
       list-style-type: disc;
     }
 

config/_default/hugo.yaml

@@ -7,7 +7,7 @@ copyright: '© 2025 Bruno Carlin'
 summaryLength: 15
 params:
   author:
-    email: mail@bcarlin.net
+    email: blog@mail.bcarlin.net
     name: Bruno Carlin
 
 languages:
@@ -41,3 +41,5 @@ markup:
   goldmark:
     parser:
       wrapStandAloneImageWithinParagraph: false
+  tableOfContents:
+    ordered: true

config/_default/menus.en.yaml

@@ -10,9 +10,16 @@
     weight: 20
 
   secondary:
+  - name: 'Projects'
+    url: 'https://code.bcarlin.net'
+    weight: 10
+    params:
+      iconName: "git-pull-request-fill"
+      iconTitle: "My software forge"
+
   - name: '@bcarlin@hachyderm.io'
     url: 'https://hachyderm.io/@bcarlin'
-    weight: 10
+    weight: 20
     params:
       rel: "me"
       iconName: "mastodon-fill"
@@ -20,7 +27,7 @@
 
   - name: 'LinkedIn'
     url: 'https://www.linkedin.com/in/brunocarlin'
-    weight: 20
+    weight: 30
     params:
       rel: "me"
       iconName: "linkedin-fill"
@@ -28,7 +35,7 @@
 
   - name: 'GPG Key'
     url: '/bcarlin.gpg'
-    weight: 30
+    weight: 40
     params:
       class: "u-key"
       iconName: "key-fill"

config/_default/menus.fr.yaml

@@ -10,9 +10,16 @@
     weight: 20
 
   secondary:
+  - name: 'Projets'
+    url: 'https://code.bcarlin.net'
+    weight: 10
+    params:
+      iconName: "git-pull-request-fill"
+      iconTitle: "Ma forge logicielle"
+
   - name: '@bcarlin@hachyderm.io'
     url: 'https://hachyderm.io/@bcarlin'
-    weight: 10
+    weight: 20
     params:
       rel: "me"
       iconName: "mastodon-fill"
@@ -20,7 +27,7 @@
 
   - name: 'LinkedIn'
     url: 'https://www.linkedin.com/in/brunocarlin'
-    weight: 20
+    weight: 30
     params:
       rel: "me"
       iconName: "linkedin-fill"
@@ -28,7 +35,7 @@
 
   - name: 'Clef GPG'
     url: '/bcarlin.gpg'
-    weight: 30
+    weight: 40
     params:
       class: "u-key"
       iconName: "key-fill"

content/blog/008-embracing-modern-css/index.en.md

@@ -9,7 +9,7 @@ categories:
 tags:
 - CSS
 summary: |
-  entrer le résumé
+  Where I write about my discoveries of recent CSS I was unaware of.
 description: |
   The article explores recent developments in CSS, such as nested rules, CSS
   variables, and classless CSS, which allow for cleaner and more efficient

i18n/en.yaml

@@ -17,4 +17,9 @@ permalink_section: "Permalink to this section"
 tags: Tags
 information_icon: Information icon
 warning_icon: Warning icon
+translations: Translations
 also_available_in: "Also available in:"
+table_of_contents: "Contents:"
+source_code: |
+  The source of this site is available on 
+  <a href="https://code.bcarlin.net/bcarlin/bcarlin.net">my software forge</a>.

i18n/fr.yaml

@@ -17,4 +17,9 @@ permalink_section: Permalien vers cette partie
 tags: Tags
 information_icon: Icône information
 warning_icon: Icône attention
+translations: Traductions
 also_available_in: "Également disponible en :"
+table_of_contents: "Contenu :"
+source_code: |
+  Les sources de ce site sont disponibles sur
+  <a rel="external" href="https://code.bcarlin.net/bcarlin/bcarlin.net">ma forge logicielle</a>.

layouts/_partials/footer.html

@@ -11,4 +11,6 @@
   {{partial "icon.html" (dict "icon" "creative-commons-nc-fill" "label" "Creative Commons Non Commercial Logo")}}
   <br>
   {{ T "generated_with_hugo" | safeHTML }}
+  <br>
+  {{ T "source_code" | safeHTML }}
 </p>

layouts/baseof.html

@@ -38,12 +38,12 @@
   <main>
     {{- if .IsTranslated }}
     {{- range .Translations }}
-    <div class="translations">
+    <aside class="translations" aria-label="{{ T `translations` }}">
       {{ T `also_available_in` }}
       <a hreflang="{{ .Language.LanguageCode }}" href="{{ .RelPermalink }}" title="{{ .Language.LanguageName }}">
         {{ if eq .Language.Lang "en" }}🇬🇧{{ else if eq .Language.Lang "fr" }}🇫🇷{{ else }}{{ .Language.LanguageName }}{{ end }}
       </a>
-    </div>
+    </aside>
     {{- end }}
     {{- end }}
 

layouts/blog/single.html

@@ -23,8 +23,22 @@
       </div>
     </header>
 
+    
+    {{ with .TableOfContents }}
+    {{- if ne . `<nav id="TableOfContents"></nav>` }}
+    <section class="table-of-contents">
+      <p>{{ T "table_of_contents" }}</p>
+      {{ . }}
+    </section>
+    {{- end }}
+    {{- end }}
+
     <section class="e-content">
       {{ .Content }}
     </section>
+
+    <footer>
+      Any comment? Remark? Suggestion? <a href="mailto:{{ .Site.Params.email }}?subject=Re: {{ .Title }}">Send me an email</a>!
+    </footer>
   </article>
 {{ end }}