//  ~\blog\assets\scss\custom.scss

//--------------------------------------------------
//链接三栏
@media (min-width: 1024px) {
  .article-list--compact.links {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr; //三个1fr即为三栏,两个1fr则为双栏,以此类推即可.
    background: none;
    box-shadow: none;
    gap: 1rem;

    article {
      background: var(--card-background);
      border: none;
      box-shadow: var(--shadow-l2);
      margin-bottom: 8px;
      border-radius: var(--card-border-radius);

      &:nth-child(odd) {
        margin-right: 8px;
      }
    }
  }
}

/* 归档页面两栏 */
@media (min-width: 720px) {
  .article-list--compact {
    display: grid;
    grid-template-columns: 1fr 1fr;
    background: none;
    box-shadow: none;
    gap: 1rem;

    article {
      background: var(--card-background);
      border: none;
      box-shadow: var(--shadow-l2);
      margin-bottom: 8px;
      border-radius: 16px;
    }
  }
}

.widget--toc {
    background-color: var(--card-background);
    border-radius: var(--card-border-radius);
    display: flex;
    flex-direction: column;
    color: var(--card-text-color-main);
    overflow: hidden;
    // display:inline-block;
    font-size: 16px;

    #TableOfContents {
        overflow-x: auto;
        ol,
        ul {
            margin: 10; 
            padding: 0;
        }
        ol {
            list-style-type: none;
            counter-reset: item;
            li:before {
                counter-increment: item;
                content: counters(item, ".") ". ";
                font-weight: bold;
                margin-right: 0px;
            }
        }
        & > ul {
            padding: 0 1em;
        }
        li {
            margin: 5px 20px;
            padding: 6px; 
            & > ol,
            & > ul {
                margin-top: 10px;
                padding-left: 6px;
                margin-bottom: -5px;
                & > li:last-child {
                    margin-bottom: 0;
                }
            }
        }
    }
}

docker run -d \
  -e LEAN_ID=huochuan-blog \
  -e LEAN_KEY=huochuan-blog-key \
  -e LEAN_MASTER_KEY=huochuan-blog-master-key \
  -p 8360:8360 \
  lizheming/waline

# docker-compose.yml
version: '3'

services:
  waline:
    container_name: waline
    image: lizheming/waline:latest
    restart: always
    ports:
      - 127.0.0.1:8360:8360
    volumes:
      - ${PWD}/waline/data:/app/data
    environment:
      TZ: 'Asia/Shanghai'
      SQLITE_PATH: '/root/waline/sqlite/app/data'
      JWT_TOKEN: 'huochuan'
      SITE_NAME: 'huochuan'
      SITE_URL: '64.176.35.191:8360'
      SECURE_DOMAINS: '64.176.35.191:8360'
      AUTHOR_EMAIL: 'hechuan4@outlook.com'

docker run -d --name waline -p 8360:8360 \
  -v /root/waline/data:/app/data \
  -e TZ="Asia/Shanghai" \
  -e JWT_TOKEN:'huochuan'\
  -e SQLITE_PATH:'/root/sqlite/app/data' \
  -e AUTHOR_EMAIL="hechuan4@outlook.com" \
  -e SITE_NAME="huochuan" \
  -e SITE_URL="64.176.35.191:8360" \
  -e SECURE_DOMAINS="hechuan.me" \
  --restart always \
  lizheming/waline:latest

docker run --name twikoo -e TWIKOO_THROTTLE=1000 -p 8686:8080 -v ${PWD}/data:/app/data -d imaegoo/twikoo

<script async src="//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js">
script>

<i class="powerby">
<span id="busuanzi_container_site_pv">
    访问量 - <span id="busuanzi_value_site_pv">span>
span> 
<span id="busuanzi_container_site_uv">
    访客数 - <span id="busuanzi_value_site_uv">span>人次
  span>
i>

