feat: 新增標籤外掛 timeline closed #644

fix: 自建頁面圖片沒有 blur 效果
improvement: 優化 404 頁面 UI
improvement: lazyload 默認佔位圖改為透明圖片
improvement: 優化 lazyload blur 出現特效
improvement: 優化 css

scripts/filters/post_lazyload.js

@@ -9,7 +9,7 @@
 const urlFor = require('hexo-util').url_for.bind(hexo)
 
 function lazyload (htmlContent) {
-  const bg = hexo.theme.config.lazyload.placeholder ? urlFor(hexo.theme.config.lazyload.placeholder) : 'data:image/gif;base64,R0lGODdhAQABAPAAAMPDwwAAACwAAAAAAQABAAACAkQBADs='
+  const bg = hexo.theme.config.lazyload.placeholder ? urlFor(hexo.theme.config.lazyload.placeholder) : 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7'
   return htmlContent.replace(/(<img.*? src=)/ig, `$1 "${bg}" data-lazy-src=`)
 }
 

scripts/tag/timeline.js

@@ -0,0 +1,40 @@
+/**
+ * timeline
+ * by Jerry
+ */
+
+'use strict'
+
+function timeLineFn (args, content) {
+  const tlBlock = /<!--\s*timeline (.*?)\s*-->\n([\w\W\s\S]*?)<!--\s*endtimeline\s*-->/g
+
+  let result = ''
+  if (args.length) {
+    args = hexo.render.renderSync({ text: args.join(' '), engine: 'markdown' })
+    result += `<div class='timeline-item headline'><div class='timeline-item-title'><div class='item-circle'>${args}</div></div></div>`
+  }
+
+  const matches = []
+  let match
+
+  while ((match = tlBlock.exec(content)) !== null) {
+    matches.push(match[1])
+    matches.push(match[2])
+  }
+
+  console.log(matches)
+
+  for (let i = 0; i < matches.length; i += 2) {
+    const tlChildTitle = hexo.render.renderSync({ text: matches[i], engine: 'markdown' })
+    const tlChildContent = hexo.render.renderSync({ text: matches[i + 1], engine: 'markdown' })
+
+    const tlTitleHtml = `<div class='timeline-item-title'><div class='item-circle'>${tlChildTitle}</div></div>`
+    const tlContentHtml = `<div class='timeline-item-content'>${tlChildContent}</div>`
+
+    result += `<div class='timeline-item'>${tlTitleHtml + tlContentHtml}</div>`
+  }
+
+  return `<div class="timeline">${result}</div>`
+}
+
+hexo.extend.tag.register('timeline', timeLineFn, { ends: true })