feat: add sticky bar with smooth scroll

exampleSite/README.md

@@ -3,9 +3,9 @@
     - créer une section Showcase
 - refaire la possibilité d'overrider le style/script/etc -> TODO
 - créer des jolis thèmes de base (avec des noms) -> TODO
-- ajouter Travis pour tester le thème quotidiennement avec les nouvelles versions de Hugo -> TODO
-
+- ajouter les attachments -> TODO
 
+- ajouter Travis pour tester le thème quotidiennement avec les nouvelles versions de Hugo -> OK
 - #54 -> OK
 - corriger slider menu qui ne fonctionne plus -> OK
 - Update font awesome -> OK

layouts/partials/favicon.html

@@ -1 +1,2 @@
 <link rel="shortcut icon" href="/images/favicon.png" type="image/x-icon" />
+<link rel="icon" href="/images/favicon.png" type="image/x-icon" />

layouts/partials/header.html

@@ -34,7 +34,7 @@
     {{ partial "menu.html" . }}
         <section id="body">
         <div id="overlay"></div>
-        <div class="padding highlightable">
+        <div class="padding highlightable sticky-parent">
               {{if not .IsHome}}
               <div id="top-bar">
               {{ if and (or .IsPage .IsSection) .Site.Params.editURL }}

static/js/hugo-learn.js

@@ -56,10 +56,10 @@ images.each(function(index){
 });
 
 // Stick the top to the top of the screen when  scrolling
-//$("#top-bar").stick_in_parent( {
-//  parent: ".sticky-parent",
-//  spacer: ".sticky-spacer",
-//});
+$("#top-bar").stick_in_parent( {
+ parent: ".sticky-parent",
+ spacer: ".sticky-spacer",
+});
 
 
 jQuery(document).ready(function() {

static/js/learn.js

@@ -251,6 +251,89 @@ jQuery(document).ready(function() {
         });
     }
 
+    /** 
+    * Fix anchor scrolling that hides behind top nav bar
+    * Courtesy of https://stackoverflow.com/a/13067009/28106
+    *
+    * We could use pure css for this if only heading anchors were
+    * involved, but this works for any anchor, including footnotes
+    **/
+    (function (document, history, location) {
+        var HISTORY_SUPPORT = !!(history && history.pushState);
+
+        var anchorScrolls = {
+            ANCHOR_REGEX: /^#[^ ]+$/,
+            OFFSET_HEIGHT_PX: 50,
+
+            /**
+             * Establish events, and fix initial scroll position if a hash is provided.
+             */
+            init: function () {
+                this.scrollToCurrent();
+                $(window).on('hashchange', $.proxy(this, 'scrollToCurrent'));
+                $('body').on('click', 'a', $.proxy(this, 'delegateAnchors'));
+            },
+
+            /**
+             * Return the offset amount to deduct from the normal scroll position.
+             * Modify as appropriate to allow for dynamic calculations
+             */
+            getFixedOffset: function () {
+                return this.OFFSET_HEIGHT_PX;
+            },
+
+            /**
+             * If the provided href is an anchor which resolves to an element on the
+             * page, scroll to it.
+             * @param  {String} href
+             * @return {Boolean} - Was the href an anchor.
+             */
+            scrollIfAnchor: function (href, pushToHistory) {
+                var match, anchorOffset;
+
+                if (!this.ANCHOR_REGEX.test(href)) {
+                    return false;
+                }
+
+                match = document.getElementById(href.slice(1));
+
+                if (match) {
+                    anchorOffset = $(match).offset().top - this.getFixedOffset();
+                    $('html, body').animate({ scrollTop: anchorOffset });
+
+                    // Add the state to history as-per normal anchor links
+                    if (HISTORY_SUPPORT && pushToHistory) {
+                        history.pushState({}, document.title, location.pathname + href);
+                    }
+                }
+
+                return !!match;
+            },
+
+            /**
+             * Attempt to scroll to the current location's hash.
+             */
+            scrollToCurrent: function (e) {
+                if (this.scrollIfAnchor(window.location.hash) && e) {
+                    e.preventDefault();
+                }
+            },
+
+            /**
+             * If the click event's target was an anchor, fix the scroll position.
+             */
+            delegateAnchors: function (e) {
+                var elem = e.target;
+
+                if (this.scrollIfAnchor(elem.getAttribute('href'), true)) {
+                    e.preventDefault();
+                }
+            }
+        };
+
+        $(document).ready($.proxy(anchorScrolls, 'init'));
+    })(window.document, window.history, window.location);
+    
 });
 
 jQuery(window).on('load', function() {