hexo-theme-redefine-x 2.8.5

package/scripts/modules/btn.js

@@ -0,0 +1,85 @@
+"use strict";
+
+/**
+ * Single Button module for Hexo theme Redefine
+ * Creates standalone button elements
+ */
+
+/**
+ * Creates a single button
+ * 
+ * @param {Array} args - Button arguments (class, text, url, icon)
+ * @returns {String} HTML for a single button
+ */
+function postBtn(args) {
+  // Parse arguments - support both '::' and ',' as separators
+  let parsedArgs;
+  const argsStr = args.join(" ");
+  
+  if (argsStr.includes("::")) {
+    parsedArgs = argsStr.split("::");
+  } else {
+    parsedArgs = argsStr.split(",");
+  }
+  
+  // Default values
+  let cls = "";
+  let text = "";
+  let url = "";
+  let icon = "";
+  
+  // Parse arguments based on count
+  switch(parsedArgs.length) {
+    case 4: // class, text, url, icon
+      cls = parsedArgs[0];
+      text = parsedArgs[1];
+      url = parsedArgs[2];
+      icon = parsedArgs[3];
+      break;
+      
+    case 3:
+      // Check if third arg is an icon (contains fa-)
+      if (parsedArgs[2].includes("fa-")) {
+        // text, url, icon
+        text = parsedArgs[0];
+        url = parsedArgs[1];
+        icon = parsedArgs[2];
+      } else {
+        // class, text, url
+        cls = parsedArgs[0];
+        text = parsedArgs[1];
+        url = parsedArgs[2];
+      }
+      break;
+      
+    case 2: // text, url
+      text = parsedArgs[0];
+      url = parsedArgs[1];
+      break;
+      
+    case 1: // text only
+      text = parsedArgs[0];
+      break;
+  }
+  
+  // Clean up values
+  cls = cls.trim();
+  icon = icon.trim();
+  text = text.trim();
+  url = url.trim();
+  
+  // Build attributes
+  const hrefAttr = url ? `href='${url}'` : '';
+  const classAttr = cls ? `${cls}` : '';
+  
+  // Build button HTML
+  if (icon) {
+    return `<a class="button ${classAttr}" ${hrefAttr} title='${text}'><i class='${icon}'></i> ${text}</a>`;
+  }
+  
+  return `<a class="button ${classAttr}" ${hrefAttr} title='${text}'>${text}</a>`;
+}
+
+// Register Hexo tags
+hexo.extend.tag.register("btn", postBtn);
+hexo.extend.tag.register("button", postBtn);

package/scripts/modules/btns.js

@@ -0,0 +1,71 @@
+'use strict';
+
+/**
+ * Buttons module for Hexo theme Redefine
+ * Creates button containers and button elements
+ */
+
+/**
+ * Creates a buttons container
+ * 
+ * @param {Array} args - Class names for the container
+ * @param {String} content - Button content (cells)
+ * @returns {String} HTML for the buttons container
+ */
+function postBtns(args, content) {
+  const classes = args.join(' ');
+  return `<div class="btns ${classes}">
+            ${content}
+          </div>`;
+}
+
+/**
+ * Creates a single button cell
+ * 
+ * @param {Array} args - Button properties (text, url, icon/image)
+ * @returns {String} HTML for a single button
+ */
+function postCell(args, content) {
+  // Parse arguments - support both '::' and ',' as separators
+  let parsedArgs;
+  const argsStr = args.join(' ');
+  
+  if (argsStr.includes('::')) {
+    parsedArgs = argsStr.split('::');
+  } else {
+    parsedArgs = argsStr.split(',');
+  }
+  
+  // Extract button properties
+  const text = (parsedArgs[0] || '').trim();
+  const url = (parsedArgs[1] || '').trim();
+  const buttonClasses = ['button'];
+  
+  // Handle URL
+  const hrefAttr = url ? `href='${url}'` : '';
+  
+  // Handle icon or image
+  let iconOrImage = '';
+  
+  if (parsedArgs.length > 2) {
+    const iconOrImgSrc = parsedArgs[2].trim();
+    
+    // Check if it's a FontAwesome icon
+    if (iconOrImgSrc.includes('fa-')) {
+      iconOrImage = `<i class='${iconOrImgSrc}'></i> `;
+    } else {
+      // Use specified image or default
+      const imgSrc = iconOrImgSrc || hexo.theme.config.default.image;
+      iconOrImage = `<img src='${imgSrc}'>`;
+    }
+  }
+  
+  // Return complete button HTML
+  return `<a class="${buttonClasses.join(' ')}" ${hrefAttr} title='${text}'>${iconOrImage}${text}</a>`;
+}
+
+// Register Hexo tags
+hexo.extend.tag.register('btns', postBtns, {ends: true});
+hexo.extend.tag.register('buttons', postBtns, {ends: true});
+hexo.extend.tag.register('cell', postCell);
+

