scroll indicator and glowing logo

3 files changed, 71 insertions, 46 deletions

diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
index 9b14356..6a8a68d 100644
--- a/layouts/_default/baseof.html
+++ b/layouts/_default/baseof.html
@@ -40,6 +40,75 @@
 
     
   </div>
+
+  <!-- Back to top -->
+    {{ if .Site.Params.backtotop }}
+      <div id="backtotop" class="w3-hide-small w3-hide-medium">
+  
+        <button onclick="topFunction()" class="w3-btn w3-red w3-large" style="width:160px">{{ T "backtotop"}}
+        &rarr;</button>
+        
+      </div>
+
+      <script>
+        function topFunction() {
+          document.body.scrollTop = 0;
+          document.documentElement.scrollTop = 0;
+      }
+      </script>
+
+
+    {{ end }}
+
+    <!-- scroll indicator -->
+    {{ if .Site.Params.scrollindicator }}
+      <div class="progress-container" id="scrollbar">
+        <div class="progress-bar" id="progress-bar"></div>
+      </div>  
+
+
+    {{ end }}
+<script>
+// When the user scrolls down 50px from the top of the document, show the button
+window.onscroll = function() {scrollFunction()};
+
+function scrollFunction() {
+  <!-- TOC -->
+    {{ if and (ge (len .TableOfContents) 100) (ne .Params.toc "false")  }}
+    
+    if (document.body.scrollTop > 50 || document.documentElement.scrollTop > 50) {
+        document.getElementById("toc").style.display = "block";
+    } else {
+        document.getElementById("toc").style.display = "none";
+    }
+    {{ end }}
+<!-- Back to top -->
+    {{ if .Site.Params.backtotop }}
+    if (document.body.scrollTop > 50 || document.documentElement.scrollTop > 50) {
+        document.getElementById("backtotop").style.display = "block";
+    } else {
+        document.getElementById("backtotop").style.display = "none";
+    }
+    {{ end }}
+    <!-- scroll indicator -->
+    {{ if .Site.Params.scrollindicator }}
+      var winScroll = document.body.scrollTop || document.documentElement.scrollTop;
+      var height = document.documentElement.scrollHeight - document.documentElement.clientHeight;
+      var scrolled = (winScroll / height) * 100;
+      document.getElementById("progress-bar").style.width = scrolled + "%";
+      if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
+            document.getElementById("scrollbar").style.display = "block";
+        } else {
+            document.getElementById("scrollbar").style.display = "none";
+        }
+    
+
+    {{ end }}
+}
+
+
+</script>
+
   {{ with .Params.customfooter }}
 {{ . | safeHTML }}
 {{ end }}
diff --git a/layouts/partials/header.html b/layouts/partials/header.html
index b712e89..e5e34e7 100644
--- a/layouts/partials/header.html
+++ b/layouts/partials/header.html
@@ -37,7 +37,7 @@
   <div class="w3-content">
   
   <div class="w3-container w3-center w3-padding-32 w3-hide-small"> 
-      <h1 class="w3-xxxlarge w3-text-blue w3-wide w3-allerta" style="text-shadow:1px 1px 0 #444" ><u>
+      <h1 class="w3-xxxlarge w3-text-blue w3-wide w3-allerta {{ if .Site.Params.glowlogo }} glow {{ end }} " style="text-shadow:1px 1px 0 #444" ><u>
       {{ with .Site.Params.logotext }}
          {{ . }}
       {{ else }}
diff --git a/layouts/post/single.html b/layouts/post/single.html
index 53c1808..fd29ef9 100644
--- a/layouts/post/single.html
+++ b/layouts/post/single.html
@@ -15,51 +15,7 @@
       </div>
     {{ end }}
 
- <!-- Back to top -->
-    {{ if .Site.Params.backtotop }}
-      <div id="backtotop" class="w3-hide-small w3-hide-medium">
-  
-        <button onclick="topFunction()" class="w3-btn w3-red w3-large" style="width:160px">{{ T "backtotop"}}
-        &rarr;</button>
-        
-      </div>
-
-      <script>
-        function topFunction() {
-          document.body.scrollTop = 0;
-          document.documentElement.scrollTop = 0;
-      }
-      </script>
-
-
-    {{ end }}
-<script>
-// When the user scrolls down 50px from the top of the document, show the button
-window.onscroll = function() {scrollFunction()};
-
-function scrollFunction() {
-  <!-- TOC -->
-    {{ if and (ge (len .TableOfContents) 100) (ne .Params.toc "false")  }}
-    
-    if (document.body.scrollTop > 50 || document.documentElement.scrollTop > 50) {
-        document.getElementById("toc").style.display = "block";
-    } else {
-        document.getElementById("toc").style.display = "none";
-    }
-    {{ end }}
-<!-- Back to top -->
-    {{ if .Site.Params.backtotop }}
-    if (document.body.scrollTop > 50 || document.documentElement.scrollTop > 50) {
-        document.getElementById("backtotop").style.display = "block";
-    } else {
-        document.getElementById("backtotop").style.display = "none";
-    }
-    {{ end }}
-}
-
-
-</script>
-
+