页面细节调整优化

layout/common/article.ftl

@@ -28,7 +28,7 @@
                             <div class="level-item">
                                 <#list post.categories as category>
                                     <a class="has-link-grey -link"
-                                       href="${category.fullPath!}">${category.name!}</a>&nbsp;
+                                       href="${category.fullPath!}">${category.name!}&emsp;</a>&nbsp;
                                 </#list>
                             </div>
                         </#if>
@@ -37,7 +37,7 @@
                             <div class="level-item">
                                 <#list categories as category>
                                     <a class="has-link-grey -link"
-                                       href="${category.fullPath!}">${category.name!}</a>&nbsp;
+                                       href="${category.fullPath!}">${category.name!}&emsp;</a>&nbsp;
                                 </#list>
                             </div>
                         </#if>

layout/common/widget.ftl

@@ -24,6 +24,9 @@
         <#if settings.sidebar_categories!true>
             <#include "../widget/category.ftl">
         </#if>
+        <#if settings.sidebar_tags!true>
+            <#include "../widget/tag.ftl">
+        </#if>
         <#if settings.sidebar_tagcloud!true>
             <#include "../widget/tagcloud.ftl">
         </#if>
@@ -36,9 +39,9 @@
             <#if settings.sidebar_recentpost!true>
                 <#include "../widget/recent_posts.ftl">
             </#if>
-            <#if settings.sidebar_recentcomment!true>
+            <#--<#if settings.sidebar_recentcomment!true>
                 <#include "../widget/recent_comments.ftl">
-            </#if>
+            </#if>-->
         <#else>
             <#if post??>
                 <#include "../widget/cate_posts.ftl">
@@ -49,7 +52,7 @@
                     <#include "../widget/recent_posts.ftl">
                 </#if>
             </#if>
-            <#if settings.sidebar_recentcomment!true>
+            <#if !is_post?? && settings.sidebar_recentcomment!true>
                 <#include "../widget/recent_comments.ftl">
             </#if>
         </#if>
@@ -59,13 +62,10 @@
             <#if settings.sidebar_recentpost!true>
                 <#include "../widget/recent_posts.ftl">
             </#if>
-            <#if settings.sidebar_recentcomment!true>
+            <#--<#if !is_post?? && settings.sidebar_recentcomment!true>
                 <#include "../widget/recent_comments.ftl">
-            </#if>
+            </#if>-->
             <#--<#include "../widget/archive.ftl">-->
-            <#if settings.sidebar_tags!true>
-                <#include "../widget/tag.ftl">
-            </#if>
         </div>
     </#if>
         </div>

layout/layout.ftl

@@ -68,7 +68,7 @@
             <link rel="stylesheet" href="${settings.cdn_lightgallery_css!}">
             <link rel="stylesheet" href="${settings.cdn_justifiedGallery_css!}">
         </#if>
-        <link rel="stylesheet" href="${settings.cdn_outdatedbrowser_css!}">
+        <link rel="stylesheet" href="${theme_base!}/source/lib/outdatedbrowser/outdatedbrowser.min.css" />
         <script src="${settings.cdn_pace_js!}"></script>
 
         <link rel="stylesheet" href="${theme_base!}/source/css/style.css">
@@ -148,7 +148,7 @@
                                             </div>
                                         </div>
                                         <div class="level">
-                                            <div class="columns">
+                                            <div class="columns" style="width: 100%;">
                                                 <div class="column is-12-tablet is-12-desktop is-8-widescreen is-8-fullhd has-order-2 column-main">
                                                     <#nested />
                                                 </div>

layout/plugin/outdated-browser.ftl

@@ -1,16 +1,30 @@
 <div id="outdated">
-    <h6>Your browser is out-of-date!</h6>
+    <h6>Your browser is out of date!</h6>
-    <p>Update your browser to view this website correctly. <a id="btnUpdateBrowser" href="http://outdatedbrowser.com/">Update
+    <p>Update your browser to view this website correctly. <a id="btnUpdateBrowser" href="http://outdatedbrowser.com/">Update my browser now </a></p>
-            my browser now </a></p>
     <p class="last"><a href="#" id="btnCloseUpdateBrowser" title="Close">&times;</a></p>
 </div>
