修改后的样子:
大纲预览
插件部分
有需要原作者的直接去下载并配置。我禁用了很多插件项。
下载地址
插件下载地址: https://github.com/obgnail/typora_plugin
插件官网
上面主题基于:https://github.com/liangjingkanji/DrakeTyporaTheme
百度链接:https://pan.baidu.com/s/1ISqF98yck8MuBCJSVEah-Q?pwd=52pj
备用蓝奏下载:https://wwo.lanzn.com/b0kn7cn5g 密码:52pj
GitHub:https://github.com/xyz349925756/typora_backup
如何使用?
打开 typora 安装目录下的 resources 将 window.html plugin 直接复制进去。
(如果不会,在桌面点击 typora 图标 右键 --> 属性 --> 打开文件所在的位置 )
打开style替换文件 放到 resources\style 下覆盖即可。(我升级了font-awesome-4.7.0) window.css 文件注释了标题前面的三个斜杠颜色。
themes 文件是已经修改好的主题,覆盖路径 C:\Users\您的用户名\AppData\Roaming\Typora\themes 。
(如果不喜欢标题样式打开主题文件前面的部分找到 h1..h6 h1 span{ ..} 这样的内容注释掉就可以了。)
字体已经包含在上面下载地址中。
字体部分css
--monospace: "FiraCode Nerd Font Mono","华康手札体W5P", Menlo, "Ubuntu Mono", Consolas, HYZhengYuan; /*代码字体*/
--text-font: "FiraCode Nerd Font Mono","华康手札体W5P"; /*正文字体*/
--title-font: "HYZhengYuan"; /*标题字体*/
--latex-font: "Fira Code Light"; /*LaTeX字体(不含英语)*/
--text-line-height: 1.6; /*正文行间距*/
--code-line-height: 1.6; /*代码块行间距*/
--p-spacing: 0.8rem; /*段间距*/
--text-size: 12px;
主题CSS
/* 自定义 */
span.file-node-title-name-part {
color: #6495ed;
font-size: 12px;
}
span.file-node-title-ext-part {
color: #f21100;
font-size: 12px;
}
/* 多元化引用 */
.md-alert-text-note .md-alert-text-container:after {
content: "笔记";
}
.md-alert-text-tip .md-alert-text-container:after {
content: "提示";
}
.md-alert-text-important .md-alert-text-container:after {
content: "重要";
}
.md-alert-text-warning .md-alert-text-container:after {
content: "警告";
}
.md-alert-text-caution .md-alert-text-container:after {
content: "小心";
}
/* 文件目录 */
.outline-item-open > .outline-item > .outline-expander:before {
color: #2196F3;
content: "\f261";
font-size: 14px;
padding-right: 4px;
}
span.outline-expander::before {
content: "\f260";
color: #F44336;
font-size: 14px;
padding-right: 4px;
}
.outline-expander:hover:before {
content: "\f261";
color: #ffc107;
font-size: 14px;
padding-right: 4px;
}
/* 标题样式 */
#top-titlebar, #top-titlebar * {
background-color: inherit;
/* color: inherit; */
}
span.ty-menu-btn-area-sub.ty-menu-btn-area-sub3 {
color: green;
}
span.ty-menu-btn-area-sub.ty-menu-btn-area-sub2 {
color: #4CAF50;
}
span.ty-menu-btn-area-sub.ty-menu-btn-area-sub1 {
color: #E91E63;
}
/* 文件大纲 */
.active-tab-files #info-panel-tab-file .info-panel-tab-border, .active-tab-outline #info-panel-tab-outline .info-panel-tab-border {
height: 1px;
background-color: transparent;
border-bottom: #e91e63 3px double;
}
/* 引用样式 */
.md-alert.md-alert-note {
border-left-color: #0969da;
background-image: linear-gradient(90deg, #0969da60, transparent);
border-bottom: #0969da20 1px solid;
padding: 4px 0px 0px 20px;
border-radius: 5px 0px 0px 5px;
}
.md-alert.md-alert-important {
border-left-color: #8250df;
background-image: linear-gradient(90deg, #8250df60, transparent);
border-bottom: #8250df20 1px solid;
padding: 4px 0px 0px 20px;
border-radius: 5px 0px 0px 5px;
}
.md-alert.md-alert-warning {
border-left-color: #9a6700;
background-image: linear-gradient(90deg, #9a670060, transparent);
border-bottom: #9a670020 1px solid;
padding: 4px 0px 0px 20px;
border-radius: 5px 0px 0px 5px;
}
.md-alert.md-alert-tip {
border-left-color: #1f883d;
background-image: linear-gradient(90deg, #1f883d60, transparent);
border-bottom: #1f883d20 1px solid;
padding: 4px 0px 0px 20px;
border-radius: 5px 0px 0px 5px;
}
.md-alert.md-alert-caution {
border-left-color: #cf222e;
background-image: linear-gradient(90deg, #cf222e60, transparent);
border-bottom: #cf222e20 1px solid;
padding: 4px 0px 0px 20px;
border-radius: 5px 0px 0px 5px;
}
/* 水平线 */
hr {
height: 1px;
padding: 0;
margin: 16px 0;
background-image: linear-gradient(to left, #42a5f5,white);
border: 0 none;
overflow: hidden;
box-sizing: content-box;
}
blockquote:before {
display: block;
position: absolute;
content: '';
width: 4px;
left: 0;
top: 0;
height: 100%;
background-color: #2196F3;
border-radius: 2px;
}
blockquote {
/* color: #2196F3; */
border-radius: 2px;
padding: 10px 16px;
background-image: linear-gradient(45deg, #03A9F460, transparent);
position: relative;
border-left: none;
border-bottom: #03A9F420 1px solid;
}
/* 标题 */
h1 {
font-size: 2rem;
text-align: center;
padding: 0px;
margin: 0px;
}
h1 span {
border-radius: 0px 5px 0px 0px;
padding: 0px 30px;
border-left: 2px solid darkturquoise;
border-top: 30px solid transparent;
border-right: 100px solid darkorange;
border-bottom: 1px solid darkorange;
margin: 0px 20px;
}
h2 {
border-bottom: solid 1px #f44336;
/* border-right: solid 30px #f44336; */
/* border-radius: 0px 30px 0px 0px; */
padding: 0px;
margin: 0px;
}
h2 span {
background-image: linear-gradient(to right,#42a5f5,#f44336);
border-radius: 0px 5px 0px 0px;
padding: 2px 30px 2px;
color: rgb(255, 255, 255);
border-bottom: 1px orange;
border-top: solid 1px white;
}
h3 span {
background-image: linear-gradient(to right,#ffd800,#39f436);
border-radius: 0px 6px 0px 0px;
padding: 2px 30px 2px;
color: white;
border-top: solid 1px white;
}
h3 {
/* border-right: solid 30px #39f436; */
border-bottom: dotted 1px #39f436;
padding: 0px;
margin: 0px;
/* border-radius: 0px 0px 30px 0px; */
}
h4 span {
background-image: linear-gradient(to right,#f44336,#ff9800);
border-radius: 0px 5px 0px 0px;
padding: 2px 30px 2px;
color: white;
border-top: solid 1px white;
}
h4 {
border-bottom: dotted 1px #ff9800;
padding: 0px;
margin: 0px;
}
h5 span {
background-image: linear-gradient(to right,#ff9800,#673AB7);
border-radius: 0px 4px 0px 0px;
padding: 2px 30px 2px;
color: white;
border-top: solid 1px white;
}
h5 {
border-bottom: solid 1px #673AB7;
border-right: dotted 20px #673AB7;
padding: 0px;
margin: 0px;
}
h6 span {
background-image: linear-gradient(to right,#673AB7,#4CAF50);
border-radius: 0px 4px 0px 0px;
padding: 2px 30px 2px;
color: white;
border-top: solid 1px white;
}
h6 {
border-bottom: solid 1px #4CAF50;
border-right: dotted 18px #4CAF50;
padding: 0px;
margin: 0px;
}
/* 表格 */
table thead {
background-image: linear-gradient(45deg, #428bca, transparent);
text-align: center;
}
table tr:nth-child(1n) {
background-image: linear-gradient(45deg, #428bca60, transparent);
}
table tr:nth-child(2n) {
background-image: linear-gradient(45deg, #ffcc660d, transparent);
}
/* 自定义结束 */
暂无评论内容