package/scripts/modules/folding.js

@@ -0,0 +1,34 @@
+'use strict';
+
+const postFolding = (args, content) => {
+  // Parse arguments - support both '::' and ',' as delimiters
+  const delimiter = args.join(' ').includes('::') ? '::' : ',';
+  const [style, title = ''] = args.join(' ').split(delimiter).map(arg => arg.trim());
+  
+  // Render markdown content
+  const renderedContent = hexo.render.renderSync({
+    text: content, 
+    engine: 'markdown'
+  });
+  
+  // Replace heading tags with paragraph tags that have heading classes
+  const processedContent = renderedContent.replace(
+    /<(h[1-6])>/g, 
+    (_, tag) => `<p class='${tag}'>`
+  ).replace(
+    /<\/(h[1-6])>/g, 
+    () => '</p>'
+  );
+  
+  // Build the HTML with or without custom style
+  const styleAttr = style ? ` class="${style}"` : '';
+  
+  return `<details${styleAttr} data-header-exclude>
+    <summary><i class="fa-solid fa-chevron-right"></i>${title} </summary>
+    <div class='content markdown-body'>
+      ${processedContent}
+    </div>
+  </details>`;
+};
+
+hexo.extend.tag.register('folding', postFolding, {ends: true});

package/scripts/modules/note-large.js

@@ -0,0 +1,72 @@
+function postNoteLarge(args, content) {
+  if (args.length === 0) {
+    args.push("default", "Warning");
+  }
+
+  let icon = "";
+  let title = "";
+  
+  // Extract color from args[0]
+  const color = args[0];
+  
+  // Process all arguments after color to build icon and title
+  const remainingArgs = args.slice(1);
+  
+  // Find all fa- prefixed arguments
+  const faArgs = [];
+  const faIndices = [];
+  
+  remainingArgs.forEach((arg, index) => {
+    if (arg && arg.startsWith('fa-')) {
+      faArgs.push(arg);
+      faIndices.push(index);
+    }
+  });
+  
+  // Handle FontAwesome icons based on how many fa- args we found
+  if (faArgs.length === 2) {
+    // Two fa- args: first is style, second is icon
+    icon = `<i class="notel-icon ${faArgs[0]} ${faArgs[1]}"></i>`;
+    
+    // Remove both FA args (remove higher index first to preserve positions)
+    remainingArgs.splice(faIndices[1], 1);
+    remainingArgs.splice(faIndices[0], 1);
+  } else if (faArgs.length === 1) {
+    // One fa- arg: it's the icon, default to fa-solid
+    icon = `<i class="notel-icon fa-solid ${faArgs[0]}"></i>`;
+    
+    // Remove the FA arg
+    remainingArgs.splice(faIndices[0], 1);
+  }
+  
+  // Join all remaining args as the title
+  title = remainingArgs.join(" ");
+  
+  // If no title was provided, set a default
+  if (!title) {
+    title = "Note";
+  }
+
+  return `
+  <div class="note-large ${color}">
+    <div class="notel-title rounded-t-lg p-3 font-bold text-lg flex flex-row gap-2 items-center">
+      ${icon}${hexo.render.renderSync({
+        text: title,
+        engine: "markdown",
+      })}
+    </div>
+    <div class="notel-content markdown-body">
+      ${hexo.render.renderSync({
+        text: content,
+        engine: "markdown",
+      })}
+    </div>
+  </div>`;
+}
+
+hexo.extend.tag.register("noteL", postNoteLarge, { ends: true });
+hexo.extend.tag.register("notel", postNoteLarge, { ends: true });
+hexo.extend.tag.register("notelarge", postNoteLarge, { ends: true });
+hexo.extend.tag.register("notel-large", postNoteLarge, { ends: true });
+hexo.extend.tag.register("notes-large", postNoteLarge, { ends: true });
+hexo.extend.tag.register("subwarning", postNoteLarge, { ends: true });

