diff --git a/content/js/main.js b/content/js/main.js index d1e84ae..9aed0d3 100644 --- a/content/js/main.js +++ b/content/js/main.js @@ -7,13 +7,6 @@ function setVisibleTags(){ } } -var isMobile = window.screen.width < 720; -if (localStorage.getItem("openside") === null) { - window.sidebarExpanded = !isMobile; -} else { - window.sidebarExpanded = (localStorage.getItem("openside") === "true"); -} - function updateSidebar(notransition) { if (notransition) { document.querySelectorAll("#sidebar")[0].classList.add("notransition"); @@ -40,8 +33,42 @@ function sidebarClick() { updateSidebar(false); } +function getNextPrev() { + // thanks iznogoodd from #nim @ freenode.net + var links = document.querySelectorAll('#sidebar a[href]'); + + var nav = {prev: null, next: null}; + for(var i = 0; i < links.length; i++){ + var item = links.item(i); + if(item && item.getAttribute('href') === window.location.pathname){ + nav.prev = links.item(i - 1) && links.item(i - 1).getAttribute('href'); + nav.next = links.item(i + 1) && links.item(i + 1).getAttribute('href'); + return nav; + } + } +} + +function updateNextPrevButtons() { + var nav = getNextPrev(); + + var prev = document.getElementById("arrow-prev"); + var next = document.getElementById("arrow-next"); + + if (nav.prev != null) { prev.classList.remove("disabled"); prev.href = nav.prev; } + if (nav.next != null) { next.classList.remove("disabled"); next.href = nav.next; } +} + + +var isMobile = window.screen.width < 720; +if (localStorage.getItem("openside") === null) { + window.sidebarExpanded = !isMobile; +} else { + window.sidebarExpanded = (localStorage.getItem("openside") === "true"); +} + localStorage.setItem(window.location.pathname, true); window.onload = function(){ updateSidebar(true); setVisibleTags(); + updateNextPrevButtons(); } diff --git a/content/stylesheets/main.css b/content/stylesheets/main.css index 3559871..8d14e3e 100644 --- a/content/stylesheets/main.css +++ b/content/stylesheets/main.css @@ -58,6 +58,16 @@ body { .nav-toggle span { margin-top: 9.5px; } +#nextprev { + overflow: hidden; + padding: .5em 1em; +} + +.text-icon { font-size: 5em; } +#arrow-prev { float: left; } +#arrow-next { float: right; } + + article { margin: 15px; @@ -70,6 +80,9 @@ a { text-decoration: none; } a:link, a:visited { color: #B45D47; } a:hover { color: #FE3B3B; } +a.disabled, a:link.disabled, a:visited.disabled { color: #999; pointer-events: none; } +a:hover.disabled { color: #888; } + pre, code { font-family: Monaco, Menlo, Consolas, "Courier New", monospace; } code { diff --git a/layouts/default.html b/layouts/default.html index 38e674c..6b5ed74 100644 --- a/layouts/default.html +++ b/layouts/default.html @@ -41,6 +41,11 @@ <%= yield %> +
+ ↽ + ⇁ +
+