From ca1b4954fc63a1415229766d3e8904b6a27272ae Mon Sep 17 00:00:00 2001
From: schnusch <schnusch@users.noreply.github.com>
Date: Wed, 18 Jan 2023 18:16:54 +0100
Subject: [PATCH 1/2] Remove unnecessary javascript code and replace with hugo
 template code

---
 assets/css/content.scss |  1 +
 assets/css/theme.scss   |  1 -
 assets/js/index.js      | 21 +--------------------
 layouts/index.html      | 15 ++++++++++-----
 4 files changed, 12 insertions(+), 26 deletions(-)

diff --git a/assets/css/content.scss b/assets/css/content.scss
index 3dc9825..6c23ca8 100644
--- a/assets/css/content.scss
+++ b/assets/css/content.scss
@@ -3,6 +3,7 @@ html {
   max-height: 100%;
   font-size: 62.5%;
   overflow-x: hidden;
+  scroll-behavior: smooth;
 }
 
 body {
diff --git a/assets/css/theme.scss b/assets/css/theme.scss
index d935894..9c448ca 100644
--- a/assets/css/theme.scss
+++ b/assets/css/theme.scss
@@ -242,7 +242,6 @@ a.fn-item {
   margin: 0 auto;
 }
 
-
 /** ==========  Site footer ============ */
 .site-footer {
   background: var(--footer-color-background);
diff --git a/assets/js/index.js b/assets/js/index.js
index bf3859f..40901c0 100644
--- a/assets/js/index.js
+++ b/assets/js/index.js
@@ -7,7 +7,6 @@ var $first = $(".post.first");
 var $last = $(".post.last");
 var $fnav = $(".fixed-nav");
 var $postholder = $(".post-holder");
-var $postafter = $(".post-after");
 var $sitehead = $("#site-head");
 
 /* Globals jQuery, document */
@@ -31,32 +30,14 @@ var $sitehead = $("#site-head");
     }
   }
   $(document).ready(function () {
-    $postafter.each(function (e) {
-      var bg = $(this).parent().css("background-color");
-      $(this).css("border-top-color", bg);
-    });
-
     $("a.btn.site-menu").click(function (e) {
+      e.preventDefault();
       srcToAnchorWithTitle($(e.target).data("title-anchor"));
     });
     $("#header-arrow").click(function () {
       srcTo($first);
     });
 
-    $(".post-title").each(function () {
-      var t = $(this).data("fnav-title");
-      var index = $(this).parents(".post-holder").index();
-      var postId = $(this).closest("article.post").attr('id');
-      $fnav.append(
-        "<a class='fn-item' item_index='" + index + "' data-post-id='" + postId + "'>" + t + "</a>"
-      );
-      $(".fn-item").click(function () {
-        var postId = $(this).data("post-id");
-        var s = $("#" + postId);
-        srcTo(s, 200);
-      });
-    });
-
     $(".post.last").next(".post-after").hide();
     if ($sitehead.length) {
       $(window).scroll(function () {
diff --git a/layouts/index.html b/layouts/index.html
index b9e978f..747c932 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -32,10 +32,10 @@
               {{ with .Params.header_menu_title }}{{ $button_title = . }}{{ end }}
 
               {{ if isset .Params "external" }}
-                 <a class='btn site-menu' href='{{ .Params.external  }}'>{{ $button_title }}&nbsp;<icon class="fa fa-external-link"></icon></a>
+                 <a class='btn site-menu' href='{{ .Params.external }}'>{{ $button_title }}&nbsp;<icon class="fa fa-external-link"></icon></a>
               {{ else }}
                 {{ $fnav_title := .Title }}{{ with .Params.navigation_menu_title }}{{ $fnav_title = . }}{{ end }}
-                 <a class='btn site-menu' data-title-anchor='{{ anchorize $fnav_title }}'>{{ $button_title }}</a>
+                 <a class='btn site-menu' data-title-anchor='{{ anchorize $fnav_title }}' href='#{{ anchorize $fnav_title }}'>{{ $button_title }}</a>
               {{ end }}
             {{ end }}
             <i id='header-arrow' class="fa fa-angle-down"></i>
@@ -44,18 +44,23 @@
 </header>
 
 <main class="content" role="main">
+    {{ $content := where $sections "Params.external" "==" nil }}
 
     <!-- Render sticky left navigation menu -->
-    <div class='fixed-nav'></div>
+    <div class='fixed-nav'>
+        {{ range $index_val, $elem_val := $content }}
+            {{ $fnav_title := .Title }}{{ with .Params.navigation_menu_title }}{{ $fnav_title = . }}{{ end }}
+            <a class='fn-item' item_index='{{ (add $index_val 1) }}' href='#{{ anchorize $fnav_title }}'>{{ $fnav_title | safeHTML }}</a>
+        {{ end }}
+    </div>
 
     <!-- Render single-page content -->
-    {{ $content := where $sections "Params.external" "==" nil }}
     {{ range $index_val, $elem_val := $content }}
         {{ $fnav_title := .Title }}{{ with .Params.navigation_menu_title }}{{ $fnav_title = . }}{{ end }}
         <div class='post-holder{{ if and (ne .Site.Params.invertSectionColors true) (not (modBool $index_val 2)) }} dark{{ else if and (eq .Site.Params.invertSectionColors true) (modBool $index_val 2) }} dark{{ end }}'>
             <article id='{{ anchorize $fnav_title }}' class='post {{ if eq $index_val 0 }}first{{ end }} {{ if eq (add $index_val 1) (len $content) }}last{{ end }}'>
                 <header class="post-header">
-                    <h2 class="post-title" data-fnav-title="{{ $fnav_title | safeHTMLAttr }}">{{ .Title | safeHTML }}</h2>
+                    <h2 class="post-title">{{ .Title | safeHTML }}</h2>
                 </header>
                 <section class="post-content">
                     {{ .Content }}

From 2d2190f8f03a046bebe50102e35d3552fcc76bf2 Mon Sep 17 00:00:00 2001
From: Ferdinand Thiessen <opensource@fthiessen.de>
Date: Mon, 10 Apr 2023 00:06:04 +0200
Subject: [PATCH 2/2] Only use jQuery animate if native smooth scrolling is not
 supported

Signed-off-by: Ferdinand Thiessen <opensource@fthiessen.de>
---
 assets/css/theme.scss |  1 +
 assets/js/index.js    | 22 +++++++++++++++-------
 layouts/index.html    |  8 +++++---
 3 files changed, 21 insertions(+), 10 deletions(-)

diff --git a/assets/css/theme.scss b/assets/css/theme.scss
index 9c448ca..7604944 100644
--- a/assets/css/theme.scss
+++ b/assets/css/theme.scss
@@ -108,6 +108,7 @@ body {
     -moz-transition: all ease 0.3s;
 
     &:hover {
+      color: inherit;
       opacity: 0.9;
     }
   }
diff --git a/assets/js/index.js b/assets/js/index.js
index 40901c0..110abcd 100644
--- a/assets/js/index.js
+++ b/assets/js/index.js
@@ -30,15 +30,23 @@ var $sitehead = $("#site-head");
     }
   }
   $(document).ready(function () {
-    $("a.btn.site-menu").click(function (e) {
-      e.preventDefault();
-      srcToAnchorWithTitle($(e.target).data("title-anchor"));
-    });
-    $("#header-arrow").click(function () {
-      srcTo($first);
-    });
+    // fallback to jQuery animate if smooth scrolling is not supported
+    if (!"scrollBehavior" in document.documentElement.style) {
+      // Cover buttons
+      $("a.btn.site-menu").click(function (e) {
+        e.preventDefault();
+        srcToAnchorWithTitle($(e.target).data("title-anchor"));
+      });
+
+      // cover arrow button
+      $("#header-arrow").click(function (e) {
+        e.preventDefault()
+        srcTo($first);
+      });
+    }
 
     $(".post.last").next(".post-after").hide();
+
     if ($sitehead.length) {
       $(window).scroll(function () {
         var w = $(window).scrollTop();
diff --git a/layouts/index.html b/layouts/index.html
index 747c932..ef173ce 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -2,6 +2,7 @@
 {{ $headless := .Site.GetPage "/homepage" }}
 {{ $sections := $headless.Resources.ByType "page" }}
 {{ $sections := cond .Site.BuildDrafts $sections (where $sections "Draft" "==" false) }}
+{{ $content := where $sections "Params.external" "==" nil }}
 
 <!-- Welcome screen that scrolls out of view -->
 {{ if not .Params.header_use_video }}
@@ -38,14 +39,15 @@
                  <a class='btn site-menu' data-title-anchor='{{ anchorize $fnav_title }}' href='#{{ anchorize $fnav_title }}'>{{ $button_title }}</a>
               {{ end }}
             {{ end }}
-            <i id='header-arrow' class="fa fa-angle-down"></i>
+            {{ with (index $content 0) }}
+                {{ $first_title := .Title }}{{ with .Params.navigation_menu_title }}{{ $first_title = . }}{{ end }}
+                <a id='header-arrow' href="#{{- anchorize $first_title -}}" aria-label="Go to first section"><i class="fa fa-angle-down"></i></a>
+            {{ end }}
         </div>
     </div>
 </header>
 
 <main class="content" role="main">
-    {{ $content := where $sections "Params.external" "==" nil }}
-
     <!-- Render sticky left navigation menu -->
     <div class='fixed-nav'>
         {{ range $index_val, $elem_val := $content }}