From 3cbb978a22f156f6f33e149e4a78e40026caa28d Mon Sep 17 00:00:00 2001
From: HMLTFan <xfqwdsj@qq.com>
Date: Fri, 28 Jan 2022 22:54:15 +0800
Subject: [PATCH 1/7] Added messasge tag.

---
 scripts/tags/message.js | 60 +++++++++++++++++++++++++++++++++++++++++
 1 file changed, 60 insertions(+)
 create mode 100644 scripts/tags/message.js

diff --git a/scripts/tags/message.js b/scripts/tags/message.js
new file mode 100644
index 0000000..29a999c
--- /dev/null
+++ b/scripts/tags/message.js
@@ -0,0 +1,60 @@
+/**
+ * Bulma Message Tag, see {@link https://bulma.io/documentation/components/message/}.
+ * @param {string} color The color of this message. Usable: dark, primary, link, info, success, warning, danger.
+ * @param {string} icon The icon of this message, can not be set.
+ * @param {string} title The header of this message, can not be set, supported Markdown.
+ * @param {string} styles Additional styles of this message, can not be set. Usable: [small, medium, large].
+ * @example
+ * {% message color:danger icon:info-circle 'title:Very danger!' style:small %}
+ *     **You are in danger.**
+ * {% endmessage %}
+ */
+hexo.extend.tag.register('message', function(args, content) {
+    var color = 'dark';
+    var icon = '';
+    var title = '';
+    var styles = '';
+    var header = '';
+    args.forEach(element => {
+        var key = element.split(':')[0];
+        var value = element.split(':')[1];
+        if (value != null && value != undefined && value != '') {
+            switch (key) {
+                case 'color':
+                    color = value;
+                    break;
+                case 'icon':
+                    icon = `<i class="fas fa-${value} mr-2"></i>`;
+                    break;
+                case 'title':
+                    title = value;
+                    break;
+                case 'style':
+                    var stylesArray = value.split(' ');
+                    var processed = [];
+                    stylesArray.forEach(styleElement, index => {
+                        if (styleElement != null && styleElement != undefined && styleElement != '') {
+                            processed.push(`is-${styleElement}`);
+                        }
+                    });
+                    styles = processed.join(' ');
+                    break;
+            }
+        }
+    });
+    if (icon != '' || title != '') {
+        header = `
+        <div class="message-header">
+            ${hexo.render.renderSync({text: icon + title, engine: 'markdown'})}
+        </div>
+        `
+    }
+    return `
+    <article class="message is-${color} ${styles}">
+        ${header}
+        <div class="message-body">
+        ${hexo.render.renderSync({text: content, engine: 'md'})}
+        </div>
+    </article>
+    `;
+}, { ends: true });
\ No newline at end of file

From ec1d2c792382482c7435cdb8441ff6f58f49d04f Mon Sep 17 00:00:00 2001
From: HMLTFan <xfqwdsj@qq.com>
Date: Sat, 29 Jan 2022 15:36:14 +0800
Subject: [PATCH 2/7] Update message.js, tabs.js

---
 scripts/tags/message.js |  35 ++++++------
 scripts/tags/tabs.js    | 118 ++++++++++++++++++++++++++++++++++++++++
 2 files changed, 134 insertions(+), 19 deletions(-)
 create mode 100644 scripts/tags/tabs.js

diff --git a/scripts/tags/message.js b/scripts/tags/message.js
index 29a999c..de2f9ed 100644
--- a/scripts/tags/message.js
+++ b/scripts/tags/message.js
@@ -1,23 +1,27 @@
 /**
  * Bulma Message Tag, see {@link https://bulma.io/documentation/components/message/}.
- * @param {string} color The color of this message. Usable: dark, primary, link, info, success, warning, danger.
- * @param {string} icon The icon of this message, can not be set.
- * @param {string} title The header of this message, can not be set, supported Markdown.
- * @param {string} styles Additional styles of this message, can not be set. Usable: [small, medium, large].
+ * 
+ * @param {string} color    The color of this message, can not be set. Usable: dark, primary, link, info, success,
+ *                          warning, danger.
+ * @param {string} icon     The icon of this message, can not be set.
+ * @param {string} title    The header of this message, can not be set, supported Markdown.
+ * @param {string} size     The size of this message, can not be set. Usable: small, medium, large. The default
+ *                          size is between small and medium.
+ * 
  * @example
- * {% message color:danger icon:info-circle 'title:Very danger!' style:small %}
+ * {% message color:danger icon:info-circle 'title:Very danger!' size:small %}
  *     **You are in danger.**
  * {% endmessage %}
  */
