Replace the non-link elements.

Good for CSP.

_includes/post-nav.html

@@ -11,18 +11,21 @@
   {% if page.previous.url %}
   <a href="{{ site.baseurl }}{{ page.previous.url }}" class="btn btn-outline-primary">
     <p>{{ page.previous.title }}</p>
-  {% else %}
-  <a href="javascript:;" class="btn btn-outline-primary disabled">
-    <p>-</p>
-  {% endif %}
   </a>
+  {% else %}
+  <span class="btn btn-outline-primary disabled">
+    <p>-</p>
+  </span>
+  {% endif %}
 
   {% if page.next.url %}
   <a href="{{ site.baseurl }}{{page.next.url}}" class="btn btn-outline-primary">
     <p>{{ page.next.title }}</p>
-  {% else %}
-    <a href="javascript:;" class="btn btn-outline-primary disabled">
-    <p>-</p>
-  {% endif %}
   </a>
+  {% else %}
+  <span class="btn btn-outline-primary disabled">
+    <p>-</p>
+  </span>
+  {% endif %}
+
 </div>

_includes/topbar.html

@@ -44,7 +44,7 @@
       <input class="form-control" id="search-input" type="search" placeholder="{{ site.data.label.search_hint }}...">
       <i class="fa fa-times-circle fa-fw" id="search-cleaner"></i>
     </span>
-    <a href="javascript:;">Cancel</a>
+    <span id="search-cancel" >Cancel</span>
   </div>
 
 </div>

assets/css/main.scss

@@ -328,7 +328,7 @@ body {
   visibility: hidden;
 }
 
-#search-wrapper+a { /* 'Cancel' link */
+#search-cancel { /* 'Cancel' link */
   color: var(--link-color, #2a408e);
   margin-left: 1rem;
   display: none;

assets/css/post.scss

@@ -27,69 +27,77 @@
   font-size: 0.85rem;
 }
 
