[JavaScript知识库]Typora自定义主题css文件修改

?此主题是本人根据主题Drake?做了调整之后的自用主题，以下代码可用来借鉴css主题文件的修改位置，关键修改位置均有注释，修改最终效果如下：

:root {
    --monospace: "Fira Code","JetBrains Mono", HYZhengYuan,  Menlo, "等距更纱黑体 SC","Ubuntu Mono", Consolas; /*code font*/
    --text-font: "汉仪正圆-55W", HYZhengYuan,"正文字体","方正FW筑紫A圆 简";
    --title-font:"汉仪正圆-55W",HYZhengYuan,"方正FW筑紫A圆 简","标题字体","汉仪正圆-55W",HYZhengYuan;
    --title1-font:"华文行楷","汉仪魁肃","方正FW筑紫A圆 简","正文字体", "汉仪正圆-55W", HYZhengYuan;
    --title2-font:"方正FW筑紫A圆 简","汉仪正圆-55W", HYZhengYuan,"正文字体", "汉仪正圆-55W", HYZhengYuan;
    --title3-font:"汉仪正圆-55W", HYZhengYuan,"正文字体", "汉仪正圆-55W", HYZhengYuan;
    --title4-font:"汉仪正圆-55W", HYZhengYuan,"正文字体", "汉仪正圆-55W", HYZhengYuan;
    --title5-font:"汉仪正圆-55W", HYZhengYuan,"正文字体", "汉仪正圆-55W", HYZhengYuan;
    --title6-font:"汉仪正圆-55W", HYZhengYuan,"正文字体", "汉仪正圆-55W", HYZhengYuan;




    --font-title: var(--font-song);
    --font-title-h1: 100 3.5rem/4.5rem var(--title1-font);
    --font-title-h2: 580 2.5rem/3.5rem var(--title2-font);
    --font-title-h3: 520 1.8rem/2.8rem var(--title3-font);
    --font-title-h4: 520 1.6rem/2.6rem var(--title4-font);
    --font-title-h5: 520 1.4rem/2.4rem var(--title5-font);
    --font-title-h6: 520 1.2rem/2.2rem var(--title6-font);

    /* font setting:font-weight;font-size;line-height;font-family 
    --font-hei: "Poppins", -apple-system, "Helvetica Neue", Helvetica, "Noto Sans", "Nimbus Sans L", Arial, "Liberation Sans", "Noto Sans CJK SC", "PingFang SC", "Hiragino Sans GB", "Source Han Sans SC", "Source Han Sans CN", "Microsoft YaHei", "Wenquanyi Micro Hei", "WenQuanYi Zen Hei", "ST Heiti", SimHei, "WenQuanYi Zen Hei Sharp", sans-serif;
    --font-song: "EB Garamond", Georgia, "Nimbus Roman No9 L", "Noto Serif CJK SC", "Songti SC", "Source Han Serif SC", "Source Han Serif CN", STSong, "AR PL New Sung", "AR PL SungtiL GB", NSimSun, SimSun, "TW\-Sung", "WenQuanYi Bitmap Song", "AR PL UMing CN", "AR PL UMing HK", "AR PL UMing TW", "AR PL UMing TW MBE", PMingLiU, MingLiU, serif;
    --font-kai: "EB Garamond", Bas kerville, Georgia, "Liberation Serif", STKaiti, "AR PL UKai CN", "AR PL UKai HK", "AR PL UKai TW", "AR PL UKai TW MBE", "AR PL KaitiM GB", KaiTi, KaiTi_GB2312, DFKai-SB, "TW\-Kai", serif;
    --font-mono: "Cascadia Code", "Sarasa Term SC", Monaco, "Deja Vu Sans Mono", Consolas, "Lucida Console", "Andale Mono", Courier, "PingFang SC", "Noto Sans CJK SC";
    --monospace: var(--font-mono);

    --font-weight: 400;
    --font-size: 1rem;
    --line-height: 2rem;
    --font-family: var(--font-hei);

    --text-font: 400 1rem/1.5rem var(--font-hei);
    --text-font-size: 1rem;
   */


    /* margin setting:top;right;bottom;left */
    --margin-h1: 4rem auto 3rem;
    --margin-h2: 3rem auto 2rem;
    --margin-h3: 2rem auto 1rem;
    --margin-h4: 1rem auto 0.5rem;
    --margin-h5: 1rem auto 0.5rem;
    --margin-h6: 1rem auto 0.5rem;


    --text-color: #030303;/*字体颜色*/
    --bg-color: #ffffff;
    --bg-color-table: #ffffff;
    --control-text-color: var(--text-color);
    --meta-content-color: var(--text-color);
    --active-file-border-color: var(--drake-accent);
    --rawblock-edit-panel-bd: var(--code-block-bg-color);
    --item-hover-bg-color: #E5E5E596;
    --active-file-bg-color: var(--item-hover-bg-color);



    --drake-accent: #e95f59;
    --drake-highlight: #d63200;/*红色*/
    --a-color:#45b787;/*网址颜色#3399ff   #2eb59a   #08E7E7 #7f7fff*/
    --variable-color: var(--drake-highlight);
    --outline-active-color: var(--a-color);
    --code-block-bg-color: #2b2b2b;
    --code-block-color: #A9B7C6;
    --title-color:  #1177b0;/*标题颜色#255296  #1556B8 #1661ab #5698c3  #2486b9  #1177b0*/
    --strong-color: #f03f24;/*加粗颜色  #EE2C2C   #f15642*   #f15642 #f43e06  #f03f24*/

    --color-title-h1: #030303;
    --color-title-h2: #030303;
    --color-title-h3: var(--title-color);
    --color-title-h4: var(--title-color);
    --color-title-h5: var(--title-color);
    --color-title-h6: var(--title-color);


    --blockquote-border-color: #b2aec5;
    --blockquote-color: #595959;
    --blockquote-bg-color: #fff9f9;

    --h2-underline-color: var(--title-color);
    --horizontal-divider-color: var(--title-color);
    --height-light-color: var(--drake-highlight);
    --height-light-border-color: var(--drake-highlight);
    --yaml-color: #777777;
    --yaml-bg-color: #f7f7f7;
    --footnotes-bg-color: #3c3d3e;
    --footnotes-highlight: #FFD760;
    --table-border-color: #dfe2e5;
    --table-header-bg-color: #f6f8fa;
    --table-bg-color: var(--bg-color-table);
    --table-n2-bg-color: #f6f8fa;
    --input-bg-color: var(--item-hover-bg-color);
    --btn-hover-bg-color: var(--item-hover-bg-color);
    --checkbox-checked: url("data:image/svg+xml,%3Csvg class='icon' viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cpath d='M425.984 726.016l384-384-59.99-61.995-324.01 324.011-152.021-152.021L213.973 512zm384-598.016q36.01 0 61.013 25.984T896 213.974v596.01q0 34.005-25.003 59.99t-61.013 25.983h-596.01q-36.011 0-61.014-25.984t-25.003-59.989v-596.01q0-34.006 25.003-59.99T213.973 128h596.011z' fill='%2365b73b'/%3E%3C/svg%3E");
    --checkbox-unchecked: url("data:image/svg+xml,%3Csvg class='icon' viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cpath d='M810.667 213.333v597.334H213.333V213.333h597.334m0-85.333H213.333C166.4 128 128 166.4 128 213.333v597.334C128 857.6 166.4 896 213.333 896h597.334C857.6 896 896 857.6 896 810.667V213.333C896 166.4 857.6 128 810.667 128z' fill='%23333333'/%3E%3C/svg%3E");

/*一号标题上下横线*/
--dashed-border: 1.2px dashed #4d97ff;
--dashed-border-opt: 1.2px dashed #B23AEE;

}