package/scripts/modules/note.js

@@ -0,0 +1,64 @@
+function postNote(args, content) {
+  if (args.length === 0) {
+    args.push("default");
+  }
+
+  let icon = "";
+  
+  // Extract style classes from all args except potential icon classes
+  let classes = [];
+  const remainingArgs = [...args]; // Copy args array
+  
+  // Add first arg as main class
+  if (remainingArgs.length > 0) {
+    classes.push(remainingArgs[0]);
+    remainingArgs.shift();
+  }
+  
+  // Find all fa- prefixed arguments
+  const faArgs = [];
+  const faIndices = [];
+  
+  remainingArgs.forEach((arg, index) => {
+    if (arg && arg.startsWith('fa-')) {
+      faArgs.push(arg);
+      faIndices.push(index);
+    }
+  });
+  
+  // Handle FontAwesome icons based on how many fa- args we found
+  if (faArgs.length === 2) {
+    // Two fa- args: first is style, second is icon
+    icon = `<i class="note-icon ${faArgs[0]} ${faArgs[1]}"></i>`;
+    
+    // Remove both FA args (remove higher index first to preserve positions)
+    remainingArgs.splice(faIndices[1], 1);
+    remainingArgs.splice(faIndices[0], 1);
+  } else if (faArgs.length === 1) {
+    // One fa- arg: it's the icon, default to fa-solid
+    icon = `<i class="note-icon fa-solid ${faArgs[0]}"></i>`;
+    
+    // Remove the FA arg
+    remainingArgs.splice(faIndices[0], 1);
+  }
+  
+  // Add any remaining args as additional classes
+  classes = classes.concat(remainingArgs);
+  
+  // Add icon-padding class if icon exists
+  if (icon) {
+    classes.push("icon-padding");
+  }
+
+  return `
+  <div class="note p-4 mb-4 rounded-small markdown-body ${classes.join(" ")}">
+    ${icon}${hexo.render.renderSync({
+      text: content,
+      engine: "markdown",
+    })}
+  </div>`;
+}
+
+hexo.extend.tag.register("note", postNote, { ends: true });
+hexo.extend.tag.register("notes", postNote, { ends: true });
+hexo.extend.tag.register("subnote", postNote, { ends: true });

package/scripts/modules/tabs.js

