博客更新日志 | Loli的杂货铺

2024-09-11

手动merge一些小修小补。包括：

移动端的表格呈现（原项目8a94da3）。修改了markdown.styl
归档页面的左侧装饰，修改了原点和虚线的对齐。修改了archive-list.ejs archive-list.styl

在考虑要不要把tools页面模版也移动进来。视难度而定。

将footer里面的keep主题链接指向自己的fork。修改了footer.ejs

2024-01-16

重新大调，更新主题版本到keep v4.0.6,目前决定始终保持这个版本。

在源码上修改的内容：

深色主题时的网页文字和背景颜色，从冷灰变成了暖灰。修改了stylus-variables.styl
archive部分，变成一页显示所有内容。修改了archive-content.ejs
友链的文字在链接上方。修改了page-template.ejs
开始画面的文字增加了一个背景颜色以防止撞色。修改了stylus-variables.styl keep-style.styl
音乐播放器。修改了page.ejs
删除了页脚的Keep主题版本。修改了footer.ejs

在官方的Aplayer.css基础上进行一系列修改，适配了keep主题的深色模式。效果太好了！

其它的修改通过 css 和 js 注入实现

删除了一些没有用的包。

现在似乎支持mermaid流程图了

2023-11-10

修复了keep主题运行时冒出的bug。

暴改hexo-reference/src/footnotes.js，使其完美适配。彻底修复引用的排版错误。

'use strict';

var md = require('markdown-it')({
    // allow HTML tags
    html: true
});

/**
 * Render markdown footnotes
 * @param {String} text
 * @returns {String} text
 */
function renderFootnotes(text) {
    var footnotes = [];
    var reFootnoteContent = /\[\^([a-zA-Z\d]+)\]: ?([\S\s]+?)(?=\[\^(?:\d+)\]|\n\n|$)/g;

    var reFootnoteHint = /\[\^([a-zA-Z\d]+)\]/g;
    var html = '';
    
    // threat all footnote contents
    text = text.replace(reFootnoteContent, function (match, index, content) {
        footnotes.push({
            index: index,
            content: content,
            hint: index
        });
        // remove footnote content
        return '';
    });


    // create map for looking footnotes array
    function createLookMap() {
        var map = {}
        for (var i = 0; i < footnotes.length; i++) {
            var item = footnotes[i]
            var hint = item["hint"];
            map[hint] = item;
            map[hint]["index"] = i+1;
        }
        return map
    }

    var indexMap = createLookMap()

    // console.log('indexMap:',indexMap);
    
    // render (HTML) footnotes reference
    text = text.replace(reFootnoteHint,
        function(match, hint){
            var tooltip = indexMap[hint].content;
            return '<sup id="fnref:' + hint + '">' +
                '<a href="#fn:'+ hint +'" rel="footnote">' +
                '<span class="hint--top hint--error hint--medium hint--rounded hint--bounce" aria-label="'
                + tooltip +
                '">[' + indexMap[hint]["index"] +']</span></a></sup>';
        });

    // render footnotes (HTML)
    footnotes.forEach(function (footNote) {
        html += '<li id="fn:' + footNote.hint + '">';
        html += '<span style="display: inline-block; vertical-align: top; margin-left: 10px;">';
        html += md.renderInline(footNote.content.trim());
        html += '<a href="#fnref:' + footNote.hint + '" rev="footnote"> ↩</a></span></li>';
    });

    // add footnotes at the end of the content
    if (footnotes.length) {
        text += '<div id="footnotes">';
        text += '<hr>';
        text += '<div id="footnotelist">';
        text += '<ol style="list-style: none; padding-left: 0; margin-left: 40px">' + html + '</ol>';
        text += '</div></div>';
    }
    return text;
}
module.exports = renderFootnotes;

2023-11-05

衬线字体。

在 /hexo-theme-keep/source/css/common/css-variables.styl

@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC&display=swap');
:root {
  --base-font-family STSong,Noto Serif SC;
}

2023-10-31 (2)

换回了hexo-filter-mathjax

不过其svg的渲染效果依旧不让人满意。渲染代码在/lib/filter.js，目前内容如下：

//
//  Load the packages needed for MathJax
//
const { mathjax } = require('mathjax-full/js/mathjax.js');
const { TeX } = require('mathjax-full/js/input/tex.js');
const { SVG } = require('mathjax-full/js/output/svg.js');
const { CHTML } = require('mathjax-full/js/output/chtml.js');
const { LiteAdaptor } = require('mathjax-full/js/adaptors/liteAdaptor.js');
const { RegisterHTMLHandler } = require('mathjax-full/js/handlers/html.js');

let { AllPackages } = require('mathjax-full/js/input/tex/AllPackages.js');