html {
    font-size: 18px;/*标题大小*/
}

body {
    font-family: var(--text-font) !important;
    color: var(--text-color);/*    color: #333;*/
    -webkit-font-feature-settings: "liga" on, "calt" on;
    -webkit-font-smoothing: subpixel-antialiased;
    text-rendering: optimizeLegibility;
    letter-spacing: 0;
    margin: 0;
    overflow-x: hidden;

    font-size: 17px;/*正文字体大小*/
    font-weight: 100;
   /* font-size: 1rem;*/
    line-height: 2rem;
    background: #FFFFFF;

}

/*此处rgba表示背景方格颜色，3%表示宽度*/
#write {
    background-image: linear-gradient(
            90deg
            ,rgba(60,10,30,.04) 5%,transparent 0),linear-gradient(
            1turn
            ,rgba(60,10,30,.04) 5%,transparent 0);
    background-size: 20px 20px;/*网格大小*/
    background-position: 50%;
}


#write a {
    border-bottom: var(--dashed-border-opt);
}




/*code block*/
#write .md-fences {
    font-size: 0.9rem;
    font-weight: 500;
    padding: 1rem !important;/*填充边距*/
    border-radius: 2px;
    word-wrap: normal;
    background-color: var(--code-block-bg-color);
    color: var(--code-block-color);
    border: none;
    line-height: 1.6rem;/*行距*/
}