-hexo.extend.tag.register('message', function(args, content) {
+ hexo.extend.tag.register('message', function(args, content) {
     var color = 'dark';
     var icon = '';
     var title = '';
-    var styles = '';
+    var size = '';
     var header = '';
     args.forEach(element => {
-        var key = element.split(':')[0];
-        var value = element.split(':')[1];
+        var key = element.split(':')[0].trim();
+        var value = element.split(':')[1].trim();
         if (value != null && value != undefined && value != '') {
             switch (key) {
                 case 'color':
@@ -29,15 +33,8 @@ hexo.extend.tag.register('message', function(args, content) {
                 case 'title':
                     title = value;
                     break;
-                case 'style':
-                    var stylesArray = value.split(' ');
-                    var processed = [];
-                    stylesArray.forEach(styleElement, index => {
-                        if (styleElement != null && styleElement != undefined && styleElement != '') {
-                            processed.push(`is-${styleElement}`);
-                        }
-                    });
-                    styles = processed.join(' ');
+                case 'size':
+                    size = ` is-${value}`;
                     break;
             }
         }
@@ -50,7 +47,7 @@ hexo.extend.tag.register('message', function(args, content) {
         `
     }
     return `
-    <article class="message is-${color} ${styles}">
+    <article class="message is-${color}${size}">
         ${header}
         <div class="message-body">
         ${hexo.render.renderSync({text: content, engine: 'md'})}
diff --git a/scripts/tags/tabs.js b/scripts/tags/tabs.js
new file mode 100644
index 0000000..83f69ca
--- /dev/null
+++ b/scripts/tags/tabs.js
@@ -0,0 +1,118 @@
+/**
+ * Bulma Tabs Tag, see {@link https://bulma.io/documentation/components/tabs/}.
+ * 
+ * The format of each item is: <!-- <active>item [id] [<icon>] '[title]' --> [content] <!-- enditem -->.
+ * If each item's content is indented with four spaces or one tab, these indents will be ignored.
+ * 
+ * @param {string} id           The unique id of this tab, should match: /\w/.
+ * @param {string} behavior     The behavior of this tab, can not be set. Usable: centered, right, fullwidth. The
+ *                              default behavior is to display on the left.
+ * @param {string} size         The size of this tab, can not be set. Usable: small, medium, large. The default
+ *                              size is between small and medium.
+ * @param {string} style        The style of this tab, can not be set. Usable: boxed, toggle, toggle-rounded.
+ * 
+ * @example
+ * {% tabs behavior:fullwidth size:small style:toggle-rounded %}
+ *     <!-- item info info 'Info' -->This is info.<!-- enditem -->
+ *     <!-- activeitem hello 'Hello' -->This is hello.<!-- enditem -->
+ * {% endmessage %}
+ */
+ hexo.extend.tag.register('tabs', function(args, content) {
+    var id = '';
+    var behavior = '';
+    var size = '';
+    var style = '';
+    var contentEl = content;
+    args.forEach(element => {
+        var key = element.split(':')[0].trim();
+        var value = element.split(':')[1].trim();
+        if (value != null && value != undefined && value != '') {
+            switch (key) {
+                case 'id':
+                    id = value;
+                    break;
+                case 'behavior':
+                    behavior = ` is-${value}`;
+                    break;
+                case 'size':
+                    size = ` is-${value}`;
+                    break;
+                case 'style':
+                    if (value == 'toggle-rounded') {
+                        style = ' is-toggle is-toggle-rounded';
+                    } else {
+                        style = ` is-${value}`;
+                    }
+                    break;
+            }
+        }
+    });
+
+    var blockRegExp = /<!--\s*(active)?item( \w+)( \w+)?( '.*?')\s*-->([\s\S]*?)<!--\s*enditem\s*-->/g;
+    var match;
+    var tabsEl = '';
+    var contentEl = '';
+
+    while((match = blockRegExp.exec(content)) !== null) {
+        var active = '';
+        var hidden = ' is-hidden';
+        if (match[1] != undefined) {
+            active = ' class="is-active"';
+            hidden = '';
+        }
+        var icon = '';
+        if (match[3] != undefined && match[3].substring(1) != '') icon = `<span class="icon is-small"><i class="fas fa-${match[3].substring(1)}" aria-hidden="true"></i></span>`;
+        var contentString = match[5].replace(/^\n?|[ \n\t]*$/g, '');
+        if (contentString.match(/^ {4}|^\t{1}/gm) != null && contentString.match(/^ {4}|^\t{1}/gm).length == contentString.split('\n').length) contentString = contentString.replace(/^ {4}|^\t{1}/g, '').replace(/\n {4}|\n\t{1}/g, '\n');
+        tabsEl += `
+        <li id="${match[2].substring(1)}"${active}">
+            <a onclick="switchTab(this)">${hexo.render.renderSync({text: icon + match[4].substring(2, match[4].length - 1), engine: 'markdown'})}</a>
+        </li>
+        `;
+        contentEl += `
+        <div id="${match[2].substring(1)}" class="tab-content${hidden}">
+            ${hexo.render.renderSync({text: contentString, engine: 'markdown'})}
+        </div>
+        `;
+    }
+    
+    return `
+    <div>
+        <div class="tabs my-3${behavior}${size}${style}">
+            <ul class="mx-0 my-0">
+                ${tabsEl}
+            </ul>
+        </div>
+        <div>
+            ${contentEl}
+        </div>
+    </div>
+    `;
+}, { ends: true });
+
+hexo.extend.injector.register(
+    "head_end",
+    `
+    <script>
+        function switchTab(element) {
+            var id = element.parentElement.id;
+            var tabElements = element.parentElement.parentElement.children;
+            var contentElements = element.parentElement.parentElement.parentElement.parentElement.children[1].children;
+            for (var i = 0; i < tabElements.length; i++) {
+                var $tab = tabElements[i];
+                var $content = contentElements[i];
+                if ($tab.id == id) {
+                    $tab.classList.add('is-active');
+                } else {
+                    $tab.classList.remove('is-active');
+                }
+                if ($content.id == id) {
+                    $content.classList.remove('is-hidden');
+                } else {
+                    $content.classList.add('is-hidden');
+                }
+            }
+        }
+    </script>
+    `
+);
\ No newline at end of file

From 3a8d5fa6dc8d6cda220c83ef16545ee94e3a2b79 Mon Sep 17 00:00:00 2001
From: HMLTFan <xfqwdsj@qq.com>
Date: Sun, 30 Jan 2022 12:42:38 +0800
Subject: [PATCH 3/7] Fixed some problems

---
 include/register.js     |   2 +
 scripts/tags/message.js | 116 ++++++++++----------
 scripts/tags/tabs.js    | 234 ++++++++++++++++++++--------------------
 3 files changed, 178 insertions(+), 174 deletions(-)

diff --git a/include/register.js b/include/register.js
index ed50b2d..57f02e4 100644
--- a/include/register.js
+++ b/include/register.js
@@ -12,4 +12,6 @@ module.exports = hexo => {
     require('hexo-component-inferno/lib/hexo/helper/cdn')(hexo);
     require('hexo-component-inferno/lib/hexo/helper/page')(hexo);
     require('hexo-component-inferno/lib/core/view').init(hexo);
+    require('./../scripts/tags/message')(hexo);
+    require('./../scripts/tags/tabs')(hexo);
 };
diff --git a/scripts/tags/message.js b/scripts/tags/message.js
index de2f9ed..8fd945c 100644
--- a/scripts/tags/message.js
+++ b/scripts/tags/message.js
@@ -1,57 +1,59 @@
-/**
- * Bulma Message Tag, see {@link https://bulma.io/documentation/components/message/}.
- * 
- * @param {string} color    The color of this message, can not be set. Usable: dark, primary, link, info, success,
- *                          warning, danger.
- * @param {string} icon     The icon of this message, can not be set.
- * @param {string} title    The header of this message, can not be set, supported Markdown.
- * @param {string} size     The size of this message, can not be set. Usable: small, medium, large. The default
- *                          size is between small and medium.
- * 
- * @example
- * {% message color:danger icon:info-circle 'title:Very danger!' size:small %}
- *     **You are in danger.**
- * {% endmessage %}
- */
- hexo.extend.tag.register('message', function(args, content) {
-    var color = 'dark';
-    var icon = '';
-    var title = '';
-    var size = '';
-    var header = '';
-    args.forEach(element => {
-        var key = element.split(':')[0].trim();
-        var value = element.split(':')[1].trim();
-        if (value != null && value != undefined && value != '') {
-            switch (key) {
-                case 'color':
-                    color = value;
-                    break;
-                case 'icon':
-                    icon = `<i class="fas fa-${value} mr-2"></i>`;
-                    break;
-                case 'title':
-                    title = value;
-                    break;
-                case 'size':
-                    size = ` is-${value}`;
-                    break;
-            }
-        }
-    });
-    if (icon != '' || title != '') {
-        header = `
-        <div class="message-header">
-            ${hexo.render.renderSync({text: icon + title, engine: 'markdown'})}
-        </div>
-        `
-    }
-    return `
-    <article class="message is-${color}${size}">
-        ${header}
-        <div class="message-body">
-        ${hexo.render.renderSync({text: content, engine: 'md'})}
-        </div>
-    </article>
-    `;
-}, { ends: true });
\ No newline at end of file
+/**
+ * Bulma Message Tag, see {@link https://bulma.io/documentation/components/message/}.
+ * 
+ * @param {string} color    The color of this message, can not be set. Usable: dark, primary, link, info, success,
+ *                          warning, danger.
+ * @param {string} icon     The icon of this message, can not be set.
+ * @param {string} title    The header of this message, can not be set, supported Markdown.
+ * @param {string} size     The size of this message, can not be set. Usable: small, medium, large. The default
+ *                          size is between small and medium.
+ * 
+ * @example
+ * {% message color:danger icon:info-circle 'title:Very danger!' size:small %}
+ *     **You are in danger.**
+ * {% endmessage %}
+ */
+ module.exports = function (hexo) {
+    hexo.extend.tag.register('message', function(args, content) {
+        let color = 'dark';
+        let icon = '';
+        let title = '';
+        let size = '';
+        let header = '';
+        args.forEach(element => {
+            const key = element.split(':')[0].trim();
+            const value = element.split(':')[1].trim();
+            if (value !== null && value !== undefined && value !== '') {
+                switch (key) {
+                    case 'color':
+                        color = value;
+                        break;
+                    case 'icon':
+                        icon = `<i class="fas fa-${value} mr-2"></i>`;
+                        break;
+                    case 'title':
+                        title = value;
+                        break;
+                    case 'size':
+                        size = ` is-${value}`;
+                        break;
+                }
+            }
+        });
+        if (icon !== '' || title !== '') {
+            header = `
+            <div class="message-header">
+                ${hexo.render.renderSync({text: icon + title, engine: 'markdown'})}
+            </div>
+            `
+        }
+        return `
+        <article class="message is-${color}${size}">
+            ${header}
+            <div class="message-body">
+            ${hexo.render.renderSync({text: content, engine: 'md'})}
+            </div>
+        </article>
+        `;
+    }, { ends: true });
+}
\ No newline at end of file
diff --git a/scripts/tags/tabs.js b/scripts/tags/tabs.js
index 83f69ca..882aaab 100644
--- a/scripts/tags/tabs.js
+++ b/scripts/tags/tabs.js
@@ -1,118 +1,118 @@
-/**
- * Bulma Tabs Tag, see {@link https://bulma.io/documentation/components/tabs/}.
- * 
- * The format of each item is: <!-- <active>item [id] [<icon>] '[title]' --> [content] <!-- enditem -->.
- * If each item's content is indented with four spaces or one tab, these indents will be ignored.
- * 
- * @param {string} id           The unique id of this tab, should match: /\w/.
- * @param {string} behavior     The behavior of this tab, can not be set. Usable: centered, right, fullwidth. The
- *                              default behavior is to display on the left.
- * @param {string} size         The size of this tab, can not be set. Usable: small, medium, large. The default
- *                              size is between small and medium.
- * @param {string} style        The style of this tab, can not be set. Usable: boxed, toggle, toggle-rounded.
- * 
- * @example
- * {% tabs behavior:fullwidth size:small style:toggle-rounded %}
- *     <!-- item info info 'Info' -->This is info.<!-- enditem -->
- *     <!-- activeitem hello 'Hello' -->This is hello.<!-- enditem -->
- * {% endmessage %}
- */
- hexo.extend.tag.register('tabs', function(args, content) {
-    var id = '';
-    var behavior = '';
-    var size = '';
-    var style = '';
-    var contentEl = content;
-    args.forEach(element => {
-        var key = element.split(':')[0].trim();
-        var value = element.split(':')[1].trim();
-        if (value != null && value != undefined && value != '') {
-            switch (key) {
-                case 'id':
-                    id = value;
-                    break;
-                case 'behavior':
-                    behavior = ` is-${value}`;
-                    break;
-                case 'size':
-                    size = ` is-${value}`;
-                    break;
-                case 'style':
-                    if (value == 'toggle-rounded') {
-                        style = ' is-toggle is-toggle-rounded';
-                    } else {
-                        style = ` is-${value}`;
-                    }
-                    break;
-            }
-        }
-    });
-
-    var blockRegExp = /<!--\s*(active)?item( \w+)( \w+)?( '.*?')\s*-->([\s\S]*?)<!--\s*enditem\s*-->/g;
-    var match;
-    var tabsEl = '';
-    var contentEl = '';
-
-    while((match = blockRegExp.exec(content)) !== null) {
-        var active = '';
-        var hidden = ' is-hidden';
-        if (match[1] != undefined) {
-            active = ' class="is-active"';
-            hidden = '';
-        }
-        var icon = '';
-        if (match[3] != undefined && match[3].substring(1) != '') icon = `<span class="icon is-small"><i class="fas fa-${match[3].substring(1)}" aria-hidden="true"></i></span>`;
-        var contentString = match[5].replace(/^\n?|[ \n\t]*$/g, '');
-        if (contentString.match(/^ {4}|^\t{1}/gm) != null && contentString.match(/^ {4}|^\t{1}/gm).length == contentString.split('\n').length) contentString = contentString.replace(/^ {4}|^\t{1}/g, '').replace(/\n {4}|\n\t{1}/g, '\n');
-        tabsEl += `
-        <li id="${match[2].substring(1)}"${active}">
-            <a onclick="switchTab(this)">${hexo.render.renderSync({text: icon + match[4].substring(2, match[4].length - 1), engine: 'markdown'})}</a>
-        </li>
-        `;
-        contentEl += `
-        <div id="${match[2].substring(1)}" class="tab-content${hidden}">
-            ${hexo.render.renderSync({text: contentString, engine: 'markdown'})}
-        </div>
-        `;
-    }
-    
-    return `
-    <div>
-        <div class="tabs my-3${behavior}${size}${style}">
-            <ul class="mx-0 my-0">
-                ${tabsEl}
-            </ul>
-        </div>
-        <div>
-            ${contentEl}
-        </div>
-    </div>
-    `;
-}, { ends: true });
-
-hexo.extend.injector.register(
-    "head_end",
-    `
-    <script>
-        function switchTab(element) {
-            var id = element.parentElement.id;
-            var tabElements = element.parentElement.parentElement.children;
-            var contentElements = element.parentElement.parentElement.parentElement.parentElement.children[1].children;
-            for (var i = 0; i < tabElements.length; i++) {
-                var $tab = tabElements[i];
-                var $content = contentElements[i];
-                if ($tab.id == id) {
-                    $tab.classList.add('is-active');
-                } else {
-                    $tab.classList.remove('is-active');
-                }
-                if ($content.id == id) {
-                    $content.classList.remove('is-hidden');
-                } else {
-                    $content.classList.add('is-hidden');
-                }
-            }
-        }
-    </script>
-    `
+/**
+ * Bulma Tabs Tag, see {@link https://bulma.io/documentation/components/tabs/}.
+ * 
+ * The format of each item is: <!-- <active>item [id] [<icon>] '[title]' --> [content] <!-- enditem -->.
+ * If each item's content is indented with four spaces or one tab, these indents will be ignored.
+ * 
+ * @param {string} id           The unique id of this tab, should match: /\w/.
+ * @param {string} behavior     The behavior of this tab, can not be set. Usable: centered, right, fullwidth. The
+ *                              default behavior is to display on the left.
+ * @param {string} size         The size of this tab, can not be set. Usable: small, medium, large. The default
+ *                              size is between small and medium.
+ * @param {string} style        The style of this tab, can not be set. Usable: boxed, toggle, toggle-rounded.
+ * 
+ * @example
+ * {% tabs behavior:fullwidth size:small style:toggle-rounded %}
+ *     <!-- item info info 'Info' -->This is info.<!-- enditem -->
+ *     <!-- activeitem hello 'Hello' -->This is hello.<!-- enditem -->
+ * {% endmessage %}
+ */
+ hexo.extend.tag.register('tabs', function(args, content) {
+    let id = '';
+    let behavior = '';
+    let size = '';
+    let style = '';
+    let contentEl = content;
+    args.forEach(element => {
+        const key = element.split(':')[0].trim();
+        const value = element.split(':')[1].trim();
+        if (value !== null && value !== undefined && value !== '') {
+            switch (key) {
+                case 'id':
+                    id = value;
+                    break;
+                case 'behavior':
+                    behavior = ` is-${value}`;
+                    break;
+                case 'size':
+                    size = ` is-${value}`;
+                    break;
+                case 'style':
+                    if (value === 'toggle-rounded') {
+                        style = ' is-toggle is-toggle-rounded';
+                    } else {
+                        style = ` is-${value}`;
+                    }
+                    break;
+            }
+        }
+    });
+
+    const blockRegExp = /<!--\s*(active)?item( \w+)( \w+)?( '.*?')\s*-->([\s\S]*?)<!--\s*enditem\s*-->/g;
+    let match;
+    let tabsEl = '';
+    let contentEl = '';
+
+    while((match = blockRegExp.exec(content)) !== null) {
+        let active = '';
+        let hidden = ' is-hidden';
+        let icon = '';
+        var contentString = match[5].replace(/^\n?|[ \n\t]*$/g, '');
+        if (match[1] === 'active') {
+            active = ' class="is-active"';
+            hidden = '';
+        }
+        if (match[3] === 'active' && match[3].substring(1) !== '') icon = `<span class="icon is-small"><i class="fas fa-${match[3].substring(1)}" aria-hidden="true"></i></span>`;
+        if (contentString.match(/^ {4}|^\t{1}/gm) !== null && contentString.match(/^ {4}|^\t{1}/gm).length === contentString.split('\n').length) contentString = contentString.replace(/^ {4}|^\t{1}/g, '').replace(/\n {4}|\n\t{1}/g, '\n');
+        tabsEl += `
+        <li id="${match[2].substring(1)}"${active}">
+            <a onclick="switchTab(this)">${hexo.render.renderSync({text: icon + match[4].substring(2, match[4].length - 1), engine: 'markdown'})}</a>
+        </li>
+        `;
+        contentEl += `
+        <div id="${match[2].substring(1)}" class="tab-content${hidden}">
+            ${hexo.render.renderSync({text: contentString, engine: 'markdown'})}
+        </div>
+        `;
+    }
+    
+    return `
+    <div>
+        <div class="tabs my-3${behavior}${size}${style}">
+            <ul class="mx-0 my-0">
+                ${tabsEl}
+            </ul>
+        </div>
+        <div>
+            ${contentEl}
+        </div>
+    </div>
+    `;
+}, { ends: true });
+
+hexo.extend.injector.register(
+    "head_end",
+    `
+    <script>
+        function switchTab(element) {
+            const id = element.parentElement.id;
+            const tabElements = element.parentElement.parentElement.children;
+            const contentElements = element.parentElement.parentElement.parentElement.parentElement.children[1].children;
+            for (let i = 0; i < tabElements.length; i++) {
+                const $tab = tabElements[i];
+                const $content = contentElements[i];
+                if ($tab.id === id) {
+                    $tab.classList.add('is-active');
+                } else {
+                    $tab.classList.remove('is-active');
+                }
+                if ($content.id === id) {
+                    $content.classList.remove('is-hidden');
+                } else {
+                    $content.classList.add('is-hidden');
+                }
+            }
+        }
+    </script>
+    `
 );
\ No newline at end of file

From da442f6c4ff43d5e38331aa48cb0117b0a644b2c Mon Sep 17 00:00:00 2001
From: HMLTFan <xfqwdsj@qq.com>
Date: Sun, 30 Jan 2022 12:53:25 +0800
Subject: [PATCH 4/7] Fixed some problems

---
 scripts/tags/message.js |  12 +--
 scripts/tags/tabs.js    | 191 +++++++++++++++++++++-------------------
 2 files changed, 105 insertions(+), 98 deletions(-)

diff --git a/scripts/tags/message.js b/scripts/tags/message.js
index 8fd945c..3462572 100644
--- a/scripts/tags/message.js
+++ b/scripts/tags/message.js
@@ -1,25 +1,26 @@
 /**
  * Bulma Message Tag, see {@link https://bulma.io/documentation/components/message/}.
- * 
+ *
  * @param {string} color    The color of this message, can not be set. Usable: dark, primary, link, info, success,
  *                          warning, danger.
  * @param {string} icon     The icon of this message, can not be set.
  * @param {string} title    The header of this message, can not be set, supported Markdown.
  * @param {string} size     The size of this message, can not be set. Usable: small, medium, large. The default
  *                          size is between small and medium.
- * 
+ *
  * @example
  * {% message color:danger icon:info-circle 'title:Very danger!' size:small %}
  *     **You are in danger.**
  * {% endmessage %}
  */
- module.exports = function (hexo) {
+module.exports = function(hexo) {
     hexo.extend.tag.register('message', function(args, content) {
         let color = 'dark';
         let icon = '';
         let title = '';
         let size = '';
         let header = '';
+
         args.forEach(element => {
             const key = element.split(':')[0].trim();
             const value = element.split(':')[1].trim();
@@ -45,8 +46,9 @@
             <div class="message-header">
                 ${hexo.render.renderSync({text: icon + title, engine: 'markdown'})}
             </div>
-            `
+            `;
         }
+
         return `
         <article class="message is-${color}${size}">
             ${header}
@@ -56,4 +58,4 @@
         </article>
         `;
     }, { ends: true });
-}
\ No newline at end of file
+};
diff --git a/scripts/tags/tabs.js b/scripts/tags/tabs.js
index 882aaab..7969285 100644
--- a/scripts/tags/tabs.js
+++ b/scripts/tags/tabs.js
@@ -1,118 +1,123 @@
 /**
  * Bulma Tabs Tag, see {@link https://bulma.io/documentation/components/tabs/}.
- * 
+ *
  * The format of each item is: <!-- <active>item [id] [<icon>] '[title]' --> [content] <!-- enditem -->.
  * If each item's content is indented with four spaces or one tab, these indents will be ignored.
- * 
+ *
  * @param {string} id           The unique id of this tab, should match: /\w/.
  * @param {string} behavior     The behavior of this tab, can not be set. Usable: centered, right, fullwidth. The
  *                              default behavior is to display on the left.
  * @param {string} size         The size of this tab, can not be set. Usable: small, medium, large. The default
  *                              size is between small and medium.
  * @param {string} style        The style of this tab, can not be set. Usable: boxed, toggle, toggle-rounded.
- * 
+ *
  * @example
  * {% tabs behavior:fullwidth size:small style:toggle-rounded %}
  *     <!-- item info info 'Info' -->This is info.<!-- enditem -->
  *     <!-- activeitem hello 'Hello' -->This is hello.<!-- enditem -->
  * {% endmessage %}
  */
- hexo.extend.tag.register('tabs', function(args, content) {
-    let id = '';
-    let behavior = '';
-    let size = '';
-    let style = '';
-    let contentEl = content;
-    args.forEach(element => {
-        const key = element.split(':')[0].trim();
-        const value = element.split(':')[1].trim();
-        if (value !== null && value !== undefined && value !== '') {
-            switch (key) {
-                case 'id':
-                    id = value;
-                    break;
-                case 'behavior':
-                    behavior = ` is-${value}`;
-                    break;
-                case 'size':
-                    size = ` is-${value}`;
-                    break;
-                case 'style':
-                    if (value === 'toggle-rounded') {
-                        style = ' is-toggle is-toggle-rounded';
-                    } else {
-                        style = ` is-${value}`;
-                    }
-                    break;
+module.exports = function(hexo) {
+    hexo.extend.tag.register('tabs', function(args, content) {
+        let id = '';
+        let behavior = '';
+        let size = '';
+        let style = '';
+
+        args.forEach(element => {
+            const key = element.split(':')[0].trim();
+            const value = element.split(':')[1].trim();
+            if (value !== null && value !== undefined && value !== '') {
+                switch (key) {
+                    case 'id':
+                        id = value;
+                        break;
+                    case 'behavior':
+                        behavior = ` is-${value}`;
+                        break;
+                    case 'size':
+                        size = ` is-${value}`;
+                        break;
+                    case 'style':
+                        if (value === 'toggle-rounded') {
+                            style = ' is-toggle is-toggle-rounded';
+                        } else {
+                            style = ` is-${value}`;
+                        }
+                        break;
+                }
             }
-        }
-    });
+        });
 
-    const blockRegExp = /<!--\s*(active)?item( \w+)( \w+)?( '.*?')\s*-->([\s\S]*?)<!--\s*enditem\s*-->/g;
-    let match;
-    let tabsEl = '';
-    let contentEl = '';
+        const blockRegExp = /<!--\s*(active)?item( \w+)( \w+)?( '.*?')\s*-->([\s\S]*?)<!--\s*enditem\s*-->/g;
+        let match;
+        let tabsEl = '';
+        let contentEl = '';
 
-    while((match = blockRegExp.exec(content)) !== null) {
-        let active = '';
-        let hidden = ' is-hidden';
-        let icon = '';
-        var contentString = match[5].replace(/^\n?|[ \n\t]*$/g, '');
-        if (match[1] === 'active') {
-            active = ' class="is-active"';
-            hidden = '';
+        while((match = blockRegExp.exec(content)) !== null) {
+            let active = '';
+            let hidden = ' is-hidden';
+            let icon = '';
+            var contentString = match[5].replace(/^\n?|[ \n\t]*$/g, '');
+
+            if (match[1] === 'active') {
+                active = ' class="is-active"';
+                hidden = '';
+            }
+            if (match[3] === 'active' && match[3].substring(1) !== '') icon = `<span class="icon is-small"><i class="fas fa-${match[3].substring(1)}" aria-hidden="true"></i></span>`;
+            if (contentString.match(/^ {4}|^\t{1}/gm) !== null && contentString.match(/^ {4}|^\t{1}/gm).length === contentString.split('\n').length) contentString = contentString.replace(/^ {4}|^\t{1}/g, '').replace(/\n {4}|\n\t{1}/g, '\n');
+
+            tabsEl += `
+            <li id="${match[2].substring(1)}"${active}">
+                <a onclick="switchTab(this)">${hexo.render.renderSync({text: icon + match[4].substring(2, match[4].length - 1), engine: 'markdown'})}</a>
+            </li>
+            `;
+
+            contentEl += `
+            <div id="${match[2].substring(1)}" class="tab-content${hidden}">
+                ${hexo.render.renderSync({text: contentString, engine: 'markdown'})}
+            </div>
+            `;
         }
-        if (match[3] === 'active' && match[3].substring(1) !== '') icon = `<span class="icon is-small"><i class="fas fa-${match[3].substring(1)}" aria-hidden="true"></i></span>`;
-        if (contentString.match(/^ {4}|^\t{1}/gm) !== null && contentString.match(/^ {4}|^\t{1}/gm).length === contentString.split('\n').length) contentString = contentString.replace(/^ {4}|^\t{1}/g, '').replace(/\n {4}|\n\t{1}/g, '\n');
-        tabsEl += `
-        <li id="${match[2].substring(1)}"${active}">
-            <a onclick="switchTab(this)">${hexo.render.renderSync({text: icon + match[4].substring(2, match[4].length - 1), engine: 'markdown'})}</a>
-        </li>
-        `;
-        contentEl += `
-        <div id="${match[2].substring(1)}" class="tab-content${hidden}">
-            ${hexo.render.renderSync({text: contentString, engine: 'markdown'})}
-        </div>
-        `;
-    }
-    
-    return `
-    <div>
-        <div class="tabs my-3${behavior}${size}${style}">
-            <ul class="mx-0 my-0">
-                ${tabsEl}
-            </ul>
-        </div>
+
+        return `
         <div>
-            ${contentEl}
+            <div class="tabs my-3${behavior}${size}${style}">
+                <ul class="mx-0 my-0">
+                    ${tabsEl}
+                </ul>
+            </div>
+            <div>
+                ${contentEl}
+            </div>
         </div>
-    </div>
-    `;
-}, { ends: true });
+        `;
+    }, { ends: true });
 
-hexo.extend.injector.register(
-    "head_end",
-    `
-    <script>
-        function switchTab(element) {
-            const id = element.parentElement.id;
-            const tabElements = element.parentElement.parentElement.children;
-            const contentElements = element.parentElement.parentElement.parentElement.parentElement.children[1].children;
-            for (let i = 0; i < tabElements.length; i++) {
-                const $tab = tabElements[i];
-                const $content = contentElements[i];
-                if ($tab.id === id) {
-                    $tab.classList.add('is-active');
-                } else {
-                    $tab.classList.remove('is-active');
-                }
-                if ($content.id === id) {
-                    $content.classList.remove('is-hidden');
-                } else {
-                    $content.classList.add('is-hidden');
+    hexo.extend.injector.register(
+        "head_end",
+        `
+        <script>
+            function switchTab(element) {
+                const id = element.parentElement.id;
+                const tabElements = element.parentElement.parentElement.children;
+                const contentElements = element.parentElement.parentElement.parentElement.parentElement.children[1].children;
+                for (let i = 0; i < tabElements.length; i++) {
+                    const $tab = tabElements[i];
+                    const $content = contentElements[i];
+                    if ($tab.id === id) {
+                        $tab.classList.add('is-active');
+                    } else {
+                        $tab.classList.remove('is-active');
+                    }
+                    if ($content.id === id) {
+                        $content.classList.remove('is-hidden');
+                    } else {
+                        $content.classList.add('is-hidden');
+                    }
                 }
             }
-        }
-    </script>
-    `
-);
\ No newline at end of file
+        </script>
+        `
+    );
+};

From 7214ec1e2864ca559a61f88791209a57d4f3739c Mon Sep 17 00:00:00 2001
From: HMLTFan <xfqwdsj@qq.com>
Date: Sun, 30 Jan 2022 12:56:11 +0800
Subject: [PATCH 5/7] Fixed some problems

---
 scripts/tags/message.js |  2 +-
 scripts/tags/tabs.js    | 13 ++++---------
 2 files changed, 5 insertions(+), 10 deletions(-)

diff --git a/scripts/tags/message.js b/scripts/tags/message.js
index 3462572..0954131 100644
--- a/scripts/tags/message.js
+++ b/scripts/tags/message.js
@@ -14,7 +14,7 @@
  * {% endmessage %}
  */
 module.exports = function(hexo) {
-    hexo.extend.tag.register('message', function(args, content) {
+    hexo.extend.tag.register('message', (args, content) => {
         let color = 'dark';
         let icon = '';
         let title = '';
diff --git a/scripts/tags/tabs.js b/scripts/tags/tabs.js
index 7969285..575d0ac 100644
--- a/scripts/tags/tabs.js
+++ b/scripts/tags/tabs.js
@@ -4,7 +4,6 @@
  * The format of each item is: <!-- <active>item [id] [<icon>] '[title]' --> [content] <!-- enditem -->.
  * If each item's content is indented with four spaces or one tab, these indents will be ignored.
  *
- * @param {string} id           The unique id of this tab, should match: /\w/.
  * @param {string} behavior     The behavior of this tab, can not be set. Usable: centered, right, fullwidth. The
  *                              default behavior is to display on the left.
  * @param {string} size         The size of this tab, can not be set. Usable: small, medium, large. The default
@@ -18,8 +17,7 @@
  * {% endmessage %}
  */
 module.exports = function(hexo) {
-    hexo.extend.tag.register('tabs', function(args, content) {
-        let id = '';
+    hexo.extend.tag.register('tabs', (args, content) => {
         let behavior = '';
         let size = '';
         let style = '';
@@ -29,9 +27,6 @@ module.exports = function(hexo) {
             const value = element.split(':')[1].trim();
             if (value !== null && value !== undefined && value !== '') {
                 switch (key) {
-                    case 'id':
-                        id = value;
-                        break;
                     case 'behavior':
                         behavior = ` is-${value}`;
                         break;
@@ -54,11 +49,11 @@ module.exports = function(hexo) {
         let tabsEl = '';
         let contentEl = '';
 
-        while((match = blockRegExp.exec(content)) !== null) {
+        while ((match = blockRegExp.exec(content)) !== null) {
             let active = '';
             let hidden = ' is-hidden';
             let icon = '';
-            var contentString = match[5].replace(/^\n?|[ \n\t]*$/g, '');
+            let contentString = match[5].replace(/^\n?|[ \n\t]*$/g, '');
 
             if (match[1] === 'active') {
                 active = ' class="is-active"';
@@ -95,7 +90,7 @@ module.exports = function(hexo) {
     }, { ends: true });
 
     hexo.extend.injector.register(
-        "head_end",
+        'head_end',
         `
         <script>
             function switchTab(element) {

From 6462421bb9aebead66e7da990f197b41dc9685f6 Mon Sep 17 00:00:00 2001
From: HMLTFan <xfqwdsj@qq.com>
Date: Sun, 30 Jan 2022 13:10:30 +0800
Subject: [PATCH 6/7] Fixed some problems

---
 scripts/tags/tabs.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/scripts/tags/tabs.js b/scripts/tags/tabs.js
index 575d0ac..3e3c18a 100644
--- a/scripts/tags/tabs.js
+++ b/scripts/tags/tabs.js
@@ -59,7 +59,7 @@ module.exports = function(hexo) {
                 active = ' class="is-active"';
                 hidden = '';
             }
-            if (match[3] === 'active' && match[3].substring(1) !== '') icon = `<span class="icon is-small"><i class="fas fa-${match[3].substring(1)}" aria-hidden="true"></i></span>`;
+            if (match[3] !== undefined && match[3].substring(1) !== '') icon = `<span class="icon is-small"><i class="fas fa-${match[3].substring(1)}" aria-hidden="true"></i></span>`;
             if (contentString.match(/^ {4}|^\t{1}/gm) !== null && contentString.match(/^ {4}|^\t{1}/gm).length === contentString.split('\n').length) contentString = contentString.replace(/^ {4}|^\t{1}/g, '').replace(/\n {4}|\n\t{1}/g, '\n');
 
             tabsEl += `

From 8b2f08fd36f20a118f2ca3401783b8fc850985c0 Mon Sep 17 00:00:00 2001
From: HMLTFan <xfqwdsj@qq.com>
Date: Sun, 30 Jan 2022 13:18:21 +0800
Subject: [PATCH 7/7] Optimizaed some details

---
 scripts/tags/message.js |  9 ++++-----
 scripts/tags/tabs.js    | 14 ++++++--------
 2 files changed, 10 insertions(+), 13 deletions(-)

diff --git a/scripts/tags/message.js b/scripts/tags/message.js
index 0954131..974218f 100644
--- a/scripts/tags/message.js
+++ b/scripts/tags/message.js
@@ -15,10 +15,9 @@
  */
 module.exports = function(hexo) {
     hexo.extend.tag.register('message', (args, content) => {
-        let color = 'dark';
         let icon = '';
         let title = '';
-        let size = '';
+        let classes = '';
         let header = '';
 
         args.forEach(element => {
@@ -27,7 +26,7 @@ module.exports = function(hexo) {
             if (value !== null && value !== undefined && value !== '') {
                 switch (key) {
                     case 'color':
-                        color = value;
+                        classes += ` is-${value}`;
                         break;
                     case 'icon':
                         icon = `<i class="fas fa-${value} mr-2"></i>`;
@@ -36,7 +35,7 @@ module.exports = function(hexo) {
                         title = value;
                         break;
                     case 'size':
-                        size = ` is-${value}`;
+                        classes += ` is-${value}`;
                         break;
                 }
             }
@@ -50,7 +49,7 @@ module.exports = function(hexo) {
         }
 
         return `
-        <article class="message is-${color}${size}">
+        <article class="message${classes}">
             ${header}
             <div class="message-body">
             ${hexo.render.renderSync({text: content, engine: 'md'})}
diff --git a/scripts/tags/tabs.js b/scripts/tags/tabs.js
index 3e3c18a..226e2cd 100644
--- a/scripts/tags/tabs.js
+++ b/scripts/tags/tabs.js
@@ -18,9 +18,7 @@
  */
 module.exports = function(hexo) {
     hexo.extend.tag.register('tabs', (args, content) => {
-        let behavior = '';
-        let size = '';
-        let style = '';
+        let classes = '';
 
         args.forEach(element => {
             const key = element.split(':')[0].trim();
@@ -28,16 +26,16 @@ module.exports = function(hexo) {
             if (value !== null && value !== undefined && value !== '') {
                 switch (key) {
                     case 'behavior':
-                        behavior = ` is-${value}`;
+                        classes += ` is-${value}`;
                         break;
                     case 'size':
-                        size = ` is-${value}`;
+                        classes += ` is-${value}`;
                         break;
                     case 'style':
                         if (value === 'toggle-rounded') {
-                            style = ' is-toggle is-toggle-rounded';
+                            classes += ' is-toggle is-toggle-rounded';
                         } else {
-                            style = ` is-${value}`;
+                            classes += ` is-${value}`;
                         }
                         break;
                 }
@@ -77,7 +75,7 @@ module.exports = function(hexo) {
 
         return `
         <div>
-            <div class="tabs my-3${behavior}${size}${style}">
+            <div class="tabs my-3${classes}">
                 <ul class="mx-0 my-0">
                     ${tabsEl}
                 </ul>