module.exports = function(config) {

  //
  //  Create DOM adaptor and register it for HTML documents
  //
  const adaptor = new LiteAdaptor({
    fontSize         : 16,
    cjkCharWidth     : config.cjk_width,
    unknownCharWidth : config.normal_width
  });
  RegisterHTMLHandler(adaptor);

  return function(content) {

    //
    //  Create input and output jax and a document using them on the content from the HTML file
    //
    if (Array.isArray(config.packages)) {
      AllPackages = AllPackages.concat(config.packages);
    }
    const tex = new TeX(Object.assign({
      packages  : AllPackages,
      tags      : config.tags,
      inlineMath: config.single_dollars ? {
        '[+]': [['$', '$']]
      } : {}
    }, config.extension_options));
    const svg = new SVG({
      fontCache: 'global'
    });
    const chtml = new CHTML();
    const html = mathjax.document(content, {
      InputJax : tex,
      OutputJax: svg
      // OutputJax: chtml
    });

    //
    //  Typeset the document
    //
    html.render();

    // console.log('html.document:', adaptor.innerHTML(adaptor.body(html.document)));

    //
    //  Output the resulting HTML
    //
    return adaptor.innerHTML(adaptor.body(html.document));
  };
}

2023-10-31

优化数学渲染。从结果上，从svg改成html-css渲染。

细节上，卸载了hexo-filter-mathjax，安装hexo-randerer-mathjax.

~~不过autotag出现了问题。它不给渲染tag了:(~~ 有限的tag支持。~~跳转似乎不行。~~ 似乎需要英文的label。

先这样吧，我搞不懂了。

还有nm的pjax。。。我先deploy一下看看显示效果吧。。管不了了。

目前的/node_modules/hexo-renderer-mathjax/mathjax.html

<script type="text/x-mathjax-config">
    MathJax.Hub.Config({
        tex2jax: {
            inlineMath: [ ["$","$"], ["\\(","\\)"] ],
            skipTags: ['script', 'noscript', 'style', 'textarea', 'pre', 'code'],
            processEscapes: true
        },
        TeX: {
            equationNumbers: {
                autoNumber: "AMS" //增加了这个，支持自动编号。
            }
        },
    });
    MathJax.Hub.Queue(function() {
        var all = MathJax.Hub.getAllJax();
        for (var i = 0; i < all.length; ++i)
            all[i].SourceElement().parentNode.className += ' has-jax';
    });
</script>
<script src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script> 
<!-- +1s -->

ref: tex2jax配置文档, 配置文件文档

2023-07-11

图片增加caption。

方法：渲染器设置为markdown-it（这一步怎么做的忘了

安装 markdown-it-figure-caption

在markdown-it的配置里面加入。

在keep主题的markdown.styl中加入代码，让caption居中。完成。

2023-06-12

修改keep主题源码，头图和首页slogan可针对浅色、深色背景分别设置。

增加友链页。修改keep主题源码，调整友链页内容和链接出现的顺序。

2023-06-11

试着换了主题为keep，并进行魔改。

修改了hexo-generator-index的generator.js，过滤了hide为true的页面。

现在只有首页隐藏了标记hide的文章。

此外mermaid和math不可用

尚未更改博客首页头图。

尚未增加友链和杂货部分。

更新：mathjax可用；mermaid依然有bug：pjax无法加载，无法画类图。

由于有了Pjax，增加Aplayer。metingJS因为原来的API挂了，换了网上别的API。

修改的JS脚本硬编码到了scripts.ejs，调用播放器的代码放在了page.ejs中。

尾注会出现两个序号，非常之蠢。

友链尚未增加，该按钮没用。

原来的“杂货”窗口也没有增加。

2023-03-01

将domain换成了 justaloli.cn 。原有域名，如果可能，将重定向到这个域名。

2023-02-26

一定程度上修复了音乐播放器，换回了Aplayer。但是由于没有PJAX，依旧只将播放器放在了杂货的一个页面中。

2023-02-25

新增RSS。入口在杂货。

2023-02-07

发现文章页面底部的「引用」板块显示的链接还是旧的justaloli.github.io。修改了一下。

2023-01-18

尝试了很多，最终增加了一个Aplayer音乐播放器。

issue：很遗憾，由于Fluid主题不支持Pjax，音乐在页面跳转时将暂停。为此我只能求其次，只在某几个页面显示音乐播放器。

让Fluid支持Pjax，或者让Aplayer不被重新加载，目前都不在我的能力范围内。后续会持续学习。

追加issue 玩脱了，整个播放器都没有了。完全不知道出了什么问题无语。

做了很多好像什么都没有做。暂时搁置。

2023-01-17

对站点进行了萌ICP备案

给网页增加了一个sakana🐟～小组件，好玩！

2023-01-16

对 fluid 主题源码进行了一些修改，调整了「友链」（在这个博客下叫做杂货铺！）的布局和写作方式。

不过这些改变不是通过注入自己的代码实现的，而是直接修改fluid主题源码实现的，有一些不优雅。不过我比较满意。梦想是做成瀑布流，不过对我而言太困难。

2023-01-15

更换了网站头图，并彻底调整了网页配色。

2023-01-13

注册了新域名 justaloli.site，做了域名解析和cloudflare的CDN加速

2023-01-12

建站第一天。部署在Github Pagejustaloli.github.io。确定了博客框架hexo，确定了主题fluid，确定了网站名Loli的杂货铺。