/*code snippet*/
#write code, tt {
    margin: 0 2px;
    border-radius: 2px;
    color: var(--drake-highlight);
    background-color: #fff5f5;
    padding: .065em .4em;
}

/*variable*/
var {
    color: var(--variable-color);
    font-weight: bold;
}

/*raw block*/
.md-rawblock-control:not(.md-rawblock-tooltip) {
    border-radius: 2px 0 2px 2px;
    padding: 0.2rem !important;
}
.md-rawblock:hover > .md-rawblock-container {
    background: none;
}
.md-rawblock-input {
    font-size: 1rem;
}
.md-rawblock-tooltip-btn:hover {
    background: none;
}
.md-rawblock:hover > .md-rawblock-tooltip {
    border-radius: 2px 2px 0 0;
    margin-bottom: 2px !important;
}
.md-rawblock-tooltip.md-rawblock-control {
    border-radius: 2px 2px 0 0;
    color: var(--code-block-color);
}
.md-rawblock-tooltip-name {
    color: var(--code-block-color);
    opacity: 1;
}

/*quote block*/
blockquote:before {
    display: block;
    position: absolute;
    content: '';
    width: 4px;
    left: 0;
    top: 0;
    height: 100%;
    background-color: var(--blockquote-border-color);
    border-radius: 2px;
}

blockquote {
    color: var(--blockquote-color);
    border-radius: 2px;
    padding: 10px 16px;
    background-color: var(--blockquote-bg-color);
    position: relative;
    border-left: none;
}

/*加粗字体*/
#write strong {
    color: var(--strong-color);
    font-weight: 900;
    font-size: 18px;
}
#write blockquote strong {
    color: var(--blockquote-color);
}

/*link*/
#write a {
    color: var(--a-color);
    text-decoration: none;
}
#write a .md-plain, .md-htmlblock-container a:hover {
    border-bottom: .1rem solid var(--a-color);
}
[md-inline=link] a {
    margin: 0 .2rem;
}
a:any-link {
    color: var(--a-color);
}

img {
    border-left: none;
    border-right: none;
    vertical-align: baseline;
    border-radius: 2px;
}

#write {
    max-width: 900px;
    margin: 200px auto;
    padding: 20px 30px 100px;
}
#typora-source .CodeMirror-lines {
    max-width: 1200px;
}

#write p {
    word-spacing: .05rem;
}

#write > ul:first-child,
#write > ol:first-child {
    margin-top: 30px;
}

body > *:first-child {
    margin-top: 0 !important;
}

body > *:last-child {
    margin-bottom: 0 !important;
}

/* title setting */
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--title-font);
    position: relative;
    margin-top: 2rem;
    margin-bottom: 1rem;
    font-weight: bold;
    line-height: 1.225;
    font-size: 1.5em;
    /*border-left: 4px solid #0000C6;/*标题前边加个东西*/

    cursor: text;
    color: var(--title-color);
}

h3.md-focus:before, h4.md-focus:before, h5.md-focus:before, h6.md-focus:before {
    visibility: hidden;
}

#write h1,
#write h2 {
    text-align: center;
    text-transform: uppercase;
}


/*
h1 {
    font-family: var(--title-font);
    font-size: 3rem;
    text-align: center;
    margin-top: 0;
}

h2.md-end-block.md-heading {
    font-size: 2.5rem;
    text-align: center;
    display: inline-block;
}
/*设置横线
h2.md-end-block.md-heading:after {
    display: block;
    content: '';
    height: 2px;
    margin-top: 4px;
    background-color: var(--h2-underline-color);
    border-radius: 2px;
}

h3 {
    font-size: 2.0rem;
}

h4 {
    font-size: 1.7rem;
}

h5 {
    font-size: 1.6rem;
}
*/



#write h1 {
    color: var(--color-title-h1);
    font: var(--font-title-h1);
    margin: var(--margin-h1);
}

#write h2 {
    color: var(--color-title-h2);
    font: var(--font-title-h2);
    margin: var(--margin-h2);
}

