Typora主题修改、VScode主题

VScode主题直接去看下面这个网址就行了

https://vscodethemes.com/

前言

https://theme.typora.io/
https://github.com/topics/typora-theme
在官网和github上均可找到相关的主题,自己下载就行了。比较优美的主题有:Dracula、Mlike、Mo Dark、Mint Dark

截止2022-2-7,本人查阅了Dark主题.css,将其下载打包,并进行了少许修改,合集:https://download.csdn.net/download/wxkhturfun/79602533

修改:基于Mo Dark和Dracula进行了修改,添加了标题下的双下划线、侧边大纲栏的高亮、边距等内容

1.1 标题

/* h1-h6 */
#write h1,
#write h2,
#write h3,
#write h4,
#write h5,
#write h6 {
  margin-top: 0.5em;
  margin-bottom: 0.5em;/*修改下划线到下面文字的距离*/
  line-height: 1em;
  padding-top: 0.3em;
}

#write h1 {
  font-size: 2.5em;
  padding-bottom: 0.5em;
  border-bottom: 3px double var(--text-color5);

}

#write h2 {
  font-size: 2em;
  padding-bottom: 0.5em;
  border-bottom: 3px double var(--text-color5);
}

#write h3 {
  font-size: 1.75em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid var(--text-color5);
}

#write h4 {
  font-size: 1.55em;
}

#write h5 {
  font-size: 1.35em;
}

#write h6 {
  font-size: 1.2em;
}

/* horizontal divider */
hr {
  height: 1px;
  background-color: var(--text-color5);
  border: 0px;
}

1.2 sidebar

/* sidebar outline item hover and active */
.outline-item:hover {
  color: var(--hover-text-color);
}

.outline-label:hover {
  text-decoration: none;
}

.pin-outline .outline-active {
  color: var(--hover-text-color);
}

/* sidebar title hover */
.info-panel-tab:hover {
  color: var(--hover-text-color) !important;
}

1.3 代码块颜色

/* code fences */
.md-fences {
  font-family: "Fira Code", Consolas, "Lucida Console", "Courier", monospace, "Helvetica Neue", Helvetica, Arial, sans-serif;
  background-color: #222526;
  padding-top: 6px;
  padding-bottom: 6px;
  padding-left: 10px;
  padding-right: 10px;
  -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
          box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
  margin-bottom: 2.5rem;
  border: none;
  border-radius: 6px;
}

1.4文件

因为时不时折腾,所以给自己留了个备份:
https://download.csdn.net/download/wxkhturfun/79602533
dracula.css
github-night-high-contrast.css
github-night.css
github.css
gothic.css
han.css
mint-dark.css
mint.css
mlike-light.css
mlike.css
mo-dark.css
mo.css
newsprint.css
night.css
notes-dark.css
onedark.css
pixyll.css
whitey.css
xydark.css
xydarkfocus.css
xylight.css

  • 1
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Greate AUK

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值