docker run -d --name memos -p 5230:5230 \
  -v /root/memos:/var/opt/memos \
  neosmemo/memos:latest

// 头像旋转动画
.sidebar header .site-avatar .site-logo {
  transition: transform 1.65s ease-in-out; // 旋转时间
}

.sidebar header .site-avatar .site-logo:hover {
  transform: rotate(360deg); // 旋转角度为360度
}

// 代码块基础样式修改
.highlight {
  max-width: 102% !important;
  background-color: var(--pre-background-color);
  padding: var(--card-padding);
  position: relative;
  border-radius: 12px;
  margin-left: -7px !important;
  margin-right: -12px;
  box-shadow: var(--shadow-l1) !important;

  &:hover {
    .copyCodeButton {
      opacity: 1;
    }
  }
}

// light模式下的代码块样式调整
// 备份颜色#fff9f3,#fff9f3cc
[data-scheme="light"] .article-content .highlight {
  background-color: #F0EFEB;
}

[data-scheme="light"] .chroma {
  color: #ff6f00;
  background-color: #F0EFEB;
}

// 页面基本配色
:root {
  --body-background: #f2f2f2;
  --card-background: #DEDEDE;
  --pre-background-color: #fafafa;
  
  // 行内代码背景色
  --code-background-color: #f8f8f8;
  // 行内代码前景色
  --code-text-color: #e96900;

  // 全局顶部边距
  --main-top-padding: 30px;
  // 卡片间距
  --section-separation: 20px;
}

// 文章内容图片圆角阴影
.article-page .main-article .article-content {
  img {
    // 文章图片大小
	//max-width: 96% !important;
    height: auto !important;
    border-radius: 7px;
  }
}

$db->connect ('localhost','root','password','typecho');

<?php
$db= new mysqli();
$db->connect('localhost','root','password','typecho');

$prefix = "typecho";
$sql=<<<TEXT
select u.screenName author,url authorUrl,title,text,created,t2.category,t1.tags,slug from {$prefix}_contents c
left join
 (select cid,CONCAT('"',group_concat(m.name SEPARATOR '","'),'"') tags from {$prefix}_metas m,{$prefix}_relationships r where m.mid=r.mid and m.type='tag' group by cid ) t1
 on c.cid=t1.cid
 left join
(select cid,CONCAT('"',GROUP_CONCAT(m.name SEPARATOR '","'),'"') category from {$prefix}_metas m,{$prefix}_relationships r where m.mid=r.mid and m.type='category' group by cid) t2
on c.cid=t2.cid
left join ( select uid, screenName ,url from {$prefix}_users)  as u
on c.authorId = u.uid
TEXT;

$db->query("set character set 'utf8'");//读库
$res=$db->query($sql);
if($res){
    if($res->num_rows>0){

        while($r=$res->fetch_object()) {
            $_c=date('Y-m-d H:i:s',$r->created);
            $_t=str_replace('<!--markdown-->','',$r->text);
            $_a = str_replace(array('C#'),'CSharp',$r->tags);
            $_g = str_replace(array('C#'),'CSharp',$r->category);
            $_g = str_replace(array(','),'-',$_g);
            $_author = $r->author;
            if ($r->authorUrl != "" && $r->authorUrl != "http://www.typecho.org") {
                $_author = "<a href=\"{$r->authorUrl}\" rel=\"noopener\" target=\"_blank\">{$r->author}</a>";
            }
            $_tmp = <<<TMP
---
title: "$r->title"
categories: [$r->category]
tags: [$r->tags]
draft: false
slug: "$r->slug"
date: "$_c"
---

$_t

TMP;
            $file_name=$r->title;
           file_put_contents(str_replace(array(" ","?","\\","/" ,":" ,"|", "*" ),'-',$file_name).".md",$_tmp);
        }
    }
    $res->free();
}

$db->close();