#write h3 {
    color: var(--color-title-h3);
    font: var(--font-title-h3);
    margin: var(--margin-h3);
}

#write h4 {
    color: var(--color-title-h4);
    font: var(--font-title-h4);
    margin: var(--margin-h4);
}

#write h5 {
    color: var(--color-title-h5);
    font: var(--font-title-h5);
    margin: var(--margin-h5);
}

#write h6 {
    color: var(--color-title-h6);
    font: var(--font-title-h6);
    margin: var(--margin-h6);
}

/*标题一加入横线*/
#write h1:before,
#write h1:after {
    content: "";
    display: block;
    position: relative;
    width: 50%;
    margin: .5rem auto;
}

/*加入字母*/
#write h1::before {
    top: -1.5rem;
    border-top: var(--dashed-border);
}

#write h1::after {
    top: 1.5rem;
    border-top: var(--dashed-border-opt);
}

#write h3::before {
    content: "H3";
}

#write h4::before {
    content: "H4";
}

#write h5::before {
    content: "H5";
}

#write h6::before {
    content: "H6";
}

#write h3::before,
#write h4::before,
#write h5::before,
#write h6::before {
    font-size: 1.2rem !important;
    vertical-align: bottom;
    margin-right: .5rem;
    padding: 2px;
    border-radius: 5px;
    background: var(--color-text);
    color: var(--bg-write);
}




h1:hover a.anchor,
h2:hover a.anchor,
h3:hover a.anchor,
h4:hover a.anchor,
h5:hover a.anchor,
h6:hover a.anchor {
    text-decoration: none;
}

h1 tt,
h1 code {
    font-size: inherit !important;
}

h2 tt,
h2 code {
    font-size: inherit !important;
}

h3 tt,
h3 code {
    font-size: inherit !important;
}

h4 tt,
h4 code {
    font-size: inherit !important;
}

h5 tt,
h5 code {
    font-size: inherit !important;
}

h6 tt,
h6 code {
    font-size: inherit !important;
}

blockquote,
ul,
ol,
dl,
table {
    margin: 0.8em 0;
}
p {
    margin: 0;
}

li > ol,
li > ul {
    margin: 0 0;
}

hr {
    height: 2px;
    padding: 0;
    margin: 16px 0;
    background-color: var(--horizontal-divider-color);
    border: 0 none;
    overflow: hidden;
    box-sizing: content-box;
}

body > h2:first-child {
    margin-top: 0;
    padding-top: 0;
}

body > h1:first-child {
    margin-top: 0;
    padding-top: 0;
}

body > h1:first-child + h2 {
    margin-top: 0;
    padding-top: 0;
}

body > h3:first-child,
body > h4:first-child,
body > h5:first-child,
body > h6:first-child {
    margin-top: 0;
    padding-top: 0;
}

a:first-child h1,
a:first-child h2,
a:first-child h3,
a:first-child h4,
a:first-child h5,
a:first-child h6 {
    margin-top: 0;
    padding-top: 0;
}

h1 p,
h2 p,
h3 p,
h4 p,
h5 p,
h6 p {
    margin-top: 0;
}

li p.first {
    display: inline-block;
}

ul, ol {
    padding-inline-start: 2em;
}

ul:first-child,
ol:first-child {
    margin-top: 0;
}

ul:last-child,
ol:last-child {
    margin-bottom: 0;
}

table {
    padding: 0;
    word-break: initial;
    background-color: var(--table-bg-color);
}
table tr {
    border-top: .1em solid var(--table-border-color);
    margin: 0;
    padding: 0;
}
table th {
    font-weight: bold;
    border: .1em solid var(--table-border-color);
    border-bottom: 0;
    margin: 0;
    padding: 6px 13px;
}
table td {
    border: .1em solid var(--table-border-color);
    margin: 0;
    padding: 6px 13px;
}
table thead {
    background-color: var(--table-header-bg-color);
}
table tr:nth-child(2n) {
    background-color: var(--table-n2-bg-color);
}
table tr th:first-child,
table tr td:first-child {
    margin-top: 0;
}
table tr th:last-child,
table tr td:last-child {
    margin-bottom: 0;
}

#write em {
    padding: 0 5px 0 2px;
}

/* height light */
#write mark {
    border: .1em solid var(--height-light-border-color);
    color: var(--height-light-color);
    background-color: transparent;
    padding: .1rem .5rem;
    border-radius: 2rem;
    margin: 0 .2rem;
    font-size: .95rem;
}