+$prompt-older: "Older";
+$prompt-newer: "Newer";
+
 .post-navigation {
   padding-top: 3rem;
   padding-bottom: 2rem;
+
+  .btn, .btn.disabled {
+    width: 50%;
+    position: relative;
+    color: var(--link-color, #2a408e);
+    border-color: var(--main-border, #e9ecef);
+  }
+
+  .btn:hover {
+    background: #2a408e;
+    color: #fff;
+    border-color: #2a408e;
+  }
+
+  .btn.disabled {
+    pointer-events: auto;
+    cursor: not-allowed;
+    background: none;
+    color: gray;
+    // border-color: var(--main-border, #e9ecef);
+  }
+
+  .btn.btn-outline-primary.disabled:focus {
+    box-shadow: none;
+  }
+
+  p {
+    font-size: 1.1rem;
+    line-height: 1.5rem;
+    margin-top: .3rem;
+    white-space: normal;
+  }
+
+  a::before,
+  span::before {
+    color: var(--text-muted-color, gray);
+    font-size: .65rem;
+    text-transform: uppercase;
+  }
+
+  a:first-child,
+  span:first-child {
+    border-top-right-radius: 0;
+    border-bottom-right-radius: 0;
+    left: .5px;
+  }
+
+  a:last-child,
+  span:last-child {
+    border-top-left-radius: 0;
+    border-bottom-left-radius: 0;
+    right: .5px;
+  }
+
+  a:first-child::before,
+  span:first-child::before {
+    content: $prompt-older
+  }
+
+  a:last-child::before,
+  span:last-child::before {
+    content: $prompt-newer
+  }
 }
 
-.post-navigation .btn,
-.post-navigation .btn.disabled {
-  width: 50%;
-  position: relative;
-  color: var(--link-color, #2a408e);
-  border-color: var(--main-border, #e9ecef);
-}
-
-.post-navigation .btn:hover {
-  background: #2a408e;
-  color: #fff;
-  border-color: #2a408e;
-}
-
-.post-navigation a.btn.disabled {
-  pointer-events: auto;
-  cursor: not-allowed;
-  background: none;
-  color: gray;
-  border-color: var(--main-border, #e9ecef);
-}
-
-.post-navigation a.btn.btn-outline-primary.disabled:focus {
-  box-shadow: none;
-}
-
-.post-navigation a > p {
-  font-size: 1.1rem;
-  line-height: 1.5rem;
-  margin-top: .3rem;
-  white-space: normal;
-}
-
-.post-navigation a:first-child {
-  border-top-right-radius: 0;
-  border-bottom-right-radius: 0;
-  left: .5px;
-}
-
-.post-navigation a:last-child {
-  border-top-left-radius: 0;
-  border-bottom-left-radius: 0;
-  right: .5px;
-}
-
-.post-navigation a::before {
-  color: var(--text-muted-color, gray);
-  font-size: .65rem;
-  text-transform: uppercase;
-}
-
-.post-navigation a:first-child::before {
-  content: "Older";
-}
-
-.post-navigation a:last-child::before {
-  content: "Newer";
-}
 
 @keyframes fade-up {
   from {

assets/js/_src/_commons/search-display.js

@@ -10,7 +10,7 @@ $(function() {
 
   var btnSbTrigger = $('#sidebar-trigger');
   var btnSearchTrigger = $('#search-trigger');
-  var btnCancel = $('#search-wrapper + a');
+  var btnCancel = $('#search-cancel');
   var btnClear = $('#search-cleaner');
 
   var main = $('#main');

assets/js/dist/_commons/search-display.min.js

@@ -1 +1 @@
-$(function(){var j=$("#sidebar-trigger");var o=$("#search-trigger");var h=$("#search-wrapper + a");var b=$("#search-cleaner");var e=$("#main");var c=$("#topbar-title");var k=$("#search-wrapper");var i=$("#search-result-wrapper");var g=$("#search-results");var l=$("#search-input");var a=$("#search-hints");var d=(function(){var p=0;return{block:function(){p=$(window).scrollTop();$("body").addClass("no-scroll")},release:function(){$("body").removeClass("no-scroll");$("html,body").scrollTop(p)},getOffset:function(){return p}}})();var m=(function(){return{on:function(){j.addClass("unloaded");c.addClass("unloaded");o.addClass("unloaded");k.addClass("d-flex");h.addClass("loaded")},off:function(){h.removeClass("loaded");k.removeClass("d-flex");j.removeClass("unloaded");c.removeClass("unloaded");o.removeClass("unloaded")}}})();var n=(function(){var p=false;return{on:function(){if(!p){i.removeClass("unloaded");e.addClass("hidden");p=true;d.block()}},off:function(){if(p){g.empty();if(a.hasClass("unloaded")){a.removeClass("unloaded")}i.addClass("unloaded");b.removeClass("visable");e.removeClass("hidden");l.val("");p=false;d.release()}},isVisable:function(){return p}}})();function f(){return h.hasClass("loaded")}o.click(function(){m.on();n.on();l.focus()});h.click(function(){m.off();n.off()});l.focus(function(){k.addClass("input-focus")});l.focusout(function(){k.removeClass("input-focus")});l.on("keyup",function(p){if(p.keyCode==8&&l.val()==""){if(!f()){n.off()}else{a.removeClass("unloaded")}}else{if(l.val()!=""){n.on();if(!b.hasClass("visible")){b.addClass("visable")}if(f()){a.addClass("unloaded")}}}});b.on("click",function(){l.val("");if(f()){a.removeClass("unloaded");g.empty()}else{n.off()}l.focus();b.removeClass("visable")})});
+$(function(){var j=$("#sidebar-trigger");var o=$("#search-trigger");var h=$("#search-cancel");var b=$("#search-cleaner");var e=$("#main");var c=$("#topbar-title");var k=$("#search-wrapper");var i=$("#search-result-wrapper");var g=$("#search-results");var l=$("#search-input");var a=$("#search-hints");var d=(function(){var p=0;return{block:function(){p=$(window).scrollTop();$("body").addClass("no-scroll")},release:function(){$("body").removeClass("no-scroll");$("html,body").scrollTop(p)},getOffset:function(){return p}}})();var m=(function(){return{on:function(){j.addClass("unloaded");c.addClass("unloaded");o.addClass("unloaded");k.addClass("d-flex");h.addClass("loaded")},off:function(){h.removeClass("loaded");k.removeClass("d-flex");j.removeClass("unloaded");c.removeClass("unloaded");o.removeClass("unloaded")}}})();var n=(function(){var p=false;return{on:function(){if(!p){i.removeClass("unloaded");e.addClass("hidden");p=true;d.block()}},off:function(){if(p){g.empty();if(a.hasClass("unloaded")){a.removeClass("unloaded")}i.addClass("unloaded");b.removeClass("visable");e.removeClass("hidden");l.val("");p=false;d.release()}},isVisable:function(){return p}}})();function f(){return h.hasClass("loaded")}o.click(function(){m.on();n.on();l.focus()});h.click(function(){m.off();n.off()});l.focus(function(){k.addClass("input-focus")});l.focusout(function(){k.removeClass("input-focus")});l.on("keyup",function(p){if(p.keyCode==8&&l.val()==""){if(!f()){n.off()}else{a.removeClass("unloaded")}}else{if(l.val()!=""){n.on();if(!b.hasClass("visible")){b.addClass("visable")}if(f()){a.addClass("unloaded")}}}});b.on("click",function(){l.val("");if(f()){a.removeClass("unloaded");g.empty()}else{n.off()}l.focus();b.removeClass("visable")})});