---
title: "{{ replace .File.ContentBaseName "-" " " | title }}"
slug: "{{ replace .Name "-" " " | title }}"
description: 
date: {{ .Date }}
image: 
math: 
license: 
hidden: false
comments: true
---

    <!-- PC侧栏社交信息 -->
    <?php if ($this->options->SocialInfo && (($this->options->SocialSwitch === 'on') || ($this->options->SocialSwitch === 'on2'))) : ?>
        <?php
        $SocialInfo = $this->options->SocialInfo;
        if ($SocialInfo) {
            $SocialInfo_arr = explode("\r\n", $SocialInfo);
            if (count($SocialInfo_arr) > 0) {
                for ($i = 0; $i < count($SocialInfo_arr); $i++) {
                    $SocialTitle = explode("||", $SocialInfo_arr[$i])[0];
                    $SocialIco = explode("||", $SocialInfo_arr[$i])[1];
                    $SocialUrl = explode("||", $SocialInfo_arr[$i])[2];
                    $SocialInfos[] = array("SocialTitle" => trim($SocialTitle), "SocialIco" => trim($SocialIco), "SocialUrl" => trim($SocialUrl));
                }
            }
        }
        ?>
        <section class="top-social">
            <?php foreach ($SocialInfos as $item) : ?>
                <li class="<?php echo $item['SocialTitle']; ?>">
                    <a class="<?php echo $item['SocialTitle']; ?>A" href="<?php echo $item['SocialUrl']; ?>" target="_blank" title="<?php echo $item['SocialTitle']; ?>">
                        <img src="<?php echo $item['SocialIco']; ?>" />
                    </a>
                </li>
            <?php endforeach; ?>
        </section>
    <?php endif; ?>

	<!-- PC侧栏社交信息 -->
    <?php if ($this->options->SocialInfo && (($this->options->SocialSwitch === 'on') || ($this->options->SocialSwitch === 'on2'))) : ?>
        <?php
        $SocialInfo = $this->options->SocialInfo;
        if ($SocialInfo) {
            $SocialInfo_arr = explode("\r\n", $SocialInfo);
            if (count($SocialInfo_arr) > 0) {
                for ($i = 0; $i < count($SocialInfo_arr); $i++) {
                    $SocialTitle = explode("||", $SocialInfo_arr[$i])[0];
                    $SocialIco = explode("||", $SocialInfo_arr[$i])[1];
                    $SocialUrl = explode("||", $SocialInfo_arr[$i])[2];
                    $SocialInfos[] = array("SocialTitle" => trim($SocialTitle), "SocialIco" => trim($SocialIco), "SocialUrl" => trim($SocialUrl));
                }
            }
        }
        ?>
        <section class="top-social pe-social">
            <?php foreach ($SocialInfos as $item) : ?>
                <li class="<?php echo $item['SocialTitle']; ?>">
                    <a class="<?php echo $item['SocialTitle']; ?>A" href="<?php echo $item['SocialUrl']; ?>" target="_blank" title="<?php echo $item['SocialTitle']; ?>">
                        <img src="<?php echo $item['SocialIco']; ?>" />
                    </a>
                </li>
            <?php endforeach; ?>
        </section>
    <?php endif; ?>

    // 侧栏社交信息开关
    $SocialSwitch = new Typecho_Widget_Helper_Form_Element_Select(
    'SocialSwitch',
    array(
        'off' => '关闭（默认）',
        'on' => '开启PC社交信息',
        'on1' => '开启PE社交信息',
        'on2' => '同时开启PC与PE社交信息',
    ),
    'off',
    '是否启用侧栏社交信息',
    '介绍：开启后，侧栏展示社交信息功能（必须填写下面的侧栏社交信息）'
    );
    $SocialSwitch->setAttribute('class', 'joe_content joe_other'); //没有custom.php就把joe_custom改成joe_other
    $form->addInput($SocialSwitch->multiMode());

    //侧栏社交信息
    $SocialInfo = new Typecho_Widget_Helper_Form_Element_Textarea(
    'SocialInfo',
    NULL,
    NULL,
    '侧栏社交信息',
    '介绍：用于设置侧栏社交信息 <br />
         格式:社交简称(微信必须固定格式WeChat) || 社交图标 || 跳转链接(微信则填二维码链接) <br />
         比如: Bilibili || 图标链接 || id(中间使用两个竖杠分隔) <br />
         其他：其他:一行一个，一行代表一个社交信息 '
    );
    $SocialInfo->setAttribute('class', 'joe_content joe_other'); //没有custom.php就把joe_custom改成joe_other
    $form->addInput($SocialInfo);