/*shortcut*/
kbd {
    border: .1em solid #5b5b5e;
    background: transparent;
    color: var(--text-color);
    margin: 0 .4rem;
    font-size: .95rem;
    padding: .3em .4em;
    border-radius: .4em;
    vertical-align: top;
    box-shadow: .1em .1em .2em rgba(0, 0, 0, 0.3);
}

#write del {
    padding: 1px 2px;
}

.md-task-list-item > input {
    margin-left: -1.3em;
}

@media print {
    html {
        font-size: 12px;
    }

    table,
    pre {
        page-break-inside: avoid;
    }

    pre {
        word-wrap: break-word;
    }
}

/*YAML*/
#write pre.md-meta-block {
    padding: 1rem;
    font-size: 1rem;
    background-color: var(--yaml-bg-color);
    border: 0;
    border-radius: 2px;
    color: var(--yaml-color);
    margin-top: 0 !important;
}

.mathjax-block > .code-tooltip {
    bottom: .375rem;
}

#write > h3.md-focus:before {
    left: -1.5625rem;
    top: .375rem;
}

#write > h4.md-focus:before {
    left: -1.5625rem;
    top: .285714286rem;
}

#write > h5.md-focus:before {
    left: -1.5625rem;
    top: .285714286rem;
}

#write > h6.md-focus:before {
    left: -1.5625rem;
    top: .285714286rem;
}

.md-image > .md-meta {
    border-radius: 2px;
    font-family: initial;
    padding: 2px 0 0 4px;
    color: inherit;
}

.md-tag {
    color: inherit;
}

.md-toc {
    margin-top: 20px;
    padding-bottom: 20px;
}

.typora-quick-open-item {
    font-size: 1rem !important;
    height: 50px;
    padding-left: 8px;
    padding-top: 4px;
    padding-bottom: 4px;
}

#typora-quick-open {
    box-shadow: 0 0 8px #00000045;
    padding: 0;
}

.ty-quick-open-category.ty-has-prev .ty-quick-open-category-title {
    border-top: none;
}

#typora-quick-open-input {
    margin: 8px;
    box-shadow: none;
    border-radius: 2px;
}

#typora-quick-open-input input {
    font-size: 1rem;
    box-shadow: none;
    padding-top: 2px;
    padding-left: 10px;
    padding-right: 10px;
    line-height: 32px;
    max-height: 32px;
    border: none;
}

.modal-dialog#typora-quick-open {
    border-radius: 8px;
}

.ty-quick-open-category-title {
    padding-left: 8px;
    color: #BEBEBE;
    font-size: 0.8rem;
    margin-bottom: 4px;
}

.typora-quick-open-item-path {
    font-size: 0.8rem;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-top: 1px;
}

/*search input*/
.form-control {
    border: none;
    border-radius: 2px;
    box-shadow: none;
}

#md-searchpanel .btn {
    border-radius: 2px;
}

#search-panel-replaceall-btn {
    padding-right: 5px !important;
    text-align: center !important;
}

#search-panel-replace-btn {
    text-align: center !important;
}

#md-searchpanel input {
    background: var(--input-bg-color);
    border-radius: 2px;
}

.searchpanel-search-option-btn {
    border-radius: 2px;
    border: none;
    background: transparent;
    color: var(--text-color);
}

.searchpanel-search-option-btn.active {
    background: var(--text-color);
    color: var(--bg-color);
}

.form-control:focus {
    box-shadow: none;
}

#md-notification:before {
    top: 10px;
}

/** focus mode */
.on-focus-mode blockquote {
    border-left-color: rgba(85, 85, 85, 0.12);
}

header,
.context-menu,
.megamenu-content,
footer {
    font-family: initial;
}

/*sidebar*/
.file-node-content:hover .file-node-icon,
.file-node-content:hover .file-node-open-state {
    visibility: visible;
}

#typora-sidebar {
    font-size: 1.1rem;
}

.sidebar-tabs {
    border-bottom: none;
}

.file-list-item-summary, .file-list-item-parent-loc, .file-list-item-time, .file-list-item-summary {
    font-size: 0.9rem !important;
    font-family: var(--text-font);
}

.file-list-item-file-ext-part {
    display: none;
}

.outline-item {
    font-size: 1rem;
}

/*footnotes mark*/
#write .md-footnote {
    background-color: inherit;
    color: var(--drake-highlight);
    font-size: 0.9rem;
    border-radius: 0.9rem;
    padding-left: 0;
}

