Created
January 17, 2017 08:45
-
-
Save morgaan/21e9f8c559c63eadc24a1bbd5bcbcc7c to your computer and use it in GitHub Desktop.
Userscript to Improve rendering of markdown in Simplenote preview
This file contains 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
| // ==UserScript== | |
| // @name SimplenoteImprovedMarkdownPreview | |
| // @namespace http://tampermonkey.net/ | |
| // @version 0.1 | |
| // @description Userscript to Improve rendering of markdown in Simplenote preview | |
| // @author Morgan CUGERONE | |
| // @require https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.18.2/babel.js | |
| // @require https://cdnjs.cloudflare.com/ajax/libs/babel-polyfill/6.16.0/polyfill.js | |
| // @match https://app.simplenote.com | |
| // @grant GM_addStyle | |
| // ==/UserScript== | |
| /* jshint ignore:start */ | |
| var inline_src = (<><![CDATA[ | |
| /* jshint ignore:end */ | |
| /* jshint esnext: false */ | |
| /* jshint esversion: 6 */ | |
| GM_addStyle(`// Selectors start here | |
| .app .note #static_content a { color: #4183C4; text-decoration: none; } | |
| .app .note #static_content a.absent { color: #cc0000; } | |
| .app .note #static_content a.anchor { display: block; padding-left: 30px; margin-left: -30px; cursor: pointer; position: absolute; top: 0; left: 0; bottom: 0; } | |
| .app .note #static_content h1, .app .note #static_content h2, .app .note #static_content h3, .app .note #static_content h4, .app .note #static_content h5, .app .note #static_content h6 { margin: 20px 0 1.5em 10px; padding: 0; font-weight: bold; -webkit-font-smoothing: antialiased; cursor: text; position: relative; text-align: left; } | |
| .app .note #static_content h2:first-child, .app .note #static_content h1:first-child, .app .note #static_content h1:first-child + h2, .app .note #static_content h3:first-child, .app .note #static_content h4:first-child, .app .note #static_content h5:first-child, .app .note #static_content h6:first-child { margin-top: 0; padding-top: 0; } | |
| .app .note #static_content h1:hover a.anchor, .app .note #static_content h2:hover a.anchor, .app .note #static_content h3:hover a.anchor, .app .note #static_content h4:hover a.anchor, .app .note #static_content h5:hover a.anchor, .app .note #static_content h6:hover a.anchor { text-decoration: none; } | |
| .app .note #static_content h1 tt, .app .note #static_content h1 code { font-size: inherit; } | |
| .app .note #static_content h2 tt, .app .note #static_content h2 code { font-size: inherit; } | |
| .app .note #static_content h3 tt, .app .note #static_content h3 code { font-size: inherit; } | |
| .app .note #static_content h4 tt, .app .note #static_content h4 code { font-size: inherit; } | |
| .app .note #static_content h5 tt, .app .note #static_content h5 code { font-size: inherit; } | |
| .app .note #static_content h6 tt, .app .note #static_content h6 code { font-size: inherit; } | |
| .app .note #static_content h1 { font-size: 28px; color: black; } | |
| .app .note #static_content h2 { font-size: 24px; border-bottom: 1px solid #cccccc; color: black; } | |
| .app .note #static_content h3 { font-size: 18px; } | |
| .app .note #static_content h4 { font-size: 16px; } | |
| .app .note #static_content h5 { font-size: 14px; } | |
| .app .note #static_content h6 { color: #777777; font-size: 14px; } | |
| .app .note #static_content p, .app .note #static_content blockquote, .app .note #static_content ul, .app .note #static_content ol, .app .note #static_content dl, .app .note #static_content li, .app .note #static_content table, .app .note #static_content pre { margin: 15px 0; } | |
| .app .note #static_content hr { height: 0; margin: 15px 0; overflow: hidden; background: transparent; border: 0; border-bottom: 1px solid #ddd; } | |
| .app .note #static_content body > h2:first-child { margin-top: 0; padding-top: 0; } | |
| .app .note #static_content body > h1:first-child { margin-top: 0; padding-top: 0; } | |
| .app .note #static_content body > h1:first-child + h2 { margin-top: 0; padding-top: 0; } | |
| .app .note #static_content body > h3:first-child, .app .note #static_content body > h4:first-child, .app .note #static_content body > h5:first-child, .app .note #static_content body > h6:first-child { margin-top: 0; padding-top: 0; } | |
| .app .note #static_content a:first-child h1, .app .note #static_content a:first-child h2, .app .note #static_content a:first-child h3, .app .note #static_content a:first-child h4, .app .note #static_content a:first-child h5, .app .note #static_content a:first-child h6 { margin-top: 0; padding-top: 0; } | |
| .app .note #static_content h1 p, .app .note #static_content h2 p, .app .note #static_content h3 p, .app .note #static_content h4 p, .app .note #static_content h5 p, .app .note #static_content h6 p { margin-top: 0; } | |
| .app .note #static_content li p.first { display: inline-block; } | |
| .app .note #static_content ul, .app .note #static_content ol { padding-left: 30px; } | |
| .app .note #static_content ul :first-child, .app .note #static_content ol :first-child { margin-top: 0; } | |
| .app .note #static_content ul :last-child, .app .note #static_content ol :last-child { margin-bottom: 0; } | |
| .app .note #static_content dl { padding: 0; } | |
| .app .note #static_content dl dt { font-size: 14px; font-weight: bold; font-style: italic; padding: 0; margin: 15px 0 5px; } | |
| .app .note #static_content dl dt:first-child { padding: 0; } | |
| .app .note #static_content dl dt > :first-child { margin-top: 0; } | |
| .app .note #static_content dl dt > :last-child { margin-bottom: 0; } | |
| .app .note #static_content dl dd { margin: 0 0 15px; padding: 0 15px; } | |
| .app .note #static_content dl dd > :first-child { margin-top: 0; } | |
| .app .note #static_content dl dd > :last-child { margin-bottom: 0; } | |
| .app .note #static_content blockquote { border-left: 4px solid #dddddd; padding: 0 15px; color: #777777; } | |
| .app .note #static_content blockquote > :first-child { margin-top: 0; } | |
| .app .note #static_content blockquote > :last-child { margin-bottom: 0; } | |
| .app .note #static_content table { padding: 0; } | |
| .app .note #static_content table tr { border-top: 1px solid #cccccc; background-color: white; margin: 0; padding: 0; } | |
| .app .note #static_content table tr:nth-child(2n) { background-color: #f8f8f8; } | |
| .app .note #static_content table tr th { font-weight: bold; border: 1px solid #cccccc; text-align: left; margin: 0; padding: 6px 13px; } | |
| .app .note #static_content table tr td { border: 1px solid #cccccc; text-align: left; margin: 0; padding: 6px 13px; } | |
| .app .note #static_content table tr th :first-child, .app .note #static_content table tr td :first-child { margin-top: 0; } | |
| .app .note #static_content table tr th :last-child, .app .note #static_content table tr td :last-child { margin-bottom: 0; } | |
| .app .note #static_content img { max-width: 100%; } | |
| .app .note #static_content span.frame { display: block; overflow: hidden; } | |
| .app .note #static_content span.frame > span { border: 1px solid #dddddd; display: block; float: left; overflow: hidden; margin: 13px 0 0; padding: 7px; width: auto; } | |
| .app .note #static_content span.frame span img { display: block; float: left; } | |
| .app .note #static_content span.frame span span { clear: both; color: #333333; display: block; padding: 5px 0 0; } | |
| .app .note #static_content span.align-center { display: block; overflow: hidden; clear: both; } | |
| .app .note #static_content span.align-center > span { display: block; overflow: hidden; margin: 13px auto 0; text-align: center; } | |
| .app .note #static_content span.align-center span img { margin: 0 auto; text-align: center; } | |
| .app .note #static_content span.align-right { display: block; overflow: hidden; clear: both; } | |
| .app .note #static_content span.align-right > span { display: block; overflow: hidden; margin: 13px 0 0; text-align: right; } | |
| .app .note #static_content span.align-right span img { margin: 0; text-align: right; } | |
| .app .note #static_content span.float-left { display: block; margin-right: 13px; overflow: hidden; float: left; } | |
| .app .note #static_content span.float-left span { margin: 13px 0 0; } | |
| .app .note #static_content span.float-right { display: block; margin-left: 13px; overflow: hidden; float: right; } | |
| .app .note #static_content span.float-right > span { display: block; overflow: hidden; margin: 13px auto 0; text-align: right; } | |
| .app .note #static_content code, .app .note #static_content tt { margin: 0 2px; padding: 0 5px; white-space: nowrap; border: 1px solid #eaeaea; background-color: #f8f8f8; border-radius: 3px; } | |
| .app .note #static_content pre code { margin: 0; padding: 0; white-space: pre; border: none; background: transparent; } | |
| .app .note #static_content .highlight pre { background-color: #f8f8f8; border: 1px solid #cccccc; font-size: 13px; line-height: 19px; overflow: auto; padding: 6px 10px; border-radius: 3px; } | |
| .app .note #static_content pre { background-color: #f8f8f8; border: 1px solid #cccccc; font-size: 13px; line-height: 19px; overflow: auto; padding: 6px 10px; border-radius: 3px; } | |
| .app .note #static_content pre code, .app .note #static_content pre tt { background-color: transparent; border: none; } | |
| `); | |
| /* jshint ignore:start */ | |
| ]]></>).toString(); | |
| var c = Babel.transform(inline_src, { presets: [ "es2015", "es2016" ] }); | |
| eval(c.code); | |
| /* jshint ignore:end */ |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment