hexo-theme-stellar 1.13.0 → 1.15.0

package/README.md

@@ -2,6 +2,9 @@
 
 Stellar 是一个内置文档系统的简约商务风 Hexo 主题，支持丰富的标签和动态数据组件，请配合 [文档](https://xaoxuu.com/wiki/stellar/) 使用。
 
+[![Star History Chart](https://api.star-history.com/svg?repos=xaoxuu/hexo-theme-stellar&type=Date)](https://star-history.com/#xaoxuu/hexo-theme-stellar&Date)
+
+
 ## Getting Started
 
 Check your environment:

package/_config.yml

@@ -1,6 +1,6 @@
 ######## Stellar info ########
 stellar:
-  version: '1.13.0'
+  version: '1.15.0'
   homepage: 'https://xaoxuu.com/wiki/stellar/'
   repo: 'https://github.com/xaoxuu/hexo-theme-stellar'
   cdn_css: # Use cdn links instead of /css/main.css
@@ -212,6 +212,7 @@ tag_plugins:
     qq: https://fastly.jsdelivr.net/gh/cdn-x/emoji/qq/%s.gif
     aru: https://fastly.jsdelivr.net/gh/cdn-x/emoji/aru-l/%s.gif
     tieba: https://fastly.jsdelivr.net/gh/cdn-x/emoji/tieba/%s.png
+    blobcat: https://gcore.jsdelivr.net/gh/norevi/waline-blobcatemojis@1.0/blobs/%s.png
   # {% image %}
   image:
     fancybox: # true, false
@@ -325,7 +326,7 @@ style:
       card: white # 卡片背景颜色
       title: '#000' # 标题文本颜色
       text: '#333' # 正文文本颜色
-      code: '#111' # 行内代码颜色
+      code: '#f33a00' # 行内代码颜色
     dark:
       background: '#313438' # 深色背景颜色
       background-mobile: black # 移动端深色背景（OLED调成纯黑可以省电）
@@ -349,3 +350,8 @@ default:
   link: https://fastly.jsdelivr.net/gh/cdn-x/placeholder@1.0.1/link/8f277b4ee0ecd.svg
   cover: https://fastly.jsdelivr.net/gh/cdn-x/placeholder@1.0.1/cover/76b86c0226ffd.svg
   image: https://fastly.jsdelivr.net/gh/cdn-x/placeholder@1.0.1/image/2659360.svg
+
+api_host:
+  ghapi: https://api.github.com
+  ghraw: https://raw.githubusercontent.com
+  gist: https://gist.github.com

package/_data/links.yml

@@ -1,4 +1,4 @@
-
+# 不要直接在这里写，要复制到 blog/source/_data/links.yml 位置
 '示例':
   - title: XAOXUU
     avatar: https://bu.dusays.com/2021/09/24/2f74810ceb3d3.png

package/_data/widgets.yml

@@ -61,10 +61,12 @@ welcome:
     **第二步**
     创建 `blog/source/_data/widgets.yml` 文件，此文件中填写需要自定义的侧边栏组件，例如 `welcome` 组件。
     <br>
-    如果有任何疑问，请先查阅[文档](https://xaoxuu.com/wiki/stellar/)，如果文档中没有提供，请提 [issue](https://github.com/xaoxuu/hexo-theme-stellar/issues/) 向开发中询问。
+    如果有任何疑问，请先查阅 [文档](https://xaoxuu.com/wiki/stellar/)，如果文档中没有提供，请提 [issue](https://github.com/xaoxuu/hexo-theme-stellar/issues/) 向开发中询问。
 
 timeline:
   layout: timeline
   title: 近期动态
   api: # https://api.github.com/repos/xaoxuu/hexo-theme-stellar/issues
-  user:
+  user: # 默认显示所有人的数据，设置名称可过滤为仅显示某人的数据，多个名称用英文逗号隔开，不要加空格
+  type: # 默认不用写，如果是友链朋友圈数据请写 fcircle
+  limit: # 默认通过 api 上增加 per_page 来设置，如果是友链朋友圈，可通过这个设置数量

package/layout/_partial/head.ejs

@@ -1,22 +1,33 @@
 <%
 function generate_title() {
-  if (page.layout == 'wiki' && page.wiki && (page.title || page.seo_title)) {
-    return page.wiki + __('symbol.colon') + (page.seo_title || page.title) + ' - ' + config.title;
-  } else if (page.seo_title || page.title || page.wiki) {
-    return (page.seo_title || page.title || page.wiki) + ' - ' + config.title;
-  } else if (page.category) {
-    return __('btn.category') + __('symbol.colon') + page.category + ' - ' + config.title;
-  } else if (page.tag) {
-    return __('btn.tag') + __('symbol.colon') + page.tag + ' - ' + config.title;
+  if (page.seo_title) {
+    return page.seo_title;
+  }
+  if (page.wiki) {
+    let proj = theme.wiki.projects[page.wiki];
+    let wiki = (proj && proj.name) || page.wiki;
+    if (page.title) {
+      return wiki + __('symbol.colon') + page.title + ' - ' + config.title;
+    } else {
+      return wiki + ' - ' + config.title;
+    }
   } else {
-    return config.title;
+    if (page.category) {
+      return __('btn.category') + __('symbol.colon') + page.category + ' - ' + config.title;
+    } else if (page.tag) {
+      return __('btn.tag') + __('symbol.colon') + page.tag + ' - ' + config.title;
+    } else {
+      return config.title;
+    }
   }
   return '';
 }
 function generate_description() {
-  // 索引页
-  if (theme.open_graph && theme.open_graph.enable) {
-    return '';
+  if (page.layout == 'wiki' && page.wiki) {
+    let proj = theme.wiki.projects[page.wiki];
+    if (proj && proj.description) {
+      return '<meta name="description" content="' + proj.description + '">';
+    }
   }
   if (page.description || page.excerpt || page.content) {
     return '<meta name="description" content="' + truncate(strip_html(page.description || page.excerpt || page.content), {length: 150}) + '">';

package/layout/_partial/main/article/article_footer.ejs

@@ -69,7 +69,7 @@ function layoutDiv() {
             el += ' onclick="util.toggle("qrcode-wechat&quot)"';
           } else if (item == 'weibo') {
             el += ' href="https://service.weibo.com/share/share.php?url=' + page.permalink;
-            el += '&title=' + (page.seo_title || page.title) + ' - ' + config.title;
+            el += '&title=' + (page.seo_title || (page.title + ' - ' + config.title));
             if (page.latyout == 'post' && page.cover) {
               el += '&pics=' + page.cover;
             } else if (page.latyout == 'wiki' && page.logo && page.logo.src) {
@@ -78,7 +78,7 @@ function layoutDiv() {
             el += '&summary=' + truncate(page.description || strip_html(page.excerpt || page.content), {length: 120});
             el += '"';
           } else if (item == 'email') {
-            el += ' href="mailto:?subject=' + (page.title || page.seo_title) + ' - ' + config.title + '&'
+            el += ' href="mailto:?subject=' + ((page.title + ' - ' + config.title) || page.seo_title) + '&'
             el += 'body=' + page.permalink + '"';
           } else if (item == 'link') {
             el += ' onclick="util.copy("copy-link", "' + __('message.copied') + '")"';

package/layout/_partial/main/article/read_next.ejs

@@ -35,7 +35,7 @@ function layoutDiv() {
     if (prev) {
       el += '<div class="note">' + title_prev + '</div>';
       el += '<a href="' + url_for(prev.path) + '">';
-      el += prev.title || prev.seo_title || prev.wiki;
+      el += prev.title || prev.seo_title || prev.wiki || date(prev.date, config.date_format);
       el += '</a>';
     }
     el += '</div>';
@@ -44,7 +44,7 @@ function layoutDiv() {
     if (next) {
       el += '<div class="note">' + title_next + '</div>';
       el += '<a href="' + url_for(next.path) + '">';
-      el += next.title || next.seo_title || next.wiki;
+      el += next.title || next.seo_title || next.wiki || date(next.date, config.date_format);
       el += '</a>';
     }
     el += '</div>';

package/layout/_partial/main/post_list/post_card.ejs

@@ -1,11 +1,14 @@
 <%
-const obj = {
-  image: post['cover'],
-  title: post['cover-title'],
-  cat: post['cover-cat'],
-  subtitle: post['cover-subtitle'],
-  color: post['cover-text-color']
+const poster = post.poster;
+var obj = {
+  image: post.cover
 };
+if (poster) {
+  obj.headline = poster.headline;
+  obj.topic = poster.topic;
+  obj.caption = poster.caption;
+  obj.color = poster.color;
+}
 function div_default() {
   var el = '';
   el += '<article class="md">';
@@ -97,24 +100,24 @@ function div_photo() {
   var el = '';
   el += '<div class="cover">';
   el += '<img src="' + obj.image + '"/>';
-  if (obj.title || obj.cat || obj.subtitle) {
+  if (obj.headline || obj.topic || obj.caption) {
     el += '<div class="cover-info"';
     if (obj.color) {
       el += 'style="color:' + obj.color + '"';
     }
-    if (obj.cat) {
+    if (obj.topic) {
       el += 'position="top">';
     } else {
       el += 'position="bottom">';
     }
-    if (obj.cat) {
-      el += '<div class="cap">' + obj.cat + '</div>';
+    if (obj.topic) {
+      el += '<div class="cap">' + obj.topic + '</div>';
     }
-    if (obj.title) {
-      el += '<div class="title">' + obj.title + '</div>';
+    if (obj.headline) {
+      el += '<div class="title">' + obj.headline + '</div>';
     }
-    if (obj.subtitle) {
-      el += '<div class="cap">' + obj.subtitle + '</div>';
+    if (obj.caption) {
+      el += '<div class="cap">' + obj.caption + '</div>';
     }
     el += '</div>';
 
@@ -123,7 +126,7 @@ function div_photo() {
   return el;
 }
 function div() {
-  if (obj.image && obj.image.length > 0 && obj.title != undefined) {
+  if (obj.image && obj.image.length > 0 && obj.headline != undefined) {
     return div_photo();
   }
   return div_default();

package/layout/_partial/main/post_list/wiki_card.ejs

@@ -16,7 +16,7 @@ function layoutDiv() {
     let tag = proj.tags[0];
     el += '<div class="cap breadcrumb"' + category_color(tag) + '>' + tag + '</div>';
   }
-  el += '<h2 class="post-title">' + (proj.title || proj.name || proj.seo_title) + '</h2>';
+  el += '<h2 class="post-title">' + (proj.title || proj.name) + '</h2>';
   if (proj.description) {
     el += '<p>' + proj.description + '</p>';
   }

package/layout/_partial/sidebar/logo.ejs

@@ -21,7 +21,7 @@ function layoutTitle(main, url, sub) {
 }
 function layoutDiv() {
   var el = '';
-  if (page.layout == 'wiki') {
+  if (page.layout == 'wiki' && proj && proj.index != false) {
     el += '<div class="logo-wrap wiki">';
     // all products
     el += '<a style="filter: grayscale(100%)" class="wiki-home cap" href="' + url_for(config.wiki_dir) + '">';
@@ -39,7 +39,7 @@ function layoutDiv() {
       }
     }
     if (proj != undefined) {
-      let main = proj.name || proj.title || proj.wiki || page.wiki || page.title;
+      let main = proj.name || proj.title || page.wiki || page.title;
       let url = proj.homepage.path;
       let sub = proj.subtitle;
       el += layoutTitle(main, url, sub);

package/layout/_partial/sidebar/widgets/ghissues.ejs

@@ -18,7 +18,7 @@ function layoutDiv() {
   if (repo == undefined) {
     return el;
   }
-  item.api = 'https://api.github.com/repos/' + repo + '/issues?per_page=' + item.limit;
+  item.api = theme.api_host.ghapi + '/repos/' + repo + '/issues?per_page=' + item.limit;
   if (item.labels) {
     item.api += '&labels=' + item.labels;
   }

package/layout/_partial/sidebar/widgets/ghrepo.ejs

@@ -22,7 +22,7 @@ function layoutDiv() {
   el += '<div class="widget-wrap" id="repo-info">';
   // body
   el += '<div class="widget-body">';
-  el += '<div class="items stellar-ghinfo-api" api="https://api.github.xaoxuu.com/repos/' + repo + '">';
+  el += '<div class="items stellar-ghinfo-api" api="' + theme.api_host.ghapi + '/repos/' + repo + '">';
   el += '<a class="repo" href="https://github.com/' + repo + '" target="_blank" rel="external nofollow noopener noreferrer">';
     el += '<div class="repo-name flex-row">';
       el += '<svg aria-hidden="true" role="img" class="color-icon-primary" viewBox="0 0 16 16" width="1em" height="1em" fill="currentColor" style="user-select:none;overflow:visible"><path fill-rule="evenodd" d="M2 2.5A2.5 2.5 0 014.5 0h8.75a.75.75 0 01.75.75v12.5a.75.75 0 01-.75.75h-2.5a.75.75 0 110-1.5h1.75v-2h-8a1 1 0 00-.714 1.7.75.75 0 01-1.072 1.05A2.495 2.495 0 012 11.5v-9zm10.5-1V9h-8c-.356 0-.694.074-1 .208V2.5a1 1 0 011-1h8zM5 12.25v3.25a.25.25 0 00.4.2l1.45-1.087a.25.25 0 01.3 0L8.6 15.7a.25.25 0 00.4-.2v-3.25a.25.25 0 00-.25-.25h-3.5a.25.25 0 00-.25.25z"></path></svg>';
@@ -38,7 +38,7 @@ function layoutDiv() {
         el += '<svg aria-hidden="true" role="img" class="color-icon-primary" viewBox="0 0 16 16" width="1em" height="1em" fill="currentColor" style="user-select:none;overflow:visible"><path fill-rule="evenodd" d="M5 3.25a.75.75 0 11-1.5 0 .75.75 0 011.5 0zm0 2.122a2.25 2.25 0 10-1.5 0v.878A2.25 2.25 0 005.75 8.5h1.5v2.128a2.251 2.251 0 101.5 0V8.5h1.5a2.25 2.25 0 002.25-2.25v-.878a2.25 2.25 0 10-1.5 0v.878a.75.75 0 01-.75.75h-4.5A.75.75 0 015 6.25v-.878zm3.75 7.378a.75.75 0 11-1.5 0 .75.75 0 011.5 0zm3-8.75a.75.75 0 100-1.5.75.75 0 000 1.5z"></path></svg>';
         el += '<span type="text" id="forks_count"></span>';
       el += '</div>';
-      el += '<div class="flex-row stellar-ghinfo-api" index="0" api="https://api.github.xaoxuu.com/repos/' + repo + '/tags">';
+      el += '<div class="flex-row stellar-ghinfo-api" index="0" api="' + theme.api_host.ghapi + '/repos/' + repo + '/tags">';
         el += '<svg aria-hidden="true" role="img" class="color-icon-primary" viewBox="0 0 16 16" width="1em" height="1em" fill="currentColor" style="user-select:none;overflow:visible"><path fill-rule="evenodd" d="M2.5 7.775V2.75a.25.25 0 01.25-.25h5.025a.25.25 0 01.177.073l6.25 6.25a.25.25 0 010 .354l-5.025 5.025a.25.25 0 01-.354 0l-6.25-6.25a.25.25 0 01-.073-.177zm-1.5 0V2.75C1 1.784 1.784 1 2.75 1h5.025c.464 0 .91.184 1.238.513l6.25 6.25a1.75 1.75 0 010 2.474l-5.026 5.026a1.75 1.75 0 01-2.474 0l-6.25-6.25A1.75 1.75 0 011 7.775zM6 5a1 1 0 100 2 1 1 0 000-2z"></path></svg>';
         el += '<span type="text" id="latest-tag-name">0</span>';
       el += '</div>';

package/layout/_partial/sidebar/widgets/timeline.ejs

@@ -11,8 +11,8 @@ function layoutDiv() {
       el += '</div>';
     }
     el += '<div class="widget-body fs14">';
-      el += '<div class="tag-plugin timeline stellar-timeline-api"';
-      ['api', 'user', 'hide'].forEach(key => {
+      el += '<div class="tag-plugin timeline stellar-' + (item.type || "timeline") + '-api"';
+      ['api', 'user', 'hide', 'limit'].forEach(key => {
         if (item[key]) {
           el += ' ' + key + '="' + item[key] + '"';
         }

package/layout/index.ejs

@@ -13,7 +13,7 @@ if (page.title && page.wiki) {
 function layout_post_card(layout, post, content) {
   var el = '';
   var layout = layout;
-  if (layout == 'post' && post['cover'] != undefined && post['cover-title'] != undefined) {
+  if (layout == 'post' && post.cover != undefined && post.poster != undefined) {
     layout += ' photo';
   }
   el += '<a class="post-card ' + layout + ' ' + scrollreveal() + '" href="' + url_for(post.link || post.path) + '">';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hexo-theme-stellar",
-  "version": "1.13.0",
+  "version": "1.15.0",
   "description": "Elegant and powerful theme for Hexo.",
   "main": "package.json",
   "scripts": {
@@ -21,8 +21,8 @@
     "url": "https://github.com/xaoxuu/hexo-theme-stellar/issues/"
   },
   "dependencies": {
-    "hexo-renderer-ejs": "^1.0.0",
-    "hexo-renderer-stylus": "^2.0.1"
+    "hexo-renderer-ejs": "^2.0.0",
+    "hexo-renderer-stylus": "^2.1.0"
   },
   "homepage": "https://xaoxuu.com/wiki/stellar/",
   "devDependencies": {

package/scripts/tags/friends.js

@@ -17,7 +17,7 @@ hexo.extend.tag.register('friends', function(args) {
   if (args.api) {
     api = args.api;
   } else if (args.repo) {
-    api = 'https://raw.github.xaoxuu.com/' + args.repo + '/output/v2/data.json';
+    api = 'https://api.vlts.cc/output_data/v2/' + args.repo;
   }
   
   var el = '<div class="tag-plugin users-wrap">';

package/scripts/tags/link.js

@@ -7,18 +7,30 @@
 
 'use strict';
 
-var util = require('hexo-util');
 const full_url_for = require('hexo-util').full_url_for.bind(hexo);
 
 hexo.extend.tag.register('link', function(args) {
   args = hexo.args.map(args, ['icon', 'desc'], ['url', 'title']);
-
+  var autofill = [];
+  if (!args.title) {
+    autofill.push('title');
+  }
+  if (!args.icon) {
+    autofill.push('icon');
+  }
+  if (args.desc) {
+    autofill.push('desc');
+  }
   var el = '';
   el += '<div class="tag-plugin link dis-select">';
-  el += '<a class="link-card' + (args.desc ? ' rich' : ' plain') + '" title="' + args.title + '" href="' + args.url + '"';
+  el += '<a class="link-card' + (args.desc ? ' rich' : ' plain') + '" title="' + (args.title || '') + '" href="' + args.url + '"';
   if (args.url.includes('://')) {
     el += ' target="_blank" rel="external nofollow noopener noreferrer"';
   }
+  el += ' cardlink';
+  el += ' autofill="';
+  el += autofill.join(',');
+  el += '"';
   el += '>';
 
   function loadIcon() {

package/scripts/tags/sites.js

@@ -17,7 +17,7 @@ hexo.extend.tag.register('sites', function(args) {
   if (args.api) {
     api = args.api;
   } else if (args.repo) {
-    api = 'https://raw.github.xaoxuu.com/' + args.repo + '/output/v2/data.json';
+    api = 'https://api.vlts.cc/output_data/v2/' + args.repo;
   }
   
   var el = '<div class="tag-plugin sites-wrap">';

package/source/css/_common/base.styl

@@ -8,7 +8,7 @@ pre
 
 a
   text-decoration: none
-  color: $color-link
+  color: var(--theme-link)
   &:hover
     color: $color-hover
 

package/source/css/_common/highlight.styl

@@ -1,14 +1,14 @@
 code
   -webkit-font-smoothing: auto
   -moz-osx-font-smoothing: auto
-  color: var(--text-code)
   font-family: $ff-code
 
 p>code:not([class]),li>code:not([class])
   font-size: 85%
   background: var(--block)
-  padding: .2em .4em
+  padding: .2em
   border-radius: 4px
+  color: var(--text-code)
 
 article.md .highlight, pre:not([class]):has(>code)
   margin: var(--gap-p) 0
@@ -75,6 +75,22 @@ article.md .highlight
   .gutter+.code pre
     padding-left: 0.25em
 
+article.md .gist 
+  .gist-file 
+    border: 1px solid var(--block-border)
+    border-radius: $border-block
+  .gist-data
+    border-bottom: 1px solid var(--block-border)
+  .highlight
+    display: inherit
+    border: none
+    border-radius: 0
+    background: none
+    margin: 0
+    padding: 1em 0
+  .gist-meta
+    background: var(--block-border)
+
 
 table:not([class])
   border-collapse: collapse

package/source/css/_common/pre.styl

@@ -1,6 +1,6 @@
 pre:not([class]):has(>code)
   display: block
   padding: 1rem
-  overflow: scroll
+  overflow: auto
   code 
     padding: 0

package/source/css/_custom.styl

@@ -64,7 +64,7 @@ $fs-p    = $fs-15
 $fs-code = $fs-13
 
 $border-card = 12px
-$border-block = 6px
+$border-block = 8px
 $border-image = 6px
 
 // 可以动态变化的属性

package/source/css/_defines/theme.styl

@@ -1,8 +1,12 @@
-:root
-  --site-bg: $light-background
-  --block: $light-block
-  --block-border: darken($light-block, 5)
-  --block-hover: darken($light-block, 2)
+set_text_light()
+  --text-p0: $dark-title
+  --text-p1: mix($dark-text, $dark-background, 85)
+  --text-p2: mix($dark-text, $dark-background, 70)
+  --text-p3: mix($dark-text, $dark-background, 45)
+  --text-p4: mix($dark-text, $dark-background, 35)
+  --text-meta: mix($dark-text, $dark-background, 30)
+  --text-code: $dark-code
+set_text_dark()
   --text-p0: $light-title
   --text-p1: $light-text
   --text-p2: mix($light-text, $light-background, 80)
@@ -10,24 +14,25 @@
   --text-p4: mix($light-text, $light-background, 35)
   --text-meta: mix($light-text, $light-background, 20)
   --text-code: $light-code
+:root
+  --site-bg: $light-background
   --card: $light-card
+  --block: $light-block
+  --block-border: darken($light-block, 5)
+  --block-hover: darken($light-block, 2)
+  set_text_dark()
   --theme-highlight: darken($color-theme, 5)
   --theme-bg: mix($color-theme, $light-card, 10)
+  --theme-link: $color-link
 
 set_darkmode()
   :root
     --site-bg: $dark-background
+    --card: $dark-card
     --block: $dark-block
     --block-border: lighten($dark-block, 6)
     --block-hover: darken($dark-block, 4)
-    --text-p0: $dark-title
-    --text-p1: mix($dark-text, $dark-background, 85)
-    --text-p2: mix($dark-text, $dark-background, 70)
-    --text-p3: mix($dark-text, $dark-background, 45)
-    --text-p4: mix($dark-text, $dark-background, 35)
-    --text-meta: mix($dark-text, $dark-background, 30)
-    --text-code: $dark-code
-    --card: $dark-card
+    set_text_light()
     --theme-highlight: $color-theme
     --theme-bg: mix($color-theme, $dark-card, 10)
     @media screen and (max-width: $device-mobile-max)

package/source/css/_layout/list.styl

@@ -1,15 +1,13 @@
 // list
 .post-list
   margin: 1rem
-  .post-title
-    margin-top: 1.5rem
   .post-title:first-child
     margin-top: .5rem
 
 .post-list
   .post-title
     font-weight: 500
-    margin: .75rem 0
+    margin: 1.25rem 0 .75rem 0
     line-height: 1.2
     font-size: $fs-h3
     border-bottom: none
@@ -29,6 +27,7 @@
   box-shadow: 0 2px 8px 0px rgba(0, 0, 0, 0.02)
   trans1 box-shadow
   overflow: hidden
+  z-index: 0
   background: var(--card)
   position: relative
   .excerpt
@@ -53,8 +52,12 @@
       img
         object-fit: contain
         height: 1.5em
+
 .post-list .post-card:hover
   box-shadow: 0 1px 4px 0px rgba(0, 0, 0, 0.1), 0 4px 16px 0px rgba(0, 0, 0, 0.1)
+  img 
+    transform: scale(1.02)
+    filter: brightness(80%)
 
 
 // common article
@@ -86,11 +89,9 @@
     @media screen and (max-width: 900px)
       height: 240px
     @media screen and (max-width: $device-tablet)
-      height: 280px
-    @media screen and (max-width: $device-mobile)
-      height: 240px
-    @media screen and (max-width: $device-mobile-425)
       height: 220px
+    @media screen and (max-width: $device-mobile-425)
+      height: 200px
     @media screen and (max-width: $device-mobile-375)
       height: 180px
 
@@ -108,8 +109,10 @@
       color: var(--text-p0)
       &[position=top]
         top: 0
+        background-image: linear-gradient(rgba(0,0,0,0.2),rgba(0,0,0,0))
       &[position=bottom]
         bottom: 0
+        background-image: linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.2))
       div+div
         margin-top: 4px
       .cap

package/source/css/_layout/md.styl

@@ -133,30 +133,27 @@ article.md
   p:not([class]), li:not([class])
     a:not([class])
       position: relative
-      padding: 2px
+      padding: 2px 0
       text-decoration: none
-      display: inline-block
       line-height: 1.2
+      word-break: keep-all
       &:after
         content: ''
         position: absolute
         border-radius: 2px
-        bottom: 1px
-        left: 2px
-        right: 2px
+        bottom: 0
+        left: 0
+        right: 0
         height: 1px
-        opacity: 0.5
-        background: $color-link
+        opacity: 0.8
+        background: var(--theme-link)
         trans1: all
       &:hover
         border-bottom: none
-        color: $color-link
-        // color: darken($color-hover, 10)
-        // background: alpha($color-hover, 0.08)
+        color: var(--theme-link)
         &:after
           height: 100%
           opacity: 0.2
           bottom: 0
-          left: 0
-          right: 0
-          // background-color: alpha($color-hover, 0.08)
+          left: -2px
+          right: -2px

package/source/css/_layout/partial/bread-nav.styl

@@ -8,7 +8,7 @@
     align-items: center
     flex-direction: row
     &:not([style]) a
-      color: $color-link
+      color: var(--theme-link)
     &[style] a
       color: inherit
     span.sep

package/source/css/_layout/tag-plugins/common.styl

@@ -1,3 +1,24 @@
+set_text_white()
+  --text-p0: white
+  --text-p1: white
+  --text-p2: #eee
+  --text-p3: #ddd
+  --text-code: white
+  --card: $dark-card
+  --block: $dark-block
+  --block-border: lighten($dark-block, 6)
+  --block-hover: darken($dark-block, 4)
+set_text_black()
+  --text-p0: black
+  --text-p1: #111
+  --text-p2: #333
+  --text-p3: #555
+  --text-code: white
+  --card: $light-card
+  --block: $light-block
+  --block-border: darken($light-block, 5)
+  --block-hover: darken($light-block, 2)
+
 .tag-plugin
   --theme: var(--text-p1)
   --theme-border: var(--block-border)
@@ -5,86 +26,99 @@
 
 .tag-plugin[color='red']
   --theme: $c-red
-  --theme-border: mix($c-red, $light-card, 40)
-  --theme-bg: mix($c-red, $light-card, 10)
+  --theme-border: mix($c-red, white, 60)
+  --theme-bg: mix($c-red, white, 15)
 
 .tag-plugin[color='orange']
   --theme: $c-orange
-  --theme-border: mix($c-orange, $light-card, 40)
-  --theme-bg: mix($c-orange, $light-card, 10)
+  --theme-border: mix($c-orange, white, 60)
+  --theme-bg: mix($c-orange, white, 15)
 
 .tag-plugin[color='yellow']
   --theme: $c-yellow
-  --theme-border: mix($c-yellow, $light-card, 40)
-  --theme-bg: mix($c-yellow, $light-card, 10)
+  --theme-border: mix($c-yellow, white, 60)
+  --theme-bg: mix($c-yellow, white, 20)
 
 .tag-plugin[color='green']
   --theme: $c-green
-  --theme-border: mix($c-green, $light-card, 40)
-  --theme-bg: mix($c-green, $light-card, 10)
+  --theme-border: mix($c-green, white, 60)
+  --theme-bg: mix($c-green, white, 15)
 
 .tag-plugin[color='cyan']
   --theme: $c-cyan
-  --theme-border: mix($c-cyan, $light-card, 40)
-  --theme-bg: mix($c-cyan, $light-card, 10)
+  --theme-border: mix($c-cyan, white, 60)
+  --theme-bg: mix($c-cyan, white, 15)
 
 .tag-plugin[color='blue']
   --theme: $c-blue
-  --theme-border: mix($c-blue, $light-card, 40)
-  --theme-bg: mix($c-blue, $light-card, 10)
+  --theme-border: mix($c-blue, white, 60)
+  --theme-bg: mix($c-blue, white, 15)
 
 .tag-plugin[color='purple']
   --theme: $c-purple
-  --theme-border: mix($c-purple, $light-card, 40)
-  --theme-bg: mix($c-purple, $light-card, 10)
-
+  --theme-border: mix($c-purple, white, 60)
+  --theme-bg: mix($c-purple, white, 15)
 
 .tag-plugin[color='light']
   --theme-bg: white
 
-
 .tag-plugin[color='dark']
-  --theme-bg: #444
-  color: var(--card) !important
+  --theme-bg: #333
+  set_text_white()
+
+.tag-plugin.note[color='warning']
+  --theme: $c-yellow
+  --theme-border: #ffe659
+  --theme-bg: #ffe659
+  --theme-link: #ff453a
+
+.tag-plugin.note[color='error']
+  --theme: $c-yellow
+  --theme-border: #ff453a
+  --theme-bg: #ff453a
+  --theme-link: #ffe659
+  set_text_white()
 
 set_darkmode_tags()
   .tag-plugin[color='red']
-    --theme-border: mix($c-red, $dark-card, 80)
-    --theme-bg: mix($c-red, $dark-card, 10)
+    --theme-border: mix($c-red, black, 70)
+    --theme-bg: mix($c-red, black, 20)
 
   .tag-plugin[color='orange']
-    --theme-border: mix($c-orange, $dark-card, 80)
-    --theme-bg: mix($c-orange, $dark-card, 10)
+    --theme-border: mix($c-orange, black, 70)
+    --theme-bg: mix($c-orange, black, 20)
 
   .tag-plugin[color='yellow']
-    --theme-border: mix($c-yellow, $dark-card, 80)
-    --theme-bg: mix($c-yellow, $dark-card, 10)
+    --theme-border: mix($c-yellow, black, 70)
+    --theme-bg: mix($c-yellow, black, 20)
 
   .tag-plugin[color='green']
-    --theme-border: mix($c-green, $dark-card, 80)
-    --theme-bg: mix($c-green, $dark-card, 10)
+    --theme-border: mix($c-green, black, 70)
+    --theme-bg: mix($c-green, black, 20)
 
   .tag-plugin[color='cyan']
-    --theme-border: mix($c-cyan, $dark-card, 80)
-    --theme-bg: mix($c-cyan, $dark-card, 10)
+    --theme-border: mix($c-cyan, black, 70)
+    --theme-bg: mix($c-cyan, black, 20)
 
   .tag-plugin[color='blue']
-    --theme-border: mix($c-blue, $dark-card, 80)
-    --theme-bg: mix($c-blue, $dark-card, 10)
+    --theme-border: mix($c-blue, black, 70)
+    --theme-bg: mix($c-blue, black, 20)
 
   .tag-plugin[color='purple']
-    --theme-border: mix($c-purple, $dark-card, 80)
-    --theme-bg: mix($c-purple, $dark-card, 10)
+    --theme-border: mix($c-purple, black, 70)
+    --theme-bg: mix($c-purple, black, 20)
 
   .tag-plugin[color='light']
     --theme-border: white
-    --theme-bg: #ddd
-    color: var(--card) !important
+    --theme-bg: #fff
 
   .tag-plugin[color='dark']
     --theme-border: black
-    --theme-bg: #222
-    color: var(--text-p1) !important
+    --theme-bg: #111
+    set_text_white()
+
+  .tag-plugin[color='warning'],.tag-plugin[color='light']
+    set_text_black()
 
 if hexo-config('style.darkmode') == 'auto'
   @media (prefers-color-scheme: dark)

package/source/css/_layout/tag-plugins/folding.styl

@@ -48,8 +48,8 @@ details.folding[open]
     margin: 0 - 1rem
     margin-top: 0
     background: var(--card)
-    border-bottom-left-radius: $border-block
-    border-bottom-right-radius: $border-block
+    border-bottom-left-radius: 'calc(%s - 1px)' % $border-block
+    border-bottom-right-radius: 'calc(%s - 1px)' % $border-block
     font-size: $fs-15
     >:first-child
       margin-top: 0

package/source/css/_layout/tag-plugins/link.styl

@@ -3,7 +3,7 @@
   margin: 1em auto
   display: flex
   justify-content: center
-  @media screen and (max-width: $device-mobile-425)
+  @media screen and (max-width: $device-mobile-375)
     width: 100%
 
 .md .link-card
@@ -14,8 +14,8 @@
   cursor: pointer
   min-width 280px
   max-width: 100%
-  width: 350px
-  @media screen and (max-width: $device-mobile-425)
+  width: 320px
+  @media screen and (max-width: $device-mobile-375)
     width: 100%
   box-shadow: $boxshadow-card
   border-radius: $border-block

package/source/css/_layout/tag-plugins/quot.styl

@@ -2,6 +2,7 @@
   text-align: center
   position: relative
   align-items: center
+  max-width 400px
 .md .tag-plugin.quot:not(span)
   display: inline-flex
   align-self: center

package/source/css/_layout/tag-plugins/timeline.styl

@@ -104,8 +104,14 @@
   padding: 0.5rem 1rem
   margin-top: 4px
   box-shadow: $boxshadow-block
+  trans2: transform box-shadow
+  &:hover
+    transform: translateY(-1px)
+    box-shadow: $boxshadow-card-float
   p
     font-size: $fs-14
+    img  
+      display: block
   &:empty
     display: none
   p,.highlight,ol,ul,.tag-plugin
@@ -120,17 +126,13 @@
       span
         color: inherit
   a.body
+    display: block
     color: var(--text-p1)
-    trans2: transform box-shadow
     line-height: 1.25
     padding: 0.75rem 1rem
-    &:hover
-      transform: translateY(-1px)
-      box-shadow: $boxshadow-card-float
 
 
 .tag-plugin.timeline[api] .body
-  overflow: scroll
   p.title
     font-size: 1rem
     font-weight: 700
@@ -162,9 +164,6 @@
   flex-wrap: wrap
   justify-content: space-between
   align-items: stretch
-  position: sticky
-  position: -webkit-sticky
-  bottom: -0.5rem
   background: var(--card)
   span
     line-height: 1.8
@@ -201,4 +200,19 @@
   margin: 0.75rem 0
   p
     font-size: $fs-13
-    margin: 0.25rem
+    margin: 0.25rem
+
+.tag-plugin.timeline .body
+  line-height: 1.5
+  h1,h2
+    font-size: 1.25rem
+    margin: 1rem 0
+    line-height: 1.2
+  h3,h4
+    font-size: 1rem
+    margin: 0.75rem 0
+    line-height: 1.2
+  h5,h6
+    font-size: $fs-15
+    margin: 0.5rem 0
+    line-height: 1.2

package/source/css/_plugins/lazyload.styl

@@ -1,5 +1,5 @@
 trans-cover($p, $t = 0.28s)
-  trans2pro: transform 1s $p $t
+  trans2pro: transform 0.5s $p $t
 trans-site($p)
   trans2: box-shadow transform $p
 trans-user($p)

package/source/js/main.js

@@ -219,7 +219,7 @@ if (stellar.plugins.stellar) {
     let js = stellar.plugins.stellar[key];
     if (key == 'linkcard') {
       stellar.loadScript(js, { defer: true }).then(function () {
-        setCardLink(document.querySelectorAll('a.link-card'));
+        setCardLink(document.querySelectorAll('a.link-card[cardlink]'));
       });
     } else {
       const els = document.getElementsByClassName('stellar-' + key + '-api');

package/source/js/plugins/fcircle.js

@@ -59,7 +59,7 @@ const FCircle = {
         cell += '<img src="' + (item.avatar || cfg.avatar) + '" onerror="javascript:this.src=\'' + cfg.avatar + '\';">';
         cell += '<span>' + item.author + '</span>';
         cell += '</div>';
-        cell += '<p>' + item.updated + '</p>';
+        cell += '<p>' + item.created + '</p>';
         cell += '</div>';
         cell += '<a class="body" href="' + item.link + '" target="_blank" rel="external nofollow noopener noreferrer">';
         cell += item.title;

package/source/js/plugins/linkcard.js

@@ -1,103 +1,25 @@
 // 本插件由CardLink定制而成，原项目源码: https://github.com/Lete114/CardLink
 
-var cardLink = {};
-cardLink.caches = {};
-cardLink.server = 'https://api.allorigins.win/raw?url=';
-
-/**
- * Remove '/' and '/index.html'
- * @param {String} params
- * @returns { String }
- */
-function indexHandler(params) {
-  let path = params.replace(/(\/index\.html|\/)*$/gi, '')
-  if (path.length === 0) path += '/'
-  return path
-}
-
-/**
- * Determine if it is a ['https://', 'http://', '//'] protocol
- * @param {String} url Website url
- * @returns {Boolean}
- */
-function isHttp(url) {
-  return /^(https?:)?\/\//g.test(url)
-}
-
 function renderer(el, obj) {
-  if (obj.title && obj.title.length > 0) {
+  var autofill = [];
+  const autofillStr = el.getAttribute('autofill');
+  if (autofillStr) {
+    autofill = autofillStr.split(',');
+  }
+  if (obj.title && obj.title.length > 0 && autofill.includes('title')) {
     el.querySelector('.title').innerHTML = obj.title;
+    el.title = obj.title;
   }
-  if (obj.icon && obj.icon.length > 0) {
+  if (obj.icon && obj.icon.length > 0 && autofill.includes('icon')) {
     el.querySelector('.img').style = 'background-image: url("' + obj.icon + '");';
+    el.querySelector('.img').setAttribute('data-bg', obj.icon);
   }
   let desc = el.querySelector('.desc');
-  if (desc && obj.desc && obj.desc.length > 0) {
+  if (desc && obj.desc && obj.desc.length > 0 && autofill.includes('desc')) {
     desc.innerHTML = obj.desc;
   }
 }
 
-/**
- * Get info
- * @param {Element} el Element
- * @param {String} html String type html
- * @param {String} link Website address
- */
-// eslint-disable-next-line max-statements
-function getInfo(el, html, link) {
-  try {
-    let title, icon, desc
-    const doc = new DOMParser().parseFromString(html, 'text/html')
-    // If there is no title, no card link is generated
-    title = doc.querySelector('title')
-    if (title) {
-      title = title.textContent
-
-      // Get the src of the first img tag in the body tag
-      let tmp = doc.querySelector('head link[rel="apple-touch-icon"]')
-      if (!tmp) {
-        tmp = doc.querySelector('head link[rel="icon"]')
-      }
-      icon = tmp && tmp.getAttribute('href')
-
-      if (/^data:image/.test(icon)) icon = ''
-
-      // If there is no src then get the site icon
-      if (!icon) {
-        const links = [].slice.call(doc.querySelectorAll('link[rel][href]'))
-        icon = links.find((_el) => _el.rel.includes('icon'))
-        icon = icon && icon.getAttribute('href')
-      }
-      
-      desc = doc.querySelector('head meta[name="description"]')
-
-      if (desc) {
-        desc = desc.content;
-      }
-      // If `icon` is not the ['https://', 'http://', '//'] protocol, splice on the `origin` of the a tag
-      if (icon && !isHttp(icon)) icon = new URL(link).origin + icon
-      cardLink.caches[link] = { title, link, icon, desc }
-      
-      renderer(el, cardLink.caches[link])
-    }
-  } catch (error) {
-    // eslint-disable-next-line no-console
-    console.warn('CardLink Error: Failed to parse', error)
-  }
-}
-
-function fetchPage(link, callback) {
-  fetch(link)
-    .then((result) => result.text())
-    .then(callback)
-    .catch((error) => {
-      const server = cardLink.server
-      // eslint-disable-next-line no-console
-      if (link.includes(server) || !server) return console.error('CardLink Error:', error)
-      fetchPage(server + link, callback)
-    })
-}
-
 /**
  * Create card links
  * @param {NodeList} nodes A collection of nodes or a collection of arrays,
@@ -109,16 +31,18 @@ function setCardLink(nodes) {
   nodes.forEach((el) => {
     // If it is not a tag element then it is not processed
     if (el.nodeType !== 1) return
-    el.removeAttribute('cardlink')
-    const link = el.href
-
-    const cache = cardLink.caches[link]
-    if (cache) return renderer(el, cache)
-
-    if (isHttp(link)) {
-      fetchPage(link, (html) => {
-        getInfo(el, html, link)
-      })
-    }
+    el.removeAttribute('cardlink');
+    const link = el.href;
+    const api = 'https://api.vlts.cc/site_info/v1?url=';
+    fetch(api + link).then(function(response) {
+      if (response.ok) {
+        return response.json();
+      }
+      throw new Error('Network response was not ok.');
+    }).then(function(data) {
+      renderer(el, data);
+    }).catch(function(error) {
+      console.log(error);
+    });
   })
 }

package/source/js/plugins/timeline.js

@@ -77,7 +77,7 @@ const StellarTimeline = {
         }
         var cell = '<div class="timenode" index="' + i + '">';
         cell += '<div class="header">';
-        if (!users.length && item.user) {
+        if (!users.length && item.user && !hide.includes('user')) {
           cell += '<a class="user-info" href="' + item.user.html_url + '" target="_blank" rel="external nofollow noopener noreferrer">';
           cell += '<img src="' + item.user.avatar_url + '">';
           cell += '<span>' + item.user.login + '</span>';