From c93c38ee5ab50a6c40457500a883a70c7085a643 Mon Sep 17 00:00:00 2001
From: xaoxuu <git@xaoxuu.com>
Date: Fri, 2 Feb 2024 16:53:05 +0800
Subject: [PATCH] [feat] tag-plugin: icon

---
 _config.yml                                |  3 +++
 scripts/tags/index.js                      |  1 +
 scripts/tags/lib/icon.js                   | 27 ++++++++++++++++++++++
 source/css/_layout/tag-plugins/common.styl |  4 ++++
 source/css/_layout/tag-plugins/icon.styl   | 12 ++++++++++
 5 files changed, 47 insertions(+)
 create mode 100644 scripts/tags/lib/icon.js
 create mode 100644 source/css/_layout/tag-plugins/icon.styl

diff --git a/_config.yml b/_config.yml
index 5280097..33e06bd 100755
--- a/_config.yml
+++ b/_config.yml
@@ -304,6 +304,9 @@ tag_plugins:
     aru: https://gcore.jsdelivr.net/gh/cdn-x/emoji/aru-l/${name}.gif
     tieba: https://gcore.jsdelivr.net/gh/cdn-x/emoji/tieba/${name}.png
     blobcat: https://gcore.jsdelivr.net/gh/norevi/waline-blobcatemojis@1.0/blobs/${name}.png
+  icon:
+    # 留空时，图标和文字颜色相同
+    default_color: accent # theme, accent, red, orange, yellow, green, cyan, blue, purple
   # {% image %}
   image:
     fancybox: false # true, false
diff --git a/scripts/tags/index.js b/scripts/tags/index.js
index 658461a..07baf54 100644
--- a/scripts/tags/index.js
+++ b/scripts/tags/index.js
@@ -29,6 +29,7 @@ hexo.extend.tag.register('checkbox', require('./lib/checkbox')(hexo, 'checkbox')
 hexo.extend.tag.register('radio', require('./lib/checkbox')(hexo, 'radio'))
 hexo.extend.tag.register('copy', require('./lib/copy')(hexo))
 hexo.extend.tag.register('emoji', require('./lib/emoji')(hexo))
+hexo.extend.tag.register('icon', require('./lib/icon')(hexo))
 hexo.extend.tag.register('frame', require('./lib/frame')(hexo))
 hexo.extend.tag.register('image', require('./lib/image')(hexo))
 hexo.extend.tag.register('link', require('./lib/link')(hexo))
diff --git a/scripts/tags/lib/icon.js b/scripts/tags/lib/icon.js
new file mode 100644
index 0000000..a0a7d9e
--- /dev/null
+++ b/scripts/tags/lib/icon.js
@@ -0,0 +1,27 @@
+/**
+ * icon.js v1.0 | https://github.com/xaoxuu/hexo-theme-stellar/
+ * 格式与官方标签插件一致使用空格分隔，中括号内的是可选参数（中括号不需要写出来）
+ *
+ * {% icon key [color:color] [style:css] %}
+ *
+ */
+
+'use strict'
+
+module.exports = ctx => function(args) {
+  args = ctx.args.map(args, ['color', 'style'], ['key'])
+  if (args.color == null) {
+    args.color = ctx.theme.config.tag_plugins.icon.default_color
+  }
+  var el = ''
+  el += '<span class="tag-plugin colorful icon"'
+  el += ' ' + ctx.args.joinTags(args, ['color']).join(' ')
+  el += '>'
+  var more = ''
+  if (args.style) {
+    more += `style="${args.style}"`
+  }
+  el += ctx.utils.icon(args.key, more)
+  el += '</span>'
+  return el
+}
diff --git a/source/css/_layout/tag-plugins/common.styl b/source/css/_layout/tag-plugins/common.styl
index 8a3f199..2b25baf 100644
--- a/source/css/_layout/tag-plugins/common.styl
+++ b/source/css/_layout/tag-plugins/common.styl
@@ -40,6 +40,10 @@ set_dynamic_color($theme)
   set_dynamic_color($c-blue)
 .colorful[color='purple']
   set_dynamic_color($c-purple)
+.colorful[color='theme']
+  set_dynamic_color($color-theme)
+.colorful[color='accent']
+  set_dynamic_color($color-accent)
 
 .colorful[color='light']
   --theme-block: white
diff --git a/source/css/_layout/tag-plugins/icon.styl b/source/css/_layout/tag-plugins/icon.styl
new file mode 100644
index 0000000..1badf48
--- /dev/null
+++ b/source/css/_layout/tag-plugins/icon.styl
@@ -0,0 +1,12 @@
+span.tag-plugin.icon
+  display: inline-block
+  margin: -4px 1px 0
+  vertical-align: middle
+  svg,img
+    display: block
+    height: 1.5em
+    width: auto
+  svg
+    color: var(--theme)
+  img
+    object-fit: contain