Add bold for selected nav

markedjs · Aug 3, 2018 · ab89d59 · ab89d59
1 parent 6c2b90f
commit ab89d59
Showing 1 changed file with 14 additions and 1 deletion.
diff --git a/docs/index.html b/docs/index.html
@@ -57,6 +57,11 @@
             font-size: 0.8em;
         }
 
+        nav .selected {
+            color: #21283E;
+            font-weight: bold;
+        }
+
         header {
             display: flex;
             height: 50px;
@@ -177,6 +182,7 @@ <h1>Marked.js Documentation</h1>
 
         var content = document.querySelector('#content');
         var body = document.querySelector('html');
+        var navLinks = document.querySelectorAll('nav a');
         var currentPage = 'README.md';
         var currentHash = '';
         var renderedPage = '';
@@ -204,7 +210,14 @@ <h1>Marked.js Documentation</h1>
                 fetchAnchor(currentHash)
             });
 
-            history.replaceState('', document.title, '#/' + currentPage + (currentHash ? '#' + currentHash : ''));
+            var url = '#/' + currentPage + (currentHash ? '#' + currentHash : '');
+            var fullUrl = window.location.origin + '/' + url;
+
+            navLinks.forEach(function(link) {
+                link.className = link.href === fullUrl ? 'selected' : '';
+            });
+
+            history.replaceState('', document.title, url);
         }
 
         function fetchAnchor(anchor) {