diff options
Diffstat (limited to 'jthanio/static/css/prism.css')
| -rw-r--r-- | jthanio/static/css/prism.css | 135 |
1 files changed, 32 insertions, 103 deletions
diff --git a/jthanio/static/css/prism.css b/jthanio/static/css/prism.css index 876c561..7361087 100644 --- a/jthanio/static/css/prism.css +++ b/jthanio/static/css/prism.css @@ -1,16 +1,16 @@ /* PrismJS 1.19.0 -https://prismjs.com/download.html#themes=prism-dark&languages=markup+css+clike+javascript+bash+go+python&plugins=toolbar+copy-to-clipboard */ +https://prismjs.com/download.html#themes=prism-okaidia&languages=markup+css+clike+bash+go+python */ /** - * prism.js Dark theme for JavaScript, CSS and HTML - * Based on the slides of the talk “/Reg(exp){2}lained/” - * @author Lea Verou + * okaidia theme for JavaScript, CSS and HTML + * Loosely based on Monokai textmate theme by http://www.monokai.nl/ + * @author ocodia */ code[class*="language-"], pre[class*="language-"] { - color: white; + color: #f8f8f2; background: none; - text-shadow: 0 -.1em .2em black; + text-shadow: 0 1px rgba(0, 0, 0, 0.3); font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace; font-size: 1em; text-align: left; @@ -30,34 +30,23 @@ pre[class*="language-"] { hyphens: none; } -@media print { - code[class*="language-"], - pre[class*="language-"] { - text-shadow: none; - } -} - -pre[class*="language-"], -:not(pre) > code[class*="language-"] { - background: hsl(30, 20%, 25%); -} - /* Code blocks */ pre[class*="language-"] { padding: 1em; margin: .5em 0; overflow: auto; - border: .3em solid hsl(30, 20%, 40%); - border-radius: .5em; - box-shadow: 1px 1px .5em black inset; + border-radius: 0.3em; +} + +:not(pre) > code[class*="language-"], +pre[class*="language-"] { + background: #272822; } /* Inline code */ :not(pre) > code[class*="language-"] { - padding: .15em .2em .05em; + padding: .1em; border-radius: .3em; - border: .13em solid hsl(30, 20%, 40%); - box-shadow: 1px 1px .3em -.1em black inset; white-space: normal; } @@ -65,11 +54,11 @@ pre[class*="language-"] { .token.prolog, .token.doctype, .token.cdata { - color: hsl(30, 20%, 50%); + color: slategray; } .token.punctuation { - opacity: .7; + color: #f8f8f2; } .token.namespace { @@ -78,11 +67,15 @@ pre[class*="language-"] { .token.property, .token.tag, -.token.boolean, -.token.number, .token.constant, -.token.symbol { - color: hsl(350, 40%, 70%); +.token.symbol, +.token.deleted { + color: #f92672; +} + +.token.boolean, +.token.number { + color: #ae81ff; } .token.selector, @@ -91,7 +84,7 @@ pre[class*="language-"] { .token.char, .token.builtin, .token.inserted { - color: hsl(75, 70%, 60%); + color: #a6e22e; } .token.operator, @@ -100,18 +93,23 @@ pre[class*="language-"] { .language-css .token.string, .style .token.string, .token.variable { - color: hsl(40, 90%, 60%); + color: #f8f8f2; } .token.atrule, .token.attr-value, +.token.function, +.token.class-name { + color: #e6db74; +} + .token.keyword { - color: hsl(350, 40%, 70%); + color: #66d9ef; } .token.regex, .token.important { - color: #e90; + color: #fd971f; } .token.important, @@ -126,72 +124,3 @@ pre[class*="language-"] { cursor: help; } -.token.deleted { - color: red; -} - -div.code-toolbar { - position: relative; -} - -div.code-toolbar > .toolbar { - position: absolute; - top: .3em; - right: .2em; - transition: opacity 0.3s ease-in-out; - opacity: 0; -} - -div.code-toolbar:hover > .toolbar { - opacity: 1; -} - -/* Separate line b/c rules are thrown out if selector is invalid. - IE11 and old Edge versions don't support :focus-within. */ -div.code-toolbar:focus-within > .toolbar { - opacity: 1; -} - -div.code-toolbar > .toolbar .toolbar-item { - display: inline-block; -} - -div.code-toolbar > .toolbar a { - cursor: pointer; -} - -div.code-toolbar > .toolbar button { - background: none; - border: 0; - color: inherit; - font: inherit; - line-height: normal; - overflow: visible; - padding: 0; - -webkit-user-select: none; /* for button */ - -moz-user-select: none; - -ms-user-select: none; -} - -div.code-toolbar > .toolbar a, -div.code-toolbar > .toolbar button, -div.code-toolbar > .toolbar span { - color: #bbb; - font-size: .8em; - padding: 0 .5em; - background: #f5f2f0; - background: rgba(224, 224, 224, 0.2); - box-shadow: 0 2px 0 0 rgba(0,0,0,0.2); - border-radius: .5em; -} - -div.code-toolbar > .toolbar a:hover, -div.code-toolbar > .toolbar a:focus, -div.code-toolbar > .toolbar button:hover, -div.code-toolbar > .toolbar button:focus, -div.code-toolbar > .toolbar span:hover, -div.code-toolbar > .toolbar span:focus { - color: inherit; - text-decoration: none; -} - |