.top-social{position:relative;padding:10px 0;width:250px;display:flex;flex-wrap:wrap;background:var(--background);justify-content:space-around;margin-bottom:15px;border-radius:var(--radius-wrap);box-shadow:var(--box-shadow)}.top-social li{width:50px;text-align:center;padding:5px 0px}.top-social li img{height:25px}.top-social .wechat{position:relative}.top-social .wechat .wechatInner{display:none;position:absolute;box-shadow:0px 1px 4px 2px var(--theme);border-radius:var(--radius-wrap);transition:.7s all ease;background:var(--background);-webkit-transition:.7s all ease;top:-175px;left:-45px;transform:translate3d(0, 16px, 0);width:140px;height:140px}.top-social .wechat .wechatInner::before{content:"";position:absolute;bottom:-16px;left:0;right:0;margin:auto;display:inline-block;width:0px;border:18px solid transparent;border-bottom:none;border-top-color:#fff;filter:drop-shadow(0px 4px 2px var(--theme))}.top-social .wechat .wechatInner img{border-radius:var(--radius-wrap);width:140px;height:auto;padding:0;background:none}.top-social .wechat:hover .wechatInner{display:block}.pe-social{width:100%}

.top-social{position:relative;padding:5px 0;width:250px;display:flex;flex-wrap:wrap;background:var(--background);justify-content:space-around;margin-bottom:15px;border-radius:var(--radius-wrap);box-shadow:var(--box-shadow);li{width:50px;text-align:center;padding:5px 0;position:relative;img{height:32px}.WeChatInner{display:none;position:absolute;box-shadow:0 1px 4px 2px var(--theme);border-radius:var(--radius-wrap);transition:.7s all ease;background:var(--background);-webkit-transition:.7s all ease;top:-175px;left:-50px;transform:translate3d(0,16px,0);width:150px;height:150px;z-index:2;&::before{content:"";position:absolute;bottom:-16px;left:0;right:0;margin:auto;display:inline-block;width:0;border:18px solid transparent;border-bottom:0;border-top-color:var(--background);filter:drop-shadow(0px 4px 2px var(--theme))}img{border-radius:2px;width:140px;height:auto;margin:5px;background:0}}&:hover .WeChatInner{display:block}}}.pe-social{width:100%}

<script src="<?php $this->options->themeUrl('assets/js/custom.min.js'); ?>"></script>

注释掉
<!--
        <div class="item">
            <svg class="icon" width="20" height="20" viewBox="0 0 1024 1024">
                <path d="M0 512a512 512 0 1 0 1024 0A512 512 0 1 0 0 512z" fill="#F3B243" />
                <path d="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" fill="#FFF" />
                <path d="M341.037 480.37l257.344-175.718 27.713 40.592-257.34 175.718z" fill="#FFF" />
                <path d="M349.053 488.452L601.907 670.56l-28.725 39.887L320.307 528.34z" fill="#FFF" />
            </svg>
            <span>作品采用：</span>
            <span class="text">
                《
                <a class="link" href="//creativecommons.org/licenses/by-nc-sa/4.0/deed.zh" target="_blank" rel="noopener noreferrer nofollow">署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0)</a>
                》许可协议授权
            </span>
        </div>
-->