#write .md-footnote:before {
    content: "[";
}

#write .md-footnote:after {
    content: "]";
}

/*footnotes content*/
.md-hover-tip .code-tooltip-content {
    border-radius: 2px;
}

/*footnotes title*/
span.md-def-name {
    padding-right: 3ch;
    padding-left: 0;
    position: relative;
    font-weight: normal;
}

/*footnotes desc*/
.footnotes {
    font-size: 1rem;
    font-weight: normal;
    color: var(--text-color);
    position: relative;
}

/*footnotes tooltip text*/
.code-tooltip-content .md-plain {
    font-size: 0.9rem;
    font-family: inherit;
}

.code-tooltip-content code {
    padding: 0 2px;
    font-family: inherit;
    color: var(--footnotes-highlight);
    background-color: inherit;
}

.code-tooltip-content a {
    color: var(--footnotes-highlight);
}

div.code-tooltip-content {
    box-shadow: 0 0 8px #00000045;
    background: var(--footnotes-bg-color);
}

.footnotes {
    opacity: 1;
}

.md-def-name:after {
    content: ". ^";
    color: var(--text-color);
}

.md-def-footnote .md-def-name:before {
    content: "";
    color: var(--text-color);
    position: absolute;
}

.md-def-name:before {
    content: "";
    color: var(--text-color);
    position: absolute;
}

.md-content.md-url, .md-def-content.md-def-url.md-auto-disp {
    text-decoration: none;
    border-bottom: .1rem solid var(--text-color);
}

.CodeMirror-scroll::-webkit-scrollbar {
    display: none;
}

.file-list-item-summary {
    font-size: 1em;
}

.pin-outline #outline-content .outline-active strong, .pin-outline .outline-active {
    font-weight: 500;
    color: var(--outline-active-color);
}

.file-list-item.active {
    border-left: 4px solid var(--drake-accent);
}

#md-searchpanel .btn:not(.close-btn):hover {
    box-shadow: none;
    background: var(--btn-hover-bg-color);
}

/*checkbox*/
#write input[type=checkbox] {
    opacity: 0;
    height: 1.6rem;
    width: 1.6rem;
    margin-left: -2em;
    margin-top: 0;
    top: 0;
}

#write .ul-list li.md-task-list-item.task-list-done::before {
    content: "";
    background: var(--checkbox-checked) 0 0 no-repeat;
    background-size: 100%;
    display: inline-block;
    position: absolute;
    height: 1.6rem;
    width: 1.6rem;
    margin-left: -2em;
}

#write .ul-list li.md-task-list-item.task-list-not-done::before {
    content: "";
    background: var(--checkbox-unchecked) 0 0 no-repeat;
    background-size: 100%;
    display: inline-block;
    position: absolute;
    height: 1.6rem;
    width: 1.6rem;
    margin-left: -2em;
}

/*insert table*/
.btn {
    border-radius: 2px;
}

.modal-content {
    border-radius: 8px;
}

.btn-primary:hover, .btn-primary:active {
    background-color: var(--btn-hover-bg-color);
    color: var(--drake-highlight);
}

.btn-primary {
    background-color: transparent;
    color: var(--drake-highlight);
}

.btn-default {
    background-color: transparent;
}

.btn:active {
    box-shadow: none;
    border-color: transparent;
}

.modal-footer {
    border-top: none;
}

#table-insert-col, #table-insert-row {
    background: var(--input-bg-color);
    border-radius: 2px;
}

