Last active
November 14, 2022 06:56
-
-
Save purpleskyfall/2759ede9aef7cc95c2b6c630ae0a18ac to your computer and use it in GitHub Desktop.
newsprint-dark theme for typora
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* meyer reset -- http://meyerweb.com/eric/tools/css/reset/ , v2.0 | 20110126 | License: none (public domain) */ | |
| @include-when-export url(https://fonts.loli.net/css?family=PT+Serif:400,400italic,700,700italic&subset=latin,cyrillic-ext,cyrillic,latin-ext); | |
| /* =========== */ | |
| /* pt-serif-regular - latin */ | |
| @font-face { | |
| font-family: 'PT Serif'; | |
| font-style: normal; | |
| font-weight: normal; | |
| src: local('PT Serif'), local('PTSerif-Regular'), url('./newsprint/pt-serif-v11-latin-regular.woff2') format('woff2'); | |
| unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; | |
| } | |
| /* pt-serif-italic - latin */ | |
| @font-face { | |
| font-family: 'PT Serif'; | |
| font-style: italic; | |
| font-weight: normal; | |
| src: local('PT Serif Italic'), local('PTSerif-Italic'), url('./newsprint/pt-serif-v11-latin-italic.woff2') format('woff2'); | |
| unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; | |
| } | |
| /* pt-serif-700 - latin */ | |
| @font-face { | |
| font-family: 'PT Serif'; | |
| font-style: normal; | |
| font-weight: bold; | |
| src: local('PT Serif Bold'), local('PTSerif-Bold'), url('./newsprint/pt-serif-v11-latin-700.woff2') format('woff2'); | |
| unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; | |
| } | |
| /* pt-serif-700italic - latin */ | |
| @font-face { | |
| font-family: 'PT Serif'; | |
| font-style: italic; | |
| font-weight: bold; | |
| src: local('PT Serif Bold Italic'), local('PTSerif-BoldItalic'), url('./newsprint/pt-serif-v11-latin-700italic.woff2') format('woff2'); | |
| unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; | |
| } | |
| :root { | |
| --active-file-bg-color: #777; | |
| --active-file-text-color: black; | |
| --bg-color: #242221; | |
| --text-color: #ededef; | |
| --control-text-color: #444; | |
| --rawblock-edit-panel-bd: #263238; | |
| --select-text-bg-color: #a7a8bd; | |
| --select-text-font-color: #36284e; | |
| --search-select-bg-color: #b78b26; | |
| } | |
| pre { | |
| --select-text-bg-color: #a7a8bd; | |
| --select-text-font-color: #36284e; | |
| } | |
| html { | |
| font-size: 16px; | |
| -webkit-font-smoothing: antialiased; | |
| } | |
| html, body { | |
| background-color: #242221; | |
| font-family: "PT Serif", 'Times New Roman', Times, serif; | |
| color: #ededef; | |
| line-height: 1.5em; | |
| } | |
| /*#write { | |
| overflow-x: auto; | |
| max-width: initial; | |
| padding-left: calc(50% - 17em); | |
| padding-right: calc(50% - 17em); | |
| } | |
| @media (max-width: 36em) { | |
| #write { | |
| padding-left: 1em; | |
| padding-right: 1em; | |
| } | |
| }*/ | |
| #write { | |
| max-width: 40em; | |
| } | |
| @media only screen and (min-width: 1400px) { | |
| #write { | |
| max-width: 914px; | |
| } | |
| } | |
| ol li { | |
| list-style-type: decimal; | |
| list-style-position: outside; | |
| } | |
| ul li { | |
| list-style-type: disc; | |
| list-style-position: outside; | |
| } | |
| ol, | |
| ul { | |
| list-style: none; | |
| } | |
| blockquote, | |
| q { | |
| quotes: none; | |
| } | |
| blockquote:before, | |
| blockquote:after, | |
| q:before, | |
| q:after { | |
| content: ''; | |
| content: none; | |
| } | |
| table { | |
| border-collapse: collapse; | |
| border-spacing: 0; | |
| } | |
| /* styles */ | |
| /* ====== */ | |
| /* headings */ | |
| h1, | |
| h2, | |
| h3, | |
| h4, | |
| h5, | |
| h6 { | |
| font-weight: bold; | |
| } | |
| h1 { | |
| font-size: 1.875em; | |
| /*30 / 16*/ | |
| line-height: 1.6em; | |
| /* 48 / 30*/ | |
| margin-top: 2em; | |
| } | |
| h2, | |
| h3 { | |
| font-size: 1.3125em; | |
| /*21 / 16*/ | |
| line-height: 1.15; | |
| /*24 / 21*/ | |
| margin-top: 2.285714em; | |
| /*48 / 21*/ | |
| margin-bottom: 1.15em; | |
| /*24 / 21*/ | |
| } | |
| h3 { | |
| font-weight: normal; | |
| } | |
| h4 { | |
| font-size: 1.125em; | |
| /*18 / 16*/ | |
| margin-top: 2.67em; | |
| /*48 / 18*/ | |
| } | |
| h5, | |
| h6 { | |
| font-size: 1em; | |
| /*16*/ | |
| } | |
| h1 { | |
| border-bottom: 1px solid; | |
| margin-bottom: 1.875em; | |
| padding-bottom: 0.8125em; | |
| } | |
| /* links */ | |
| a { | |
| text-decoration: none; | |
| color: #065588; | |
| } | |
| a:hover, | |
| a:active { | |
| text-decoration: underline; | |
| } | |
| /* block spacing */ | |
| p, | |
| blockquote, | |
| .md-fences { | |
| margin-bottom: 1.5em; | |
| } | |
| h1, | |
| h2, | |
| h3, | |
| h4, | |
| h5, | |
| h6 { | |
| margin-bottom: 1.5em; | |
| } | |
| /* blockquote */ | |
| blockquote { | |
| font-style: italic; | |
| border-left: 5px solid; | |
| margin-left: 2em; | |
| padding-left: 1em; | |
| } | |
| /* lists */ | |
| ul, | |
| ol { | |
| margin: 0 0 1.5em 1.5em; | |
| } | |
| /* tables */ | |
| .md-meta,.md-before, .md-after { | |
| color:#777; | |
| } | |
| table { | |
| margin-bottom: 1.5em; | |
| /*24 / 16*/ | |
| font-size: 1em; | |
| /* width: 100%; */ | |
| } | |
| thead th, | |
| tfoot th { | |
| padding: .25em .25em .25em .4em; | |
| text-transform: uppercase; | |
| } | |
| th { | |
| text-align: left; | |
| } | |
| td { | |
| vertical-align: top; | |
| padding: .25em .25em .25em .4em; | |
| } | |
| code, | |
| .md-fences { | |
| background-color: #263238; | |
| } | |
| code { | |
| padding-left: 2px; | |
| padding-right: 2px; | |
| } | |
| .md-fences { | |
| margin-left: 2em; | |
| margin-bottom: 3em; | |
| padding-left: 1ch; | |
| padding-right: 1ch; | |
| } | |
| pre, | |
| code, | |
| tt { | |
| font-size: .875em; | |
| line-height: 1.714285em; | |
| } | |
| /* some fixes */ | |
| h1 { | |
| line-height: 1.3em; | |
| font-weight: normal; | |
| margin-bottom: 0.5em; | |
| } | |
| p + ul, | |
| p + ol{ | |
| margin-top: .5em; | |
| } | |
| h3 + ul, | |
| h4 + ul, | |
| h5 + ul, | |
| h6 + ul, | |
| h3 + ol, | |
| h4 + ol, | |
| h5 + ol, | |
| h6 + ol { | |
| margin-top: .5em; | |
| } | |
| li > ul, | |
| li > ol { | |
| margin-top: inherit; | |
| margin-bottom: 0; | |
| } | |
| li ol>li { | |
| list-style-type: lower-alpha; | |
| } | |
| li li ol>li{ | |
| list-style-type: lower-roman; | |
| } | |
| h2, | |
| h3 { | |
| margin-bottom: .75em; | |
| } | |
| hr { | |
| border-top: none; | |
| border-right: none; | |
| border-bottom: 1px solid; | |
| border-left: none; | |
| } | |
| h1 { | |
| border-color: #c5c5c5; | |
| } | |
| blockquote { | |
| border-color: #bababa; | |
| color: #656565; | |
| } | |
| blockquote ul, | |
| blockquote ol { | |
| margin-left:0; | |
| } | |
| .ty-table-edit { | |
| background-color: transparent; | |
| } | |
| thead { | |
| background-color: #1d1d1d; | |
| } | |
| tr:nth-child(even) { | |
| background: #303030; | |
| } | |
| hr { | |
| border-color: #c5c5c5; | |
| } | |
| .task-list{ | |
| padding-left: 1rem; | |
| } | |
| .md-task-list-item { | |
| padding-left: 1.5rem; | |
| list-style-type: none; | |
| } | |
| .md-task-list-item > input:before { | |
| content: '\221A'; | |
| display: inline-block; | |
| width: 1.25rem; | |
| height: 1.6rem; | |
| vertical-align: middle; | |
| text-align: center; | |
| color: #ddd; | |
| background-color: #F3F2EE; | |
| } | |
| .md-task-list-item > input:checked:before, | |
| .md-task-list-item > input[checked]:before{ | |
| color: inherit; | |
| } | |
| #write pre.md-meta-block { | |
| min-height: 1.875rem; | |
| color: #555; | |
| border: 0px; | |
| background: transparent; | |
| margin-top: -4px; | |
| margin-left: 1em; | |
| margin-top: 1em; | |
| } | |
| .md-image>.md-meta { | |
| color: #9B5146; | |
| } | |
| .md-image>.md-meta{ | |
| font-family: Menlo, 'Ubuntu Mono', Consolas, 'Courier New', 'Microsoft Yahei', 'Hiragino Sans GB', 'WenQuanYi Micro Hei', serif; | |
| } | |
| #write>h3.md-focus:before{ | |
| left: -1.5rem; | |
| color:#999; | |
| border-color:#999; | |
| } | |
| #write>h4.md-focus:before{ | |
| left: -1.5rem; | |
| top: .25rem; | |
| color:#999; | |
| border-color:#999; | |
| } | |
| #write>h5.md-focus:before{ | |
| left: -1.5rem; | |
| top: .0.3125rem; | |
| color:#999; | |
| border-color:#999; | |
| } | |
| #write>h6.md-focus:before{ | |
| left: -1.5rem; | |
| top: 0.3125rem; | |
| color:#999; | |
| border-color:#999; | |
| } | |
| .md-toc:focus .md-toc-content{ | |
| margin-top: 19px; | |
| } | |
| .md-toc-content:empty:before{ | |
| color: #065588; | |
| } | |
| .md-toc-item { | |
| color: #065588; | |
| } | |
| #write div.md-toc-tooltip { | |
| background-color: #242221; | |
| } | |
| #typora-sidebar { | |
| background-color: #242221; | |
| -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.375); | |
| box-shadow: 0 6px 12px rgba(0, 0, 0, 0.375); | |
| } | |
| .pin-outline #typora-sidebar { | |
| background: inherit; | |
| box-shadow: none; | |
| border-right: 1px dashed; | |
| } | |
| .pin-outline #typora-sidebar:hover .outline-title-wrapper { | |
| border-left:1px dashed; | |
| } | |
| .outline-item:hover { | |
| background-color: #777; | |
| border-left: 28px solid #777; | |
| border-right: 18px solid #777; | |
| } | |
| .typora-node .outline-item:hover { | |
| border-right: 28px solid #777; | |
| } | |
| .outline-expander:before { | |
| content: "\f0da"; | |
| font-family: FontAwesome; | |
| font-size:14px; | |
| top: 1px; | |
| } | |
| .outline-expander:hover:before, | |
| .outline-item-open>.outline-item>.outline-expander:before { | |
| content: "\f0d7"; | |
| } | |
| .modal-content { | |
| background-color: #242221; | |
| } | |
| .auto-suggest-container ul li { | |
| list-style-type: none; | |
| } | |
| /** UI for electron */ | |
| .megamenu-menu, | |
| #top-titlebar, #top-titlebar *, | |
| .megamenu-content { | |
| background: #242221; | |
| color: #ededef; | |
| } | |
| ::-webkit-scrollbar-thumb { | |
| background: #393939; | |
| } | |
| ::-webkit-scrollbar-thumb:active { | |
| background: #777; | |
| } | |
| .megamenu-opened header { | |
| background: #242221; | |
| } | |
| .megamenu-menu-header { | |
| border-bottom: 1px dashed #202B33; | |
| } | |
| .megamenu-menu { | |
| box-shadow: none; | |
| border-right: 1px dashed; | |
| } | |
| header, .context-menu, .megamenu-content, footer { | |
| font-family: "PT Serif", 'Times New Roman', Times, serif; | |
| color: #ededef; | |
| } | |
| #megamenu-back-btn { | |
| color: #ededef; | |
| border-color: #ededef; | |
| } | |
| .megamenu-menu-header #megamenu-menu-header-title:before { | |
| color: #ededef; | |
| } | |
| .megamenu-menu-list li a:hover, .megamenu-menu-list li a.active { | |
| color: inherit; | |
| background-color: #888; | |
| } | |
| .long-btn:hover { | |
| background-color: #888; | |
| } | |
| #recent-file-panel tbody tr:nth-child(2n-1) { | |
| background-color: transparent !important; | |
| } | |
| #recent-file-panel-action-btn { | |
| background: inherit; | |
| color: inherit; | |
| } | |
| .megamenu-menu-panel tbody tr:hover td:nth-child(2) { | |
| color: inherit; | |
| } | |
| .megamenu-menu-panel .btn { | |
| background-color: #888; | |
| } | |
| .btn-default { | |
| background-color: transparent; | |
| } | |
| .typora-sourceview-on #toggle-sourceview-btn, | |
| .ty-show-word-count #footer-word-count { | |
| background: #c7c5c5; | |
| } | |
| #typora-quick-open { | |
| background-color: inherit; | |
| } | |
| .md-diagram-panel { | |
| margin-top: 8px; | |
| } | |
| .file-list-item-file-name { | |
| font-weight: initial; | |
| } | |
| .file-list-item-summary { | |
| opacity: 1; | |
| } | |
| .file-list-item { | |
| color: #aaa; | |
| } | |
| .file-list-item.active { | |
| background-color: inherit; | |
| color: white; | |
| } | |
| .ty-side-sort-btn.active { | |
| background-color: inherit; | |
| } | |
| .file-list-item.active .file-list-item-file-name { | |
| font-weight: bold; | |
| } | |
| .file-list-item{ | |
| opacity:1 !important; | |
| } | |
| .file-library-node.active>.file-node-background{ | |
| background-color: rgba(32, 43, 51, 0.63); | |
| background-color: var(--active-file-bg-color); | |
| } | |
| .file-tree-node.active>.file-node-content{ | |
| color: white; | |
| color: var(--active-file-text-color); | |
| } | |
| .md-task-list-item>input { | |
| margin-left: -1.7em; | |
| margin-top: calc(1rem - 12px); | |
| -webkit-appearance: button; | |
| } | |
| input { | |
| border: 1px solid #aaa; | |
| } | |
| .megamenu-menu-header #megamenu-menu-header-title, | |
| .megamenu-menu-header:hover, | |
| .megamenu-menu-header:focus { | |
| color: inherit; | |
| } | |
| .dropdown-menu .divider { | |
| border-color: #e5e5e5; | |
| opacity: 1; | |
| } | |
| /* https://github.com/typora/typora-issues/issues/2046 */ | |
| .os-windows-7 strong, | |
| .os-windows-7 strong { | |
| font-weight: 760; | |
| } | |
| .ty-preferences .btn-default { | |
| background: transparent; | |
| } | |
| .ty-preferences .window-header { | |
| border-bottom: 1px dashed #202B33; | |
| box-shadow: none; | |
| } | |
| #sidebar-loading-template, #sidebar-loading-template.file-list-item { | |
| color: #777; | |
| } | |
| .searchpanel-search-option-btn.active { | |
| background: #777; | |
| color: white; | |
| } | |
| .export-detail, .light .export-detail, | |
| .light .export-item.active, | |
| .light .export-items-list-control { | |
| background: #e0e0e0; | |
| border-radius: 2px; | |
| font-weight: 700; | |
| color: inherit | |
| } | |
| /** ported from https://codemirror.net/theme/material.css **/ | |
| /* | |
| Name: material | |
| Author: Michael Kaminsky (http://github.com/mkaminsky11) | |
| Original material color scheme by Mattia Astorino (https://github.com/equinusocio/material-theme) | |
| */ | |
| .CodeMirror div.CodeMirror-cursor { border-left: 1px solid #f8f8f0; } | |
| .cm-s-inner { | |
| background-color: #263238; | |
| color: rgba(233, 237, 237, 1); | |
| } | |
| .cm-s-inner .CodeMirror-gutters { | |
| background: #263238; | |
| color: rgb(83,127,126); | |
| border: none; | |
| } | |
| .cm-s-inner .CodeMirror-guttermarker, .cm-s-inner .CodeMirror-guttermarker-subtle, .cm-s-inner .CodeMirror-linenumber { color: rgb(83,127,126); } | |
| .cm-s-inner .CodeMirror-cursor { border-left: 1px solid #f8f8f0; } | |
| .cm-s-inner div.CodeMirror-selected { background: rgba(255, 255, 255, 0.15); } | |
| .cm-s-inner.CodeMirror-focused div.CodeMirror-selected { background: rgba(255, 255, 255, 0.10); } | |
| .cm-s-inner .CodeMirror-line::selection, .cm-s-inner .CodeMirror-line > span::selection, .cm-s-inner .CodeMirror-line > span > span::selection { background: rgba(255, 255, 255, 0.10); } | |
| .cm-s-inner .CodeMirror-line::-moz-selection, .cm-s-inner .CodeMirror-line > span::-moz-selection, .cm-s-inner .CodeMirror-line > span > span::-moz-selection { background: rgba(255, 255, 255, 0.10); } | |
| .cm-s-inner .CodeMirror-activeline-background { background: rgba(0, 0, 0, 0); } | |
| .cm-s-inner .cm-keyword { color: rgba(199, 146, 234, 1); } | |
| .cm-s-inner .cm-operator { color: rgba(233, 237, 237, 1); } | |
| .cm-s-inner .cm-variable-2 { color: #80CBC4; } | |
| .cm-s-inner .cm-variable-3 { color: #82B1FF; } | |
| .cm-s-inner .cm-builtin { color: #DECB6B; } | |
| .cm-s-inner .cm-atom { color: #F77669; } | |
| .cm-s-inner .cm-number { color: #F77669; } | |
| .cm-s-inner .cm-def { color: rgba(233, 237, 237, 1); } | |
| .cm-s-inner .cm-string { color: #C3E88D; } | |
| .cm-s-inner .cm-string-2 { color: #80CBC4; } | |
| .cm-s-inner .cm-comment { color: #546E7A; } | |
| .cm-s-inner .cm-variable { color: #82B1FF; } | |
| .cm-s-inner .cm-tag { color: #80CBC4; } | |
| .cm-s-inner .cm-meta { color: #80CBC4; } | |
| .cm-s-inner .cm-attribute { color: #FFCB6B; } | |
| .cm-s-inner .cm-property { color: #80CBAE; } | |
| .cm-s-inner .cm-qualifier { color: #DECB6B; } | |
| .cm-s-inner .cm-variable-3 { color: #DECB6B; } | |
| .cm-s-inner .cm-tag { color: rgba(255, 83, 112, 1); } | |
| .cm-s-inner .cm-error { | |
| color: rgba(255, 255, 255, 1.0); | |
| background-color: #EC5F67; | |
| } | |
| .cm-s-inner .CodeMirror-matchingbracket { | |
| text-decoration: underline; | |
| color: white !important; | |
| } | |
| /**apply to code fences with plan text**/ | |
| .md-fences { | |
| background-color: #263238; | |
| color: rgba(233, 237, 237, 1); | |
| border: none; | |
| } | |
| .md-fences .code-tooltip { | |
| background-color: #263238; | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment