| :root { |
| |
| --bg-color: rgba(0,0,0,0.55); |
| |
| --title-color: rgba(138, 213, 253,0.9) ; |
| |
| --text-color-scope: #696969; |
| --text-color: rgba(255,255,255,0.96); |
| |
| --light-text-color: rgba(255,255,255,0.88); |
| --lighter-text-color: #888888; |
| |
| --link-color: rgba(112, 210, 232,1.0); |
| |
| --code-color: rgba(100,20,206,0.98); |
| --inline-code-bg: rgba(255, 255, 255,0.75); |
| |
| --shadow-color: #eee; |
| --border-quote: rgba(138, 213, 253,0.9); |
| |
| --border: #e7e7e7; |
| --link-bottom: #bbb; |
| --shadow: 3px 3px 10px var(--shadow-color); |
| |
| --code-background: rgba(225,225,225,0.45); |
| |
| --code-text-color: rgba(73,83,113,0.98); |
| --code-primary-color: rgba(70,48,113,0.98); |
| |
| --source-code-bg: rgba(255,255,255,0.4); |
| |
| --header-weight: normal; |
| |
| --bg-transparency-table: rgba(255, 255, 255, 0.3); |
| --bg-transparency: rgba(0, 0, 0, 0.38); |
| |
| --table-th-bg-color: rgba(172, 224, 253,0.7); |
| --table-td-bg-color: rgba(240,255,255,0.3); |
| |
| --meun-control-active-bg: rgba(34, 34, 34,1); |
| |
| --side-bar-bg-color: #2E3033; |
| |
| --control-text-color: #eee; |
| |
| --control-text-hover-color: var(--meun-control-active-bg); |
| |
| --item-hover-bg-color: rgba(255,255,255,0.35); |
| |
| --active-file-text-color: var(--title-color); |
| |
| --active-file-border-color: var(var(--title-color));*/ |
| --active-file-bg-color: var(--meun-control-active-bg); |
| --active-file-border-color: var(--title-color); |
| |
| --list-color: rgba(48, 235, 255, 0.9); |
| |
| --code-serial-color: rgba(73,83,113,0.55);; |
| |
| --base-font: "JetBrains Mono","Helvetica Neue", -apple-system, Ubuntu, |
| "Microsoft YaHei", Helvetica, "Nimbus Sans L", Arial, "Liberation Sans", |
| "Noto Sans CJK SC", "PingFang SC", "Hiragino Sans GB", "Source Han Sans SC", |
| "Source Han Sans CN", "Wenquanyi Micro Hei", "WenQuanYi Zen Hei", "ST Heiti", |
| SimHei, "WenQuanYi Zen Hei Sharp", "Source Sans Pro", sans-serif; |
| --title-font: "JetBrains Mono","EB Garamond", Georgia, "Noto Serif", "Noto Serif CJK SC", |
| "Nimbus Roman No9 L", "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, |
| "Ubuntu", "Source Sans Pro", serif; |
| --monospace: "JetBrains Mono", "Fira Code", "Cascadia Code", "Sarasa Term SC", |
| Monaco, "Deja Vu Sans Mono", Consolas, "Lucida Console", "Andale Mono", |
| "Roboto Mono", Courier, Monospace !important; |
| } |
| |
| @media print { |
| html { |
| font-size: 0.9rem; |
| } |
| |
| table, |
| pre { |
| page-break-inside: avoid; |
| } |
| |
| pre { |
| word-wrap: break-word; |
| } |
| #write { |
| max-width: 100%; |
| } |
| @page { |
| size: A3; |
| margin-left: 0; |
| margin-right: 0; |
| } |
| } |
| |
| * { |
| color: var(--text-color); |
| } |
| |
| html { |
| |
| font-size: 14px; |
| -webkit-text-size-adjust: 100%; |
| -ms-text-size-adjust: 100%; |
| text-rendering: optimizelegibility; |
| -webkit-font-smoothing: initial; |
| } |
| |
| body { |
| font-size: 15px; |
| color: var(--text-color-scope); |
| -webkit-font-smoothing: antialiased; |
| line-height: 1.6rem; |
| letter-spacing: 0; |
| overflow-x: hidden; |
| |
| } |
| |
| content { |
| background-image: url('./images/xxx.png'); |
| |
| background-size: 100%;*/ |
| width:100%; |
| height:100%; |
| background-size: cover; |
| |
| background-repeat: no-repeat; |
| background-size: fill;*/ |
| |
| } |
| |
| #write { |
| font-family: var(--base-font); |
| |
| margin: 0 auto; |
| |
| padding: 1rem calc(24% - 150px); |
| padding-bottom: 100px; |
| color: var(--text-color); |
| background-color: var(--bg-transparency); |
| min-height: calc(100% - 48px); |
| } |
| |
| #write p { |
| line-height: 1.6rem; |
| word-spacing: 0.05rem; |
| } |
| |
| body > *:first-child { |
| margin-top: 0 !important; |
| } |
| |
| body > *:last-child { |
| margin-bottom: 0 !important; |
| } |
| |
| a { |
| color: var(--link-color); |
| text-decoration: none; |
| } |
| #write a .md-plain{ |
| color: var(--link-color); |
| text-decoration: none; |
| } |
| #write a { |
| |
| border-bottom: 1px solid var(--link-color); |
| |
| } |
| #write a:hover { |
| |
| border-bottom: 1px solid var(--link-color); |
| color: var(--link-color); |
| text-decoration: none; |
| } |
| |
| .md-content { |
| color: var(--light-text-color); |
| } |
| |
| h1, |
| h2, |
| h3, |
| h4, |
| h5, |
| h6 { |
| position: relative; |
| margin-top: 2rem; |
| margin-bottom: 1rem; |
| font-weight: var(--header-weight); |
| line-height: 1.3; |
| cursor: text; |
| color: var(--title-color) !important; |
| font-family: var(--title-font); |
| } |
| |
| .md-heading >.md-plain{ |
| color: var(--title-color) ; |
| } |
| |
| h1 { |
| text-align: center; |
| font-size: 2.25em; |
| |
| margin-bottom: 3rem; |
| } |
| h1:after { |
| content: ""; |
| display: block; |
| margin: 0.2em auto 0; |
| width: 6rem; |
| height: 2px; |
| |
| } |
| |
| h2 { |
| padding-left: 0.4em; |
| font-size: 1.75em; |
| border-left: 0.4em solid var(--title-color); |
| border-bottom: 2px solid var(--title-color); |
| } |
| h3 { |
| font-size: 1.5em; |
| } |
| h4 { |
| font-size: 1.2em; |
| |
| } |
| h5 { |
| font-size: 1em; |
| |
| } |
| h6 { |
| font-size: 0.9em; |
| |
| } |
| |
| h3::before {content: "❄️"; display: inline-block;color: var(--title-color);} |
| h4::before {content: "🌟"; display: inline-block;color: var(--title-color);} |
| h5::before {content: "✨"; display: inline-block;color: var(--title-color);} |
| h6::before {content: "🔥"; display: inline-block;color: var(--title-color);} |
| |
| h3 > span, h4 > span, h5 > span, h6 > span |
| { |
| margin-left: 5px; |
| } |
| |
| h3:before { |
| animation: rotate 3s linear infinite; |
| -webkit-animation: rotate 3s linear infinite; |
| } |
| |
| @keyframes rotate { |
| from { |
| transform:rotate(0deg) |
| } |
| |
| to { |
| transform:rotate(360deg) |
| } |
| } |
| |
| p, |
| blockquote, |
| ul, |
| ol, |
| dl, |
| table { |
| margin: 0.8em 0; |
| } |
| |
| hr { |
| margin: 1.5em auto; |
| border-top: 1px solid var(--border); |
| } |
| |
| li > ol, |
| li > ul { |
| margin: 0 0; |
| } |
| |
| li p.first { |
| display: inline-block; |
| } |
| |
| ul, |
| ol { |
| padding-left: 2rem; |
| } |
| |
| ul:first-child, |
| ol:first-child { |
| margin-top: 0; |
| } |
| |
| ul:last-child, |
| ol:last-child { |
| margin-bottom: 0; |
| } |
| |
| #write ol li, |
| ul li { |
| padding-left: 0.1rem; |
| } |
| |
| blockquote { |
| border-left: 0.3rem solid var(--border-quote); |
| padding-left: 1em; |
| padding: 3px 16px; |
| |
| color: var(--title-color); |
| font-family: var(--base-font); |
| background-color: rgba(138, 213, 253, 0.15); |
| } |
| |
| table { |
| margin-bottom: 1.25rem; |
| |
| font-size: 13px; |
| } |
| table th, |
| table td { |
| padding: 8px; |
| line-height: 1.25rem; |
| vertical-align: middle; |
| border: 1px solid #ddd; |
| background-color: var(--bg-transparency-table); |
| } |
| table th { |
| font-weight: bold; |
| background-color: var(--table-th-bg-color); |
| } |
| table td { |
| background-color: var(--table-td-bg-color); |
| } |
| table thead th { |
| vertical-align: middle; |
| } |
| table tr:nth-child(2n), |
| thead { |
| |
| background-color: var(--bg-transparency-table); |
| } |
| |
| table th span { |
| color: rgba( 41, 121, 187, 0.9); |
| font-size: 15px; |
| } |
| |
| #write strong { |
| padding: 0 2px; |
| font-weight: bold; |
| } |
| |
| ::selection { |
| background:rgba(0, 0, 0, 0.25); |
| color: rgba(64,224,208, 1.0); |
| } |
| |
| #write code, |
| tt { |
| padding: 2px 4px; |
| |
| border-radius: 0.55rem; |
| font-family: var(--monospace); |
| font-size: 0.9rem; |
| color: var(--code-color); |
| |
| background-color: var(--inline-code-bg); |
| padding: 2px 6px; |
| margin: 0 2px; |
| } |
| |
| #typora-source { |
| background-color: var(--source-code-bg); |
| } |
| .typora-sourceview-on #toggle-sourceview-btn { |
| background-color: rgba(0, 0, 0, 0); |
| |
| } |
| |
| #write .md-footnote { |
| color: var(--code-color); |
| background-color: var(--inline-code-bg); |
| } |
| |
| #write mark { |
| padding: 2px 6px; |
| |
| border-radius: 3px; |
| background: rgba(0,0,0,0.3); |
| |
| color: rgba(64,224,208, 0.95); |
| } |
| #write mark span{ |
| |
| color: rgba(64,224,208, 0.95); |
| } |
| |
| u { |
| color: var(--title-color); |
| text-decoration-color: var(--title-color); |
| } |
| |
| #write del { |
| padding: 1px 2px; |
| } |
| |
| .md-task-list-item > input { |
| margin-left: -1.3em; |
| } |
| |
| #write pre.md-meta-block { |
| padding: 1rem; |
| font-size: 85%; |
| line-height: 1.45; |
| |
| background-color: var(--code-background); |
| border: 0; |
| border-radius: 3px; |
| color: var(--code-primary-color); |
| margin-top: 0 !important; |
| } |
| |
| .mathjax-block > .code-tooltip { |
| bottom: 0.375rem; |
| } |
| |
| .md-image > .md-meta { |
| border-radius: 3px; |
| font-family: var(--monospace); |
| padding: 2px 0 0 4px; |
| font-size: 0.9em; |
| color: inherit; |
| } |
| |
| img[alt|="shadow"] { |
| box-shadow: var(--shadow); |
| } |
| |
| img { |
| border-radius: 0.6rem; |
| } |
| |
| #write a .md-toc-inner { |
| line-height: 1.6; |
| white-space: pre-line; |
| border-bottom: none; |
| |
| color :rgb(74,88,157,0.8); |
| font-size: 0.9rem; |
| } |
| |
| display: none; |
| } */ |
| .md-toc-h2 .md-toc-inner { |
| font-weight: bold; |
| } |
| |
| header, |
| .context-menu, |
| .megamenu-content, |
| footer { |
| font-family: var(--base-font); |
| } |
| |
| .file-node-content:hover .file-node-icon, |
| .file-node-content:hover .file-node-open-state { |
| visibility: visible; |
| } |
| |
| .md-lang { |
| color: #b4654d; |
| } |
| |
| .html-for-mac .context-menu { |
| --item-hover-bg-color: #e6f0fe; |
| } |
| |
| .md-fences { |
| border: 1px solid var(--border); |
| border-radius: 5px; |
| |
| background: var(--code-background); |
| font-size: 0.8rem; |
| } |
| |
| #write pre.md-fences { |
| display: block; |
| -webkit-overflow-scrolling: touch; |
| box-shadow: var(--shadow); |
| } |
| |
| .CodeMirror-line >span{ |
| color: var(--code-text-color); |
| } |
| |
| .cm-s-inner { |
| padding: 0.25rem; |
| border-radius: 0.25rem; |
| } |
| |
| .cm-s-inner .cm-variable{ |
| color: var(--code-text-color); |
| } |
| |
| .CodeMirror-scroll { |
| |
| background-color: rgba(255, 255, 255, 0); |
| } |
| .cm-s-inner.CodeMirror, |
| .cm-s-inner .CodeMirror-gutters { |
| color: #A9A9A9 !important; |
| border: none; |
| font-size: 1rem; |
| padding: 2px 10px; |
| } |
| |
| .cm-s-inner .CodeMirror-gutters { |
| color: #6d8a88; |
| } |
| |
| .cm-s-inner .CodeMirror-linenumber { |
| padding: 0 0.1rem 0 0.3rem; |
| |
| } |
| |
| .cm-s-inner .cm-property{ |
| color: rgba(172, 120, 188,0.9) |
| } |
| |
| .cm-s-inner .CodeMirror-matchingbracket { |
| text-decoration: underline; |
| color: #a34e8f !important; |
| } |
| |
| #fences-auto-suggest .active { |
| background: #ddd; |
| } |
| |
| .cm-s-inner span.cm-comment { |
| |
| color: rgba(32,127,128,1); |
| |
| } |
| .cm-s-inner span.cm-builtin { |
| color: #0451a5; |
| } |
| |
| #write .code-tooltip { |
| border: 1px solid var(--border); |
| } |
| |
| .auto-suggest-container { |
| border-color: #b4b4b4; |
| } |
| |
| .auto-suggest-container .autoComplt-hint.active { |
| background: #b4b4b4; |
| color: inherit; |
| } |
| |
| #write .md-task-list-item > input { |
| -webkit-appearance: initial; |
| display: block; |
| position: absolute; |
| border: 1px solid #b4b4b4; |
| border-radius: 0.2rem; |
| margin-top: 0.3rem; |
| height: 1rem; |
| width: 1rem; |
| transition: background 0.3s; |
| } |
| |
| #write .md-task-list-item > input:focus { |
| outline: none; |
| box-shadow: none; |
| } |
| |
| #write .md-task-list-item > input:hover { |
| background: #ddd; |
| } |
| |
| #write .md-task-list-item > input[checked]::before { |
| content: ""; |
| position: absolute; |
| top: 20%; |
| left: 50%; |
| height: 60%; |
| width: 2px; |
| transform: rotate(40deg); |
| background: #333; |
| } |
| |
| #write .md-task-list-item > input[checked]::after { |
| content: ""; |
| position: absolute; |
| top: 46%; |
| left: 25%; |
| height: 30%; |
| width: 2px; |
| transform: rotate(-40deg); |
| background: #333; |
| } |
| |
| #write .md-task-list-item > p { |
| transition: color 0.3s, opacity 0.3s; |
| } |
| |
| #write .md-task-list-item.task-list-done > p { |
| color: #b4b4b4; |
| text-decoration: line-through; |
| } |
| |
| #write .md-task-list-item.task-list-done > p > .md-emoji { |
| opacity: 0.5; |
| } |
| |
| #write .md-task-list-item.task-list-done > p > .md-link > a { |
| opacity: 0.6; |
| } |
| |
| #typora-sidebar, |
| .typora-node #typora-sidebar { |
| box-shadow: 3px 0px 10px var(--shadow-color); |
| } |
| .sidebar-content-content { |
| font-size: 0.9rem; |
| } |
| .file-tree-node.active span{ |
| color: var(--title-color); |
| } |
| #typora-sidebar i{ |
| color: var(--title-color); |
| } |
| |
| .cm-s-inner .cm-property{ |
| color: rgba(123,44,191,1) |
| |
| } |
| .cm-s-inner .cm-def{ |
| color: rgba(197,3,191,0.98) |
| } |
| .cm-type{ |
| color: rgba(199,21,133, 1); |
| } |
| |
| .md-comment{ |
| color: rgb(136, 251, 230); |
| } |
| |
| strong span { |
| color: rgba(10, 221, 221, 0.9); |
| font-size: 17px; |
| } |
| |
| .ul-list > .md-list-item::marker { |
| color: var(--list-color); |
| } |
| |
| .cm-s-inner .CodeMirror-linenumber { |
| color: var(--code-serial-color); |
| } |
| |
| .cm-punctuation { |
| color: var(--code-text-color); |
| } |
| |
| p .md-image:only-child{ |
| width: auto; |
| text-align: inherit; |
| } |