-<script src="${settings.cdn_outdatedbrowser_js!}" defer></script>
+<script src="${theme_base!}/source/lib/outdatedbrowser/outdatedbrowser.min.js"></script>
 <script>
-    document.addEventListener("DOMContentLoaded", function () {
+    //event listener form DOM ready
+    function addLoadEvent(func) {
+        var oldonload = window.onload;
+        if (typeof window.onload != 'function') {
+            window.onload = func;
+        } else {
+            window.onload = function() {
+                if (oldonload) {
+                    oldonload();
+                }
+                func();
+            }
+        }
+    }
+    //call function after DOM ready
+    addLoadEvent(function(){
         outdatedBrowser({
             bgColor: '#f25648',
             color: '#ffffff',
-            lowerThan: 'object-fit' // display on IE11 or below
+            lowerThan: 'borderImage'
-        });
+        })
     });
 </script>

layout/plugin/style.theme.ftl

@@ -179,6 +179,7 @@
         background-color: var(--cardbgcolor) !important;
         border-color: var(--cardbgcolor) !important;
         color: var(--color) !important;
+        border: 0;
     }
 
     .menu-list .level {

layout/widget/links.ftl

@@ -1,6 +1,6 @@
 <@linkTag method="list">
     <#if links?? && links?size gt 0>
-        <div class="card widget">
+        <div class="card widget is-hidden-mobile">
             <div class="card-content">
                 <div class="menu">
                 <h3 class="menu-label">

layout/widget/tagcloud.ftl

@@ -1,12 +1,12 @@
 <@tagTag method="list">
     <#if tags?? && tags?size gt 0>
-        <div class="card widget">
+        <div class="card widget is-hidden-mobile">
             <div class="card-content">
                 <h3 class="menu-label">
                     标签云
                 </h3>
                 <#list tags as tag>
-                    <a href="${tag.fullPath!}" style="font-size:<#if tag.name?length gt 7> ${tag.postCount+(tag.name?length)}<#else>${tag.postCount+(tag.name?length)*2}</#if>px">${tag.name!}</a>
+                    <a href="${tag.fullPath!}" style="font-size:<#if tag.name?length gt 7> ${tag.postCount+(tag.name?length)}<#else>${tag.postCount+(tag.name?length)*2}</#if>px">${tag.name!}&emsp;</a>
                 </#list>
             </div>
         </div>

links.ftl

@@ -44,7 +44,7 @@
             //     showUserAgent: true
             // }
           </script>
-          <halo-comment id="59" type="sheet"></halo-comment>
+          <halo-comment id="1" type="post"></halo-comment>
         </div>
       </div>
     </div>

photos.ftl

@@ -29,10 +29,6 @@
     <link rel="stylesheet" href="${settings.cdn_fontawesome_css!}">
     <#include "layout/plugin/style.theme.ftl">
 
-
-    <link rel="stylesheet"
-          href="${settings.cdn_outdatedbrowser_css!}">
-
     <link rel="stylesheet" href="${theme_base!}/source/css/style.css">
     <link rel="stylesheet" href="${theme_base!}/source/css/bundle.css">
     <link rel="stylesheet" href="${theme_base!}/source/css/back-to-top.css">

settings.yaml

@@ -421,18 +421,6 @@ custom_cdn:
       type: text
       default: '//cdn.jsdelivr.net/npm/bulma@0.7.5/css/bulma.min.css'
       placeholder: 'CDN网址'
-    cdn_outdatedbrowser_js:
-      name: cdn_outdatedbrowser_js
-      label: outdatedbrowser-js(浏览器兼容性提示插件)
-      type: text
-      default: '//cdn.jsdelivr.net/npm/outdatedbrowser@1.1.5/outdatedbrowser/outdatedbrowser.min.js'
-      placeholder: 'CDN网址'
-    cdn_outdatedbrowser_css:
-      name: cdn_outdatedbrowser_css
-      label: outdatedbrowser-css(浏览器兼容性提示插件)
-      type: text
-      default: '//cdn.jsdelivr.net/npm/outdatedbrowser@1.1.5/outdatedbrowser/outdatedbrowser.min.css'
-      placeholder: 'CDN网址'
     cdn_pace_js:
       name: cdn_pace_js
       label: pace-js(浏览器加载效果插件)

source/css/style.css

@@ -64,7 +64,7 @@ textarea {
   }
 }
 .tag.is-grey {
-  background: #e7e7e7;
+  background: #e7e7e7 !important;
 }
 .card {
   border-radius: 2px;
@@ -94,7 +94,7 @@ textarea {
   flex: 8;
 }
 .card-normal .card .card-image img {
-  max-height: 150px;
+  max-height: 120px;
   top: 50%;
   transform: translateX(-5%) translateY(-50%);
   position: relative;
@@ -106,7 +106,7 @@ textarea {
   filter: brightness(0.85);
 }
 .card-normal .card .card-content {
-  flex: 12;
+  flex: 20;
   padding: 1rem;
 }
 img.thumbnail {

source/css/style.styl

@@ -57,7 +57,7 @@ body, button, input, select, textarea
 
 .tag
     &.is-grey
-        background: #e7e7e7
+        background: #e7e7e7 !important
 
 //.card:hover
 //    .card-image
@@ -91,14 +91,14 @@ body, button, input, select, textarea
             flex: 8
             img
                 //height: 80%
-                max-height 150px
+                max-height 120px
                 top: 50%
                 transform: translateX(-5%) translateY(-50%)
                 position: relative
                 border-radius: 2px
                 box-shadow: 3px 4px 12px 0 rgba(0, 0, 0, .2)
         .card-content
-            flex: 12
+            flex: 20
             padding: 1rem
 
 

source/lib/outdatedbrowser/lang/en.html

@@ -0,0 +1,3 @@
+ <h6>Your browser is out of date!</h6>
+ <p>Update your browser to view this website correctly. <a id="btnUpdateBrowser" href="http://outdatedbrowser.com/">Update my browser now </a></p>
+ <p class="last"><a href="#" id="btnCloseUpdateBrowser" title="Close">&times;</a></p>

source/lib/outdatedbrowser/lang/zh-cn.html

@@ -0,0 +1,3 @@
+ <h6>您的浏览器已过时</h6>
+ <p>要正常浏览本网站请升级您的浏览器。<a id="btnUpdateBrowser" href="http://outdatedbrowser.com/zh-cn">现在升级</a></p>
+ <p class="last"><a href="#" id="btnCloseUpdateBrowser" title="关闭">&times;</a></p>

source/lib/outdatedbrowser/lang/zh-tw.html

@@ -0,0 +1,3 @@
+<h6>您的瀏覽器已過時</h6>
+<p>要正常瀏覽本網站請升級您的瀏覽器。 <a id="btnUpdateBrowser" href="http://outdatedbrowser.com/zh-tw">現在升級​​</a></p>
+<p class="last"> <a href="#" id="btnCloseUpdateBrowser" title="關閉"> &times; </a> </p>

source/lib/outdatedbrowser/outdatedbrowser.min.css

@@ -0,0 +1,8 @@
+/*!--------------------------------------------------------------------
+STYLES "Outdated Browser"
+Version:    1.1.2 - 2015
+author:     Burocratik
+website:    http://www.burocratik.com
+* @preserve
+-----------------------------------------------------------------------*/
+#outdated{display:none;position:fixed;top:0;left:0;width:100%;height:170px;text-align:center;text-transform:uppercase;z-index:1500;background-color:#f25648;color:#fff}* html #outdated{position:absolute}#outdated h6{font-size:25px;line-height:25px;margin:30px 0 10px}#outdated p{font-size:12px;line-height:12px;margin:0}#outdated #btnUpdateBrowser{display:block;position:relative;padding:10px 20px;margin:30px auto 0;width:230px;color:#fff;text-decoration:none;border:2px solid #fff;cursor:pointer}#outdated #btnUpdateBrowser:hover{color:#f25648;background-color:#fff}#outdated .last{position:absolute;top:10px;right:25px;width:20px;height:20px}#outdated #btnCloseUpdateBrowser{display:block;position:relative;width:100%;height:100%;text-decoration:none;color:#fff;font-size:36px;line-height:36px}

source/lib/outdatedbrowser/outdatedbrowser.min.js

@@ -0,0 +1,8 @@
+/*!--------------------------------------------------------------------
+JAVASCRIPT "Outdated Browser"
+Version:    1.1.2 - 2015
+author:     Burocratik
+website:    http://www.burocratik.com
+* @preserve
+-----------------------------------------------------------------------*/
+var outdatedBrowser=function(t){function o(t){s.style.opacity=t/100,s.style.filter="alpha(opacity="+t+")"}function e(t){o(t),1==t&&(s.style.display="block"),100==t&&(u=!0)}function r(){var t=document.getElementById("btnCloseUpdateBrowser"),o=document.getElementById("btnUpdateBrowser");s.style.backgroundColor=bkgColor,s.style.color=txtColor,s.children[0].style.color=txtColor,s.children[1].style.color=txtColor,o.style.color=txtColor,o.style.borderColor&&(o.style.borderColor=txtColor),t.style.color=txtColor,t.onmousedown=function(){return s.style.display="none",!1},o.onmouseover=function(){this.style.color=bkgColor,this.style.backgroundColor=txtColor},o.onmouseout=function(){this.style.color=txtColor,this.style.backgroundColor=bkgColor}}function l(){var t=!1;if(window.XMLHttpRequest)t=new XMLHttpRequest;else if(window.ActiveXObject)try{t=new ActiveXObject("Msxml2.XMLHTTP")}catch(o){try{t=new ActiveXObject("Microsoft.XMLHTTP")}catch(o){t=!1}}return t}function a(t){var o=l();return o&&(o.onreadystatechange=function(){n(o)},o.open("GET",t,!0),o.send(null)),!1}function n(t){var o=document.getElementById("outdated");return 4==t.readyState&&(o.innerHTML=200==t.status||304==t.status?t.responseText:d,r()),!1}var s=document.getElementById("outdated");this.defaultOpts={bgColor:"#f25648",color:"#ffffff",lowerThan:"transform",languagePath:"../outdatedbrowser/lang/en.html"},t?("IE8"==t.lowerThan||"borderSpacing"==t.lowerThan?t.lowerThan="borderSpacing":"IE9"==t.lowerThan||"boxShadow"==t.lowerThan?t.lowerThan="boxShadow":"IE10"==t.lowerThan||"transform"==t.lowerThan||""==t.lowerThan||"undefined"==typeof t.lowerThan?t.lowerThan="transform":("IE11"==t.lowerThan||"borderImage"==t.lowerThan)&&(t.lowerThan="borderImage"),this.defaultOpts.bgColor=t.bgColor,this.defaultOpts.color=t.color,this.defaultOpts.lowerThan=t.lowerThan,this.defaultOpts.languagePath=t.languagePath,bkgColor=this.defaultOpts.bgColor,txtColor=this.defaultOpts.color,cssProp=this.defaultOpts.lowerThan,languagePath=this.defaultOpts.languagePath):(bkgColor=this.defaultOpts.bgColor,txtColor=this.defaultOpts.color,cssProp=this.defaultOpts.lowerThan,languagePath=this.defaultOpts.languagePath);var u=!0,i=function(){var t=document.createElement("div"),o="Khtml Ms O Moz Webkit".split(" "),e=o.length;return function(r){if(r in t.style)return!0;for(r=r.replace(/^[a-z]/,function(t){return t.toUpperCase()});e--;)if(o[e]+r in t.style)return!0;return!1}}();if(!i(""+cssProp)){if(u&&"1"!==s.style.opacity){u=!1;for(var c=1;100>=c;c++)setTimeout(function(t){return function(){e(t)}}(c),8*c)}" "===languagePath||0==languagePath.length?r():a(languagePath);var d='<h6>Your browser is out-of-date!</h6><p>Update your browser to view this website correctly. <a id="btnUpdateBrowser" href="http://outdatedbrowser.com/">Update my browser now </a></p><p class="last"><a href="#" id="btnCloseUpdateBrowser" title="Close">&times;</a></p>'}};