<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
  <channel>
    <title>无他 on 也被放进河川</title>
    <link>https://hechuan.me/categories/%E6%97%A0%E4%BB%96/</link>
    <description>Recent content from 也被放进河川</description>
    <generator>Hugo</generator>
    <language>zh-CN</language>
    
    <managingEditor>hechuan4@outlook.com (也被放进河川)</managingEditor>
    <webMaster>hechuan4@outlook.com (也被放进河川)</webMaster>
    
    <copyright>本博客所有文章除特别声明外，均采用 BY-NC-SA 许可协议。转载请注明出处！</copyright>
    
    <lastBuildDate>Sun, 29 Mar 2026 17:00:00 +0800</lastBuildDate>
    
    
    <atom:link href="https://hechuan.me/categories/%E6%97%A0%E4%BB%96/index.xml" rel="self" type="application/rss&#43;xml" />
    

    
      
    

    <item>
      <title>硬盘空间不够 资源存储的邪修方法</title>
      <link>https://hechuan.me/post/ziyuan-cunchu-xiexiu/</link>
      <pubDate>Sun, 29 Mar 2026 17:00:00 &#43;0800</pubDate>
      <author>hechuan4@outlook.com (也被放进河川)</author>
      <guid>https://hechuan.me/post/ziyuan-cunchu-xiexiu/</guid>
      <description>
        <![CDATA[<h1>硬盘空间不够 资源存储的邪修方法</h1><p>作者：也被放进河川（hechuan4@outlook.com）</p>
        
          <h2 id="硬盘空间不够-资源存储的邪修方法">
<a class="header-anchor" href="#%e7%a1%ac%e7%9b%98%e7%a9%ba%e9%97%b4%e4%b8%8d%e5%a4%9f-%e8%b5%84%e6%ba%90%e5%ad%98%e5%82%a8%e7%9a%84%e9%82%aa%e4%bf%ae%e6%96%b9%e6%b3%95"></a>
硬盘空间不够 资源存储的邪修方法
</h2><p>假如你整理/制作了 1t多的资源，但现在你没空间存了。</p>
<p>你制作的这个资源很精品，或者全网独一份。一单删掉，这份资源真的就全网消失了。</p>
<p>或许可以考虑制作成磁力种子，写好资源的特点内容。找几个发布站把这份资源分享出去。</p>
<p>吸引同好下载。让大家替你保存。</p>
<p>看资源大小和热门程度，你需要做种一段时间。就可以删掉了。</p>
<p>诚然这是很冒险的方法。你的资源可能永远取不回来了。</p>
<p>我称之为资源流浪记划。</p>
<p>此刻只要你的资源真的很精品独到，那这份资源某种意义上实现了赛博永生。</p>
<p>相信这份资源会躺在某人的硬盘上，直到多年后你有足够的空间重新下回来。</p>
<p>而且类似讯雷这类网盘应用，他门也会存一些热门的磁力资源在他们的服务器上。</p>
<p>前些天旧手机搞 termux 把系统搞坏了，只能重新刷系统。但刷机包官网删除了。去酷安找刷机包想到这个方法。</p>
<p><img src="https://img.hechuan.me/file/i/2026/03/20260226043614.png" alt="20260226043614.png"></p>
<p><img src="https://img.hechuan.me/file/i/2026/03/20260329165421.png" alt="20260329165421.png"></p>
<p><img src="https://img.hechuan.me/file/i/2026/03/20260226043535.png" alt="20260226043535.png"></p>

        
        <hr><p>本文2026-03-29首发于<a href='https://hechuan.me/'>也被放进河川</a>，最后修改于2026-03-29</p><p>本博客所有文章除特别声明外，均采用 BY-NC-SA 许可协议。转载请注明出处！</p>]]>
      </description>
      
        <category>无他</category>
      
    </item>
    
      
    

    <item>
      <title>国产 3D动漫 从夯到拉 (主观排名)</title>
      <link>https://hechuan.me/post/cn-3ddongman-paiming/</link>
      <pubDate>Wed, 11 Feb 2026 20:00:00 &#43;0800</pubDate>
      <author>hechuan4@outlook.com (也被放进河川)</author>
      <guid>https://hechuan.me/post/cn-3ddongman-paiming/</guid>
      <description>
        <![CDATA[<h1>国产 3D动漫 从夯到拉 (主观排名)</h1><p>作者：也被放进河川（hechuan4@outlook.com）</p>
        
          <h2 id="国产-3d动漫-从夯到拉-主观排名">
<a class="header-anchor" href="#%e5%9b%bd%e4%ba%a7-3d%e5%8a%a8%e6%bc%ab-%e4%bb%8e%e5%a4%af%e5%88%b0%e6%8b%89-%e4%b8%bb%e8%a7%82%e6%8e%92%e5%90%8d"></a>
国产 3D动漫 从夯到拉 (主观排名)
</h2><p><strong>声明</strong>:个人主观排名</p>
<p>其实网文爽文改的 3D动漫，在我这都属于吃饭时看的剧。不用带脑子，看个爽。当吃饭时的配菜。</p>
<p>从建模，特效，剧情，制作组态度等角度给出排名。</p>
<p>本文所用到的工具：<a href="https://conghangdaola.com/">https://conghangdaola.com/</a></p>
<p><img src="https://img.hechuan.me/file/i/2026/02/%E5%9B%BD%E4%BA%A7-3D%E5%8A%A8%E6%BC%AB-%E4%BB%8E%E5%A4%AF%E5%88%B0%E6%8B%89.webp" alt="国产-3D动漫-从夯到拉.webp"></p>
<h3 id="凡人修仙传">
<a class="header-anchor" href="#%e5%87%a1%e4%ba%ba%e4%bf%ae%e4%bb%99%e4%bc%a0"></a>
<strong>《凡人修仙传》</strong>
</h3><ul>
<li>制作水平在线。虽然在国际上这种制作水平不够，但在国内看还是属于好的一批，也能看出制作组水平的慢慢提高。</li>
<li>剧情没魔改，前期有过改动，但被观众喷了，制作组看到观众喷后又改了回来。单从重制这一点就很曾加好感度。你能找出几个国内能给你重制的。记的他重制过好多集。</li>
<li>后面剧情也有过小改，但是改的观众一致叫好，且不影响主线。甚至弥补了原作。</li>
<li>后面制作水平提高，稳步向好，韩立结婴还大热了一阵。加上制作组听取观众反馈，给到<strong>夯</strong>，应该不会有太大质疑。</li>
</ul>
<h3 id="仙逆">
<a class="header-anchor" href="#%e4%bb%99%e9%80%86"></a>
<strong>《仙逆》</strong>
</h3><ul>
<li>仙逆本不该在顶级一栏的，属于人上人或 npc。完全是同行衬托。</li>
<li>制作水平有。画质，人物建模，特效，都属于中流水平。</li>
<li>网文的爽点都做了出来。</li>
<li>剧情没魔改，除了原作里有些过于露骨的描写，不可能给你做出来。</li>
<li>剧情不踩点，很多作品马上高潮了，他给你等下一集。仙逆是直接让你在这一集爽完。有些剧集也有过踩点出现，不知道是制作组被骂了还是如何，这种情况后面基本少出现了。</li>
<li>主角被屠了全族，这点在我这是完全可以弃剧的雷点。但考虑到原著都多少年前的作品了，也能接着看。</li>
<li>有种感觉，制作组或者带头的领导应该是仙逆网文的粉丝。有用心做。不过受限于原著题材以及制作组水平，上限也就在这了。</li>
<li>用中流的制作水平交了一份 80分的答卷。加上其他几部作品的衬托，给到<strong>顶级</strong>。</li>
</ul>
<h3 id="牧神记">
<a class="header-anchor" href="#%e7%89%a7%e7%a5%9e%e8%ae%b0"></a>
<strong>《牧神记》</strong>
</h3><ul>
<li>《牧神记》可惜了，本来是可以给到夯的。</li>
<li>如果说以上都是爽文，就看个无脑爽，看完不过脑子。看到延康国师那，发现原来这部作品立意挺高。同时也无脑爽。</li>
<li>明显原著作者是想在网文爽文的基础上，写点什么东西出来。但很明显作者把握不住。(这里并非贬意，而是褒意。)</li>
<li>里面的台词，让我记忆犹新。“一个是批着宗教的国家，一个是批着国家的宗教”。“360堂对应世间360行”。以及新建第361堂，学堂。</li>
<li>无脑爽和立意高，本来有点相悖的，所以有的地方看着不是很合理。</li>
<li>比如主角几人去挑战楼兰黄金宫，主角境界低，对面境界高，然后对面的老大让手下压制境界到跟主角一样来打。明明这是生死之战，能明白是想表达为了公平才压制境界，但这可是生死之战，命不是最重要的？</li>
<li>制作组<strong>玄机科技</strong>用了太多 ai 生成了，追求新技术本没错。可导致很多画面看了出戏，尤其是前面的集数，ai 生成还没那么强，一眼就能看出是 ai 做的。甚至有的集快全是 ai 生成的了。太偷懒了。</li>
<li>但也有好处，ai 生成的场景确是够宏大，让你在手机的小屏幕上感受到玄幻小说描述的宏大的感觉。</li>
<li>后面 ai 发展的也快，很多 ai 生成的画面好多了。但无非是一眼看出 ai 或两眼看出 ai的区别。</li>
<li>里面的上古神语制作成用粤语替代。听着还挺有神性的，但可让那些粤语小鬼猖狂了一把，弹幕在那发粤语就是中国古代的语言。好在制组组估计看到了弹幕吵架，后面没再重复放。但也跟故事线还没讲到神那的剧情有关。</li>
<li>这部作品从一开始是《小鱼儿与花无缺》，9个师傅教主角功夫的开头模板。到丁真与他的动物朋友，主角像丁真，天天跟动物朋友玩。到延康国师。</li>
<li>该爽的地方爽，也有立意，制作用了 ai 生成，有好有坏，虽然 ai 生成的坏大于好，但可以给个<strong>顶级</strong>。</li>
</ul>
<h3 id="沧元图">
<a class="header-anchor" href="#%e6%b2%a7%e5%85%83%e5%9b%be"></a>
<strong>《沧元图》</strong>
</h3><ul>
<li>前期场景太粗糙简陋，不像是工作室出品的成品动漫。像个人兴趣爱好做出来的。</li>
<li>好在后面经费有了，场景不再简陋。</li>
<li>建模中规中据。</li>
<li>特效独数一帜。这点可以单独说说，制作组有他们独到的理解与表达。主角的中国风特效确实帅，加分。</li>
<li>说到制作组有他们独到的艺术化表达。不得不说，有时候会弄巧成拙。比如名场面主角魔化，在那唱数鸭子，门前大桥下游过一群鸭，有画面了没有。我能理解为什么这么表达，但这种艺术行为是需要前期铺垫的。</li>
<li>以及背景音乐的蒙古喊麦，喊的时间太长了，有点尬了。弹幕也全在说这事，可见不是我一人觉的尬。</li>
<li>剧情有硬伤，主角老被利用，设套。以及莫名其妙的追杀，所有人都知道，唯独主角不知道的谜语人剧情。</li>
<li>综合来看，前期可以给到<strong>拉</strong>，后面场景建模好了加上特效以及独到的艺术化表达，给到<strong>npc</strong>。</li>
</ul>
<h3 id="剑来">
<a class="header-anchor" href="#%e5%89%91%e6%9d%a5"></a>
<strong>《剑来》</strong>
</h3><ul>
<li>除了建模好，别的说不上那好了。</li>
<li>剧情就俩字：磨叽。</li>
<li>所有人都想杀主角，主角惹到他了，要杀主角，主角帮过他，要杀主角，主角小时候救过他，要杀主角。</li>
<li>给所有要杀主角的人物都安排了看似合理的措词。</li>
<li>战力说白了也有点崩坏。</li>
<li>看似说了一堆圣贤道理，过于追求所谓意境。</li>
<li>看在建模好特效好，可以给到<strong>npc</strong>。但粉丝多，吹的挺多。给到<strong>人上人</strong>。</li>
</ul>
<h3 id="吞噬星空">
<a class="header-anchor" href="#%e5%90%9e%e5%99%ac%e6%98%9f%e7%a9%ba"></a>
《吞噬星空》
</h3><ul>
<li>各方面都不突出，个人感觉动漫是没做到预期的。</li>
<li>高中时看了小说，吞噬星空地球篇是写的不错的。单论小说，吞噬星空地球篇算是顶级，夺舍金角巨兽飞出地球后就很平常的打怪升级了。</li>
<li>建模一般，剧情还有魔改，动漫还有删剪。导致剧情不连贯。</li>
<li>加上高中情怀，给到 <strong>npc</strong>。</li>
</ul>
<h3 id="完美世界">
<a class="header-anchor" href="#%e5%ae%8c%e7%be%8e%e4%b8%96%e7%95%8c"></a>
<strong>《完美世界》</strong>
</h3><ul>
<li>主角像个傻子有没有感觉。</li>
<li>什么都吃吃吃。说是熊孩子，看着像个傻莽子。</li>
<li>特效建模也不出众。属于是吃饭看剧都不选他。</li>
<li>给到<strong>拉</strong>。</li>
</ul>
<h3 id="斗破苍穹">
<a class="header-anchor" href="#%e6%96%97%e7%a0%b4%e8%8b%8d%e7%a9%b9"></a>
<strong>《斗破苍穹》</strong>
</h3><ul>
<li>可惜了。</li>
<li>作者都说做的<strong>拉</strong>的。</li>
<li>斗破现在属于给新人练手的动漫作品吧。</li>
<li>有这么一种现象，当你发弹幕说别的动漫做的<strong>拉</strong>的时候，肯定有弹幕回怼你说：总比斗破强。</li>
<li>当别的动漫开始吵起来的时候，只要拉出斗破来。大家都开始一致骂斗破。</li>
<li>给到<strong>拉</strong>。</li>
</ul>

        
        <hr><p>本文2026-02-11首发于<a href='https://hechuan.me/'>也被放进河川</a>，最后修改于2026-02-14</p><p>本博客所有文章除特别声明外，均采用 BY-NC-SA 许可协议。转载请注明出处！</p>]]>
      </description>
      
        <category>无他</category>
      
    </item>
    
      
    

    <item>
      <title>网站修改记录</title>
      <link>https://hechuan.me/post/blog-xiugai-jilu/</link>
      <pubDate>Tue, 02 Jan 2024 00:00:00 &#43;0800</pubDate>
      <author>hechuan4@outlook.com (也被放进河川)</author>
      <guid>https://hechuan.me/post/blog-xiugai-jilu/</guid>
      <description>
        <![CDATA[<h1>网站修改记录</h1><p>作者：也被放进河川（hechuan4@outlook.com）</p>
        
          <h1 id="网站修改记录">
<a class="header-anchor" href="#%e7%bd%91%e7%ab%99%e4%bf%ae%e6%94%b9%e8%ae%b0%e5%bd%95"></a>
网站修改记录
</h1><h2 id="reimu">
<a class="header-anchor" href="#reimu"></a>
Reimu
</h2><h3 id="主题改动">
<a class="header-anchor" href="#%e4%b8%bb%e9%a2%98%e6%94%b9%e5%8a%a8"></a>
主题改动
</h3><h4 id="字体颜色">
<a class="header-anchor" href="#%e5%ad%97%e4%bd%93%e9%a2%9c%e8%89%b2"></a>
字体颜色
</h4><p>上下两种用一种就行,推荐直接暴露出来,下面这种</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-scss" data-lang="scss"><span class="line"><span class="cl"><span class="nn">#</span> <span class="nt">文件</span><span class="nd">:themes</span><span class="err">\</span><span class="nt">hugo-theme-reimu</span><span class="err">\</span><span class="nt">assets</span><span class="err">\</span><span class="nt">css</span><span class="err">\</span><span class="nt">_variables</span><span class="nc">.scss</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl">  <span class="o">--</span><span class="nt">color-default</span><span class="nd">:</span> <span class="nn">#444</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="nt">改为</span>
</span></span><span class="line"><span class="cl">  <span class="o">--</span><span class="nt">color-default</span><span class="nd">:</span> <span class="nn">#000000</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="nt">效果</span><span class="nd">:字体更黑</span>
</span></span></code></pre></div><div class="highlight"><pre tabindex="0" class="chroma"><code class="language-scss" data-lang="scss"><span class="line"><span class="cl"><span class="nn">#</span> <span class="nt">文件</span><span class="nd">:themes</span><span class="err">\</span><span class="nt">hugo-theme-reimu</span><span class="err">\</span><span class="nt">assets</span><span class="err">\</span><span class="nt">css</span><span class="err">\</span><span class="nt">main</span><span class="nc">.scss下</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="nn">#</span> <span class="nt">82行添加</span>
</span></span><span class="line"><span class="cl"><span class="err">$</span><span class="nt">color-default</span><span class="nd">:</span> <span class="p">{{</span> <span class="nt">default</span> <span class="s2">&#34;#444&#34;</span> <span class="o">(</span><span class="nt">index</span> <span class="err">$</span><span class="nt">params</span><span class="nc">.internal_theme.light</span> <span class="s2">&#34;--color-default&#34;</span><span class="o">)</span> <span class="p">}};</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="nn">#</span> <span class="nt">文件</span><span class="nd">:themes</span><span class="err">\</span><span class="nt">hugo-theme-reimu</span><span class="err">\</span><span class="nt">assets</span><span class="err">\</span><span class="nt">css</span><span class="err">\</span><span class="nt">_variables</span><span class="nc">.scss下</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="nn">#</span> <span class="nt">16行改</span>
</span></span><span class="line"><span class="cl">  <span class="o">--</span><span class="nt">color-default</span><span class="nd">:</span> <span class="nn">#444</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="nn">#</span> <span class="nt">为</span>
</span></span><span class="line"><span class="cl">  <span class="o">--</span><span class="nt">color-default</span><span class="nd">:</span> <span class="si">#{</span><span class="nv">$color-default</span><span class="si">}</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="nn">#</span> <span class="nt">之后改只需要改params</span><span class="nc">.yml文件</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="nt">internal_theme</span><span class="nd">:</span>
</span></span><span class="line"><span class="cl">  <span class="nt">light</span><span class="nd">:</span>
</span></span><span class="line"><span class="cl">    <span class="o">--</span><span class="nt">color-default</span><span class="nd">:</span> <span class="s1">&#39;#000000&#39;</span>
</span></span></code></pre></div><h4 id="代码块">
<a class="header-anchor" href="#%e4%bb%a3%e7%a0%81%e5%9d%97"></a>
代码块
</h4><div class="highlight"><pre tabindex="0" class="chroma"><code class="language-yml" data-lang="yml"><span class="line"><span class="cl"><span class="c"># params.yml文件</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="c"># 代码块颜色</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="nt">internal_theme</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">  </span><span class="nt">lignt</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--highlight-nav</span><span class="p">:</span><span class="w"> </span><span class="s2">&#34;#F3F3F3&#34;</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--highlight-scrollbar</span><span class="p">:</span><span class="w"> </span><span class="s2">&#34;#d6d6d6&#34;</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--highlight-background</span><span class="p">:</span><span class="w"> </span><span class="s2">&#34;#F3F3F3&#34;</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="c"># 代码块背景取消阴影模糊,感觉这样更简洁直观</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="c"># themes\hugo-theme-reimu\assets\css\partials\highlight.scss文件</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="c"># 删掉</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">box-shadow</span><span class="p">:</span><span class="w"> </span><span class="l">var(--shadow-card);</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="c"># 和</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">      </span><span class="nt">box-shadow</span><span class="p">:</span><span class="w"> </span><span class="l">var(--shadow-card-hover);</span><span class="w">
</span></span></span></code></pre></div><h4 id="要将主题颜色修改为-bilibili-哔哩哔哩-的标志性粉蓝色调">
<a class="header-anchor" href="#%e8%a6%81%e5%b0%86%e4%b8%bb%e9%a2%98%e9%a2%9c%e8%89%b2%e4%bf%ae%e6%94%b9%e4%b8%ba-bilibili-%e5%93%94%e5%93%a9%e5%93%94%e5%93%a9-%e7%9a%84%e6%a0%87%e5%bf%97%e6%80%a7%e7%b2%89%e8%93%9d%e8%89%b2%e8%b0%83"></a>
要将主题颜色修改为 <strong>Bilibili (哔哩哔哩)</strong> 的标志性粉蓝色调
</h4><p>原</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-yml" data-lang="yml"><span class="line"><span class="cl"><span class="nt">internal_theme</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">  </span><span class="nt">light</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-0</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#ff0000&#39;</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-1</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#ff5252&#39;</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-2</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#ff7c7c&#39;</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-3</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#ffafaf&#39;</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-4</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#ffd0d0&#39;</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-5</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#ffecec&#39;</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-5-5</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#fff3f3&#39;</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-6</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#fff7f7&#39;</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--color-red-6-shadow</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;rgba(255, 78, 78, 0.6)&#39;</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--color-red-3-shadow</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;rgba(255, 78, 78, 0.3)&#39;</span><span class="w">
</span></span></span></code></pre></div><p>现</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-yml" data-lang="yml"><span class="line"><span class="cl"><span class="w">  </span><span class="nt">light</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-0</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#00aeec&#39;</span><span class="w">       </span><span class="c"># 深蓝色（用于悬停或强调） #007eb1</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-1</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#00aeec&#39;</span><span class="w">       </span><span class="c"># B站标准品牌蓝（主色调）</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-2</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#40c5f1&#39;</span><span class="w">       </span><span class="c"># 次级蓝色</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-3</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#7fdcf6&#39;</span><span class="w">       </span><span class="c"># 浅蓝色</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-4</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#bfedfa&#39;</span><span class="w">       </span><span class="c"># 极浅蓝</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-5</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#e5f7fd&#39;</span><span class="w">       </span><span class="c"># 背景淡蓝</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-5-5</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#f1fbfe&#39;</span><span class="w">     </span><span class="c"># 极淡背景色</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-6</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#f8fdff&#39;</span><span class="w">       </span><span class="c"># 近白色背景</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--color-red-6-shadow</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;rgba(0,0,0,0)&#39;</span><span class="w"> </span><span class="c"># 蓝色阴影（深） 0, 174, 236, 0.6</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--color-red-3-shadow</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;rgba(0,0,0,0)&#39;</span><span class="w"> </span><span class="c"># 蓝色阴影（浅） 0, 174, 236, 0.3</span><span class="w">
</span></span></span></code></pre></div><h5 id="示例">
<a class="header-anchor" href="#%e7%a4%ba%e4%be%8b"></a>
示例
</h5><p>要将主题颜色修改为 <strong>Bilibili (哔哩哔哩)</strong> 的标志性粉蓝色调，我们需要将原本的红系（Red）变量替换为 B站经典的 <strong>“少女粉”</strong> 或 <strong>“电视蓝”</strong>。</p>
<p>在 2025 年的 UI 设计中，B站主要使用 <code>#FB7299</code> 作为主色调。以下是为你调整后的配置，将原有的红色阶替换为了过渡自然的 B站粉色系：</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">internal_theme</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">  </span><span class="nt">light</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="c"># Bilibili 风格粉色系（由深到浅）</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-0</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#E05D84&#39;</span><span class="w">            </span><span class="c"># 深粉色（用于悬停）</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-1</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#FB7299&#39;</span><span class="w">            </span><span class="c"># B站主色（正粉色）</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-2</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#FF8AAB&#39;</span><span class="w">            </span><span class="c"># 次级粉</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-3</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#FFB3C6&#39;</span><span class="w">            </span><span class="c"># 淡粉</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-4</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#FFD9E2&#39;</span><span class="w">            </span><span class="c"># 极淡粉</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-5</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#FFF1F4&#39;</span><span class="w">            </span><span class="c"># 浅粉背景</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-5-5</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#FFF7F9&#39;</span><span class="w">          </span><span class="c"># 极浅背景</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-6</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#FFFFFF&#39;</span><span class="w">            </span><span class="c"># 白色基准</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="c"># 投影颜色调整（基于 B站粉）</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--color-red-6-shadow</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;rgba(251, 114, 153, 0.6)&#39;</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--color-red-3-shadow</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;rgba(251, 114, 153, 0.3)&#39;</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="c"># 这里的变量名虽然叫 --red，但实际显示已变为 B站粉</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="c"># 如果你想增加 B站蓝（#00AEEC）作为高亮，可以修改下面的部分变量</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--highlight-aqua</span><span class="p">:</span><span class="w"> </span><span class="s2">&#34;#00AEEC&#34;</span><span class="w">   </span><span class="c"># 将水蓝色改为 B站品牌蓝</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--highlight-blue</span><span class="p">:</span><span class="w"> </span><span class="s2">&#34;#007AAB&#34;</span><span class="w">   </span><span class="c"># 深蓝色</span><span class="w">
</span></span></span></code></pre></div><p>在 Hugo Reimu 主题中，要将默认的“灵梦红”改为 <strong>Bilibili 蓝</strong>，你需要调整 <code>internal_theme</code> 下的变量值。</p>
<p>以下是基于 Bilibili 官方品牌蓝（#00AEEC）调配的配色方案，你可以直接替换配置文件中的相应部分：</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">internal_theme</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">  </span><span class="nt">light</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-0</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#007eb1&#39;</span><span class="w">       </span><span class="c"># 深蓝色（用于悬停或强调）</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-1</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#00aeec&#39;</span><span class="w">       </span><span class="c"># B站标准品牌蓝（主色调）</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-2</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#40c5f1&#39;</span><span class="w">       </span><span class="c"># 次级蓝色</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-3</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#7fdcf6&#39;</span><span class="w">       </span><span class="c"># 浅蓝色</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-4</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#bfedfa&#39;</span><span class="w">       </span><span class="c"># 极浅蓝</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-5</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#e5f7fd&#39;</span><span class="w">       </span><span class="c"># 背景淡蓝</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-5-5</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#f1fbfe&#39;</span><span class="w">     </span><span class="c"># 极淡背景色</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--red-6</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;#f8fdff&#39;</span><span class="w">       </span><span class="c"># 近白色背景</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--color-red-6-shadow</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;rgba(0, 174, 236, 0.6)&#39;</span><span class="w"> </span><span class="c"># 蓝色阴影（深）</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--color-red-3-shadow</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;rgba(0, 174, 236, 0.3)&#39;</span><span class="w"> </span><span class="c"># 蓝色阴影（浅）</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">--highlight-nav</span><span class="p">:</span><span class="w"> </span><span class="s2">&#34;#fdfdfd&#34;</span><span class="w">
</span></span></span></code></pre></div><h4 id="在-hugo-博客框架中让菜单标签在新页面打开">
<a class="header-anchor" href="#%e5%9c%a8-hugo-%e5%8d%9a%e5%ae%a2%e6%a1%86%e6%9e%b6%e4%b8%ad%e8%ae%a9%e8%8f%9c%e5%8d%95%e6%a0%87%e7%ad%be%e5%9c%a8%e6%96%b0%e9%a1%b5%e9%9d%a2%e6%89%93%e5%bc%80"></a>
在 Hugo 博客框架中，让菜单标签在新页面打开
</h4><div class="highlight"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="w">  </span>- <span class="nt">name</span><span class="p">:</span><span class="w"> </span><span class="l">travel</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">url</span><span class="p">:</span><span class="w"> </span><span class="s2">&#34;travel.moe&#34;</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">icon</span><span class="p">:</span><span class="w"> </span><span class="l">f57e</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">      </span><span class="nt">external</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span><span class="w">  </span><span class="c"># 某些主题通过此参数识别外部链接并自动新窗口打开</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">      </span><span class="nt">target</span><span class="p">:</span><span class="w"> </span><span class="s2">&#34;_blank&#34;</span><span class="w"> </span><span class="c"># 显式指定目标</span><span class="w">
</span></span></span></code></pre></div><h4 id="添加导航栏菜单">
<a class="header-anchor" href="#%e6%b7%bb%e5%8a%a0%e5%af%bc%e8%88%aa%e6%a0%8f%e8%8f%9c%e5%8d%95"></a>
添加导航栏菜单
</h4><div class="highlight"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">menu</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">  </span>- <span class="nt">name</span><span class="p">:</span><span class="w"> </span><span class="l">foreverblog</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">url</span><span class="p">:</span><span class="w"> </span><span class="s2">&#34;https://foreverblog.cn/go.html&#34;</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="nt">icon</span><span class="p">:</span><span class="w"> </span><span class="l">f197</span><span class="w">
</span></span></span></code></pre></div><p><code>themes\hugo-theme-reimu\i18n\zh-CN.yml</code></p>
<p>文件下添加</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-yml" data-lang="yml"><span class="line"><span class="cl"><span class="nt">travelling</span><span class="p">:</span><span class="w"> </span><span class="l">开往</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="nt">travel</span><span class="p">:</span><span class="w"> </span><span class="l">跃迁</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="nt">foreverblog</span><span class="p">:</span><span class="w"> </span><span class="l">穿梭</span><span class="w">
</span></span></span></code></pre></div><p><strong>i18n</strong> 是 <strong>Internationalization</strong>（国际化）的缩写</p>
<p>其命名源于首尾字母 <strong>&ldquo;i&rdquo;</strong> 和 <strong>&ldquo;n&rdquo;</strong> 之间共有 <strong>18</strong> 个字母</p>
<h4 id="字体">
<a class="header-anchor" href="#%e5%ad%97%e4%bd%93"></a>
字体
</h4><div class="highlight"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="c"># Font loading strategy</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="c"># Custom Font -&gt; Google Fonts -&gt; Local FallBack Font</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="c"># Custom Font</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="c"># v0.9.0 添加了 custom_font 配置用于定义自定义字体，其优先级最高：</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="nt">custom_font</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">  </span><span class="nt">enable</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">  </span><span class="nt">article</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="c"># - css: </span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="c">#   name:  </span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="c"># - css: https://fontsapi.zeoseven.com/292/main/result.css # font css</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="c">#   name: LXGW WenKai # font name</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">  </span><span class="nt">code</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="c"># https://fonts.google.com/</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="c"># Google Fonts, higher priority than local_font</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="nt">font</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">  </span><span class="nt">enable</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">  </span><span class="nt">article</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="c"># - Mulish</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="c"># - Noto Serif SC</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">  </span><span class="nt">code</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="c"># - Ubuntu Mono</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="c"># - Source Code Pro</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="c"># - JetBrains Mono</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="c"># Local FallBack Font</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="c"># v0.2.0 添加了 local_font 配置用于定义本机字体，其优先级比谷歌字体低：</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="nt">local_font</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">  </span><span class="nt">article</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span>- <span class="s2">&#34;-apple-system&#34;</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span>- <span class="l">PingFang SC</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span>- <span class="l">Microsoft YaHei</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span>- <span class="l">sans-serif</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">  </span><span class="nt">code</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span>- <span class="l">Menlo</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span>- <span class="l">Monaco</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span>- <span class="l">Consolas</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span>- <span class="l">monospace</span><span class="w">
</span></span></span></code></pre></div><p>改动</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">local_font</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">  </span><span class="nt">code</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span>- <span class="s2">&#34;Cascadia Code&#34;</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span>- <span class="s2">&#34;JetBrains Mono&#34;</span><span class="w"> </span><span class="c"># 现代代码字体</span><span class="w">
</span></span></span></code></pre></div><p>配置建议与说明</p>
<ul>
<li><strong>性能考量</strong>：如果你开启了 <code>custom_font</code> 或 <code>font</code>，浏览器会从服务器下载字体文件，这可能会在初次加载时导致文字有短暂的“闪烁”或延迟显示。</li>
<li><strong>代码字体 (<code>code</code>)</strong>：强烈建议使用 <strong>JetBrains Mono</strong> 或 <strong>Cascadia Code</strong>，它们带有连字特性且非常易读，配合你之前配置的 B 站蓝代码块，效果极佳。</li>
<li><strong>避坑指南</strong>：如果你在 <code>custom_font</code> 中配置了 CSS，请确保链接是 HTTPS 的，否则在 2025 年主流浏览器中会因为“混合内容”安全策略被拦截，导致字体加载失败。</li>
</ul>
<h4 id="社交链接">
<a class="header-anchor" href="#%e7%a4%be%e4%ba%a4%e9%93%be%e6%8e%a5"></a>
社交链接
</h4><p>添加 qq,travel,travelling,foreverblog</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-scss" data-lang="scss"><span class="line"><span class="cl"><span class="nn">#</span> <span class="nt">themes</span><span class="err">\</span><span class="nt">hugo-theme-reimu</span><span class="err">\</span><span class="nt">assets</span><span class="err">\</span><span class="nt">css</span><span class="err">\</span><span class="nt">partials</span><span class="err">\</span><span class="nt">sidebar</span><span class="nc">.scss</span>
</span></span><span class="line"><span class="cl"><span class="nn">#</span> <span class="nt">填加</span><span class="o">,</span><span class="nt">修改</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="o">@</span><span class="nt">if</span> <span class="nt">index</span><span class="o">(</span><span class="err">$</span><span class="nt">social-keys</span><span class="o">,</span> <span class="s2">&#34;qq&#34;</span><span class="o">)</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">  <span class="nc">.icon-qq</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="na">color</span><span class="o">:</span> <span class="mh">#00aeec</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">  <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="k">@if</span> <span class="nf">index</span><span class="p">(</span><span class="nv">$social-keys</span><span class="o">,</span> <span class="s2">&#34;travel&#34;</span><span class="p">)</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">  <span class="nc">.icon-travel</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="na">color</span><span class="o">:</span> <span class="mh">#e77c8e</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">  <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="k">@if</span> <span class="nf">index</span><span class="p">(</span><span class="nv">$social-keys</span><span class="o">,</span> <span class="s2">&#34;travelling&#34;</span><span class="p">)</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">  <span class="nc">.icon-travelling</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="na">color</span><span class="o">:</span> <span class="mh">#000001</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">  <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="k">@if</span> <span class="nf">index</span><span class="p">(</span><span class="nv">$social-keys</span><span class="o">,</span> <span class="s2">&#34;foreverblog&#34;</span><span class="p">)</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">  <span class="nc">.icon-foreverblog</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="na">color</span><span class="o">:</span> <span class="mh">#000001</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">  <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="k">@if</span> <span class="nf">index</span><span class="p">(</span><span class="nv">$social-keys</span><span class="o">,</span> <span class="s2">&#34;email&#34;</span><span class="p">)</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">  <span class="nc">.icon-email</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="na">color</span><span class="o">:</span> <span class="mh">#00aeec</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">  <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="k">@if</span> <span class="nf">index</span><span class="p">(</span><span class="nv">$social-keys</span><span class="o">,</span> <span class="s2">&#34;bilibili&#34;</span><span class="p">)</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">  <span class="nc">.icon-bilibili</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="na">color</span><span class="o">:</span> <span class="mh">#00aeec</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">  <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span></code></pre></div><div class="highlight"><pre tabindex="0" class="chroma"><code class="language-scss" data-lang="scss"><span class="line"><span class="cl"><span class="nn">#</span> <span class="nt">themes</span><span class="err">\</span><span class="nt">hugo-theme-reimu</span><span class="err">\</span><span class="nt">assets</span><span class="err">\</span><span class="nt">css</span><span class="err">\</span><span class="nt">fontawesome</span><span class="nc">.scss</span>
</span></span><span class="line"><span class="cl"><span class="nn">#</span> <span class="nt">172行添加</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="o">@</span><span class="nt">if</span> <span class="nt">index</span><span class="o">(</span><span class="err">$</span><span class="nt">social-keys</span><span class="o">,</span> <span class="s2">&#34;qq&#34;</span><span class="o">)</span> <span class="nt">or</span> <span class="err">$</span><span class="nt">triangle-badge-icon</span> <span class="o">==</span> <span class="s2">&#34;qq&#34;</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">  <span class="nc">.icon-qq</span><span class="nd">:before</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="na">content</span><span class="o">:</span> <span class="s2">&#34;\f1d6&#34;</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">  <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="k">@if</span> <span class="nf">index</span><span class="p">(</span><span class="nv">$social-keys</span><span class="o">,</span> <span class="s2">&#34;travel&#34;</span><span class="p">)</span> <span class="ow">or</span> <span class="nv">$triangle-badge-icon</span> <span class="o">==</span> <span class="s2">&#34;travel&#34;</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">  <span class="nc">.icon-travel</span><span class="nd">:before</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="na">content</span><span class="o">:</span> <span class="s2">&#34;🛸&#34;</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">  <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="k">@if</span> <span class="nf">index</span><span class="p">(</span><span class="nv">$social-keys</span><span class="o">,</span> <span class="s2">&#34;travelling&#34;</span><span class="p">)</span> <span class="ow">or</span> <span class="nv">$triangle-badge-icon</span> <span class="o">==</span> <span class="s2">&#34;travelling&#34;</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">  <span class="nc">.icon-travelling</span><span class="nd">:before</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="na">content</span><span class="o">:</span> <span class="s2">&#34;🚇&#34;</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">  <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="k">@if</span> <span class="nf">index</span><span class="p">(</span><span class="nv">$social-keys</span><span class="o">,</span> <span class="s2">&#34;foreverblog&#34;</span><span class="p">)</span> <span class="ow">or</span> <span class="nv">$triangle-badge-icon</span> <span class="o">==</span> <span class="s2">&#34;foreverblog&#34;</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">  <span class="nc">.icon-foreverblog</span><span class="nd">:before</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="na">content</span><span class="o">:</span> <span class="s2">&#34;🛸&#34;</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">  <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span></code></pre></div><p><strong>图标变大</strong></p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-scss" data-lang="scss"><span class="line"><span class="cl"><span class="nn">#</span> <span class="nt">themes</span><span class="err">\</span><span class="nt">hugo-theme-reimu</span><span class="err">\</span><span class="nt">assets</span><span class="err">\</span><span class="nt">css</span><span class="err">\</span><span class="nt">partials</span><span class="err">\</span><span class="nt">sidebar</span><span class="nc">.scss</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="nc">.sidebar-social-icon</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">  <span class="na">position</span><span class="o">:</span> <span class="ni">relative</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">  <span class="na">display</span><span class="o">:</span> <span class="ni">flex</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">  <span class="na">justify-content</span><span class="o">:</span> <span class="ni">center</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">  <span class="na">align-items</span><span class="o">:</span> <span class="ni">center</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">  <span class="na">width</span><span class="o">:</span> <span class="mi">40</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">  <span class="na">height</span><span class="o">:</span> <span class="mi">29</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl">  <span class="k">@if</span> <span class="nv">$icon_font</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="na">font</span><span class="o">:</span> <span class="mi">24</span><span class="kt">px</span> <span class="nv">$font-icon</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">  <span class="p">}</span> <span class="k">@else</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="na">font</span><span class="o">:</span> <span class="mi">24</span><span class="kt">px</span> <span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">font-icon</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">  <span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl">  <span class="na">transition</span><span class="o">:</span> <span class="ni">transform</span> <span class="mi">0</span><span class="mf">.2</span><span class="kt">s</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">  <span class="na">will-change</span><span class="o">:</span> <span class="ni">transform</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl">  <span class="k">&amp;</span><span class="nd">:hover</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="na">transform</span><span class="o">:</span> <span class="nf">scale</span><span class="p">(</span><span class="mi">1</span><span class="mf">.4</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">  <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span></code></pre></div><h4 id="fontawesome">
<a class="header-anchor" href="#fontawesome"></a>
fontawesome
</h4><div class="highlight"><pre tabindex="0" class="chroma"><code class="language-scss" data-lang="scss"><span class="line"><span class="cl"><span class="nn">#</span> <span class="nt">themes</span><span class="err">\</span><span class="nt">hugo-theme-reimu</span><span class="err">\</span><span class="nt">assets</span><span class="err">\</span><span class="nt">css</span><span class="err">\</span><span class="nt">fontawesome</span><span class="nc">.scss</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="nc">.icon-pencil</span><span class="nd">:before</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">  <span class="na">font-family</span><span class="o">:</span> <span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">font-icon</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">  <span class="na">content</span><span class="o">:</span> <span class="s2">&#34;\f303&#34;</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="nc">.icon-calendar</span><span class="nd">:before</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">  <span class="na">font-family</span><span class="o">:</span> <span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">font-icon</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">  <span class="na">content</span><span class="o">:</span> <span class="s2">&#34;\f133&#34;</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">  <span class="na">font-weight</span><span class="o">:</span> <span class="mi">900</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span></code></pre></div><h2 id="202412-你好-hugo">
<a class="header-anchor" href="#202412-%e4%bd%a0%e5%a5%bd-hugo"></a>
2024/1/2 你好 hugo
</h2><p>更换 hugo 博客框架，stcak 主题，纯静态就是快。</p>
<details class="details custom-block">
  <summary>修改记录很长点击展开</summary>
  <div class="details-content"><h3 id="hugo博客-stack主题-修改备份">
<a class="header-anchor" href="#hugo%e5%8d%9a%e5%ae%a2-stack%e4%b8%bb%e9%a2%98-%e4%bf%ae%e6%94%b9%e5%a4%87%e4%bb%bd"></a>
hugo博客 stack主题 修改备份
</h3><h3 id="1---添加好物和软件">
<a class="header-anchor" href="#1---%e6%b7%bb%e5%8a%a0%e5%a5%bd%e7%89%a9%e5%92%8c%e8%bd%af%e4%bb%b6"></a>
1 - 添加好物和软件
</h3><ul>
<li>
<p>app.html和hardware.html文件放进主题的layouts_default目录下，app.json和hardware.json放进主题data目录下</p>
</li>
<li>
<p>修改主题./assets/scss/custom.scss文件添加样式</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-css" data-lang="css"><span class="line"><span class="cl"><span class="c">/* Place your custom SCSS in HUGO_SITE_FOLDER/assets/scss/custom.scss */</span>
</span></span><span class="line"><span class="cl"><span class="o">//</span> <span class="nt">hardware硬件页样式</span>
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">quanju</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">display</span><span class="p">:</span> <span class="k">grid</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">grid-template-columns</span><span class="p">:</span> <span class="nf">repeat</span><span class="p">(</span><span class="kc">auto</span><span class="o">-</span><span class="kc">fill</span><span class="p">,</span> <span class="nf">minmax</span><span class="p">(</span><span class="mi">260</span><span class="kt">px</span><span class="p">,</span> <span class="mi">1</span><span class="n">fr</span><span class="p">));</span>
</span></span><span class="line"><span class="cl">    <span class="n">grid-gap</span><span class="p">:</span> <span class="mi">15</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="c">/* 中间空10px间距 */</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">bankuai</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">background-color</span><span class="p">:</span> <span class="mh">#ffffff</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">border-radius</span><span class="p">:</span> <span class="mi">4</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">padding</span><span class="p">:</span> <span class="mi">20</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">transition</span><span class="p">:</span> <span class="kc">all</span> <span class="mf">.3</span><span class="kt">s</span> <span class="nb">cubic-bezier</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span> <span class="mi">0</span><span class="p">,</span> <span class="mf">.5</span><span class="p">,</span> <span class="mi">1</span><span class="p">);</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">bankuai</span><span class="p">:</span><span class="nd">hover</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">box-shadow</span><span class="p">:</span> <span class="mi">2</span><span class="kt">px</span> <span class="mi">4</span><span class="kt">px</span> <span class="mi">16</span><span class="kt">px</span> <span class="nb">rgba</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span> <span class="mi">0</span><span class="p">,</span> <span class="mi">0</span><span class="p">,</span> <span class="mf">.05</span><span class="p">);</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">duiqi</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">display</span><span class="p">:</span> <span class="kc">flex</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">justify-content</span><span class="p">:</span> <span class="kc">center</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">align-items</span><span class="p">:</span> <span class="kc">center</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">duiqi</span> <span class="nt">img</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">width</span><span class="p">:</span> <span class="mi">80</span><span class="kt">%</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">margin</span><span class="p">:</span> <span class="mi">0</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">transition</span><span class="p">:</span> <span class="k">transform</span> <span class="mf">0.3</span><span class="kt">s</span> <span class="kc">ease</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">bankuai</span><span class="p">:</span><span class="nd">hover</span> <span class="p">.</span><span class="nc">duiqi</span> <span class="nt">img</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">transform</span><span class="p">:</span> <span class="nb">scale</span><span class="p">(</span><span class="mf">1.05</span><span class="p">);</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">title</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">font-family</span><span class="p">:</span> <span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">font</span><span class="o">-</span><span class="n">family</span><span class="o">-</span><span class="n">title</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">    <span class="k">font-size</span><span class="p">:</span> <span class="mi">18</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">margin</span><span class="p">:</span> <span class="mi">8</span><span class="kt">px</span> <span class="mi">0</span> <span class="mi">8</span><span class="kt">px</span> <span class="mi">0</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">note</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">font-size</span><span class="p">:</span> <span class="mi">16</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">line-height</span><span class="p">:</span> <span class="mf">1.6</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">color</span><span class="p">:</span> <span class="mh">#666</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">hardware_link</span><span class="o">,</span>
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">hardware_index_link</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">margin-bottom</span><span class="p">:</span> <span class="mi">15</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">margin-top</span><span class="p">:</span> <span class="mi">10</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">display</span><span class="p">:</span> <span class="kc">flex</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="n">grid-gap</span><span class="p">:</span> <span class="mi">8</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">flex-wrap</span><span class="p">:</span> <span class="kc">wrap</span><span class="p">;</span> <span class="err">//宽度显示不下自动换行</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">details</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">padding</span><span class="p">:</span> <span class="mi">0</span> <span class="mi">10</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">text-align</span><span class="p">:</span> <span class="kc">center</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">font-size</span><span class="p">:</span> <span class="mi">14</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">border-radius</span><span class="p">:</span> <span class="mi">20</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">font-family</span><span class="p">:</span> <span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">font</span><span class="o">-</span><span class="n">family</span><span class="o">-</span><span class="n">code</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">    <span class="k">height</span><span class="p">:</span> <span class="mi">30</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">display</span><span class="p">:</span> <span class="kc">flex</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">justify-content</span><span class="p">:</span> <span class="kc">center</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">align-items</span><span class="p">:</span> <span class="kc">center</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">tiyi</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">padding</span><span class="p">:</span> <span class="mi">0</span> <span class="mi">10</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">text-align</span><span class="p">:</span> <span class="kc">center</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">font-size</span><span class="p">:</span> <span class="mi">14</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">border-radius</span><span class="p">:</span> <span class="mi">20</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">font-family</span><span class="p">:</span> <span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">font</span><span class="o">-</span><span class="n">family</span><span class="o">-</span><span class="n">code</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">    <span class="k">height</span><span class="p">:</span> <span class="mi">30</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">display</span><span class="p">:</span> <span class="kc">flex</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">justify-content</span><span class="p">:</span> <span class="kc">center</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">align-items</span><span class="p">:</span> <span class="kc">center</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">jiage</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">padding</span><span class="p">:</span> <span class="mi">0</span> <span class="mi">10</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">text-align</span><span class="p">:</span> <span class="kc">center</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">font-size</span><span class="p">:</span> <span class="mi">14</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">border-radius</span><span class="p">:</span> <span class="mi">20</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">font-family</span><span class="p">:</span> <span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">font</span><span class="o">-</span><span class="n">family</span><span class="o">-</span><span class="n">code</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">    <span class="k">height</span><span class="p">:</span> <span class="mi">30</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">display</span><span class="p">:</span> <span class="kc">flex</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">justify-content</span><span class="p">:</span> <span class="kc">center</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">align-items</span><span class="p">:</span> <span class="kc">center</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">tiyi</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">color</span><span class="p">:</span> <span class="mh">#be3051</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">background-color</span><span class="p">:</span> <span class="kc">transparent</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">border</span><span class="p">:</span> <span class="mf">0.5</span><span class="kt">px</span> <span class="kc">solid</span> <span class="mh">#be3051</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">liing_2_right</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">margin-left</span><span class="p">:</span> <span class="kc">auto</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">details</span><span class="o">,</span>
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">jiage</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">color</span><span class="p">:</span> <span class="mh">#666</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">background-color</span><span class="p">:</span> <span class="kc">transparent</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">border</span><span class="p">:</span> <span class="mf">0.5</span><span class="kt">px</span> <span class="kc">solid</span> <span class="mh">#dadada</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">bankuai</span> <span class="nt">a</span><span class="p">:</span><span class="nd">hover</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">text-decoration</span><span class="p">:</span> <span class="kc">none</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">tiyi</span><span class="p">:</span><span class="nd">empty</span><span class="o">,</span>
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">details</span><span class="p">:</span><span class="nd">empty</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">display</span><span class="p">:</span> <span class="kc">none</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">pagetitle</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">margin-left</span><span class="p">:</span> <span class="mi">80</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">margin-right</span><span class="p">:</span> <span class="mi">80</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="o">//</span> <span class="nt">页面宽度小于700样式</span>
</span></span><span class="line"><span class="cl"><span class="p">@</span><span class="k">media</span> <span class="o">(</span><span class="nt">max-width</span><span class="p">:</span><span class="nd">700px</span><span class="o">)</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="p">.</span><span class="nc">hardware-index-nrong</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">        <span class="k">height</span><span class="p">:</span> <span class="mi">400</span><span class="kt">px</span> <span class="cp">!important</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="p">}</span>
</span></span><span class="line"><span class="cl">    <span class="p">.</span><span class="nc">hardware-img</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">        <span class="k">padding-top</span><span class="p">:</span> <span class="mi">20</span><span class="kt">px</span> <span class="cp">!important</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="p">}</span>
</span></span><span class="line"><span class="cl">    <span class="p">.</span><span class="nc">hardware-img</span> <span class="nt">img</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">        <span class="k">width</span><span class="p">:</span> <span class="mi">200</span><span class="kt">px</span> <span class="cp">!important</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="o">//</span> <span class="nt">页面宽度大于700小于900样式</span>
</span></span><span class="line"><span class="cl"><span class="p">@</span><span class="k">media</span> <span class="nt">screen</span> <span class="nt">and</span> <span class="o">(</span><span class="nt">min-width</span><span class="p">:</span><span class="nd">700px</span><span class="o">)</span> <span class="nt">and</span> <span class="o">(</span><span class="nt">max-width</span><span class="p">:</span><span class="nd">900px</span><span class="o">)</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="p">.</span><span class="nc">tuij-index</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">        <span class="k">display</span><span class="p">:</span> <span class="k">grid</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">        <span class="k">grid-template-columns</span><span class="p">:</span> <span class="mi">1</span><span class="n">fr</span> <span class="mi">1</span><span class="n">fr</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">        <span class="c">/* 两列等宽 */</span>
</span></span><span class="line"><span class="cl">        <span class="n">grid-gap</span><span class="p">:</span> <span class="mi">10</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">        <span class="c">/* 中间空10px间距 */</span>
</span></span><span class="line"><span class="cl">    <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="o">//</span> <span class="nt">页面宽度大于900样式</span>
</span></span><span class="line"><span class="cl"><span class="p">@</span><span class="k">media</span> <span class="o">(</span><span class="nt">min-width</span><span class="p">:</span><span class="nd">900px</span><span class="o">)</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="p">.</span><span class="nc">quanju</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">        <span class="k">margin-right</span><span class="p">:</span> <span class="mi">50</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">        <span class="k">margin-left</span><span class="p">:</span> <span class="mi">50</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="p">}</span>
</span></span><span class="line"><span class="cl">    <span class="p">.</span><span class="nc">tuij-index</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">        <span class="k">display</span><span class="p">:</span> <span class="k">grid</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">        <span class="k">grid-template-columns</span><span class="p">:</span> <span class="mi">1</span><span class="n">fr</span> <span class="mi">1</span><span class="n">fr</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">        <span class="c">/* 两列等宽 */</span>
</span></span><span class="line"><span class="cl">        <span class="n">grid-gap</span><span class="p">:</span> <span class="mi">15</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">        <span class="c">/* 中间空10px间距 */</span>
</span></span><span class="line"><span class="cl">    <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="o">//</span> <span class="nt">夜间模式页面样式</span>
</span></span><span class="line"><span class="cl"><span class="o">[</span><span class="nt">data-scheme</span><span class="o">=</span><span class="s2">&#34;dark&#34;</span><span class="o">]</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="err">.bankuai</span> <span class="err">{</span>
</span></span><span class="line"><span class="cl">        <span class="k">background</span><span class="p">:</span> <span class="mh">#201d1e</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="p">}</span>
</span></span><span class="line"><span class="cl">    <span class="p">.</span><span class="nc">title</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">        <span class="k">color</span><span class="p">:</span> <span class="mh">#bbbbbb</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="p">}</span>
</span></span><span class="line"><span class="cl">    <span class="p">.</span><span class="nc">note</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">        <span class="k">color</span><span class="p">:</span> <span class="mh">#999</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="p">}</span>
</span></span><span class="line"><span class="cl">    <span class="p">.</span><span class="nc">hardware-index-button</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">        <span class="k">border</span><span class="p">:</span> <span class="mf">0.5</span><span class="kt">px</span> <span class="kc">solid</span> <span class="mh">#544d4e</span> <span class="cp">!important</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">        <span class="k">color</span><span class="p">:</span> <span class="mh">#666</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="p">}</span>
</span></span><span class="line"><span class="cl">    <span class="p">.</span><span class="nc">hardware-index</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">        <span class="k">background</span><span class="p">:</span> <span class="mh">#201d1e</span> <span class="cp">!important</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="p">}</span>
</span></span><span class="line"><span class="cl">    <span class="p">.</span><span class="nc">hardware-info</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">        <span class="k">color</span><span class="p">:</span> <span class="mh">#666</span> <span class="cp">!important</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="p">}</span>
</span></span><span class="line"><span class="cl">    <span class="p">.</span><span class="nc">hardware-1</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">        <span class="k">background-color</span><span class="p">:</span> <span class="mh">#3c3739</span> <span class="cp">!important</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="p">}</span>
</span></span><span class="line"><span class="cl">    <span class="p">.</span><span class="nc">hardware-2</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">        <span class="k">background-color</span><span class="p">:</span> <span class="mh">#5f595b</span> <span class="cp">!important</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="p">}</span>
</span></span><span class="line"><span class="cl">    <span class="p">.</span><span class="nc">hardware-index-nrong</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">        <span class="k">background-color</span><span class="p">:</span> <span class="mh">#2f2b2c</span> <span class="cp">!important</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="p">}</span>
</span></span><span class="line"><span class="cl">    <span class="p">.</span><span class="nc">hardware-note</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">        <span class="k">color</span><span class="p">:</span> <span class="mh">#999</span> <span class="cp">!important</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="p">}</span>
</span></span><span class="line"><span class="cl">    <span class="p">.</span><span class="nc">details</span><span class="o">,</span>
</span></span><span class="line"><span class="cl">    <span class="p">.</span><span class="nc">jiage</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">        <span class="k">border</span><span class="p">:</span> <span class="mf">0.5</span><span class="kt">px</span> <span class="kc">solid</span> <span class="mh">#454545</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">        <span class="k">color</span><span class="p">:</span> <span class="mh">#999</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="p">}</span>
</span></span><span class="line"><span class="cl">    <span class="p">.</span><span class="nc">hardware_index_link</span> <span class="nt">a</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">        <span class="k">color</span><span class="p">:</span> <span class="mh">#999</span> <span class="cp">!important</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="err">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="o">//</span> <span class="nt">软件</span> <span class="nt">app</span> <span class="nt">样式</span>
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">appdquanjudiv</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">display</span><span class="p">:</span> <span class="k">grid</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">grid-template-columns</span><span class="p">:</span> <span class="nf">repeat</span><span class="p">(</span><span class="kc">auto</span><span class="o">-</span><span class="kc">fill</span><span class="p">,</span> <span class="nf">minmax</span><span class="p">(</span><span class="mi">340</span><span class="kt">px</span><span class="p">,</span> <span class="mi">1</span><span class="n">fr</span><span class="p">));</span>
</span></span><span class="line"><span class="cl">    <span class="n">grid-gap</span><span class="p">:</span> <span class="mi">15</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="c">/* 中间空10px间距 */</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">appquanju</span><span class="o">,</span>
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">app-index</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">border-radius</span><span class="p">:</span> <span class="mi">4</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">align-items</span><span class="p">:</span> <span class="kc">center</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">background-color</span><span class="p">:</span> <span class="mh">#ffffff</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">transition</span><span class="p">:</span> <span class="kc">all</span> <span class="mf">.3</span><span class="kt">s</span> <span class="nb">cubic-bezier</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span> <span class="mi">0</span><span class="p">,</span> <span class="mf">.5</span><span class="p">,</span> <span class="mi">1</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">    <span class="k">display</span><span class="p">:</span> <span class="k">grid</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">grid-template-columns</span><span class="p">:</span> <span class="kc">auto</span> <span class="mi">1</span><span class="n">fr</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="c">/* 第一列宽度自动，第二列平分剩余空间 */</span>
</span></span><span class="line"><span class="cl">    <span class="n">grid-gap</span><span class="p">:</span> <span class="mi">15</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="c">/* 可选项，设置列之间的间隔 */</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">appquanju</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">padding</span><span class="p">:</span> <span class="mi">20</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">background-color</span><span class="p">:</span> <span class="mh">#ffffff</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">appquanju</span><span class="p">:</span><span class="nd">hover</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">box-shadow</span><span class="p">:</span> <span class="mi">2</span><span class="kt">px</span> <span class="mi">4</span><span class="kt">px</span> <span class="mi">16</span><span class="kt">px</span> <span class="nb">rgba</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span> <span class="mi">0</span><span class="p">,</span> <span class="mi">0</span><span class="p">,</span> <span class="mf">.05</span><span class="p">);</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">appquanju</span><span class="p">:</span><span class="nd">hover</span> <span class="p">.</span><span class="nc">appimg</span> <span class="nt">img</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">transform</span><span class="p">:</span> <span class="nb">scale</span><span class="p">(</span><span class="mf">1.04</span><span class="p">);</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">appimg</span> <span class="nt">img</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">width</span><span class="p">:</span> <span class="mi">90</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">border-radius</span><span class="p">:</span> <span class="mf">22.5</span><span class="kt">%</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">transition</span><span class="p">:</span> <span class="k">transform</span> <span class="mf">0.3</span><span class="kt">s</span> <span class="kc">ease</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">apptitle</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">font-size</span><span class="p">:</span> <span class="mi">18</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">font-weight</span><span class="p">:</span> <span class="mi">600</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">appnote</span><span class="o">,</span>
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">appnote-index</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">font-size</span><span class="p">:</span> <span class="mi">16</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">line-height</span><span class="p">:</span> <span class="mf">1.6</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">color</span><span class="p">:</span> <span class="mh">#666</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">text-align</span><span class="p">:</span> <span class="kc">justify</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">overflow</span><span class="p">:</span> <span class="kc">hidden</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">text-overflow</span><span class="p">:</span> <span class="kc">ellipsis</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">display</span><span class="p">:</span> <span class="kp">-webkit-</span><span class="n">box</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="kp">-webkit-</span><span class="n">box-orient</span><span class="p">:</span> <span class="kc">vertical</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">appnote</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">margin-bottom</span><span class="p">:</span> <span class="mi">15</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="kp">-webkit-</span><span class="k">line-clamp</span><span class="p">:</span> <span class="mi">3</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">app-title-all</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">margin-bottom</span><span class="p">:</span> <span class="mi">8</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">appzhuangtai-right</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">margin-left</span><span class="p">:</span> <span class="kc">auto</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">appzhuangtai</span><span class="o">,</span>
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">app-title-all</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">display</span><span class="p">:</span> <span class="kc">flex</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">gap</span><span class="p">:</span> <span class="mi">8</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">flex-wrap</span><span class="p">:</span> <span class="kc">wrap</span><span class="p">;</span> <span class="err">//宽度显示不下自动换行</span>
</span></span><span class="line"><span class="cl">    <span class="k">align-items</span><span class="p">:</span> <span class="kc">center</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">appnote-index</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">margin-bottom</span><span class="p">:</span> <span class="mi">0</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="kp">-webkit-</span><span class="k">line-clamp</span><span class="p">:</span> <span class="mi">2</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">macos</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">padding</span><span class="p">:</span> <span class="mi">0</span> <span class="mi">10</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">text-align</span><span class="p">:</span> <span class="kc">center</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">font-size</span><span class="p">:</span> <span class="mi">12</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">border-radius</span><span class="p">:</span> <span class="mi">20</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">font-family</span><span class="p">:</span> <span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">font</span><span class="o">-</span><span class="n">family</span><span class="o">-</span><span class="n">code</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">    <span class="k">height</span><span class="p">:</span> <span class="mi">28</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">display</span><span class="p">:</span> <span class="kc">flex</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">justify-content</span><span class="p">:</span> <span class="kc">center</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">align-items</span><span class="p">:</span> <span class="kc">center</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">macos</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">color</span><span class="p">:</span> <span class="mh">#999</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">background-color</span><span class="p">:</span> <span class="mh">#F2F2F2</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">macos</span><span class="p">:</span><span class="nd">empty</span><span class="o">,</span>
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">kaiyuan</span><span class="p">:</span><span class="nd">empty</span><span class="o">,</span>
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">shoufei</span><span class="p">:</span><span class="nd">empty</span><span class="o">,</span>
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">free</span><span class="p">:</span><span class="nd">empty</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">display</span><span class="p">:</span> <span class="kc">none</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">kaiyuan</span><span class="o">,</span>
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">shoufei</span><span class="o">,</span>
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">free</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">font-size</span><span class="p">:</span> <span class="mi">12</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">padding</span><span class="p">:</span> <span class="mi">2</span><span class="kt">px</span> <span class="mi">6</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">border-radius</span><span class="p">:</span> <span class="mi">20</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">kaiyuan</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">color</span><span class="p">:</span> <span class="mh">#e59c13</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">background-color</span><span class="p">:</span> <span class="kc">transparent</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">box-shadow</span><span class="p">:</span> <span class="kc">inset</span> <span class="mi">0</span> <span class="mi">0</span> <span class="mi">0</span> <span class="mf">0.5</span><span class="kt">px</span> <span class="mh">#e59c13</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">shoufei</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">color</span><span class="p">:</span> <span class="mh">#0774e0</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">background-color</span><span class="p">:</span> <span class="kc">transparent</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">box-shadow</span><span class="p">:</span> <span class="kc">inset</span> <span class="mi">0</span> <span class="mi">0</span> <span class="mi">0</span> <span class="mf">0.5</span><span class="kt">px</span> <span class="mh">#0774e0</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">free</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">color</span><span class="p">:</span> <span class="mh">#11a173</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">background-color</span><span class="p">:</span> <span class="kc">transparent</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">box-shadow</span><span class="p">:</span> <span class="kc">inset</span> <span class="mi">0</span> <span class="mi">0</span> <span class="mi">0</span> <span class="mf">0.5</span><span class="kt">px</span> <span class="mh">#11a173</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">appdquanjudiv</span> <span class="nt">a</span><span class="p">:</span><span class="nd">hover</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">text-decoration</span><span class="p">:</span> <span class="kc">none</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">apptitle</span> <span class="nt">a</span><span class="p">:</span><span class="nd">hover</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">text-decoration</span><span class="p">:</span> <span class="kc">underline</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">pagetitle</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="k">font-size</span><span class="p">:</span> <span class="mi">18</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">line-height</span><span class="p">:</span> <span class="mf">1.8</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="k">margin-bottom</span><span class="p">:</span> <span class="mi">20</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="o">//</span> <span class="nt">夜间模式页面样式</span>
</span></span><span class="line"><span class="cl"><span class="o">[</span><span class="nt">data-scheme</span><span class="o">=</span><span class="s2">&#34;dark&#34;</span><span class="o">]</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="err">.appquanju</span> <span class="err">{</span>
</span></span><span class="line"><span class="cl">        <span class="k">background-color</span><span class="p">:</span> <span class="mh">#201d1e</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="p">}</span>
</span></span><span class="line"><span class="cl">    <span class="p">.</span><span class="nc">macos</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">        <span class="k">color</span><span class="p">:</span> <span class="mh">#666</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">        <span class="k">background-color</span><span class="p">:</span> <span class="mh">#2E282A</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="p">}</span>
</span></span><span class="line"><span class="cl">    <span class="p">.</span><span class="nc">appnote</span><span class="o">,</span>
</span></span><span class="line"><span class="cl">    <span class="p">.</span><span class="nc">appnote-index</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">        <span class="k">color</span><span class="p">:</span> <span class="mh">#999</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="p">}</span>
</span></span><span class="line"><span class="cl">    <span class="p">.</span><span class="nc">app-index</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">        <span class="k">background-color</span><span class="p">:</span> <span class="mh">#2f2b2c</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="err">}</span>
</span></span></code></pre></div></li>
<li>
<p>./content/page目录下新建app.md和hardware.md，内容如下</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-markdown" data-lang="markdown"><span class="line"><span class="cl">title: &#34;好物或硬件&#34;
</span></span><span class="line"><span class="cl">layout: &#34;hardware&#34;
</span></span><span class="line"><span class="cl">menu:
</span></span><span class="line"><span class="cl">    main:
</span></span><span class="line"><span class="cl">        weight: -60
</span></span><span class="line"><span class="cl">        params: 
</span></span><span class="line"><span class="cl">            icon: 你的图标
</span></span></code></pre></div></li>
</ul>
<p>更好看的：</p>
<ul>
<li><a href="https://immmmm.com/">https://immmmm.com/</a></li>
<li><a href="https://koobai.com/">https://koobai.com/</a></li>
<li><a href="https://nuoea.com/goods/">https://nuoea.com/goods/</a></li>
<li><a href="https://yzrss.com/haowu">https://yzrss.com/haowu</a></li>
</ul>
<h3 id="2---友链改成双栏或三栏">
<a class="header-anchor" href="#2---%e5%8f%8b%e9%93%be%e6%94%b9%e6%88%90%e5%8f%8c%e6%a0%8f%e6%88%96%e4%b8%89%e6%a0%8f"></a>
2 - 友链改成双栏或三栏
</h3><blockquote>
<p>参考：<a href="https://blog.linsnow.cn/p/modify-hugo/#hugo%E4%B8%BB%E9%A2%98%E9%AD%94%E6%94%B9">https://blog.linsnow.cn</a></p>
</blockquote>
<p>在博客根目录下的<code>assets</code>下创建一个名为<code>scss</code>的文件夹,然后在<code>scss</code>文件夹里创建一个名为<code>custom.scss</code>的文件。</p>
<p>其实在主题的<code>assets\scss\custom.scss</code>文件下写入也可以，看你喜欢。</p>
<p>在<code>custom.scss</code>中写入以下内容:</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-scss" data-lang="scss"><span class="line"><span class="cl"><span class="c1">//  ~\blog\assets\scss\custom.scss
</span></span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c1">//--------------------------------------------------
</span></span></span><span class="line"><span class="cl"><span class="c1">//链接三栏
</span></span></span><span class="line"><span class="cl"><span class="k">@media</span> <span class="p">(</span><span class="na">min-width</span><span class="o">:</span> <span class="mi">1024</span><span class="kt">px</span><span class="p">)</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">  <span class="nc">.article-list--compact.links</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="na">display</span><span class="o">:</span> <span class="ni">grid</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="na">grid-template-columns</span><span class="o">:</span> <span class="mi">1</span><span class="kt">fr</span> <span class="mi">1</span><span class="kt">fr</span> <span class="mi">1</span><span class="kt">fr</span><span class="p">;</span> <span class="c1">//三个1fr即为三栏,两个1fr则为双栏,以此类推即可.
</span></span></span><span class="line"><span class="cl">    <span class="na">background</span><span class="o">:</span> <span class="ni">none</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="na">box-shadow</span><span class="o">:</span> <span class="ni">none</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="na">gap</span><span class="o">:</span> <span class="mi">1</span><span class="kt">rem</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl">    <span class="nt">article</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">      <span class="na">background</span><span class="o">:</span> <span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">card-background</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">      <span class="na">border</span><span class="o">:</span> <span class="ni">none</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">      <span class="na">box-shadow</span><span class="o">:</span> <span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">shadow-l2</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">      <span class="na">margin-bottom</span><span class="o">:</span> <span class="mi">8</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">      <span class="na">border-radius</span><span class="o">:</span> <span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">card-border-radius</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl">      <span class="k">&amp;</span><span class="nd">:nth-child</span><span class="o">(</span><span class="nt">odd</span><span class="o">)</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">        <span class="na">margin-right</span><span class="o">:</span> <span class="mi">8</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">      <span class="p">}</span>
</span></span><span class="line"><span class="cl">    <span class="p">}</span>
</span></span><span class="line"><span class="cl">  <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span></code></pre></div><p>参考：https://github.com/CaiJimmy/hugo-theme-stack/pull/375</p>
<p><a href="https://blog.linsnow.cn/p/modify-hugo/#%E9%93%BE%E6%8E%A5%E6%A8%A1%E5%9D%97%E5%AE%9E%E7%8E%B0%E4%B8%89%E6%A0%8F%E6%A0%B7%E5%BC%8F">https://blog.linsnow.cn/p/modify-hugo/#%E9%93%BE%E6%8E%A5%E6%A8%A1%E5%9D%97%E5%AE%9E%E7%8E%B0%E4%B8%89%E6%A0%8F%E6%A0%B7%E5%BC%8F</a></p>
<h3 id="3---归档页面改成双栏或三栏">
<a class="header-anchor" href="#3---%e5%bd%92%e6%a1%a3%e9%a1%b5%e9%9d%a2%e6%94%b9%e6%88%90%e5%8f%8c%e6%a0%8f%e6%88%96%e4%b8%89%e6%a0%8f"></a>
3 - 归档页面改成双栏或三栏
</h3><p>跟上一步一样在主题的<code>assets\scss\custom.scss</code>文件下写入</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-scss" data-lang="scss"><span class="line"><span class="cl"><span class="cm">/* 归档页面两栏 */</span>
</span></span><span class="line"><span class="cl"><span class="k">@media</span> <span class="p">(</span><span class="na">min-width</span><span class="o">:</span> <span class="mi">720</span><span class="kt">px</span><span class="p">)</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">  <span class="nc">.article-list--compact</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="na">display</span><span class="o">:</span> <span class="ni">grid</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="na">grid-template-columns</span><span class="o">:</span> <span class="mi">1</span><span class="kt">fr</span> <span class="mi">1</span><span class="kt">fr</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="na">background</span><span class="o">:</span> <span class="ni">none</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="na">box-shadow</span><span class="o">:</span> <span class="ni">none</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="na">gap</span><span class="o">:</span> <span class="mi">1</span><span class="kt">rem</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl">    <span class="nt">article</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">      <span class="na">background</span><span class="o">:</span> <span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">card-background</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">      <span class="na">border</span><span class="o">:</span> <span class="ni">none</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">      <span class="na">box-shadow</span><span class="o">:</span> <span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">shadow-l2</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">      <span class="na">margin-bottom</span><span class="o">:</span> <span class="mi">8</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">      <span class="na">border-radius</span><span class="o">:</span> <span class="mi">16</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="p">}</span>
</span></span><span class="line"><span class="cl">  <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span></code></pre></div><h3 id="4---修改toc样式">
<a class="header-anchor" href="#4---%e4%bf%ae%e6%94%b9toc%e6%a0%b7%e5%bc%8f"></a>
4 - 修改Toc样式
</h3><blockquote>
<p>参考：<a href="https://munlelee.github.io/post/hugo%E5%8D%9A%E5%AE%A2-stack%E4%B8%BB%E9%A2%98%E4%BF%AE%E6%94%B9%E7%AC%AC%E4%B8%80%E7%AB%99/">https://munlelee.github.io/</a></p>
</blockquote>
<p>toc每个标题之间的行间距有点大，于是就缩了缩，在<code>custom.scss</code>文件中又追加了如下的修改：</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-scss" data-lang="scss"><span class="line"><span class="cl"><span class="nc">.widget--toc</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="na">background-color</span><span class="o">:</span> <span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">card-background</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">    <span class="na">border-radius</span><span class="o">:</span> <span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">card-border-radius</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">    <span class="na">display</span><span class="o">:</span> <span class="ni">flex</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="na">flex-direction</span><span class="o">:</span> <span class="ni">column</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="na">color</span><span class="o">:</span> <span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">card-text-color-main</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">    <span class="na">overflow</span><span class="o">:</span> <span class="ni">hidden</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="c1">// display:inline-block;
</span></span></span><span class="line"><span class="cl">    <span class="na">font-size</span><span class="o">:</span> <span class="mi">16</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl">    <span class="nn">#TableOfContents</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">        <span class="na">overflow-x</span><span class="o">:</span> <span class="ni">auto</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">        <span class="nt">ol</span><span class="o">,</span>
</span></span><span class="line"><span class="cl">        <span class="nt">ul</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">            <span class="na">margin</span><span class="o">:</span> <span class="mi">10</span><span class="p">;</span> 
</span></span><span class="line"><span class="cl">            <span class="na">padding</span><span class="o">:</span> <span class="mi">0</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">        <span class="p">}</span>
</span></span><span class="line"><span class="cl">        <span class="nt">ol</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">            <span class="na">list-style-type</span><span class="o">:</span> <span class="ni">none</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">            <span class="na">counter-reset</span><span class="o">:</span> <span class="n">item</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">            <span class="nt">li</span><span class="nd">:before</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">                <span class="na">counter-increment</span><span class="o">:</span> <span class="n">item</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">                <span class="na">content</span><span class="o">:</span> <span class="nf">counters</span><span class="p">(</span><span class="n">item</span><span class="o">,</span> <span class="s2">&#34;.&#34;</span><span class="p">)</span> <span class="s2">&#34;. &#34;</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">                <span class="na">font-weight</span><span class="o">:</span> <span class="ni">bold</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">                <span class="na">margin-right</span><span class="o">:</span> <span class="mi">0</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">            <span class="p">}</span>
</span></span><span class="line"><span class="cl">        <span class="p">}</span>
</span></span><span class="line"><span class="cl">        <span class="k">&amp;</span> <span class="o">&gt;</span> <span class="nt">ul</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">            <span class="na">padding</span><span class="o">:</span> <span class="mi">0</span> <span class="mi">1</span><span class="kt">em</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">        <span class="p">}</span>
</span></span><span class="line"><span class="cl">        <span class="nt">li</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">            <span class="na">margin</span><span class="o">:</span> <span class="mi">5</span><span class="kt">px</span> <span class="mi">20</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">            <span class="na">padding</span><span class="o">:</span> <span class="mi">6</span><span class="kt">px</span><span class="p">;</span> 
</span></span><span class="line"><span class="cl">            <span class="k">&amp;</span> <span class="o">&gt;</span> <span class="nt">ol</span><span class="o">,</span>
</span></span><span class="line"><span class="cl">            <span class="k">&amp;</span> <span class="o">&gt;</span> <span class="nt">ul</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">                <span class="na">margin-top</span><span class="o">:</span> <span class="mi">10</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">                <span class="na">padding-left</span><span class="o">:</span> <span class="mi">6</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">                <span class="na">margin-bottom</span><span class="o">:</span> <span class="o">-</span><span class="mi">5</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">                <span class="k">&amp;</span> <span class="o">&gt;</span> <span class="nt">li</span><span class="nd">:last-child</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">                    <span class="na">margin-bottom</span><span class="o">:</span> <span class="mi">0</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">                <span class="p">}</span>
</span></span><span class="line"><span class="cl">            <span class="p">}</span>
</span></span><span class="line"><span class="cl">        <span class="p">}</span>
</span></span><span class="line"><span class="cl">    <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span></code></pre></div><h3 id="5---添加评论功能">
<a class="header-anchor" href="#5---%e6%b7%bb%e5%8a%a0%e8%af%84%e8%ae%ba%e5%8a%9f%e8%83%bd"></a>
5 - 添加评论功能
</h3><h4 id="51---waline-没搞明白怎么docker部署">
<a class="header-anchor" href="#51---waline-%e6%b2%a1%e6%90%9e%e6%98%8e%e7%99%bd%e6%80%8e%e4%b9%88docker%e9%83%a8%e7%bd%b2"></a>
5.1 - waline 没搞明白怎么docker部署
</h4><p><a href="https://waline.js.org/">https://waline.js.org/</a></p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-dockerfile" data-lang="dockerfile"><span class="line"><span class="cl">docker run -d <span class="se">\
</span></span></span><span class="line"><span class="cl">  -e <span class="nv">LEAN_ID</span><span class="o">=</span>huochuan-blog <span class="se">\
</span></span></span><span class="line"><span class="cl">  -e <span class="nv">LEAN_KEY</span><span class="o">=</span>huochuan-blog-key <span class="se">\
</span></span></span><span class="line"><span class="cl">  -e <span class="nv">LEAN_MASTER_KEY</span><span class="o">=</span>huochuan-blog-master-key <span class="se">\
</span></span></span><span class="line"><span class="cl">  -p 8360:8360 <span class="se">\
</span></span></span><span class="line"><span class="cl">  lizheming/waline<span class="err">
</span></span></span></code></pre></div><div class="highlight"><pre tabindex="0" class="chroma"><code class="language-dockerfile" data-lang="dockerfile"><span class="line"><span class="cl"><span class="c"># docker-compose.yml</span><span class="err">
</span></span></span><span class="line"><span class="cl">version: <span class="s1">&#39;3&#39;</span><span class="err">
</span></span></span><span class="line"><span class="cl"><span class="err">
</span></span></span><span class="line"><span class="cl">services:<span class="err">
</span></span></span><span class="line"><span class="cl">  waline:<span class="err">
</span></span></span><span class="line"><span class="cl">    container_name: waline<span class="err">
</span></span></span><span class="line"><span class="cl">    image: lizheming/waline:latest<span class="err">
</span></span></span><span class="line"><span class="cl">    restart: always<span class="err">
</span></span></span><span class="line"><span class="cl">    ports:<span class="err">
</span></span></span><span class="line"><span class="cl">      - 127.0.0.1:8360:8360<span class="err">
</span></span></span><span class="line"><span class="cl">    volumes:<span class="err">
</span></span></span><span class="line"><span class="cl">      - <span class="si">${</span><span class="nv">PWD</span><span class="si">}</span>/waline/data:/app/data<span class="err">
</span></span></span><span class="line"><span class="cl">    environment:<span class="err">
</span></span></span><span class="line"><span class="cl">      TZ: <span class="s1">&#39;Asia/Shanghai&#39;</span><span class="err">
</span></span></span><span class="line"><span class="cl">      SQLITE_PATH: <span class="s1">&#39;/root/waline/sqlite/app/data&#39;</span><span class="err">
</span></span></span><span class="line"><span class="cl">      JWT_TOKEN: <span class="s1">&#39;huochuan&#39;</span><span class="err">
</span></span></span><span class="line"><span class="cl">      SITE_NAME: <span class="s1">&#39;huochuan&#39;</span><span class="err">
</span></span></span><span class="line"><span class="cl">      SITE_URL: <span class="s1">&#39;64.176.35.191:8360&#39;</span><span class="err">
</span></span></span><span class="line"><span class="cl">      SECURE_DOMAINS: <span class="s1">&#39;64.176.35.191:8360&#39;</span><span class="err">
</span></span></span><span class="line"><span class="cl">      AUTHOR_EMAIL: <span class="s1">&#39;hechuan4@outlook.com&#39;</span><span class="err">
</span></span></span></code></pre></div><div class="highlight"><pre tabindex="0" class="chroma"><code class="language-dockerfile" data-lang="dockerfile"><span class="line"><span class="cl">docker run -d --name waline -p 8360:8360 <span class="se">\
</span></span></span><span class="line"><span class="cl">  -v /root/waline/data:/app/data <span class="se">\
</span></span></span><span class="line"><span class="cl">  -e <span class="nv">TZ</span><span class="o">=</span><span class="s2">&#34;Asia/Shanghai&#34;</span> <span class="se">\
</span></span></span><span class="line"><span class="cl">  -e JWT_TOKEN:<span class="s1">&#39;huochuan&#39;</span><span class="se">\
</span></span></span><span class="line"><span class="cl">  -e SQLITE_PATH:<span class="s1">&#39;/root/sqlite/app/data&#39;</span> <span class="se">\
</span></span></span><span class="line"><span class="cl">  -e <span class="nv">AUTHOR_EMAIL</span><span class="o">=</span><span class="s2">&#34;hechuan4@outlook.com&#34;</span> <span class="se">\
</span></span></span><span class="line"><span class="cl">  -e <span class="nv">SITE_NAME</span><span class="o">=</span><span class="s2">&#34;huochuan&#34;</span> <span class="se">\
</span></span></span><span class="line"><span class="cl">  -e <span class="nv">SITE_URL</span><span class="o">=</span><span class="s2">&#34;64.176.35.191:8360&#34;</span> <span class="se">\
</span></span></span><span class="line"><span class="cl">  -e <span class="nv">SECURE_DOMAINS</span><span class="o">=</span><span class="s2">&#34;hechuan.me&#34;</span> <span class="se">\
</span></span></span><span class="line"><span class="cl">  --restart always <span class="se">\
</span></span></span><span class="line"><span class="cl">  lizheming/waline:latest<span class="err">
</span></span></span></code></pre></div><h4 id="52---twikoo-很简单就部署好了">
<a class="header-anchor" href="#52---twikoo-%e5%be%88%e7%ae%80%e5%8d%95%e5%b0%b1%e9%83%a8%e7%bd%b2%e5%a5%bd%e4%ba%86"></a>
5.2 - twikoo 很简单就部署好了
</h4><div class="highlight"><pre tabindex="0" class="chroma"><code class="language-dockerfile" data-lang="dockerfile"><span class="line"><span class="cl">docker run --name twikoo -e <span class="nv">TWIKOO_THROTTLE</span><span class="o">=</span><span class="m">1000</span> -p 8686:8080 -v <span class="si">${</span><span class="nv">PWD</span><span class="si">}</span>/data:/app/data -d imaegoo/twikoo<span class="err">
</span></span></span></code></pre></div><h4 id="53---artalk">
<a class="header-anchor" href="#53---artalk"></a>
5.3 - <a href="https://artalk.js.org/">artalk</a>
</h4><h3 id="6---访问统计">
<a class="header-anchor" href="#6---%e8%ae%bf%e9%97%ae%e7%bb%9f%e8%ae%a1"></a>
6 - 访问统计
</h3><h4 id="61---安装不蒜子">
<a class="header-anchor" href="#61---%e5%ae%89%e8%a3%85%e4%b8%8d%e8%92%9c%e5%ad%90"></a>
6.1 - 安装不蒜子
</h4><p>打开 <code>layouts\partials\footer\components</code> 下的 <code>script.html</code> 文件扔进去就好。</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-html" data-lang="html"><span class="line"><span class="cl"><span class="p">&lt;</span><span class="nt">script</span> <span class="na">async</span> <span class="na">src</span><span class="o">=</span><span class="s">&#34;//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js&#34;</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl">script&gt;
</span></span></code></pre></div><p>然后 <code>layouts\partials\footer</code> 文件夹下的 <code>footer.html</code> 文件中填写:</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-html" data-lang="html"><span class="line"><span class="cl"><span class="p">&lt;</span><span class="nt">i</span> <span class="na">class</span><span class="o">=</span><span class="s">&#34;powerby&#34;</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;</span><span class="nt">span</span> <span class="na">id</span><span class="o">=</span><span class="s">&#34;busuanzi_container_site_pv&#34;</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl">    访问量 - <span class="p">&lt;</span><span class="nt">span</span> <span class="na">id</span><span class="o">=</span><span class="s">&#34;busuanzi_value_site_pv&#34;</span><span class="p">&gt;</span>span&gt;
</span></span><span class="line"><span class="cl">span&gt; 
</span></span><span class="line"><span class="cl"><span class="p">&lt;</span><span class="nt">span</span> <span class="na">id</span><span class="o">=</span><span class="s">&#34;busuanzi_container_site_uv&#34;</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl">    访客数 - <span class="p">&lt;</span><span class="nt">span</span> <span class="na">id</span><span class="o">=</span><span class="s">&#34;busuanzi_value_site_uv&#34;</span><span class="p">&gt;</span>span&gt;人次
</span></span><span class="line"><span class="cl">  span&gt;
</span></span><span class="line"><span class="cl">i&gt;
</span></span></code></pre></div><p>刷新就好了。</p>
<h4 id="62---umami">
<a class="header-anchor" href="#62---umami"></a>
6.2 - umami
</h4><p><a href="https://umami.is/?ref=irithys.com">umami</a></p>
<h3 id="7---说说页面">
<a class="header-anchor" href="#7---%e8%af%b4%e8%af%b4%e9%a1%b5%e9%9d%a2"></a>
7 - 说说页面
</h3><ul>
<li><a href="https://gameapp.club/post/2022-03-10-talks-for-blog/">https://gameapp.club/post/2022-03-10-talks-for-blog/</a></li>
<li><a href="https://jdjx.run/words.html">轻语</a></li>
<li><a href="https://artitalk.js.org/">微语</a></li>
<li><a href="https://www.braindance.top/posts/kkapi&#43;ispeak%E8%AF%B4%E8%AF%B4%E9%A1%B5%E9%9D%A2%E9%83%A8%E7%BD%B2/">https://www.braindance.top/posts/kkapi+ispeak%E8%AF%B4%E8%AF%B4%E9%A1%B5%E9%9D%A2%E9%83%A8%E7%BD%B2/</a> 这个是<a href="https://www.antmoe.com/speak/">iSpeak</a>教程</li>
<li><a href="https://eallion.com/memos-deployment/#memos-awesome">https://eallion.com/memos-deployment/#memos-awesome</a> (感觉这个好用 <a href="https://github.com/songquanpeng/microblog">https://github.com/songquanpeng/microblog</a>)</li>
</ul>
<h4 id="71---memos">
<a class="header-anchor" href="#71---memos"></a>
7.1 - memos
</h4><div class="highlight"><pre tabindex="0" class="chroma"><code class="language-dockerfile" data-lang="dockerfile"><span class="line"><span class="cl">docker run -d --name memos -p 5230:5230 <span class="se">\
</span></span></span><span class="line"><span class="cl">  -v /root/memos:/var/opt/memos <span class="se">\
</span></span></span><span class="line"><span class="cl">  neosmemo/memos:latest<span class="err">
</span></span></span></code></pre></div><h3 id="8---头像旋转">
<a class="header-anchor" href="#8---%e5%a4%b4%e5%83%8f%e6%97%8b%e8%bd%ac"></a>
8 - 头像旋转
</h3><p>在 <code>/assets/scss/custom.scss</code> 中加入以下代码：</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-scss" data-lang="scss"><span class="line"><span class="cl"><span class="c1">// 头像旋转动画
</span></span></span><span class="line"><span class="cl"><span class="nc">.sidebar</span> <span class="nt">header</span> <span class="nc">.site-avatar</span> <span class="nc">.site-logo</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">  <span class="na">transition</span><span class="o">:</span> <span class="ni">transform</span> <span class="mi">1</span><span class="mf">.65</span><span class="kt">s</span> <span class="ni">ease-in-out</span><span class="p">;</span> <span class="c1">// 旋转时间
</span></span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="nc">.sidebar</span> <span class="nt">header</span> <span class="nc">.site-avatar</span> <span class="nc">.site-logo</span><span class="nd">:hover</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">  <span class="na">transform</span><span class="o">:</span> <span class="nf">rotate</span><span class="p">(</span><span class="mi">360</span><span class="kt">deg</span><span class="p">);</span> <span class="c1">// 旋转角度为360度
</span></span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span></code></pre></div><blockquote>
<p>参考：https://www.xalaok.top/post/stack-modify/</p>
</blockquote>
<h3 id="9---代码块样式和颜色">
<a class="header-anchor" href="#9---%e4%bb%a3%e7%a0%81%e5%9d%97%e6%a0%b7%e5%bc%8f%e5%92%8c%e9%a2%9c%e8%89%b2"></a>
9 - 代码块样式和颜色
</h3><p>在 <code>/assets/scss/custom.scss</code> 中加入以下代码：</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-scss" data-lang="scss"><span class="line"><span class="cl"><span class="c1">// 代码块基础样式修改
</span></span></span><span class="line"><span class="cl"><span class="nc">.highlight</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">  <span class="na">max-width</span><span class="o">:</span> <span class="mi">102</span><span class="kt">%</span> <span class="k">!important</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">  <span class="na">background-color</span><span class="o">:</span> <span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="ni">pre</span><span class="o">-</span><span class="n">background-color</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">  <span class="na">padding</span><span class="o">:</span> <span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">card-padding</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">  <span class="na">position</span><span class="o">:</span> <span class="ni">relative</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">  <span class="na">border-radius</span><span class="o">:</span> <span class="mi">12</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">  <span class="na">margin-left</span><span class="o">:</span> <span class="o">-</span><span class="mi">7</span><span class="kt">px</span> <span class="k">!important</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">  <span class="na">margin-right</span><span class="o">:</span> <span class="o">-</span><span class="mi">12</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">  <span class="na">box-shadow</span><span class="o">:</span> <span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">shadow-l1</span><span class="p">)</span> <span class="k">!important</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl">  <span class="k">&amp;</span><span class="nd">:hover</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="nc">.copyCodeButton</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">      <span class="na">opacity</span><span class="o">:</span> <span class="mi">1</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="p">}</span>
</span></span><span class="line"><span class="cl">  <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c1">// light模式下的代码块样式调整
</span></span></span><span class="line"><span class="cl"><span class="c1">// 备份颜色#fff9f3,#fff9f3cc
</span></span></span><span class="line"><span class="cl"><span class="o">[</span><span class="nt">data-scheme</span><span class="o">=</span><span class="s2">&#34;light&#34;</span><span class="o">]</span> <span class="nc">.article-content</span> <span class="nc">.highlight</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">  <span class="na">background-color</span><span class="o">:</span> <span class="mh">#F0EFEB</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="o">[</span><span class="nt">data-scheme</span><span class="o">=</span><span class="s2">&#34;light&#34;</span><span class="o">]</span> <span class="nc">.chroma</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">  <span class="na">color</span><span class="o">:</span> <span class="mh">#ff6f00</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">  <span class="na">background-color</span><span class="o">:</span> <span class="mh">#F0EFEB</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span></code></pre></div><h3 id="10---其他一些调整">
<a class="header-anchor" href="#10---%e5%85%b6%e4%bb%96%e4%b8%80%e4%ba%9b%e8%b0%83%e6%95%b4"></a>
10 - 其他一些调整
</h3><blockquote>
<p>分享一个配色网站:<a href="https://colordrop.io/">https://colordrop.io/</a></p>
</blockquote>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-scss" data-lang="scss"><span class="line"><span class="cl"><span class="c1">// 页面基本配色
</span></span></span><span class="line"><span class="cl"><span class="nd">:root</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">  <span class="na">--body-background</span><span class="o">:</span> <span class="mh">#f2f2f2</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">  <span class="na">--card-background</span><span class="o">:</span> <span class="mh">#DEDEDE</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">  <span class="na">--pre-background-color</span><span class="o">:</span> <span class="mh">#fafafa</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">  
</span></span><span class="line"><span class="cl">  <span class="c1">// 行内代码背景色
</span></span></span><span class="line"><span class="cl">  <span class="na">--code-background-color</span><span class="o">:</span> <span class="mh">#f8f8f8</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">  <span class="c1">// 行内代码前景色
</span></span></span><span class="line"><span class="cl">  <span class="na">--code-text-color</span><span class="o">:</span> <span class="mh">#e96900</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl">  <span class="c1">// 全局顶部边距
</span></span></span><span class="line"><span class="cl">  <span class="na">--main-top-padding</span><span class="o">:</span> <span class="mi">30</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">  <span class="c1">// 卡片间距
</span></span></span><span class="line"><span class="cl">  <span class="na">--section-separation</span><span class="o">:</span> <span class="mi">20</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c1">// 文章内容图片圆角阴影
</span></span></span><span class="line"><span class="cl"><span class="nc">.article-page</span> <span class="nc">.main-article</span> <span class="nc">.article-content</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">  <span class="nt">img</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="c1">// 文章图片大小
</span></span></span><span class="line"><span class="cl">	<span class="c1">//max-width: 96% !important;
</span></span></span><span class="line"><span class="cl">    <span class="na">height</span><span class="o">:</span> <span class="ni">auto</span> <span class="k">!important</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">    <span class="na">border-radius</span><span class="o">:</span> <span class="mi">7</span><span class="kt">px</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">  <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span></code></pre></div><h3 id="typecho-迁移到-hugo">
<a class="header-anchor" href="#typecho-%e8%bf%81%e7%a7%bb%e5%88%b0-hugo"></a>
typecho 迁移到 hugo
</h3><p>**参考：**<a href="https://eallion.com/typecho-to-hugo/">https://eallion.com/typecho-to-hugo/</a></p>
<p>适合于像这种链接形式为： <code>https://example.com + slug</code> 的博客进行导出。这样导出的 Markdown 博文，会在 Front matter 里添加 <code>slug</code> 值，以利于后续设置。</p>
<p>脚本地址：</p>
<blockquote>
<p><a href="https://github.com/eallion/typecho-to-hugo">https://github.com/eallion/typecho-to-hugo</a></p>
</blockquote>
<p><strong>注意：</strong> 这并不是一个 Typecho 插件！</p>
<p>用法：</p>
<ol>
<li>clone 或 下载 <a href="https://github.com/eallion/typecho-to-hugo/archive/master.zip">master.zip</a></li>
<li>修改 convert.php 中的 mysql 账号密码（第 3 行）</li>
</ol>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-php" data-lang="php"><span class="line"><span class="cl"><span class="nv">$db</span><span class="o">-&gt;</span><span class="na">connect</span> <span class="p">(</span><span class="s1">&#39;localhost&#39;</span><span class="p">,</span><span class="s1">&#39;root&#39;</span><span class="p">,</span><span class="s1">&#39;password&#39;</span><span class="p">,</span><span class="s1">&#39;typecho&#39;</span><span class="p">);</span>
</span></span></code></pre></div><ol start="3">
<li>将 convert.php 上传到网站目录下</li>
<li>通过浏览器访问 <code>htttps://www.example.com/convert.php</code> 即可导出 Hugo 所需要的格式了。</li>
<li>所有文章会在网站根目录，批量复制到 Hugo 即可。</li>
</ol>
<p><strong>convert.php 代码如下</strong></p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-php" data-lang="php"><span class="line"><span class="cl"><span class="o">&lt;?</span><span class="nx">php</span>
</span></span><span class="line"><span class="cl"><span class="nv">$db</span><span class="o">=</span> <span class="k">new</span> <span class="nx">mysqli</span><span class="p">();</span>
</span></span><span class="line"><span class="cl"><span class="nv">$db</span><span class="o">-&gt;</span><span class="na">connect</span><span class="p">(</span><span class="s1">&#39;localhost&#39;</span><span class="p">,</span><span class="s1">&#39;root&#39;</span><span class="p">,</span><span class="s1">&#39;password&#39;</span><span class="p">,</span><span class="s1">&#39;typecho&#39;</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="nv">$prefix</span> <span class="o">=</span> <span class="s2">&#34;typecho&#34;</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="nv">$sql</span><span class="o">=&lt;&lt;&lt;</span><span class="nx">TEXT</span>
</span></span><span class="line"><span class="cl"><span class="nx">select</span> <span class="nx">u</span><span class="o">.</span><span class="nx">screenName</span> <span class="nx">author</span><span class="p">,</span><span class="nx">url</span> <span class="nx">authorUrl</span><span class="p">,</span><span class="nx">title</span><span class="p">,</span><span class="nx">text</span><span class="p">,</span><span class="nx">created</span><span class="p">,</span><span class="nx">t2</span><span class="o">.</span><span class="nx">category</span><span class="p">,</span><span class="nx">t1</span><span class="o">.</span><span class="nx">tags</span><span class="p">,</span><span class="nx">slug</span> <span class="nx">from</span> <span class="p">{</span><span class="nv">$prefix</span><span class="p">}</span><span class="nx">_contents</span> <span class="nx">c</span>
</span></span><span class="line"><span class="cl"><span class="nx">left</span> <span class="nx">join</span>
</span></span><span class="line"><span class="cl"> <span class="p">(</span><span class="nx">select</span> <span class="nx">cid</span><span class="p">,</span><span class="nx">CONCAT</span><span class="p">(</span><span class="s1">&#39;&#34;&#39;</span><span class="p">,</span><span class="nx">group_concat</span><span class="p">(</span><span class="nx">m</span><span class="o">.</span><span class="nx">name</span> <span class="nx">SEPARATOR</span> <span class="s1">&#39;&#34;,&#34;&#39;</span><span class="p">),</span><span class="s1">&#39;&#34;&#39;</span><span class="p">)</span> <span class="nx">tags</span> <span class="nx">from</span> <span class="p">{</span><span class="nv">$prefix</span><span class="p">}</span><span class="nx">_metas</span> <span class="nx">m</span><span class="p">,{</span><span class="nv">$prefix</span><span class="p">}</span><span class="nx">_relationships</span> <span class="nx">r</span> <span class="nx">where</span> <span class="nx">m</span><span class="o">.</span><span class="nx">mid</span><span class="o">=</span><span class="nx">r</span><span class="o">.</span><span class="nx">mid</span> <span class="k">and</span> <span class="nx">m</span><span class="o">.</span><span class="nx">type</span><span class="o">=</span><span class="s1">&#39;tag&#39;</span> <span class="nx">group</span> <span class="nx">by</span> <span class="nx">cid</span> <span class="p">)</span> <span class="nx">t1</span>
</span></span><span class="line"><span class="cl"> <span class="nx">on</span> <span class="nx">c</span><span class="o">.</span><span class="nx">cid</span><span class="o">=</span><span class="nx">t1</span><span class="o">.</span><span class="nx">cid</span>
</span></span><span class="line"><span class="cl"> <span class="nx">left</span> <span class="nx">join</span>
</span></span><span class="line"><span class="cl"><span class="p">(</span><span class="nx">select</span> <span class="nx">cid</span><span class="p">,</span><span class="nx">CONCAT</span><span class="p">(</span><span class="s1">&#39;&#34;&#39;</span><span class="p">,</span><span class="nx">GROUP_CONCAT</span><span class="p">(</span><span class="nx">m</span><span class="o">.</span><span class="nx">name</span> <span class="nx">SEPARATOR</span> <span class="s1">&#39;&#34;,&#34;&#39;</span><span class="p">),</span><span class="s1">&#39;&#34;&#39;</span><span class="p">)</span> <span class="nx">category</span> <span class="nx">from</span> <span class="p">{</span><span class="nv">$prefix</span><span class="p">}</span><span class="nx">_metas</span> <span class="nx">m</span><span class="p">,{</span><span class="nv">$prefix</span><span class="p">}</span><span class="nx">_relationships</span> <span class="nx">r</span> <span class="nx">where</span> <span class="nx">m</span><span class="o">.</span><span class="nx">mid</span><span class="o">=</span><span class="nx">r</span><span class="o">.</span><span class="nx">mid</span> <span class="k">and</span> <span class="nx">m</span><span class="o">.</span><span class="nx">type</span><span class="o">=</span><span class="s1">&#39;category&#39;</span> <span class="nx">group</span> <span class="nx">by</span> <span class="nx">cid</span><span class="p">)</span> <span class="nx">t2</span>
</span></span><span class="line"><span class="cl"><span class="nx">on</span> <span class="nx">c</span><span class="o">.</span><span class="nx">cid</span><span class="o">=</span><span class="nx">t2</span><span class="o">.</span><span class="nx">cid</span>
</span></span><span class="line"><span class="cl"><span class="nx">left</span> <span class="nx">join</span> <span class="p">(</span> <span class="nx">select</span> <span class="nx">uid</span><span class="p">,</span> <span class="nx">screenName</span> <span class="p">,</span><span class="nx">url</span> <span class="nx">from</span> <span class="p">{</span><span class="nv">$prefix</span><span class="p">}</span><span class="nx">_users</span><span class="p">)</span>  <span class="k">as</span> <span class="nx">u</span>
</span></span><span class="line"><span class="cl"><span class="nx">on</span> <span class="nx">c</span><span class="o">.</span><span class="nx">authorId</span> <span class="o">=</span> <span class="nx">u</span><span class="o">.</span><span class="nx">uid</span>
</span></span><span class="line"><span class="cl"><span class="nx">TEXT</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="nv">$db</span><span class="o">-&gt;</span><span class="na">query</span><span class="p">(</span><span class="s2">&#34;set character set &#39;utf8&#39;&#34;</span><span class="p">);</span><span class="c1">//读库
</span></span></span><span class="line"><span class="cl"><span class="nv">$res</span><span class="o">=</span><span class="nv">$db</span><span class="o">-&gt;</span><span class="na">query</span><span class="p">(</span><span class="nv">$sql</span><span class="p">);</span>
</span></span><span class="line"><span class="cl"><span class="k">if</span><span class="p">(</span><span class="nv">$res</span><span class="p">){</span>
</span></span><span class="line"><span class="cl">    <span class="k">if</span><span class="p">(</span><span class="nv">$res</span><span class="o">-&gt;</span><span class="na">num_rows</span><span class="o">&gt;</span><span class="mi">0</span><span class="p">){</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl">        <span class="k">while</span><span class="p">(</span><span class="nv">$r</span><span class="o">=</span><span class="nv">$res</span><span class="o">-&gt;</span><span class="na">fetch_object</span><span class="p">())</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">            <span class="nv">$_c</span><span class="o">=</span><span class="nx">date</span><span class="p">(</span><span class="s1">&#39;Y-m-d H:i:s&#39;</span><span class="p">,</span><span class="nv">$r</span><span class="o">-&gt;</span><span class="na">created</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">            <span class="nv">$_t</span><span class="o">=</span><span class="nx">str_replace</span><span class="p">(</span><span class="s1">&#39;&lt;!--markdown--&gt;&#39;</span><span class="p">,</span><span class="s1">&#39;&#39;</span><span class="p">,</span><span class="nv">$r</span><span class="o">-&gt;</span><span class="na">text</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">            <span class="nv">$_a</span> <span class="o">=</span> <span class="nx">str_replace</span><span class="p">(</span><span class="k">array</span><span class="p">(</span><span class="s1">&#39;C#&#39;</span><span class="p">),</span><span class="s1">&#39;CSharp&#39;</span><span class="p">,</span><span class="nv">$r</span><span class="o">-&gt;</span><span class="na">tags</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">            <span class="nv">$_g</span> <span class="o">=</span> <span class="nx">str_replace</span><span class="p">(</span><span class="k">array</span><span class="p">(</span><span class="s1">&#39;C#&#39;</span><span class="p">),</span><span class="s1">&#39;CSharp&#39;</span><span class="p">,</span><span class="nv">$r</span><span class="o">-&gt;</span><span class="na">category</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">            <span class="nv">$_g</span> <span class="o">=</span> <span class="nx">str_replace</span><span class="p">(</span><span class="k">array</span><span class="p">(</span><span class="s1">&#39;,&#39;</span><span class="p">),</span><span class="s1">&#39;-&#39;</span><span class="p">,</span><span class="nv">$_g</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">            <span class="nv">$_author</span> <span class="o">=</span> <span class="nv">$r</span><span class="o">-&gt;</span><span class="na">author</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">            <span class="k">if</span> <span class="p">(</span><span class="nv">$r</span><span class="o">-&gt;</span><span class="na">authorUrl</span> <span class="o">!=</span> <span class="s2">&#34;&#34;</span> <span class="o">&amp;&amp;</span> <span class="nv">$r</span><span class="o">-&gt;</span><span class="na">authorUrl</span> <span class="o">!=</span> <span class="s2">&#34;http://www.typecho.org&#34;</span><span class="p">)</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">                <span class="nv">$_author</span> <span class="o">=</span> <span class="s2">&#34;&lt;a href=</span><span class="se">\&#34;</span><span class="si">{</span><span class="nv">$r</span><span class="o">-&gt;</span><span class="na">authorUrl</span><span class="si">}</span><span class="se">\&#34;</span><span class="s2"> rel=</span><span class="se">\&#34;</span><span class="s2">noopener</span><span class="se">\&#34;</span><span class="s2"> target=</span><span class="se">\&#34;</span><span class="s2">_blank</span><span class="se">\&#34;</span><span class="s2">&gt;</span><span class="si">{</span><span class="nv">$r</span><span class="o">-&gt;</span><span class="na">author</span><span class="si">}</span><span class="s2">&lt;/a&gt;&#34;</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">            <span class="p">}</span>
</span></span><span class="line"><span class="cl">            <span class="nv">$_tmp</span> <span class="o">=</span> <span class="s">&lt;&lt;&lt;</span><span class="dl">TMP</span><span class="s">
</span></span></span><span class="line"><span class="cl"><span class="s">---
</span></span></span><span class="line"><span class="cl"><span class="s">title: &#34;$r-&gt;title&#34;
</span></span></span><span class="line"><span class="cl"><span class="s">categories: [$r-&gt;category]
</span></span></span><span class="line"><span class="cl"><span class="s">tags: [$r-&gt;tags]
</span></span></span><span class="line"><span class="cl"><span class="s">draft: false
</span></span></span><span class="line"><span class="cl"><span class="s">slug: &#34;$r-&gt;slug&#34;
</span></span></span><span class="line"><span class="cl"><span class="s">date: &#34;$_c&#34;
</span></span></span><span class="line"><span class="cl"><span class="s">---
</span></span></span><span class="line"><span class="cl"><span class="s">
</span></span></span><span class="line"><span class="cl"><span class="s">$_t
</span></span></span><span class="line"><span class="cl"><span class="s">
</span></span></span><span class="line"><span class="cl"><span class="dl">TMP</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">            <span class="nv">$file_name</span><span class="o">=</span><span class="nv">$r</span><span class="o">-&gt;</span><span class="na">title</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">           <span class="nx">file_put_contents</span><span class="p">(</span><span class="nx">str_replace</span><span class="p">(</span><span class="k">array</span><span class="p">(</span><span class="s2">&#34; &#34;</span><span class="p">,</span><span class="s2">&#34;?&#34;</span><span class="p">,</span><span class="s2">&#34;</span><span class="se">\\</span><span class="s2">&#34;</span><span class="p">,</span><span class="s2">&#34;/&#34;</span> <span class="p">,</span><span class="s2">&#34;:&#34;</span> <span class="p">,</span><span class="s2">&#34;|&#34;</span><span class="p">,</span> <span class="s2">&#34;*&#34;</span> <span class="p">),</span><span class="s1">&#39;-&#39;</span><span class="p">,</span><span class="nv">$file_name</span><span class="p">)</span><span class="o">.</span><span class="s2">&#34;.md&#34;</span><span class="p">,</span><span class="nv">$_tmp</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">        <span class="p">}</span>
</span></span><span class="line"><span class="cl">    <span class="p">}</span>
</span></span><span class="line"><span class="cl">    <span class="nv">$res</span><span class="o">-&gt;</span><span class="na">free</span><span class="p">();</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="nv">$db</span><span class="o">-&gt;</span><span class="na">close</span><span class="p">();</span>
</span></span></code></pre></div><h3 id="一个有意思的">
<a class="header-anchor" href="#%e4%b8%80%e4%b8%aa%e6%9c%89%e6%84%8f%e6%80%9d%e7%9a%84"></a>
一个有意思的
</h3><p>网站根目录<code>./archetypes/default.md</code>文件里是hugo默认的文章模板<code>Frontmatter</code></p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-markdown" data-lang="markdown"><span class="line"><span class="cl">---
</span></span><span class="line"><span class="cl">title: &#34;{{ replace .File.ContentBaseName &#34;-&#34; &#34; &#34; | title }}&#34;
</span></span><span class="line"><span class="cl">slug: &#34;{{ replace .Name &#34;-&#34; &#34; &#34; | title }}&#34;
</span></span><span class="line"><span class="cl">description: 
</span></span><span class="line"><span class="cl">date: {{ .Date }}
</span></span><span class="line"><span class="cl">image: 
</span></span><span class="line"><span class="cl">math: 
</span></span><span class="line"><span class="cl">license: 
</span></span><span class="line"><span class="cl">hidden: false
</span></span><span class="line"><span class="cl">comments: true
</span></span><span class="line"><span class="cl">---
</span></span></code></pre></div><p><code>---</code>的时候用<code>:</code>号，<code>+++</code>的时候用<code>=</code>号才行。</p>
<h3 id="memos">
<a class="header-anchor" href="#memos"></a>
memos
</h3><h4 id="添加评论">
<a class="header-anchor" href="#%e6%b7%bb%e5%8a%a0%e8%af%84%e8%ae%ba"></a>
添加评论
</h4><p>参考 <a href="https://lms.pub/go.php?url=aHR0cHM6Ly9udW9lYS5jb20vbWVtb3MtdHdpa29vLw==">@归藏 同学的这篇</a></p>
<h3 id="友链朋友圈">
<a class="header-anchor" href="#%e5%8f%8b%e9%93%be%e6%9c%8b%e5%8f%8b%e5%9c%88"></a>
友链朋友圈
</h3><p><a href="https://fcircle-doc.yyyzyyyz.cn/#/backenddeploy">https://fcircle-doc.yyyzyyyz.cn/#/backenddeploy</a></p>
<p><a href="https://lms.pub/doit/memos-and-hexo-circle-of-friends.html">https://lms.pub/doit/memos-and-hexo-circle-of-friends.html</a></p>
<h3 id="最后其他一些可参考的">
<a class="header-anchor" href="#%e6%9c%80%e5%90%8e%e5%85%b6%e4%bb%96%e4%b8%80%e4%ba%9b%e5%8f%af%e5%8f%82%e8%80%83%e7%9a%84"></a>
最后其他一些可参考的：
</h3><ul>
<li><a href="https://lovir.cn/p/build-with-hugo02">https://lovir.cn/p/build-with-hugo02</a></li>
<li><a href="https://lovir.cn/p/changes-in-my-blog">https://lovir.cn/p/changes-in-my-blog</a></li>
</ul>
<p>一些hugo stack主题的博客可以跳转看看</p>
<ul>
<li>
<p><a href="https://lovir.cn">https://lovir.cn</a></p>
</li>
<li>
<p><a href="https://www.shimoko.com/">https://www.shimoko.com/</a></p>
</li>
<li>
<p><a href="https://lbqaq.top/">https://lbqaq.top/</a></p>
</li>
<li>
<p><a href="https://yelleis.top/">https://yelleis.top/</a></p>
</li>
<li>
<p><a href="https://blog.linsnow.cn/">https://blog.linsnow.cn/</a></p>
</li>
<li>
<p><a href="https://irithys.com/hugo-mod-1/">https://irithys.com/hugo-mod-1/</a></p>
</li>
</ul>
</div>
</details>
<h2 id="-年-你好-typecho">
<a class="header-anchor" href="#-%e5%b9%b4-%e4%bd%a0%e5%a5%bd-typecho"></a>
? 年 你好 typecho
</h2><p>wordpress更新的太臃肿了，换typecho博客框架。</p>
<p>采用 typecho 博客框架，joe 主题，typecho 还是挺简洁的。</p>
<details class="details custom-block">
  <summary>修改记录很长点击展开</summary>
  <div class="details-content"><h3 id="21---joe-主题">
<a class="header-anchor" href="#21---joe-%e4%b8%bb%e9%a2%98"></a>
2.1 - joe 主题
</h3><h4 id="211---文章大纲功能">
<a class="header-anchor" href="#211---%e6%96%87%e7%ab%a0%e5%a4%a7%e7%ba%b2%e5%8a%9f%e8%83%bd"></a>
2.1.1 - 文章大纲功能
</h4><h5 id="一joe-主题增加文章大纲功能">
<a class="header-anchor" href="#%e4%b8%80joe-%e4%b8%bb%e9%a2%98%e5%a2%9e%e5%8a%a0%e6%96%87%e7%ab%a0%e5%a4%a7%e7%ba%b2%e5%8a%9f%e8%83%bd"></a>
一、joe 主题增加文章大纲功能
</h5><p><a href="https://github.com/HaoOuBa/Joe/issues/84">https://github.com/HaoOuBa/Joe/issues/84</a></p>
<p>文章目录功能是通过 AutocJs 来实现的，具体可以看：https://github.com/yaohaixiao/AutocJS</p>
<h5 id="二-配置步骤">
<a class="header-anchor" href="#%e4%ba%8c-%e9%85%8d%e7%bd%ae%e6%ad%a5%e9%aa%a4"></a>
二、 配置步骤
</h5><ol>
<li>
<p>首先进入网站后台，点击更换外观，点击全局设置</p>
</li>
<li>
<p>然后在下方找到 自定义增加<code>&lt;head&gt;&lt;/head&gt;</code>里内容（非必填），填入下面代码</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-html" data-lang="html"><span class="line"><span class="cl"><span class="p">&lt;</span><span class="nt">style</span> <span class="na">type</span><span class="o">=</span><span class="s">&#34;text/css&#34;</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">outline-outside-modal-opened</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="k">z-index</span><span class="p">:</span> <span class="mi">10000</span> <span class="cp">!important</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"> <span class="k">left</span><span class="p">:</span> <span class="mi">0</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"> <span class="k">width</span><span class="p">:</span> <span class="mi">300</span><span class="kt">px</span> <span class="cp">!important</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;/</span><span class="nt">style</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;</span><span class="nt">link</span> <span class="na">rel</span><span class="o">=</span><span class="s">&#34;stylesheet&#34;</span> <span class="na">href</span><span class="o">=</span><span class="s">&#34;https://cdn.jsdelivr.net/gh/yaohaixiao/autocjs/dist/css/autoc.min.css&#34;</span><span class="p">&gt;</span>
</span></span></code></pre></div></li>
<li>
<p>最后在自定义<code>&lt;body&gt;&lt;/body&gt;</code>末尾位置内容（非必填） 中填入下面代码</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-html" data-lang="html"><span class="line"><span class="cl"><span class="p">&lt;</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">&#34;https://fastly.jsdelivr.net/gh/zhx47/autocjs/dist/autoc.min.js&#34;</span><span class="p">&gt;&lt;/</span><span class="nt">script</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;</span><span class="nt">script</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"><span class="c1">// 文章导航
</span></span></span><span class="line"><span class="cl"><span class="k">if</span> <span class="p">(</span><span class="nx">$</span><span class="p">(</span><span class="s2">&#34;.joe_detail__article&#34;</span><span class="p">).</span><span class="nx">length</span> <span class="o">&gt;</span> <span class="mi">0</span><span class="p">)</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl">    <span class="kd">var</span> <span class="nx">switcher</span> <span class="o">=</span> <span class="nb">document</span><span class="p">.</span><span class="nx">createElement</span><span class="p">(</span><span class="s1">&#39;div&#39;</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">    <span class="nx">switcher</span><span class="p">.</span><span class="nx">className</span> <span class="o">=</span> <span class="s1">&#39;joe_action_item custom_switcher&#39;</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl">    <span class="kd">var</span> <span class="nx">svg</span> <span class="o">=</span> <span class="nb">document</span><span class="p">.</span><span class="nx">createElementNS</span><span class="p">(</span><span class="s1">&#39;http://www.w3.org/2000/svg&#39;</span><span class="p">,</span> <span class="s1">&#39;svg&#39;</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">    <span class="nx">svg</span><span class="p">.</span><span class="nx">setAttribute</span><span class="p">(</span><span class="s1">&#39;class&#39;</span><span class="p">,</span> <span class="s1">&#39;custom_switcher&#39;</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">    <span class="nx">svg</span><span class="p">.</span><span class="nx">setAttribute</span><span class="p">(</span><span class="s2">&#34;viewBox&#34;</span><span class="p">,</span> <span class="s2">&#34;0 0 1024 1024&#34;</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">    <span class="nx">svg</span><span class="p">.</span><span class="nx">setAttribute</span><span class="p">(</span><span class="s2">&#34;xmlns&#34;</span><span class="p">,</span> <span class="s2">&#34;http://www.w3.org/2000/svg&#34;</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">    <span class="nx">svg</span><span class="p">.</span><span class="nx">setAttribute</span><span class="p">(</span><span class="s2">&#34;width&#34;</span><span class="p">,</span> <span class="s2">&#34;25&#34;</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">    <span class="nx">svg</span><span class="p">.</span><span class="nx">setAttribute</span><span class="p">(</span><span class="s2">&#34;height&#34;</span><span class="p">,</span> <span class="s2">&#34;25&#34;</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl">    <span class="kd">var</span> <span class="nx">path1</span> <span class="o">=</span> <span class="nb">document</span><span class="p">.</span><span class="nx">createElementNS</span><span class="p">(</span><span class="s1">&#39;http://www.w3.org/2000/svg&#39;</span><span class="p">,</span> <span class="s1">&#39;path&#39;</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">    <span class="nx">path1</span><span class="p">.</span><span class="nx">setAttribute</span><span class="p">(</span><span class="s1">&#39;class&#39;</span><span class="p">,</span> <span class="s1">&#39;custom_switcher&#39;</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">    <span class="nx">path1</span><span class="p">.</span><span class="nx">setAttribute</span><span class="p">(</span><span class="s2">&#34;d&#34;</span><span class="p">,</span> <span class="s2">&#34;M64.67 512c2.03-148.27 27.78-271.04 103.07-344.26C240.96 92.45 363.73 66.7 512 64.67c148.27 2.03 271.04 27.78 344.26 103.07C931.55 240.96 957.3 363.73 959.33 512c-2.03 148.27-27.78 271.04-103.07 344.26C783.04 931.55 660.27 957.3 512 959.33c-148.27-2.03-271.04-27.78-344.26-103.07C92.45 783.04 66.7 660.27 64.67 512z&#34;</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">    <span class="kd">var</span> <span class="nx">path2</span> <span class="o">=</span> <span class="nb">document</span><span class="p">.</span><span class="nx">createElementNS</span><span class="p">(</span><span class="s1">&#39;http://www.w3.org/2000/svg&#39;</span><span class="p">,</span> <span class="s1">&#39;path&#39;</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">    <span class="nx">path2</span><span class="p">.</span><span class="nx">setAttribute</span><span class="p">(</span><span class="s1">&#39;class&#39;</span><span class="p">,</span> <span class="s1">&#39;custom_switcher&#39;</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">    <span class="nx">path2</span><span class="p">.</span><span class="nx">setAttribute</span><span class="p">(</span><span class="s2">&#34;d&#34;</span><span class="p">,</span> <span class="s2">&#34;M706.07 405.35H327.44c-18.64 0-33.9-15.25-33.9-33.9 0-18.64 15.25-33.9 33.9-33.9h378.62c18.64 0 33.9 15.25 33.9 33.9 0 18.64-15.25 33.9-33.89 33.9zM706.07 563.37H327.44c-18.64 0-33.9-15.25-33.9-33.9 0-18.64 15.25-33.9 33.9-33.9h378.62c18.64 0 33.9 15.25 33.9 33.9s-15.25 33.9-33.89 33.9zM475.54 721.4h-148.1c-18.64 0-33.9-15.25-33.9-33.9 0-18.64 15.25-33.9 33.9-33.9h148.09c18.64 0 33.9 15.25 33.9 33.9 0.01 18.65-15.25 33.9-33.89 33.9z&#34;</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">    <span class="nx">path2</span><span class="p">.</span><span class="nx">setAttribute</span><span class="p">(</span><span class="s2">&#34;fill&#34;</span><span class="p">,</span> <span class="s2">&#34;#FFFFFF&#34;</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">    <span class="nx">switcher</span><span class="p">.</span><span class="nx">appendChild</span><span class="p">(</span><span class="nx">svg</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">    <span class="nx">svg</span><span class="p">.</span><span class="nx">appendChild</span><span class="p">(</span><span class="nx">path1</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">    <span class="nx">svg</span><span class="p">.</span><span class="nx">appendChild</span><span class="p">(</span><span class="nx">path2</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">    <span class="nb">document</span><span class="p">.</span><span class="nx">getElementsByClassName</span><span class="p">(</span><span class="s1">&#39;joe_action&#39;</span><span class="p">)[</span><span class="mi">0</span><span class="p">].</span><span class="nx">appendChild</span><span class="p">(</span><span class="nx">switcher</span><span class="p">);</span>
</span></span><span class="line"><span class="cl">    <span class="c1">// 创建 Outline 实例
</span></span></span><span class="line"><span class="cl">    <span class="kd">let</span> <span class="nx">navigation</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">AutocJs</span><span class="p">({</span>
</span></span><span class="line"><span class="cl">        <span class="c1">// 文章正文 DOM 节点的 ID 选择器
</span></span></span><span class="line"><span class="cl">        <span class="nx">article</span><span class="o">:</span> <span class="s1">&#39;.joe_detail__article&#39;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl">        <span class="c1">// 要收集的标题选择器
</span></span></span><span class="line"><span class="cl">        <span class="nx">selector</span><span class="o">:</span> <span class="s1">&#39;h1,h2,h3,h4,h5,h6&#39;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl">        <span class="c1">// 侧边栏导航的标题
</span></span></span><span class="line"><span class="cl">        <span class="nx">title</span><span class="o">:</span> <span class="s1">&#39;文章导读&#39;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl">        <span class="c1">// 文章导读导航的位置
</span></span></span><span class="line"><span class="cl">        <span class="c1">// outside - 以侧边栏菜单形式显示（默认值）
</span></span></span><span class="line"><span class="cl">        <span class="c1">// inside - 在文章正文一开始的地方显示
</span></span></span><span class="line"><span class="cl">        <span class="nx">position</span><span class="o">:</span> <span class="s1">&#39;outside&#39;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl">        <span class="c1">// 标题图标链接的 URL 地址
</span></span></span><span class="line"><span class="cl">        <span class="c1">// （默认）没有设置定制，点击链接页面滚动到标题位置
</span></span></span><span class="line"><span class="cl">        <span class="c1">// 设置了链接地址，则不会滚动定位
</span></span></span><span class="line"><span class="cl">        <span class="nx">anchorURL</span><span class="o">:</span> <span class="s1">&#39;&#39;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl">        <span class="c1">// 链接的显示位置
</span></span></span><span class="line"><span class="cl">        <span class="c1">// front - 在标题最前面（默认值）
</span></span></span><span class="line"><span class="cl">        <span class="c1">// back - 在标题后面
</span></span></span><span class="line"><span class="cl">        <span class="nx">anchorAt</span><span class="o">:</span> <span class="s1">&#39;back&#39;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl">        <span class="c1">// 是否生成文章导读导航
</span></span></span><span class="line"><span class="cl">        <span class="nx">isGenerateOutline</span><span class="o">:</span> <span class="kc">true</span><span class="p">,</span>
</span></span><span class="line"><span class="cl">        <span class="c1">// 是否在文章导读导航中显示段落章节编号
</span></span></span><span class="line"><span class="cl">        <span class="nx">isGenerateOutlineChapterCode</span><span class="o">:</span> <span class="kc">false</span><span class="p">,</span>
</span></span><span class="line"><span class="cl">        <span class="c1">// 是否在正文的文章标题中显示段落章节编号
</span></span></span><span class="line"><span class="cl">        <span class="nx">isGenerateHeadingChapterCode</span><span class="o">:</span> <span class="kc">false</span><span class="p">,</span>
</span></span><span class="line"><span class="cl">        <span class="c1">// 是否在正文的文章标题中创建锚点
</span></span></span><span class="line"><span class="cl">        <span class="nx">isGenerateHeadingAnchor</span><span class="o">:</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl">    <span class="p">});</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;/</span><span class="nt">script</span><span class="p">&gt;</span>
</span></span></code></pre></div></li>
</ol>
<h4 id="212---增加侧边栏社交信息">
<a class="header-anchor" href="#212---%e5%a2%9e%e5%8a%a0%e4%be%a7%e8%be%b9%e6%a0%8f%e7%a4%be%e4%ba%a4%e4%bf%a1%e6%81%af"></a>
2.1.2 - 增加侧边栏社交信息
</h4><h5 id="一添加pc端">
<a class="header-anchor" href="#%e4%b8%80%e6%b7%bb%e5%8a%a0pc%e7%ab%af"></a>
一、添加PC端
</h5><p>打开 Joe/public/aside.php 文件，然后在想要增加的位置添加以下代码</p>
<p>位置:24行到50行</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-php" data-lang="php"><span class="line"><span class="cl">    <span class="o">&lt;!--</span> <span class="nx">PC侧栏社交信息</span> <span class="o">--&gt;</span>
</span></span><span class="line"><span class="cl">    <span class="o">&lt;?</span><span class="nx">php</span> <span class="k">if</span> <span class="p">(</span><span class="nv">$this</span><span class="o">-&gt;</span><span class="na">options</span><span class="o">-&gt;</span><span class="na">SocialInfo</span> <span class="o">&amp;&amp;</span> <span class="p">((</span><span class="nv">$this</span><span class="o">-&gt;</span><span class="na">options</span><span class="o">-&gt;</span><span class="na">SocialSwitch</span> <span class="o">===</span> <span class="s1">&#39;on&#39;</span><span class="p">)</span> <span class="o">||</span> <span class="p">(</span><span class="nv">$this</span><span class="o">-&gt;</span><span class="na">options</span><span class="o">-&gt;</span><span class="na">SocialSwitch</span> <span class="o">===</span> <span class="s1">&#39;on2&#39;</span><span class="p">)))</span> <span class="o">:</span> <span class="cp">?&gt;</span><span class="err">
</span></span></span><span class="line"><span class="cl"><span class="err">        &lt;?php
</span></span></span><span class="line"><span class="cl"><span class="err">        $SocialInfo = $this-&gt;options-&gt;SocialInfo;
</span></span></span><span class="line"><span class="cl"><span class="err">        if ($SocialInfo) {
</span></span></span><span class="line"><span class="cl"><span class="err">            $SocialInfo_arr = explode(&#34;\r\n&#34;, $SocialInfo);
</span></span></span><span class="line"><span class="cl"><span class="err">            if (count($SocialInfo_arr) &gt; 0) {
</span></span></span><span class="line"><span class="cl"><span class="err">                for ($i = 0; $i &lt; count($SocialInfo_arr); $i++) {
</span></span></span><span class="line"><span class="cl"><span class="err">                    $SocialTitle = explode(&#34;||&#34;, $SocialInfo_arr[$i])[0];
</span></span></span><span class="line"><span class="cl"><span class="err">                    $SocialIco = explode(&#34;||&#34;, $SocialInfo_arr[$i])[1];
</span></span></span><span class="line"><span class="cl"><span class="err">                    $SocialUrl = explode(&#34;||&#34;, $SocialInfo_arr[$i])[2];
</span></span></span><span class="line"><span class="cl"><span class="err">                    $SocialInfos[] = array(&#34;SocialTitle&#34; =&gt; trim($SocialTitle), &#34;SocialIco&#34; =&gt; trim($SocialIco), &#34;SocialUrl&#34; =&gt; trim($SocialUrl));
</span></span></span><span class="line"><span class="cl"><span class="err">                }
</span></span></span><span class="line"><span class="cl"><span class="err">            }
</span></span></span><span class="line"><span class="cl"><span class="err">        }
</span></span></span><span class="line"><span class="cl"><span class="err">        ?&gt;
</span></span></span><span class="line"><span class="cl"><span class="err">        &lt;section class=&#34;top-social&#34;&gt;
</span></span></span><span class="line"><span class="cl"><span class="err">            &lt;?php foreach ($SocialInfos as $item) : ?&gt;
</span></span></span><span class="line"><span class="cl"><span class="err">                &lt;li class=&#34;&lt;?php echo $item[&#39;SocialTitle&#39;]; ?&gt;&#34;&gt;
</span></span></span><span class="line"><span class="cl"><span class="err">                    &lt;a class=&#34;&lt;?php echo $item[&#39;SocialTitle&#39;]; ?&gt;A&#34; href=&#34;&lt;?php echo $item[&#39;SocialUrl&#39;]; ?&gt;&#34; target=&#34;_blank&#34; title=&#34;&lt;?php echo $item[&#39;SocialTitle&#39;]; ?&gt;&#34;&gt;
</span></span></span><span class="line"><span class="cl"><span class="err">                        &lt;img src=&#34;&lt;?php echo $item[&#39;SocialIco&#39;]; ?&gt;&#34; /&gt;
</span></span></span><span class="line"><span class="cl"><span class="err">                    &lt;/a&gt;
</span></span></span><span class="line"><span class="cl"><span class="err">                &lt;/li&gt;
</span></span></span><span class="line"><span class="cl"><span class="err">            &lt;?php endforeach; ?&gt;
</span></span></span><span class="line"><span class="cl"><span class="err">        &lt;/section&gt;
</span></span></span><span class="line"><span class="cl"><span class="err">    &lt;?php endif; ?&gt;
</span></span></span></code></pre></div><h5 id="二添加pe端">
<a class="header-anchor" href="#%e4%ba%8c%e6%b7%bb%e5%8a%a0pe%e7%ab%af"></a>
二、添加PE端
</h5><p>打开 Joe/public/header.php 文件，然后在想要增加的位置添加上面PC的代码 PE端的代码和上面的一样，只需要将<code>&lt;section class=&quot;top-social&quot;&gt;</code>换成 <code>&lt;section class=&quot;top-social pe-social&quot;&gt;</code></p>
<p>位置:404-429行</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-php" data-lang="php"><span class="line"><span class="cl">	<span class="o">&lt;!--</span> <span class="nx">PC侧栏社交信息</span> <span class="o">--&gt;</span>
</span></span><span class="line"><span class="cl">    <span class="o">&lt;?</span><span class="nx">php</span> <span class="k">if</span> <span class="p">(</span><span class="nv">$this</span><span class="o">-&gt;</span><span class="na">options</span><span class="o">-&gt;</span><span class="na">SocialInfo</span> <span class="o">&amp;&amp;</span> <span class="p">((</span><span class="nv">$this</span><span class="o">-&gt;</span><span class="na">options</span><span class="o">-&gt;</span><span class="na">SocialSwitch</span> <span class="o">===</span> <span class="s1">&#39;on&#39;</span><span class="p">)</span> <span class="o">||</span> <span class="p">(</span><span class="nv">$this</span><span class="o">-&gt;</span><span class="na">options</span><span class="o">-&gt;</span><span class="na">SocialSwitch</span> <span class="o">===</span> <span class="s1">&#39;on2&#39;</span><span class="p">)))</span> <span class="o">:</span> <span class="cp">?&gt;</span><span class="err">
</span></span></span><span class="line"><span class="cl"><span class="err">        &lt;?php
</span></span></span><span class="line"><span class="cl"><span class="err">        $SocialInfo = $this-&gt;options-&gt;SocialInfo;
</span></span></span><span class="line"><span class="cl"><span class="err">        if ($SocialInfo) {
</span></span></span><span class="line"><span class="cl"><span class="err">            $SocialInfo_arr = explode(&#34;\r\n&#34;, $SocialInfo);
</span></span></span><span class="line"><span class="cl"><span class="err">            if (count($SocialInfo_arr) &gt; 0) {
</span></span></span><span class="line"><span class="cl"><span class="err">                for ($i = 0; $i &lt; count($SocialInfo_arr); $i++) {
</span></span></span><span class="line"><span class="cl"><span class="err">                    $SocialTitle = explode(&#34;||&#34;, $SocialInfo_arr[$i])[0];
</span></span></span><span class="line"><span class="cl"><span class="err">                    $SocialIco = explode(&#34;||&#34;, $SocialInfo_arr[$i])[1];
</span></span></span><span class="line"><span class="cl"><span class="err">                    $SocialUrl = explode(&#34;||&#34;, $SocialInfo_arr[$i])[2];
</span></span></span><span class="line"><span class="cl"><span class="err">                    $SocialInfos[] = array(&#34;SocialTitle&#34; =&gt; trim($SocialTitle), &#34;SocialIco&#34; =&gt; trim($SocialIco), &#34;SocialUrl&#34; =&gt; trim($SocialUrl));
</span></span></span><span class="line"><span class="cl"><span class="err">                }
</span></span></span><span class="line"><span class="cl"><span class="err">            }
</span></span></span><span class="line"><span class="cl"><span class="err">        }
</span></span></span><span class="line"><span class="cl"><span class="err">        ?&gt;
</span></span></span><span class="line"><span class="cl"><span class="err">        &lt;section class=&#34;top-social pe-social&#34;&gt;
</span></span></span><span class="line"><span class="cl"><span class="err">            &lt;?php foreach ($SocialInfos as $item) : ?&gt;
</span></span></span><span class="line"><span class="cl"><span class="err">                &lt;li class=&#34;&lt;?php echo $item[&#39;SocialTitle&#39;]; ?&gt;&#34;&gt;
</span></span></span><span class="line"><span class="cl"><span class="err">                    &lt;a class=&#34;&lt;?php echo $item[&#39;SocialTitle&#39;]; ?&gt;A&#34; href=&#34;&lt;?php echo $item[&#39;SocialUrl&#39;]; ?&gt;&#34; target=&#34;_blank&#34; title=&#34;&lt;?php echo $item[&#39;SocialTitle&#39;]; ?&gt;&#34;&gt;
</span></span></span><span class="line"><span class="cl"><span class="err">                        &lt;img src=&#34;&lt;?php echo $item[&#39;SocialIco&#39;]; ?&gt;&#34; /&gt;
</span></span></span><span class="line"><span class="cl"><span class="err">                    &lt;/a&gt;
</span></span></span><span class="line"><span class="cl"><span class="err">                &lt;/li&gt;
</span></span></span><span class="line"><span class="cl"><span class="err">            &lt;?php endforeach; ?&gt;
</span></span></span><span class="line"><span class="cl"><span class="err">        &lt;/section&gt;
</span></span></span><span class="line"><span class="cl"><span class="err">    &lt;?php endif; ?&gt;
</span></span></span></code></pre></div><h5 id="三添加后台">
<a class="header-anchor" href="#%e4%b8%89%e6%b7%bb%e5%8a%a0%e5%90%8e%e5%8f%b0"></a>
三、添加后台
</h5><p>直接在 Joe/functions.php 添加以下代码</p>
<p>位置:53-81行</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-php" data-lang="php"><span class="line"><span class="cl">    <span class="c1">// 侧栏社交信息开关
</span></span></span><span class="line"><span class="cl">    <span class="nv">$SocialSwitch</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Typecho_Widget_Helper_Form_Element_Select</span><span class="p">(</span>
</span></span><span class="line"><span class="cl">    <span class="s1">&#39;SocialSwitch&#39;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl">    <span class="k">array</span><span class="p">(</span>
</span></span><span class="line"><span class="cl">        <span class="s1">&#39;off&#39;</span> <span class="o">=&gt;</span> <span class="s1">&#39;关闭（默认）&#39;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl">        <span class="s1">&#39;on&#39;</span> <span class="o">=&gt;</span> <span class="s1">&#39;开启PC社交信息&#39;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl">        <span class="s1">&#39;on1&#39;</span> <span class="o">=&gt;</span> <span class="s1">&#39;开启PE社交信息&#39;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl">        <span class="s1">&#39;on2&#39;</span> <span class="o">=&gt;</span> <span class="s1">&#39;同时开启PC与PE社交信息&#39;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl">    <span class="p">),</span>
</span></span><span class="line"><span class="cl">    <span class="s1">&#39;off&#39;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl">    <span class="s1">&#39;是否启用侧栏社交信息&#39;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl">    <span class="s1">&#39;介绍：开启后，侧栏展示社交信息功能（必须填写下面的侧栏社交信息）&#39;</span>
</span></span><span class="line"><span class="cl">    <span class="p">);</span>
</span></span><span class="line"><span class="cl">    <span class="nv">$SocialSwitch</span><span class="o">-&gt;</span><span class="na">setAttribute</span><span class="p">(</span><span class="s1">&#39;class&#39;</span><span class="p">,</span> <span class="s1">&#39;joe_content joe_other&#39;</span><span class="p">);</span> <span class="c1">//没有custom.php就把joe_custom改成joe_other
</span></span></span><span class="line"><span class="cl">    <span class="nv">$form</span><span class="o">-&gt;</span><span class="na">addInput</span><span class="p">(</span><span class="nv">$SocialSwitch</span><span class="o">-&gt;</span><span class="na">multiMode</span><span class="p">());</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl">    <span class="c1">//侧栏社交信息
</span></span></span><span class="line"><span class="cl">    <span class="nv">$SocialInfo</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Typecho_Widget_Helper_Form_Element_Textarea</span><span class="p">(</span>
</span></span><span class="line"><span class="cl">    <span class="s1">&#39;SocialInfo&#39;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl">    <span class="k">NULL</span><span class="p">,</span>
</span></span><span class="line"><span class="cl">    <span class="k">NULL</span><span class="p">,</span>
</span></span><span class="line"><span class="cl">    <span class="s1">&#39;侧栏社交信息&#39;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl">    <span class="s1">&#39;介绍：用于设置侧栏社交信息 &lt;br /&gt;
</span></span></span><span class="line"><span class="cl"><span class="s1">         格式:社交简称(微信必须固定格式WeChat) || 社交图标 || 跳转链接(微信则填二维码链接) &lt;br /&gt;
</span></span></span><span class="line"><span class="cl"><span class="s1">         比如: Bilibili || 图标链接 || id(中间使用两个竖杠分隔) &lt;br /&gt;
</span></span></span><span class="line"><span class="cl"><span class="s1">         其他：其他:一行一个，一行代表一个社交信息 &#39;</span>
</span></span><span class="line"><span class="cl">    <span class="p">);</span>
</span></span><span class="line"><span class="cl">    <span class="nv">$SocialInfo</span><span class="o">-&gt;</span><span class="na">setAttribute</span><span class="p">(</span><span class="s1">&#39;class&#39;</span><span class="p">,</span> <span class="s1">&#39;joe_content joe_other&#39;</span><span class="p">);</span> <span class="c1">//没有custom.php就把joe_custom改成joe_other
</span></span></span><span class="line"><span class="cl">    <span class="nv">$form</span><span class="o">-&gt;</span><span class="na">addInput</span><span class="p">(</span><span class="nv">$SocialInfo</span><span class="p">);</span>
</span></span></code></pre></div><h5 id="四添加样式">
<a class="header-anchor" href="#%e5%9b%9b%e6%b7%bb%e5%8a%a0%e6%a0%b7%e5%bc%8f"></a>
四、添加样式
</h5><p>在 Joe/assets/css/joe.global.min.css 里添加以下样式</p>
<p>两种选一个就行</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-css" data-lang="css"><span class="line"><span class="cl"><span class="p">.</span><span class="nc">top-social</span><span class="p">{</span><span class="k">position</span><span class="p">:</span><span class="kc">relative</span><span class="p">;</span><span class="k">padding</span><span class="p">:</span><span class="mi">10</span><span class="kt">px</span> <span class="mi">0</span><span class="p">;</span><span class="k">width</span><span class="p">:</span><span class="mi">250</span><span class="kt">px</span><span class="p">;</span><span class="k">display</span><span class="p">:</span><span class="kc">flex</span><span class="p">;</span><span class="k">flex-wrap</span><span class="p">:</span><span class="kc">wrap</span><span class="p">;</span><span class="k">background</span><span class="p">:</span><span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">background</span><span class="p">);</span><span class="k">justify-content</span><span class="p">:</span><span class="kc">space-around</span><span class="p">;</span><span class="k">margin-bottom</span><span class="p">:</span><span class="mi">15</span><span class="kt">px</span><span class="p">;</span><span class="k">border-radius</span><span class="p">:</span><span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">radius</span><span class="o">-</span><span class="kc">wrap</span><span class="p">);</span><span class="k">box-shadow</span><span class="p">:</span><span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">box</span><span class="o">-</span><span class="n">shadow</span><span class="p">)}.</span><span class="nc">top-social</span> <span class="nt">li</span><span class="p">{</span><span class="k">width</span><span class="p">:</span><span class="mi">50</span><span class="kt">px</span><span class="p">;</span><span class="k">text-align</span><span class="p">:</span><span class="kc">center</span><span class="p">;</span><span class="k">padding</span><span class="p">:</span><span class="mi">5</span><span class="kt">px</span> <span class="mi">0</span><span class="kt">px</span><span class="p">}.</span><span class="nc">top-social</span> <span class="nt">li</span> <span class="nt">img</span><span class="p">{</span><span class="k">height</span><span class="p">:</span><span class="mi">25</span><span class="kt">px</span><span class="p">}.</span><span class="nc">top-social</span> <span class="p">.</span><span class="nc">wechat</span><span class="p">{</span><span class="k">position</span><span class="p">:</span><span class="kc">relative</span><span class="p">}.</span><span class="nc">top-social</span> <span class="p">.</span><span class="nc">wechat</span> <span class="p">.</span><span class="nc">wechatInner</span><span class="p">{</span><span class="k">display</span><span class="p">:</span><span class="kc">none</span><span class="p">;</span><span class="k">position</span><span class="p">:</span><span class="kc">absolute</span><span class="p">;</span><span class="k">box-shadow</span><span class="p">:</span><span class="mi">0</span><span class="kt">px</span> <span class="mi">1</span><span class="kt">px</span> <span class="mi">4</span><span class="kt">px</span> <span class="mi">2</span><span class="kt">px</span> <span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">theme</span><span class="p">);</span><span class="k">border-radius</span><span class="p">:</span><span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">radius</span><span class="o">-</span><span class="kc">wrap</span><span class="p">);</span><span class="k">transition</span><span class="p">:</span><span class="mf">.7</span><span class="kt">s</span> <span class="kc">all</span> <span class="kc">ease</span><span class="p">;</span><span class="k">background</span><span class="p">:</span><span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">background</span><span class="p">);</span><span class="kp">-webkit-</span><span class="k">transition</span><span class="p">:</span><span class="mf">.7</span><span class="kt">s</span> <span class="kc">all</span> <span class="kc">ease</span><span class="p">;</span><span class="k">top</span><span class="p">:</span><span class="mi">-175</span><span class="kt">px</span><span class="p">;</span><span class="k">left</span><span class="p">:</span><span class="mi">-45</span><span class="kt">px</span><span class="p">;</span><span class="k">transform</span><span class="p">:</span><span class="nb">translate3d</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span> <span class="mi">16</span><span class="kt">px</span><span class="p">,</span> <span class="mi">0</span><span class="p">);</span><span class="k">width</span><span class="p">:</span><span class="mi">140</span><span class="kt">px</span><span class="p">;</span><span class="k">height</span><span class="p">:</span><span class="mi">140</span><span class="kt">px</span><span class="p">}.</span><span class="nc">top-social</span> <span class="p">.</span><span class="nc">wechat</span> <span class="p">.</span><span class="nc">wechatInner</span><span class="p">::</span><span class="nd">before</span><span class="p">{</span><span class="k">content</span><span class="p">:</span><span class="s2">&#34;&#34;</span><span class="p">;</span><span class="k">position</span><span class="p">:</span><span class="kc">absolute</span><span class="p">;</span><span class="k">bottom</span><span class="p">:</span><span class="mi">-16</span><span class="kt">px</span><span class="p">;</span><span class="k">left</span><span class="p">:</span><span class="mi">0</span><span class="p">;</span><span class="k">right</span><span class="p">:</span><span class="mi">0</span><span class="p">;</span><span class="k">margin</span><span class="p">:</span><span class="kc">auto</span><span class="p">;</span><span class="k">display</span><span class="p">:</span><span class="kc">inline-block</span><span class="p">;</span><span class="k">width</span><span class="p">:</span><span class="mi">0</span><span class="kt">px</span><span class="p">;</span><span class="k">border</span><span class="p">:</span><span class="mi">18</span><span class="kt">px</span> <span class="kc">solid</span> <span class="kc">transparent</span><span class="p">;</span><span class="k">border-bottom</span><span class="p">:</span><span class="kc">none</span><span class="p">;</span><span class="k">border-top-color</span><span class="p">:</span><span class="mh">#fff</span><span class="p">;</span><span class="k">filter</span><span class="p">:</span><span class="nb">drop-shadow</span><span class="p">(</span><span class="mi">0</span><span class="kt">px</span> <span class="mi">4</span><span class="kt">px</span> <span class="mi">2</span><span class="kt">px</span> <span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">theme</span><span class="p">))}.</span><span class="nc">top-social</span> <span class="p">.</span><span class="nc">wechat</span> <span class="p">.</span><span class="nc">wechatInner</span> <span class="nt">img</span><span class="p">{</span><span class="k">border-radius</span><span class="p">:</span><span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">radius</span><span class="o">-</span><span class="kc">wrap</span><span class="p">);</span><span class="k">width</span><span class="p">:</span><span class="mi">140</span><span class="kt">px</span><span class="p">;</span><span class="k">height</span><span class="p">:</span><span class="kc">auto</span><span class="p">;</span><span class="k">padding</span><span class="p">:</span><span class="mi">0</span><span class="p">;</span><span class="k">background</span><span class="p">:</span><span class="kc">none</span><span class="p">}.</span><span class="nc">top-social</span> <span class="p">.</span><span class="nc">wechat</span><span class="p">:</span><span class="nd">hover</span> <span class="p">.</span><span class="nc">wechatInner</span><span class="p">{</span><span class="k">display</span><span class="p">:</span><span class="kc">block</span><span class="p">}.</span><span class="nc">pe-social</span><span class="p">{</span><span class="k">width</span><span class="p">:</span><span class="mi">100</span><span class="kt">%</span><span class="p">}</span>
</span></span></code></pre></div><p>用的这个目前</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-css" data-lang="css"><span class="line"><span class="cl"><span class="p">.</span><span class="nc">top-social</span><span class="p">{</span><span class="k">position</span><span class="p">:</span><span class="kc">relative</span><span class="p">;</span><span class="k">padding</span><span class="p">:</span><span class="mi">5</span><span class="kt">px</span> <span class="mi">0</span><span class="p">;</span><span class="k">width</span><span class="p">:</span><span class="mi">250</span><span class="kt">px</span><span class="p">;</span><span class="k">display</span><span class="p">:</span><span class="kc">flex</span><span class="p">;</span><span class="k">flex-wrap</span><span class="p">:</span><span class="kc">wrap</span><span class="p">;</span><span class="k">background</span><span class="p">:</span><span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">background</span><span class="p">);</span><span class="k">justify-content</span><span class="p">:</span><span class="kc">space-around</span><span class="p">;</span><span class="k">margin-bottom</span><span class="p">:</span><span class="mi">15</span><span class="kt">px</span><span class="p">;</span><span class="k">border-radius</span><span class="p">:</span><span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">radius</span><span class="o">-</span><span class="kc">wrap</span><span class="p">);</span><span class="k">box-shadow</span><span class="p">:</span><span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">box</span><span class="o">-</span><span class="n">shadow</span><span class="p">);</span><span class="err">li{</span><span class="k">width</span><span class="p">:</span><span class="mi">50</span><span class="kt">px</span><span class="p">;</span><span class="k">text-align</span><span class="p">:</span><span class="kc">center</span><span class="p">;</span><span class="k">padding</span><span class="p">:</span><span class="mi">5</span><span class="kt">px</span> <span class="mi">0</span><span class="p">;</span><span class="k">position</span><span class="p">:</span><span class="kc">relative</span><span class="p">;</span><span class="err">img{</span><span class="k">height</span><span class="p">:</span><span class="mi">32</span><span class="kt">px</span><span class="p">}.</span><span class="nc">WeChatInner</span><span class="p">{</span><span class="k">display</span><span class="p">:</span><span class="kc">none</span><span class="p">;</span><span class="k">position</span><span class="p">:</span><span class="kc">absolute</span><span class="p">;</span><span class="k">box-shadow</span><span class="p">:</span><span class="mi">0</span> <span class="mi">1</span><span class="kt">px</span> <span class="mi">4</span><span class="kt">px</span> <span class="mi">2</span><span class="kt">px</span> <span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">theme</span><span class="p">);</span><span class="k">border-radius</span><span class="p">:</span><span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">radius</span><span class="o">-</span><span class="kc">wrap</span><span class="p">);</span><span class="k">transition</span><span class="p">:</span><span class="mf">.7</span><span class="kt">s</span> <span class="kc">all</span> <span class="kc">ease</span><span class="p">;</span><span class="k">background</span><span class="p">:</span><span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">background</span><span class="p">);</span><span class="kp">-webkit-</span><span class="k">transition</span><span class="p">:</span><span class="mf">.7</span><span class="kt">s</span> <span class="kc">all</span> <span class="kc">ease</span><span class="p">;</span><span class="k">top</span><span class="p">:</span><span class="mi">-175</span><span class="kt">px</span><span class="p">;</span><span class="k">left</span><span class="p">:</span><span class="mi">-50</span><span class="kt">px</span><span class="p">;</span><span class="k">transform</span><span class="p">:</span><span class="nb">translate3d</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span><span class="mi">16</span><span class="kt">px</span><span class="p">,</span><span class="mi">0</span><span class="p">);</span><span class="k">width</span><span class="p">:</span><span class="mi">150</span><span class="kt">px</span><span class="p">;</span><span class="k">height</span><span class="p">:</span><span class="mi">150</span><span class="kt">px</span><span class="p">;</span><span class="k">z-index</span><span class="p">:</span><span class="mi">2</span><span class="p">;</span><span class="err">&amp;::before{</span><span class="k">content</span><span class="p">:</span><span class="s2">&#34;&#34;</span><span class="p">;</span><span class="k">position</span><span class="p">:</span><span class="kc">absolute</span><span class="p">;</span><span class="k">bottom</span><span class="p">:</span><span class="mi">-16</span><span class="kt">px</span><span class="p">;</span><span class="k">left</span><span class="p">:</span><span class="mi">0</span><span class="p">;</span><span class="k">right</span><span class="p">:</span><span class="mi">0</span><span class="p">;</span><span class="k">margin</span><span class="p">:</span><span class="kc">auto</span><span class="p">;</span><span class="k">display</span><span class="p">:</span><span class="kc">inline-block</span><span class="p">;</span><span class="k">width</span><span class="p">:</span><span class="mi">0</span><span class="p">;</span><span class="k">border</span><span class="p">:</span><span class="mi">18</span><span class="kt">px</span> <span class="kc">solid</span> <span class="kc">transparent</span><span class="p">;</span><span class="k">border-bottom</span><span class="p">:</span><span class="mi">0</span><span class="p">;</span><span class="k">border-top-color</span><span class="p">:</span><span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">background</span><span class="p">);</span><span class="k">filter</span><span class="p">:</span><span class="nb">drop-shadow</span><span class="p">(</span><span class="mi">0</span><span class="kt">px</span> <span class="mi">4</span><span class="kt">px</span> <span class="mi">2</span><span class="kt">px</span> <span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="n">theme</span><span class="p">))}</span><span class="nt">img</span><span class="p">{</span><span class="k">border-radius</span><span class="p">:</span><span class="mi">2</span><span class="kt">px</span><span class="p">;</span><span class="k">width</span><span class="p">:</span><span class="mi">140</span><span class="kt">px</span><span class="p">;</span><span class="k">height</span><span class="p">:</span><span class="kc">auto</span><span class="p">;</span><span class="k">margin</span><span class="p">:</span><span class="mi">5</span><span class="kt">px</span><span class="p">;</span><span class="k">background</span><span class="p">:</span><span class="mi">0</span><span class="p">}</span><span class="err">}</span><span class="o">&amp;</span><span class="p">:</span><span class="nd">hover</span> <span class="p">.</span><span class="nc">WeChatInner</span><span class="p">{</span><span class="k">display</span><span class="p">:</span><span class="kc">block</span><span class="p">}</span><span class="err">}}</span><span class="p">.</span><span class="nc">pe-social</span><span class="p">{</span><span class="k">width</span><span class="p">:</span><span class="mi">100</span><span class="kt">%</span><span class="p">}</span>
</span></span></code></pre></div><h5 id="五添加js">
<a class="header-anchor" href="#%e4%ba%94%e6%b7%bb%e5%8a%a0js"></a>
五、添加JS
</h5><p>实际没加这个,也是能用的.</p>
<p>可以直接在 Joe/assets/js/joe.global.min.js 最后添加</p>
<p><del>修改了第45行</del></p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-php" data-lang="php"><span class="line"><span class="cl"><span class="o">&lt;</span><span class="nx">script</span> <span class="nx">src</span><span class="o">=</span><span class="s2">&#34;&lt;?php </span><span class="si">$this-&gt;options</span><span class="s2">-&gt;themeUrl(&#39;assets/js/custom.min.js&#39;); ?&gt;&#34;</span><span class="o">&gt;&lt;/</span><span class="nx">script</span><span class="o">&gt;</span>
</span></span></code></pre></div><h4 id="213---取消版权许可">
<a class="header-anchor" href="#213---%e5%8f%96%e6%b6%88%e7%89%88%e6%9d%83%e8%ae%b8%e5%8f%af"></a>
2.1.3 - 取消版权许可
</h4><p>public/copyright.php文件</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-php" data-lang="php"><span class="line"><span class="cl"><span class="nx">注释掉</span>
</span></span><span class="line"><span class="cl"><span class="o">&lt;!--</span>
</span></span><span class="line"><span class="cl">        <span class="o">&lt;</span><span class="nx">div</span> <span class="nx">class</span><span class="o">=</span><span class="s2">&#34;item&#34;</span><span class="o">&gt;</span>
</span></span><span class="line"><span class="cl">            <span class="o">&lt;</span><span class="nx">svg</span> <span class="nx">class</span><span class="o">=</span><span class="s2">&#34;icon&#34;</span> <span class="nx">width</span><span class="o">=</span><span class="s2">&#34;20&#34;</span> <span class="nx">height</span><span class="o">=</span><span class="s2">&#34;20&#34;</span> <span class="nx">viewBox</span><span class="o">=</span><span class="s2">&#34;0 0 1024 1024&#34;</span><span class="o">&gt;</span>
</span></span><span class="line"><span class="cl">                <span class="o">&lt;</span><span class="nx">path</span> <span class="nx">d</span><span class="o">=</span><span class="s2">&#34;M0 512a512 512 0 1 0 1024 0A512 512 0 1 0 0 512z&#34;</span> <span class="nx">fill</span><span class="o">=</span><span class="s2">&#34;#F3B243&#34;</span> <span class="o">/&gt;</span>
</span></span><span class="line"><span class="cl">                <span class="o">&lt;</span><span class="nx">path</span> <span class="nx">d</span><span class="o">=</span><span class="s2">&#34;M540.672 323.584a90.112 90.112 0 1 0 180.224 0 90.112 90.112 0 1 0-180.224 0zM540.672 688.128a90.112 90.112 0 1 0 180.224 0 90.112 90.112 0 1 0-180.224 0zM229.376 512a90.112 90.112 0 1 0 180.224 0 90.112 90.112 0 1 0-180.224 0z&#34;</span> <span class="nx">fill</span><span class="o">=</span><span class="s2">&#34;#FFF&#34;</span> <span class="o">/&gt;</span>
</span></span><span class="line"><span class="cl">                <span class="o">&lt;</span><span class="nx">path</span> <span class="nx">d</span><span class="o">=</span><span class="s2">&#34;M341.037 480.37l257.344-175.718 27.713 40.592-257.34 175.718z&#34;</span> <span class="nx">fill</span><span class="o">=</span><span class="s2">&#34;#FFF&#34;</span> <span class="o">/&gt;</span>
</span></span><span class="line"><span class="cl">                <span class="o">&lt;</span><span class="nx">path</span> <span class="nx">d</span><span class="o">=</span><span class="s2">&#34;M349.053 488.452L601.907 670.56l-28.725 39.887L320.307 528.34z&#34;</span> <span class="nx">fill</span><span class="o">=</span><span class="s2">&#34;#FFF&#34;</span> <span class="o">/&gt;</span>
</span></span><span class="line"><span class="cl">            <span class="o">&lt;/</span><span class="nx">svg</span><span class="o">&gt;</span>
</span></span><span class="line"><span class="cl">            <span class="o">&lt;</span><span class="nx">span</span><span class="o">&gt;</span><span class="nx">作品采用：</span><span class="o">&lt;/</span><span class="nx">span</span><span class="o">&gt;</span>
</span></span><span class="line"><span class="cl">            <span class="o">&lt;</span><span class="nx">span</span> <span class="nx">class</span><span class="o">=</span><span class="s2">&#34;text&#34;</span><span class="o">&gt;</span>
</span></span><span class="line"><span class="cl">                <span class="nx">《</span>
</span></span><span class="line"><span class="cl">                <span class="o">&lt;</span><span class="nx">a</span> <span class="nx">class</span><span class="o">=</span><span class="s2">&#34;link&#34;</span> <span class="nx">href</span><span class="o">=</span><span class="s2">&#34;//creativecommons.org/licenses/by-nc-sa/4.0/deed.zh&#34;</span> <span class="nx">target</span><span class="o">=</span><span class="s2">&#34;_blank&#34;</span> <span class="nx">rel</span><span class="o">=</span><span class="s2">&#34;noopener noreferrer nofollow&#34;</span><span class="o">&gt;</span><span class="nx">署名</span><span class="o">-</span><span class="nx">非商业性使用</span><span class="o">-</span><span class="nx">相同方式共享</span> <span class="mf">4.0</span> <span class="nx">国际</span> <span class="p">(</span><span class="nx">CC</span> <span class="nx">BY</span><span class="o">-</span><span class="nx">NC</span><span class="o">-</span><span class="nx">SA</span> <span class="mf">4.0</span><span class="p">)</span><span class="o">&lt;/</span><span class="nx">a</span><span class="o">&gt;</span>
</span></span><span class="line"><span class="cl">                <span class="nx">》许可协议授权</span>
</span></span><span class="line"><span class="cl">            <span class="o">&lt;/</span><span class="nx">span</span><span class="o">&gt;</span>
</span></span><span class="line"><span class="cl">        <span class="o">&lt;/</span><span class="nx">div</span><span class="o">&gt;</span>
</span></span><span class="line"><span class="cl"><span class="o">--&gt;</span>
</span></span></code></pre></div><h3 id="22---改用-0a-my-主题">
<a class="header-anchor" href="#22---%e6%94%b9%e7%94%a8-0a-my-%e4%b8%bb%e9%a2%98"></a>
2.2 - 改用 0A-My 主题
</h3><p>这个主题有点卡。</p>
<p>或者可以看下这个主题：https://github.com/happyet/Gplus</p>
</div>
</details>
<h2 id="最开始-你好-wordpress">
<a class="header-anchor" href="#%e6%9c%80%e5%bc%80%e5%a7%8b-%e4%bd%a0%e5%a5%bd-wordpress"></a>
最开始 你好 wordpress
</h2><p>第一个域名：sadahalu。来源于银魂里的神乐的狗的名字（定春），域名太长了。</p>
<p>第二个域名就是这个站。</p>
<h4 id="11---memory-主题">
<a class="header-anchor" href="#11---memory-%e4%b8%bb%e9%a2%98"></a>
1.1 - memory 主题
</h4><p><a href="https://shawnzeng.com/">https://shawnzeng.com/</a> 制作的，开源版：https://github.com/ShawnZeng1996/Memory，不更新了。</p>

        
        <hr><p>本文2024-01-02首发于<a href='https://hechuan.me/'>也被放进河川</a>，最后修改于2025-12-27</p><p>本博客所有文章除特别声明外，均采用 BY-NC-SA 许可协议。转载请注明出处！</p>]]>
      </description>
      
        <category>无他</category>
      
    </item>
    
      
    

    <item>
      <title>欢迎来到互联网</title>
      <link>https://hechuan.me/post/welcome-to-the-internet/</link>
      <pubDate>Sat, 18 Nov 2023 00:00:00 &#43;0800</pubDate>
      <author>hechuan4@outlook.com (也被放进河川)</author>
      <guid>https://hechuan.me/post/welcome-to-the-internet/</guid>
      <description>
        <![CDATA[<h1>欢迎来到互联网</h1><p>作者：也被放进河川（hechuan4@outlook.com）</p>
        
          <p><a href="https://www.bilibili.com/video/BV1tS4y1V7yP">https://www.bilibili.com/video/BV1tS4y1V7yP</a></p>
<h4 id="tagroulette-标签轮盘-v0120">
<a class="header-anchor" href="#tagroulette-%e6%a0%87%e7%ad%be%e8%bd%ae%e7%9b%98-v0120"></a>
tagRoulette 标签轮盘 (v0.12.0+)
</h4>
<h4 id="code-block上显示文件名">
<a class="header-anchor" href="#code-block%e4%b8%8a%e6%98%be%e7%a4%ba%e6%96%87%e4%bb%b6%e5%90%8d"></a>
code block上显示文件名
</h4><div class="highlight" name="example.rs"><pre tabindex="0" class="chroma"><code class="language-rust" data-lang="rust"><span class="line"><span class="cl"><span class="cp">#[derive(Debug)]</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="k">pub</span><span class="w"> </span><span class="k">enum</span> <span class="nc">State</span><span class="w"> </span><span class="p">{</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="n">Start</span><span class="p">,</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="n">Transient</span><span class="p">,</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w">    </span><span class="n">Closed</span><span class="p">,</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="p">}</span><span class="w">
</span></span></span></code></pre></div><h4 id="heatmapcard-文章热力图-v080">
<a class="header-anchor" href="#heatmapcard-%e6%96%87%e7%ab%a0%e7%83%ad%e5%8a%9b%e5%9b%be-v080"></a>
heatMapCard 文章热力图 (v0.8.0+)
</h4>
<h4 id="link-链接卡片-v0140">
<a class="header-anchor" href="#link-%e9%93%be%e6%8e%a5%e5%8d%a1%e7%89%87-v0140"></a>
link 链接卡片 (v0.14.0+)
</h4><p><a href="https://chyon.cn" title="言岚的博客" target="_blank">言岚的博客</a>
<a href="https://www.yuki-sakura.cn/" title="千雪的格纳库" target="_blank">千雪的格纳库</a>
<a href="http://jdjx.run/" title="加东加西" target="_blank">加东加西</a>
<a href="https://87csn.com/" title="爱好者" target="_blank">爱好者</a></p>
<h4 id="gallery-照片墙-v0140">
<a class="header-anchor" href="#gallery-%e7%85%a7%e7%89%87%e5%a2%99-v0140"></a>
gallery 照片墙 (v0.14.0+)
</h4><div class="gallery-wall" id="photoWall-8a23f8a66"></div>
<script>
  (function() {
    const imageUrls = JSON.parse("[\"https://cover.sli.dev\",\"https://api.mioical.moe/img\"]");
    let images = [];
    const wallId = '#photoWall-8a23f8a66';
    let resizeTimer;
    let lastWidth = 0;
    
    function init() {
      createInitialDOM();
      loadImages();
      const wall = _$(wallId);
      if (wall && window.ResizeObserver) {
        const observer = new ResizeObserver((entries) => {
          const newWidth = entries[0].contentRect.width;
          if (Math.abs(newWidth - lastWidth) > 1) {
            clearTimeout(resizeTimer);
            resizeTimer = setTimeout(renderPhotoWall, 250);
          }
        });
        observer.observe(wall);
      } else {
        window.addEventListener('resize', handleResize);
      }
    }
    
    function createInitialDOM() {
      const wall = _$(wallId);
      if (!wall || !imageUrls.length) return;
      
      wall.style.opacity = '0';
      wall.style.pointerEvents = 'none';
      
      imageUrls.forEach((url) => {
        images.push({
          width: 800,
          height: 600,
          aspectRatio: 4/3,
          url: url,
          loaded: false
        });
      });
      
      renderPhotoWall();
    }
    
    function loadImages() {
      const loadPromises = imageUrls.map((url, index) => {
        return new Promise((resolve, reject) => {
          const img = new Image();
          img.onload = () => {
            if (images[index]) {
              images[index].width = img.naturalWidth;
              images[index].height = img.naturalHeight;
              images[index].aspectRatio = img.naturalWidth / img.naturalHeight;
              images[index].loaded = true;
            }
            resolve();
          };
          img.onerror = () => {
            if (images[index]) {
              images[index].loaded = true;
            }
            resolve();
          };
          img.src = url;
        });
      });
      
      Promise.all(loadPromises)
        .then(() => {
          const wall = _$(wallId);
          if (wall) {
            wall.style.opacity = '1';
            wall.style.pointerEvents = 'auto';
            wall.style.transition = 'opacity 0.3s ease';
          }
          renderPhotoWall();
        })
        .catch((error) => console.error("图片加载失败:", error));
    }
    
    function renderPhotoWall() {
      const wall = _$(wallId);
      
      if (!images.length || !wall) return;
      
      const screenWidth = wall.offsetWidth || window.innerWidth - 40;
      lastWidth = screenWidth;
      
      wall.innerHTML = "";
      const rowHeight = 200;
      const gap = 10;
      const maxPerRow = 4;
      
      let row = [];
      let rowWidth = 0;
      const rows = [];
      
      images.forEach((img) => {
        const scaledWidth = rowHeight * img.aspectRatio;
        
        if (rowWidth + scaledWidth <= screenWidth && row.length < maxPerRow) {
          row.push(img);
          rowWidth += scaledWidth + gap;
        } else {
          if (row.length) rows.push(row);
          row = [img];
          rowWidth = scaledWidth + gap;
        }
      });
      
      if (row.length) rows.push(row);
      
      rows.forEach((row) => {
        const rowDiv = document.createElement("div");
        rowDiv.style.cssText = `display: flex; gap: ${gap}px; width: 100%`;
        
        row.forEach((img) => {
          const item = document.createElement("div");
          item.className = "photo-item";
          const flex = row.length === 1 ? '1' : img.aspectRatio;
          item.style.cssText = `flex: ${flex}; height: ${rowHeight}px`;
          
          const imgEl = document.createElement("img");
          imgEl.alt = "Gallery Image";
          imgEl.style.cssText = "width: 100%; height: 100%; object-fit: cover";
          imgEl.className = "lazyload";
          imgEl.dataset.src = img.url;
          imgEl.dataset.sizes = "auto";

          const link = document.createElement("a");
          link.href = img.url;
          link.dataset.pswpWidth = img.width;
          link.dataset.pswpHeight = img.height;
          link.target = "_blank";
          link.className = "article-gallery-item";
          link.style.cssText = "width: 100%; height: 100%";
          link.appendChild(imgEl);
          
          item.appendChild(link);
          rowDiv.appendChild(item);
        });
        
        wall.appendChild(rowDiv);
      });
    }
    
    function handleResize() {
      clearTimeout(resizeTimer);
      resizeTimer = setTimeout(renderPhotoWall, 250);
    }
    
    if (document.readyState === 'loading') {
      document.addEventListener('DOMContentLoaded', init);
    } else {
      init();
    }
  })();
</script><link rel="preload" as="style" href="/css/gallery.min.94cd3998ffbf0abe50a0f8a9251c39f9df60899a02db59add20026d894f2d44f.css" onload="this.onload=null;this.rel='stylesheet'" />
<p>将多张图片以照片墙的形式展示出来，支持自动排列和响应式布局。</p>
<h4 id="grid-网格布局-v0141">
<a class="header-anchor" href="#grid-%e7%bd%91%e6%a0%bc%e5%b8%83%e5%b1%80-v0141"></a>
grid 网格布局 (v0.14.1+)
</h4><div class="reimu-grid grid-container-300-col-3" style="grid-template-columns: repeat(3, 1fr);"><div class="grid-cell">内容1</div><div class="grid-cell">内容2</div><div class="grid-cell">内容3</div></div><link rel="preload" as="style" href="/css/grid.min.153881eef7f7b86103896edc9eda83c6fc333d7d434136cfba87e2e3e21f08ac.css" onload="this.onload=null;this.rel='stylesheet'" />
<h4 id="details-折叠面板-v0141">
<a class="header-anchor" href="#details-%e6%8a%98%e5%8f%a0%e9%9d%a2%e6%9d%bf-v0141"></a>
details 折叠面板 (v0.14.1+)
</h4><details class="details custom-block">
  <summary>?</summary>
  <div class="details-content"><p>内容</p>
</div>
</details>
<p>在文章中创建折叠面板。</p>
<ul>
<li>summary：可选参数，设置折叠面板的标题</li>
</ul>

        
        <hr><p>本文2023-11-18首发于<a href='https://hechuan.me/'>也被放进河川</a>，最后修改于2025-12-22</p><p>本博客所有文章除特别声明外，均采用 BY-NC-SA 许可协议。转载请注明出处！</p>]]>
      </description>
      
        <category>无他</category>
      
    </item>
    
      
    

    <item>
      <title>人是怎么一步步被诈骗的,深入了解刷关注,刷单套路</title>
      <link>https://hechuan.me/post/zhapian-taolu/</link>
      <pubDate>Wed, 17 Jan 2024 00:00:00 &#43;0800</pubDate>
      <author>hechuan4@outlook.com (也被放进河川)</author>
      <guid>https://hechuan.me/post/zhapian-taolu/</guid>
      <description>
        <![CDATA[<h1>人是怎么一步步被诈骗的,深入了解刷关注,刷单套路</h1><p>作者：也被放进河川（hechuan4@outlook.com）</p>
        
          <h2 id="人是怎么一步步被诈骗的深入了解刷关注刷单套路">
<a class="header-anchor" href="#%e4%ba%ba%e6%98%af%e6%80%8e%e4%b9%88%e4%b8%80%e6%ad%a5%e6%ad%a5%e8%a2%ab%e8%af%88%e9%aa%97%e7%9a%84%e6%b7%b1%e5%85%a5%e4%ba%86%e8%a7%a3%e5%88%b7%e5%85%b3%e6%b3%a8%e5%88%b7%e5%8d%95%e5%a5%97%e8%b7%af"></a>
人是怎么一步步被诈骗的,深入了解刷关注,刷单套路
</h2><blockquote>
<p>比较长，耐心看到最后，就明白套路了。</p>
</blockquote>
<h2 id="第一日夜">
<a class="header-anchor" href="#%e7%ac%ac%e4%b8%80%e6%97%a5%e5%a4%9c"></a>
第一日夜
</h2><p>某日夜，QQ收到一个加好友的。来源显示是qq小世界，因为用的qq是谷歌商店版，压根就没有小世界这个功能。</p>
<p>加完他也不说话，当然他不说也不想问他。</p>
<p>深夜大概都睡了的点，被他拉进了一个群组（团队群，没有群号的那种。）</p>
<p><img src="https://img.hechuan.me/file/i/2024/01/zhaopian-taolu-1.jpg" alt="zhaopian-taolu-1"></p>
<h2 id="第二日">
<a class="header-anchor" href="#%e7%ac%ac%e4%ba%8c%e6%97%a5"></a>
第二日
</h2><h3 id="一">
<a class="header-anchor" href="#%e4%b8%80"></a>
一，
</h3><blockquote>
<p>（群已经解散了，这里阐述下大概的聊天记录。）</p>
</blockquote>
<p>qq群内已经拉进来好多人了，不知道什么时候能说话了。</p>
<p>内容大概是：</p>
<p>qq群发了一个链接，让下载一个app，安装完通过他们的app加一个人。加完就给红包。</p>
<p>（此时群里已经有群友在发他们收到的红包的截图了。）</p>
<p><img src="https://img.hechuan.me/file/i/2024/01/zhaopian-taolu-2.png" alt="zhaopian-taolu-2"></p>
<p>通过他们的app加了这个人后，他要你在qq群里发句口令，截图给他，然后问了些有的没的，还让在qq上加一个人。</p>
<p>（这个人一直没加上，所以这一步的意义不明。甚至可能这个qq号都是随便的一个？）</p>
<p>没加上那个人，但这个叫&quot;欣然&quot;的还是给你发了红包。</p>
<h3 id="二">
<a class="header-anchor" href="#%e4%ba%8c"></a>
二，
</h3><p>让通过抖音关注这个五个人，关注完发截图给他。</p>
<p>（这里如果是新人，很容易理解成，抖音买粉之类的。但猜测，估计就是随便找了几个抖音让你关注他们而已。）</p>
<p>很简单，关注完，他果然也发了红包。</p>
<p><img src="https://img.hechuan.me/file/i/2024/01/zhaopian-taolu-3.jpg" alt="zhaopian-taolu-3"></p>
<h3 id="三">
<a class="header-anchor" href="#%e4%b8%89"></a>
三，
</h3><p>进行到下一步。</p>
<p>这个“欣然”的拉你进了一个群，群里只有管理能说话。</p>
<p>到这一步后，这个叫“欣然”的就不发任务了，任务都在群里发。</p>
<p>你只需要把关注的截图发给这个“欣然”，收红包就行。</p>
<p><img src="https://img.hechuan.me/file/i/2024/01/zhaopian-taolu-4.png" alt="zhaopian-taolu-4"></p>
<h3 id="四">
<a class="header-anchor" href="#%e5%9b%9b"></a>
四，
</h3><p>基本每半个小时，群管理会发一个图。去关注那个抖音就行。</p>
<p>关注完，把截图发给那个“欣然”。</p>
<p><img src="https://img.hechuan.me/file/i/2024/01/zhaopian-taolu-5.png" alt="zhaopian-taolu-5"></p>
<h3 id="五">
<a class="header-anchor" href="#%e4%ba%94"></a>
五，
</h3><p>实际上他们压根不管你关注了谁，关注的对还是错。</p>
<p>这个图可以看到，他的任务是关注“朵妃”这个抖音。</p>
<p>但因为手滑发的是“冰冰超人”的抖音关注截图。</p>
<p>他依然发了红包。</p>
<p>可见，这些抖音大概只是他们随便找的。</p>
<p><img src="https://img.hechuan.me/file/i/2024/01/zhaopian-taolu-6.png" alt="zhaopian-taolu-6"></p>
<h3 id="六">
<a class="header-anchor" href="#%e5%85%ad"></a>
六，
</h3><p>大概到了7点，期间都是每半个小时一个任务。</p>
<p>都给发了红包。</p>
<p>然后新的套路开始了。</p>
<p>开始说第二天。</p>
<p><img src="https://img.hechuan.me/file/i/2024/01/zhaopian-taolu-7.png" alt="zhaopian-taolu-7"></p>
<p>他还让订好闹钟，顶个闹钟截图给他，还会给你红包。</p>
<p>（是不是觉得他人还怪好的？）</p>
<p><img src="https://img.hechuan.me/file/i/2024/01/zhaopian-taolu-8.jpg" alt="zhaopian-taolu-8"></p>
<h3 id="七">
<a class="header-anchor" href="#%e4%b8%83"></a>
七，
</h3><p>此刻他又拉你进了两个群。</p>
<p>一个群也是不能说话，另一个群可以说话。</p>
<p><img src="https://img.hechuan.me/file/i/2024/01/zhaopian-taolu-9.jpg" alt="zhaopian-taolu-9"></p>
<h3 id="八">
<a class="header-anchor" href="#%e5%85%ab"></a>
八，
</h3><p>可以说话的那个群里，好多人已经在分享他们赚了多少了。看着很欢乐。</p>
<p>有分享照片的美女，有晒美食风景的。</p>
<p>这一步足以让小部分人放下防备心。</p>
<p>（当然里面估计肯定又拖。）</p>
<p><img src="https://img.hechuan.me/file/i/2024/01/zhaopian-taolu-10.png" alt="zhaopian-taolu-10"></p>
<h3 id="九">
<a class="header-anchor" href="#%e4%b9%9d"></a>
九，
</h3><p>经过这一番，估计已经筛选出一部分了。</p>
<p>估计已经有人放下防备心了。</p>
<p><img src="https://img.hechuan.me/file/i/2024/01/zhaopian-taolu-11.png" alt="zhaopian-taolu-11"></p>
<h2 id="第三日">
<a class="header-anchor" href="#%e7%ac%ac%e4%b8%89%e6%97%a5"></a>
第三日
</h2><p>一开始还是一样。（让人渐渐的放下警惕心）</p>
<p>几单过后。</p>
<p>然后这时候出来助力任务了。不能跳过这单。（开始钓鱼上钩）</p>
<p><img src="https://img.hechuan.me/file/i/2024/01/zhaopian-taolu-12.jpg" alt="img"></p>
<p>可见大部人还是有最后的警惕心的，大部分选的依然是最低的任务。</p>
<p>这第一单助力任务，大概率依然是真的。（还没到最后的钓大鱼的环节）、</p>
<p>然后又是几单正常的。</p>
<p>（助力任务很慢，群里很多人都开始问了。）</p>
<p><img src="https://img.hechuan.me/file/i/2024/01/zhaopian-taolu-13.jpg" alt="img"></p>
<p>经过第一单的助力任务后。</p>
<p>此刻群里很多人的警惕心，就如同铁丝一般，弯折放松，再弯折放松。然后断了。</p>
<p>基本好多人已经开始放下那最后一丝警惕了。</p>
<p>钓大鱼的环节开始</p>
<p><img src="https://img.hechuan.me/file/i/2024/01/zhaopian-taolu-14.jpg" alt="img"></p>
<p>这里他们是动态调整的，可能他们的第一单助力任务后，第二单就直接跑路。</p>
<p>也可能，几单助力后才跑路。他们后台已经是有统计的。</p>
<p>只放了部分截图，更多截图可以看：</p>
<p><a href="https://github.com/hechuan4/CDN/blob/main/cdn/%E6%B7%B1%E5%85%A5%E8%AF%88%E9%AA%97%E7%BE%A4%E7%9C%8B%E7%9C%8B%E5%88%B0%E5%BA%95%E6%98%AF%E4%BB%80%E4%B9%88%E5%A5%97%E8%B7%AF.zip">https://github.com/hechuan4/CDN/blob/main/cdn/%E6%B7%B1%E5%85%A5%E8%AF%88%E9%AA%97%E7%BE%A4%E7%9C%8B%E7%9C%8B%E5%88%B0%E5%BA%95%E6%98%AF%E4%BB%80%E4%B9%88%E5%A5%97%E8%B7%AF.zip</a></p>
<h2 id="几日后">
<a class="header-anchor" href="#%e5%87%a0%e6%97%a5%e5%90%8e"></a>
几日后
</h2><p>软件还能打开，但已经没网了，后台服务器估计已经转移了。</p>
<p>软件换个名字，再拉一批新的人，开始新的一轮。</p>
<p><img src="https://img.hechuan.me/file/i/2024/01/zhaopian-taolu-15.jpg" alt="img"></p>

        
        <hr><p>本文2024-01-17首发于<a href='https://hechuan.me/'>也被放进河川</a>，最后修改于2024-01-17</p><p>本博客所有文章除特别声明外，均采用 BY-NC-SA 许可协议。转载请注明出处！</p>]]>
      </description>
      
        <category>无他</category>
      
    </item>
    
      
    

    <item>
      <title>终于收到谷歌 Adsense 的pin码了</title>
      <link>https://hechuan.me/post/google-adsense/</link>
      <pubDate>Mon, 08 Aug 2022 00:00:00 &#43;0800</pubDate>
      <author>hechuan4@outlook.com (也被放进河川)</author>
      <guid>https://hechuan.me/post/google-adsense/</guid>
      <description>
        <![CDATA[<h1>终于收到谷歌 Adsense 的pin码了</h1><p>作者：也被放进河川（hechuan4@outlook.com）</p>
        
          <h1 id="终于收到谷歌-adsense-的pin码了">
<a class="header-anchor" href="#%e7%bb%88%e4%ba%8e%e6%94%b6%e5%88%b0%e8%b0%b7%e6%ad%8c-adsense-%e7%9a%84pin%e7%a0%81%e4%ba%86"></a>
终于收到谷歌 Adsense 的pin码了
</h1><p>申请邮寄了三次,这次终于到了</p>
<p>记录下过程</p>
<p><img src="https://img.hechuan.me/file/i/2022/08/2720899358.png" alt="img"></p>
<h2 id="条件">
<a class="header-anchor" href="#%e6%9d%a1%e4%bb%b6"></a>
条件
</h2><ul>
<li>Adsense到10美金后就会让你去申请邮寄pin码验证地址</li>
<li>大概三周左右会到,不过那是国外,国内不好说</li>
<li>收不到可以重复申请,一共可以申请三次到四次,(每次的pin码内容是一样的.)看别人说是三次,但我申请完三次后,发现还能再申请一次</li>
</ul>
<p><img src="https://img.hechuan.me/file/i/2022/08/1865026530.png" alt="img"></p>
<ul>
<li>从第一次pin码发出日起,四个月内还没有验证的话会停止广告</li>
<li>停止广告一定时间后,会重置账户.(不用担心,重置后只要验证了pin码账户重新关联一下就行.一开始我还以为会咋样呢.)</li>
</ul>
<p><img src="https://img.hechuan.me/file/i/2022/08/1409308486.png" alt="img"></p>
<h2 id="填写地址相关">
<a class="header-anchor" href="#%e5%a1%ab%e5%86%99%e5%9c%b0%e5%9d%80%e7%9b%b8%e5%85%b3"></a>
填写地址相关
</h2><ul>
<li>省市区,街道多少号,市区的邮编不知道百度查</li>
<li>第一次用的我填的拼音(没收到)</li>
<li>第二次填的汉字(也没收到)</li>
<li>第三次也是填的汉字,不够后面又加了一个备注括号(找不到打电话:1xxxxxxxxxx)(这次收到了)</li>
</ul>
<p><img src="https://img.hechuan.me/file/i/2022/08/875374770.png" alt="img"></p>
<p>第三次本来想找淘宝的香港代收,一问价格太贵了</p>
<p>然后就想着再试一次,后面还备注了电话号</p>
<p>本来停止广告已经五个月了,重置账户了已经.</p>
<p>考虑估计到不了了,结果有天邮政来了个电话,说有国际邮件,问人在不在.</p>
<p>然后过一会一个骑着电车的人带着她孩子就送来了,(不知道是不是邮递员,没穿工作服)电车上我看还放着好多邮件待送.</p>
<p>态度语气都很好,双手奉上.</p>
<h2 id="结">
<a class="header-anchor" href="#%e7%bb%93"></a>
结
</h2><p>这pin码我是没想到这么寒酸,就一张软趴趴的纸.而且如果不是备注了一下电话号码,整张纸一个电话也找不到.怪不得总是丢件.</p>
<p>但我寻思真的跟备注了电话号码有关吗?</p>
<p>还真未必,</p>
<p>因为那段时间高考结束了,分数正好下来了,各大院校应该正值发送录取通知书的时间点.(不光国内的院校,很多跑出去上外国学的一样,所以国际邮寄也会繁忙一段时间)</p>
<p>录取通知书基本邮政送的,基本上没有找不到的人.</p>
<p>所以我寻思或许是因为这个原因?再加上这次有备注电话了.所以就到了?</p>

        
        <hr><p>本文2022-08-08首发于<a href='https://hechuan.me/'>也被放进河川</a>，最后修改于2022-08-08</p><p>本博客所有文章除特别声明外，均采用 BY-NC-SA 许可协议。转载请注明出处！</p>]]>
      </description>
      
        <category>教程</category><category>无他</category>
      
    </item>
    
      
    

    <item>
      <title>还是注销了吧</title>
      <link>https://hechuan.me/post/%E8%BF%98%E6%98%AF%E6%B3%A8%E9%94%80%E4%BA%86%E5%90%A7/</link>
      <pubDate>Wed, 28 Jul 2021 00:00:00 &#43;0800</pubDate>
      <author>hechuan4@outlook.com (也被放进河川)</author>
      <guid>https://hechuan.me/post/%E8%BF%98%E6%98%AF%E6%B3%A8%E9%94%80%E4%BA%86%E5%90%A7/</guid>
      <description>
        <![CDATA[<h1>还是注销了吧</h1><p>作者：也被放进河川（hechuan4@outlook.com）</p>
        
          <p>久违的登录了一下 <img src="https://img.hechuan.me/file/i/2021/07/tumblr1.png" alt="img"> 还是注销吧！ <img src="https://img.hechuan.me/file/i/2021/07/tumblr1.png" alt="img"></p>

        
        <hr><p>本文2021-07-28首发于<a href='https://hechuan.me/'>也被放进河川</a>，最后修改于2021-07-28</p><p>本博客所有文章除特别声明外，均采用 BY-NC-SA 许可协议。转载请注明出处！</p>]]>
      </description>
      
        <category>无他</category>
      
    </item>
    
      
    

    <item>
      <title>大道之行也</title>
      <link>https://hechuan.me/post/weigong/</link>
      <pubDate>Wed, 19 May 2021 00:00:00 &#43;0800</pubDate>
      <author>hechuan4@outlook.com (也被放进河川)</author>
      <guid>https://hechuan.me/post/weigong/</guid>
      <description>
        <![CDATA[<h1>大道之行也</h1><p>作者：也被放进河川（hechuan4@outlook.com）</p>
        
          <p>大道之行也，天下为公。选贤与能，讲信修睦。 故人不独亲其亲，不独子其子，使老有所终，壮有所用，幼有所长，矜、寡、孤、独、废疾者皆有所养，男有分，女有归。 货恶其弃于地也，不必藏于己；力恶其不出于身也，不必为己。 是故谋闭而不兴，盗窃乱贼而不作，故外户而不闭。是谓大同。(矜 同：鳏)</p>
<p>-先秦佚名</p>

        
        <hr><p>本文2021-05-19首发于<a href='https://hechuan.me/'>也被放进河川</a>，最后修改于2021-05-19</p><p>本博客所有文章除特别声明外，均采用 BY-NC-SA 许可协议。转载请注明出处！</p>]]>
      </description>
      
        <category>无他</category>
      
    </item>
    
      
    

    <item>
      <title>庆余年</title>
      <link>https://hechuan.me/post/qingyunian/</link>
      <pubDate>Mon, 29 Oct 2018 00:00:00 &#43;0800</pubDate>
      <author>hechuan4@outlook.com (也被放进河川)</author>
      <guid>https://hechuan.me/post/qingyunian/</guid>
      <description>
        <![CDATA[<h1>庆余年</h1><p>作者：也被放进河川（hechuan4@outlook.com）</p>
        
          <p>积善之家，必有余庆，留余庆，留余庆，忽遇恩人； 幸娘亲，幸娘亲，积得阴功。 劝人生，济困扶穷……而谁可知，人生于世，上承余庆，终究却是要自己做出道路抉择，正是所谓岔枝发：东风携云雨，幼藤吐新芽。 急催如颦鼓，洗尽茸与华。 且待朝阳至，绿遍庭中架。 更盼黄叶时，采得数枚瓜。</p>

        
        <hr><p>本文2018-10-29首发于<a href='https://hechuan.me/'>也被放进河川</a>，最后修改于2018-10-29</p><p>本博客所有文章除特别声明外，均采用 BY-NC-SA 许可协议。转载请注明出处！</p>]]>
      </description>
      
        <category>无他</category>
      
    </item>
    
      
    

    <item>
      <title>《长歌行》</title>
      <link>https://hechuan.me/post/changgexing/</link>
      <pubDate>Mon, 29 Oct 2018 00:00:00 &#43;0800</pubDate>
      <author>hechuan4@outlook.com (也被放进河川)</author>
      <guid>https://hechuan.me/post/changgexing/</guid>
      <description>
        <![CDATA[<h1>《长歌行》</h1><p>作者：也被放进河川（hechuan4@outlook.com）</p>
        
          <p><img src="https://img.hechuan.me/file/i/2018/10/changgexing.jpg" alt="changgexing.jpg">
《长歌行》 踏飞沙茫茫，皓月下驼铃北往 算前路漫漫，旧时簪藏进行囊 沉默守望的胡杨，风掠过它的颈项 长河千山之后，是回不去的故乡 梦里的长安，飞花香满川 朱檐入云林，勾阑金玉錾 这雕梁碧血染，白骨垒阑杆 满目离乱，哪里有真的长安 我拭去红妆，走在风雨路上，天地苍茫引我去何方 残阳下又飞过秋燕一行 天尽头是否有它的心乡 我执剑引戈，撕开山河蛮荒，涤荡后又新添多少悲伤 爱恨凋零后，连回忆都沧桑，偏有执着此生不忘 美玉和芳华，都蹉跎成遗憾 沧溟的鹏鱼，也被放进河川 是谁在悄声叹，轻声的呢喃 回不去还，痴痴盼望眼欲穿 我跌跌撞撞，走在风雨路上，且行且悟看尽家国沧桑 这乱世相濡以沐都成奢望 纵遂愿也不过一梦黄粱 我披上红妆，走在风雨路上，执笔绘锦绣再迎风踏浪 曾许谁的桃花他乡和故乡 辗转天涯愿所见皆安康 我长歌且行，走在风雨路上，风雨将散云后隐隐天光 我纵身雷霆劈开魑魅魍魉 千帆过尽依稀有心乡 不曾遗忘的盛世大唐</p>

        
        <hr><p>本文2018-10-29首发于<a href='https://hechuan.me/'>也被放进河川</a>，最后修改于2018-10-29</p><p>本博客所有文章除特别声明外，均采用 BY-NC-SA 许可协议。转载请注明出处！</p>]]>
      </description>
      
        <category>无他</category>
      
    </item>
    
  </channel>
</rss>