/*preference panel*/
#megamenu-content {
    background-image: none !important;
    background-color: var(--bg-color);
}
#top-titlebar {
    height: inherit;
    background-color: var(--bg-color);
}
#megamenu-menu-sidebar {
    background-color: var(--bg-color);
    color: var(--text-color);
}
.long-btn {
    width: inherit;
    min-width: 300px;
    border: 1px solid var(--text-color);
    border-radius: 6px;
}
.megamenu-menu-panel h1 {
    margin-bottom: 3rem;
    text-align: left;
}
.megamenu-menu-panel h1, .megamenu-menu-panel h2 {
    font-weight: normal;
}
#recent-file-panel-search-input {
    height: 45px;
    border: none;
    border-bottom: 1px solid var(--text-color);
    padding-left: 8px;
}
#recent-file-panel-search-input::placeholder {
    color: var(--text-color);
    opacity: .5;
}
.megamenu-menu-header {
    border-bottom: none;
}
#recent-file-panel-action-btn {
    background: none;
    border: none;
}
#recent-file-panel-action-btn-container {
    float: none;
    display: inline-block;
}
#top-titlebar .toolbar-icon.btn.hover, #top-titlebar .toolbar-icon.btn:hover {
    background-color: var(--btn-hover-bg-color);
    color: var(--text-color);
}
.megamenu-menu-panel .btn:hover {
    background-color: var(--btn-hover-bg-color) !important;
    color: var(--text-color);
}
#recent-file-panel tbody tr:nth-child(2n-1),
.megamenu-menu-panel table thead,
.megamenu-menu-panel table tr {
    background-color: transparent;
}
.megamenu-menu-panel table {
    font-weight: normal;
}
#megamenu-back-btn {
    color: var(--text-color);
    border: 1px solid var(--text-color);
}
.megamenu-menu-header #megamenu-menu-header-title {
    color: var(--text-color);
}
header, .context-menu, .megamenu-content, footer {
    font-family: var(--text-font);
}
.ty-preferences select {
    padding-left: 2px;
}
.preference-item-hint {
    font-size: 14px;
}
a.ty-link {
    color: var(--a-color);
    margin: 0 .2rem;
}

/**
    code render
    Name: IntelliJ IDEA darcula theme
    From IntelliJ IDEA by JetBrains
 */
.cm-s-inner.CodeMirror {
    background: var(--code-block-bg-color);
    color: var(--code-block-color);
}

.cm-s-inner span.cm-meta {
    color: #BBB529;
}

.cm-s-inner span.cm-number {
    color: #6897BB;
}

.cm-s-inner span.cm-keyword {
    color: #CC7832;
}

.cm-s-inner span.cm-def {
    color: #FFD760;
}

.cm-s-inner span.cm-variable {
    color: var(--code-block-color);
}

.cm-s-inner span.cm-variable-2 {
    color: var(--code-block-color);
}

.cm-s-inner span.cm-variable-3 {
    color: #9876AA;
}

.cm-s-inner span.cm-type {
    color: #AABBCC;
}

.cm-s-inner span.cm-property {
    color: #FFC66D;
}

.cm-s-inner span.cm-operator {
    color: var(--code-block-color);
}

.cm-s-inner span.cm-string {
    color: #6A8759;
}

.cm-s-inner span.cm-string-2 {
    color: #6A8759;
}

.cm-s-inner span.cm-comment {
    color: #787878;
}

.cm-s-inner span.cm-link {
    color: #CC7832;
}

.cm-s-inner span.cm-atom {
    color: #CC7832;
}

.cm-s-inner span.cm-error {
    color: #BC3F3C;
}

.cm-s-inner span.cm-tag {
    color: #E8BF6A;
}

.cm-s-inner span.cm-quote {
    color: #a6e22e;
}

.cm-s-inner span.cm-attribute {
    color: #9876AA;
}

.cm-s-inner span.cm-qualifier {
    color: #6A8759;
}

.cm-s-inner span.cm-bracket {
    color: #E8BF6A;
}

.cm-s-inner span.cm-builtin {
    color: #FF9E59;
}

.cm-s-inner span.cm-special {
    color: #FF9E59;
}

.cm-s-inner span.cm-matchhighlight {
    color: #FFFFFF;
    background-color: rgba(50, 89, 48, .7);
    font-weight: normal;
}

.cm-s-inner span.cm-searching {
    color: #FFFFFF;
    background-color: rgba(61, 115, 59, .7);
    font-weight: normal;
}

.cm-s-inner .CodeMirror-gutters {
    border-right: 1px solid rgba(120, 120, 120, 0.3);
}

.cm-s-inner .CodeMirror-linenumber {
    color: #585b5d;
}

.cm-s-inner .CodeMirror-matchingbracket {
    background-color: #3B514D;
    color: #FFEF28 !important;
}

.cm-s-inner .CodeMirror-selected {
    background: #214283 !important;
}

.cm-s-inner .CodeMirror-selectedtext {
    background: #214283 !important;
}

.cm-s-typora-default .CodeMirror-selectedtext {
    background: var(--select-text-bg-color) !important;
}

.cm-overlay.CodeMirror-selectedtext {
    background: var(--select-text-bg-color) !important;
}

.cm-s-inner div.CodeMirror-cursor {
    border-left: 1px solid var(--code-block-color);
}