@@ -0,0 +1,99 @@
+/**
+ * Module: Tabs
+ * hexo-theme-redefine
+ * By Evan
+*/
+
+'use strict';
+
+const TAB_BLOCK_REGEX = /<!--\s*tab (.*?)\s*-->\n([\w\W\s\S]*?)<!--\s*endtab\s*-->/g;
+const APLAYER_TAG_REGEX = /\<div.*class=\"aplayer aplayer-tag-marker\"(.|\n)*\<\/script\>/g;
+const FANCYBOX_TAG_REGEX = /\<div.*galleryFlag(.|\n)*\<\/span\>\<\/div\>\<\/div\>/g;
+
+function parseArgs(args) {
+  if (/::/g.test(args)) {
+    return args.join(' ').split('::');
+  } else {
+    return args.join(' ').split(',');
+  }
+}
+
+function extractMatches(content) {
+  const matches = [];
+  let match;
+
+  while ((match = TAB_BLOCK_REGEX.exec(content)) !== null) {
+    matches.push(match[1]);
+    matches.push(match[2]);
+  }
+
+  return matches;
+}
+
+function processAplayerTag(content) {
+  let aplayerTag = 0;
+
+  if (/class="aplayer aplayer-tag-marker"/g.test(content)) {
+    aplayerTag = APLAYER_TAG_REGEX.exec(content)[0];
+    content = content.replace(APLAYER_TAG_REGEX, "@aplayerTag@");
+  }
+
+  return { content, aplayerTag };
+}
+
+function processFancyboxTag(content) {
+  let fancyboxTag = 0;
+
+  if (/galleryFlag/g.test(content)) {
+    fancyboxTag = FANCYBOX_TAG_REGEX.exec(content)[0];
+    content = content.replace(FANCYBOX_TAG_REGEX, "@fancyboxTag@");
+  }
+
+  return { content, fancyboxTag };
+}
+
+function buildTabNavAndContent(matches, tabName, tabActive) {
+  let tabNav = '';
+  let tabContent = '';
+
+  for (let i = 0; i < matches.length; i += 2) {
+    const tabParameters = matches[i].split('@');
+    const postContent = matches[i + 1];
+    const tabCaption = tabParameters[0] || '';
+    const tabIcon = tabParameters[1] || '';
+    const tabHref = (tabName + ' ' + (i / 2 + 1)).toLowerCase().split(' ').join('-');
+
+    const { content: contentWithAplayerTag, aplayerTag } = processAplayerTag(postContent);
+    const { content: contentWithFancyboxTag, fancyboxTag } = processFancyboxTag(contentWithAplayerTag);
+
+    const renderedContent = hexo.render.renderSync({ text: contentWithFancyboxTag, engine: 'markdown' }).trim();
+
+    const finalContent = renderedContent.replace(/\<pre\>\<code\>.*@aplayerTag@.*\<\/code><\/pre>/, aplayerTag)
+                                        .replace(/.*@fancyboxTag@.*/, fancyboxTag);
+
+    const isActive = (tabActive > 0 && tabActive === (i / 2 + 1)) || (tabActive === 0 && i === 0) ? ' active' : '';
+
+    tabNav += `<li class="tab${isActive}"><a class="#${tabHref}">${tabIcon + tabCaption.trim()}</a></li>`;
+    tabContent += `<div class="tab-pane${isActive}" id="${tabHref}">${finalContent}</div>`;
+  }
+
+  return { tabNav, tabContent };
+}
+
+function postTabs(args, content) {
+  const [tabName, tabActive] = parseArgs(args);
+  const activeTabIndex = Number(tabActive) || 0;
+
+  !tabName && hexo.log.warn('Tabs block must have unique name!');
+
+  const matches = extractMatches(content);
+  const { tabNav, tabContent } = buildTabNavAndContent(matches, tabName, activeTabIndex);
+
+  const finalTabNav = `<ul class="nav-tabs">${tabNav}</ul>`;
+  const finalTabContent = `<div class="tab-content">${tabContent}</div>`;
+  return `<div class="tabs" id="tab-${tabName.toLowerCase().split(' ').join('-')}">${finalTabNav + finalTabContent}</div>`;
+}
+
+hexo.extend.tag.register('tabs', postTabs, { ends: true });
+hexo.extend.tag.register('subtabs', postTabs, { ends: true });
+hexo.extend.tag.register('subsubtabs', postTabs, { ends: true });

package/source/assets/hbe.style.css

