HanryYu / typora-blubook-theme

Blubook, a flat typora theme.
Apache License 2.0
513 stars 47 forks source link

fix code in head; upgrade footnote and source mode #33

Closed Higurashi-kagome closed 3 years ago

Higurashi-kagome commented 3 years ago

尝试完善下面几点

源代码模式的字体和字号

字体设置为与预览模式下<pre>标签相同的字体,字号设置为 1.1rem:

#typora-source .CodeMirror-code pre{
  font-family: 'Cascadia Code', Consolas, 'Noto Sans SC', 'Courier New', "微软雅黑", 'Microsoft YaHei', "华文细黑", STXihei;
}

#typora-source .CodeMirror-code{
  font-size: 1.1rem;
}

标题中的短代码

标题中的短代码显示不佳:

Details ![image](https://user-images.githubusercontent.com/51501079/101241359-445f8280-3730-11eb-9a4d-45e831ca91cb.png)

于是添加:

#write *[mdtype="heading"] code{
  font-size: inherit!important;
}

脚注颜色

点击脚注可以跳转到脚注位置,个人认为显示为链接颜色(蓝色)更好:

Details ![image](https://user-images.githubusercontent.com/51501079/101241368-550ff880-3730-11eb-9b52-33b14d6cd7cd.png)

故脚注字体颜色改为与链接的颜色相同:

#write .md-footnote {
  color: rgb(56, 132, 254);/*改为链接颜色*/
  background-color: var(--main-1);
}

大纲中的短代码

当标题中存在短代码时,大纲中的代码部分显示不佳:

Details ![image](https://user-images.githubusercontent.com/51501079/101241377-678a3200-3730-11eb-99b9-90ba4a788b69.png)

于是添加:

#outline-content code{
  margin-left:5px;
  margin-right:5px;
  padding:1px 2px;
  vertical-align:baseline;
  background-color: gray!important;
}