feat/fix(prettify): #398

Merge pull request #398 from viosey/feat/code_highlight

_config.template.yml

@@ -122,11 +122,8 @@ qrcode:
 #       highlight:
 #         enable: false
 prettify:
-    enable: false   # if true, customcss.enable must be true
-    theme: "vibrant-ink" # default value: "vibrant-ink"   # "theme-name without .css"
-    customcss:
-        enable: false
-        csspath: "/css/custom-prettify.min.css"
+    enable: false
+    theme: "vibrant-ink" # default value: "vibrant-ink"   # theme-name without '.css'
 
 # ---------------------------------------------------------------
 # Menu Settings
@@ -266,3 +263,5 @@ vendors:
     fontawesome:
     # MathJax 2.7.0-2.7.1
     mathjax:
+    # Prettify r298 (only prettify.js)
+    prettify:

layout/_partial/head.ejs

@@ -104,9 +104,25 @@
     <% if(theme.vendors.materialcdn) { %>
         <%- cssLsload({path:(theme.vendors.materialcdn + '/css/material.min.css'),key:'material_css'}) %>
         <%- cssLsload({path:(theme.vendors.materialcdn + '/css/style.min.css'),key:'style_css'}) %>
+
+        <% if (theme.prettify.enable){ %>
+            <% if ( (is_post()) ) { %>
+                <%- cssLsload({path:(theme.vendors.materialcdn + '/css/prettify.min.css'),key:'prettify_css'}) %>
+                <%- cssLsload({path:(theme.vendors.materialcdn + '/css/prettify/' + theme.prettify.theme + '.min.css'),key:'prettify_theme'}) %>
+            <% } %>
+        <% } %>
+
     <% } else { %>
         <%- cssLsload({path:(config.root + 'css/material.min.css'),key:'material_css'}) %>
         <%- cssLsload({path:(config.root + 'css/style.min.css'),key:'style_css'}) %>
+
+        <% if (theme.prettify.enable){ %>
+            <% if ( (is_post()) ) { %>
+                <%- cssLsload({path:(config.root + 'css/prettify.min.css'),key:'prettify_css'}) %>
+                <%- cssLsload({path:(config.root + 'css/prettify/' + theme.prettify.theme + '.min.css'),key:'prettify_theme'}) %>
+            <% } %>
+        <% } %>
+
     <% } %>
 
     <% if(theme.scheme === 'Isolation') { %>
@@ -174,17 +190,4 @@
         <% } %>
     <% } %>
 
-    <% if (theme.prettify.enable){ %>
-        <!-- prettify代码高亮主题css引入 -->
-        <link href="/vendors/prettify/themes/<%= theme.prettify.theme %>.css" rel="stylesheet">
-    <% } %>
-
-    <!-- 自定义css引入 -->
-    <% if (theme.customcss.enable){ %>
-        <% if (theme.customcss.csspath) { %>
-            <% for (var i in theme.customcss.csspath) { %>
-                <link href="<%= theme.customcss.csspath[i] %>" rel="stylesheet">
-            <% } %>
-        <% } %>
-    <% } %>
 </head>

layout/_partial/import_js.ejs

@@ -58,25 +58,33 @@
 	}
 </script>
 
-<!-- prettify代码高亮js引入 -->
+<!-- Import prettify js  -->
 <% if (theme.prettify.enable){ %>
-    <script src="/vendors/prettify/prettify.js" type="text/javascript"></script>
-<%}%>
+    <% if ( (is_post()) ) { %>
+        <% if(theme.vendors.prettify) { %>
+            <%- jsLsload({path:(theme.vendors.prettify),key:'prettify_js'}) %>
+        <% } else { %>
+            <%- jsLsload({path:(config.root + 'js/prettify.min.js'),key:'prettify_js'}) %>
+        <% } %>
+    <% } %>
+<% } %>
 
-<!-- Window Load-->
+<!-- Window Load -->
+<!-- add class for prettify -->
 <script type="text/ls-javascript" id="window-load">
     $(window).on('load', function() {
         // Post_Toc parent position fixed
         $('.post-toc-wrap').parent('.mdl-menu__container').css('position', 'fixed');
     });
 
-    $(function() {
-        <!-- prettify代码高亮js引入 -->
-        <% if (theme.prettify.enable){ %>
-            $('pre').addClass('prettyprint linenums').attr('style', 'overflow:auto;');
-            prettyPrint();
-        <%}%>
-    })
+    <% if (theme.prettify.enable) { %>
+        <% if ( (is_post()) ) { %>
+            $(function() {
+                $('pre').addClass('prettyprint linenums').attr('style', 'overflow:auto;');
+                prettyPrint();
+                })
+        <% } %>
+    <% } %>
 </script>
 
 <!-- MathJax Load-->

source/css/prettify.css

@@ -0,0 +1,27 @@
+@charset "UTF-8";
+
+/* for color-themes-for-google-code-prettify */
+pre{
+    white-space: pre-wrap;
+    word-break: break-all;
+    word-wrap: break-word;
+}
+
+#post-content .prettyprint{
+    padding: 1.2em;
+    border-radius: 0;
+}
+
+#post-content ol,#post-content ul{
+    padding-left: 51px;
+    font-size: 1rem;
+    margin: 0;
+}
+
+#post-content .prettyprint li.L0, #post-content .prettyprint li.L1,
+#post-content .prettyprint li.L2, #post-content .prettyprint li.L3,
+#post-content .prettyprint li.L4, #post-content .prettyprint li.L5,
+#post-content .prettyprint li.L6, #post-content .prettyprint li.L7,
+#post-content .prettyprint li.L8, #post-content .prettyprint li.L9 {
+    padding-left: 0.8em;
+}