From 021311974f37aa25c3502c4f542f14461507f964 Mon Sep 17 00:00:00 2001 From: Cotes Chung <11371340+cotes2020@users.noreply.github.com> Date: Sat, 22 Feb 2020 02:45:07 +0800 Subject: [PATCH] Replace the non-link elements. Good for CSP. --- _includes/post-nav.html | 19 +-- _includes/topbar.html | 2 +- assets/css/main.scss | 2 +- assets/css/post.scss | 124 ++++++++++-------- assets/js/_src/_commons/search-display.js | 2 +- assets/js/dist/_commons/search-display.min.js | 2 +- 6 files changed, 81 insertions(+), 70 deletions(-) diff --git a/_includes/post-nav.html b/_includes/post-nav.html index a0744b6..81a6231 100644 --- a/_includes/post-nav.html +++ b/_includes/post-nav.html @@ -11,18 +11,21 @@ {% if page.previous.url %}

{{ page.previous.title }}

- {% else %} -
-

-

- {% endif %}
+ {% else %} + +

-

+
+ {% endif %} {% if page.next.url %}

{{ page.next.title }}

- {% else %} -
-

-

- {% endif %}
+ {% else %} + +

-

+
+ {% endif %} + \ No newline at end of file diff --git a/_includes/topbar.html b/_includes/topbar.html index 8ee6880..5995e8f 100644 --- a/_includes/topbar.html +++ b/_includes/topbar.html @@ -44,7 +44,7 @@ - Cancel + Cancel \ No newline at end of file diff --git a/assets/css/main.scss b/assets/css/main.scss index 65547f7..d89bbf2 100644 --- a/assets/css/main.scss +++ b/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; diff --git a/assets/css/post.scss b/assets/css/post.scss index 56923f9..da762ea 100644 --- a/assets/css/post.scss +++ b/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 { diff --git a/assets/js/_src/_commons/search-display.js b/assets/js/_src/_commons/search-display.js index 37285c8..e54e0c9 100644 --- a/assets/js/_src/_commons/search-display.js +++ b/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'); diff --git a/assets/js/dist/_commons/search-display.min.js b/assets/js/dist/_commons/search-display.min.js index 8d789e1..3f614e6 100644 --- a/assets/js/dist/_commons/search-display.min.js +++ b/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")})}); \ No newline at end of file +$(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")})}); \ No newline at end of file