@@ -0,0 +1,220 @@
+.hbe,
+.hbe:after,
+.hbe:before {
+	-webkit-box-sizing: border-box;
+	-moz-box-sizing: border-box;
+	box-sizing: border-box;
+}
+
+.hbe-container{
+	margin: 0 auto;
+	overflow: hidden;
+}
+.hbe-content {
+	text-align: center;
+	font-size: 150%;
+	padding: 1em 0;
+}
+
+.hbe-input {
+	position: relative;
+	z-index: 1;
+	display: inline-block;
+	margin: 1em;
+	width: 80%;
+	min-width: 200px;
+	vertical-align: top;
+}
+
+.hbe-input-field {
+	line-height: normal;
+	font-size: 100%;
+	margin: 0;
+	position: relative;
+	display: block;
+	float: right;
+	padding: 0.8em;
+	width: 60%;
+	border: none;
+	border-radius: 0;
+	background: #f0f0f0;
+	color: #aaa;
+	font-weight: 400;
+	font-family: "Avenir Next", "Helvetica Neue", Helvetica, Arial, sans-serif;
+	-webkit-appearance: none; /* for box shadows to show on iOS */
+}
+
+.hbe-input-field:focus {
+	outline: none;
+}
+
+.hbe-input-label {
+	display: inline-block;
+	float: right;
+	padding: 0 1em;
+	width: 40%;
+	color: #696969;
+	font-weight: bold;
+	font-size: 70.25%;
+	-webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+	-webkit-touch-callout: none;
+	-webkit-user-select: none;
+	-khtml-user-select: none;
+	-moz-user-select: none;
+	-ms-user-select: none;
+	user-select: none;
+}
+
+.hbe-input-label-content {
+	position: relative;
+	display: block;
+	padding: 1.6em 0;
+	width: 100%;
+}
+
+.hbe-graphic {
+	position: absolute;
+	top: 0;
+	left: 0;
+	fill: none;
+}
+
+/* hbe button in post page */
+.hbe-button {
+  width: 130px;
+  height: 40px;
+  background: linear-gradient(to bottom, #4eb5e5 0%,#389ed5 100%); /* W3C */
+  border: none;
+  border-radius: 5px;
+  position: relative;
+  border-bottom: 4px solid #2b8bc6;
+  color: #fbfbfb;
+  font-weight: 600;
+  font-family: 'Open Sans', sans-serif;
+  text-shadow: 1px 1px 1px rgba(0,0,0,.4);
+  font-size: 15px;
+  text-align: left;
+  text-indent: 5px;
+  box-shadow: 0px 3px 0px 0px rgba(0,0,0,.2);
+  cursor: pointer;
+
+  display: block;
+  margin: 0 auto;
+  margin-bottom: 20px;
+}
+
+.hbe-button:active {
+  box-shadow: 0px 2px 0px 0px rgba(0,0,0,.2);
+  top: 1px;
+}
+
+.hbe-button:after {
+  content: "";
+  width: 0;
+  height: 0;
+  display: block;
+  border-top: 20px solid #187dbc;
+  border-bottom: 20px solid #187dbc;
+  border-left: 16px solid transparent;
+  border-right: 20px solid #187dbc;
+  position: absolute;
+  opacity: 0.6;
+  right: 0;
+  top: 0;
+  border-radius: 0 5px 5px 0;
+}
+/* hbe button in post page */
+
+/* default theme {{{ */
+.hbe-input-default {
+	overflow: hidden;
+}
+
+.hbe-input-field-default {
+	width: 100%;
+	background: transparent;
+	padding: 0.5em;
+	margin-bottom: 2em;
+	color: #f9f7f6;
+	z-index: 100;
+	opacity: 0;
+}
+
+.hbe-input-label-default {
+	width: 100%;
+	position: absolute;
+	text-align: left;
+	padding: 0.5em 0;
+	pointer-events: none;
+	font-size: 1em;
+}
+
+.hbe-input-label-default::before,
+.hbe-input-label-default::after {
+	content: '';
+	position: absolute;
+	width: 100%;
+	left: 0;
+}
+
+.hbe-input-label-default::before {
+	height: 100%;
+	background: #666666;
+	top: 0;
+	-webkit-transform: translate3d(0, -100%, 0);
+	transform: translate3d(0, -100%, 0);
+	-webkit-transition: -webkit-transform 0.2s;
+	transition: transform 0.2s;
+}
+
+.hbe-input-label-default::after {
+	height: 2px;
+	background: #666666;
+	top: 100%;
+	-webkit-transition: opacity 0.2s;
+	transition: opacity 0.2s;
+}
+
+.hbe-input-label-content-default {
+	padding: 0;
+	-webkit-transform-origin: 0 0;
+	transform-origin: 0 0;
+	-webkit-transition: -webkit-transform 0.2s, color 0.2s;
+	transition: transform 0.2s, color 0.2s;
+}
+
+.hbe-input-field-default:focus,
+.hbe-input--filled .hbe-input-field-default {
+	opacity: 1;
+	-webkit-transition: opacity 0s 0.2s;
+	transition: opacity 0s 0.2s;
+}
+
+.hbe-input-label-default::before,
+.hbe-input-label-default::after,
+.hbe-input-label-content-default,
+.hbe-input-field-default:focus,
+.hbe-input--filled .hbe-input-field-default {
+	-webkit-transition-timing-function: cubic-bezier(0, 0.25, 0.5, 1);
+	transition-timing-function: cubic-bezier(0, 0.25, 0.5, 1);
+}
+
+.hbe-input-field-default:focus + .hbe-input-label-default::before,
+.hbe-input--filled .hbe-input-label-default::before {
+	-webkit-transform: translate3d(0, 0, 0);
+	transform: translate3d(0, 0, 0);
+}
+
+.hbe-input-field-default:focus + .hbe-input-label-default::after,
+.hbe-input--filled .hbe-input-label-default::after {
+	opacity: 0;
+}
+
+.hbe-input-field-default:focus + .hbe-input-label-default .hbe-input-label-content-default,
+.hbe-input--filled .hbe-input-label-default .hbe-input-label-content-default {
+	color: #555555;
+	-webkit-transform: translate3d(0, 2.1em, 0) scale3d(0.65, 0.65, 1);
+	transform: translate3d(0, 2.1em, 0) scale3d(0.65, 0.65, 1);
+}
+/* default theme }}} */