jekyll-toc: fix css issue

Signed-off-by: José Valim <[email protected]>

Author: eksperimental

_includes/bottom.html

@@ -31,10 +31,10 @@
         headers: 'h2, h3, h4, h5, h6',
         showSpeed: 0,
         linkHere: true,
-        linkHereDuration: 600,
+        linkHereDuration: 0,
         backToTop: true,
         backToTopSelector: '.toc',
-        backToTopDuration: 100,
+        backToTopDuration: 0,
       });
       $('.jekyll-toc-header a.jekyll-toc-link-here span.jekyll-toc-icon').addClass('icon icon-link');
       $('.jekyll-toc-header a.jekyll-toc-back-to-top span.jekyll-toc-icon').addClass('icon icon-chevron-up');

_includes/toc.html

@@ -1 +1 @@
-<div class="toc"></div>
+<div id="toc" class="toc"></div>

css/style.css

@@ -914,9 +914,9 @@ li.image {
 }
 
 /* extending jekyll-toc */
-.icon, .icon span {
+.icon {
   font: normal normal normal 16px/1 icons !important;
-  display: inline-block !important;
+  /* display: inline-block; */
   text-decoration: none;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;

js/toc/toc.js

@@ -64,21 +64,42 @@
     var back_to_top = '<a class="jekyll-toc-anchor jekyll-toc-back-to-top"><span class="jekyll-toc-icon">'+settings.backToTopText+'</span></a>';
     var link_here = '<a class="jekyll-toc-anchor jekyll-toc-link-here"><span class="jekyll-toc-icon">'+settings.linkHereText+'</span></a>';
 
+    function force_update_hash(hash) { 
+      window.location.hash = '';
+      window.location.hash = hash;
+    }
+
+    function update_hash(hash) { 
+      if(history.pushState) {
+        history.pushState(null, null, '#'+hash);
+      } else {
+        force_update_hash(hash)
+      }
+    }
+
     function animate_link_here(header_id) {
+      update_hash( (typeof header_id === "undefined") ? '' : header_id );
       $('html,body').animate({scrollTop:$(document.getElementById(header_id)).offset().top}, settings.linkHereDuration);
-      window.location.hash = ( header_id === "undefined" ) ? '' : header_id;
     }
-    
+
     if (settings.backToTop) {
       $(document).on('click', '.jekyll-toc-back-to-top', function() {
-        if ( settings.backToTopSelector == '' )                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                        {
-          $('html, body').animate({scrollTop: $('html, body').offset().top}, settings.backToTopDuration);
-          window.location.hash = '';
+        if ( settings.backToTopSelector == '' ) {
+          if ( settings.backToTopDuration > 0 ) {
+            update_hash('');
+            $('html, body').animate({scrollTop: $('html, body').offset().top}, settings.backToTopDuration);
+          } else {
+            force_update_hash('');
+          }
         } else {
-          var top_element = $(settings.backToTopSelector).first();
-          $('html, body').animate({scrollTop: top_element.offset().top}, settings.backToTopDuration);
+          var top_element = ( $(settings.backToTopSelector).length ) ? $(settings.backToTopSelector).first() : $('html, body');
           var top_element_id = $(top_element).attr('id');
-          window.location.hash = ( typeof top_element_id === "undefined" ) ? '' : top_element_id;
+          update_hash ( (typeof top_element_id === "undefined") ? '' : top_element_id );
+          if ( settings.backToTopDuration > 0 || window.location.hash == '' ) {
+            $('html, body').animate({scrollTop: top_element.offset().top}, settings.backToTopDuration);
+          } else {
+            force_update_hash(window.location.hash);
+          }
         }
       });
     }
@@ -132,4 +153,4 @@
 
     render[settings.showEffect]();
   };
-})(jQuery);
+})(jQuery);