diff --git a/css/app.css b/css/app.css index 083f485..cebde6b 100644 --- a/css/app.css +++ b/css/app.css @@ -133,7 +133,6 @@ body { } #content code { - padding-left: 5px; padding-right: 5px; color: #FFF; @@ -275,13 +274,15 @@ body { } /** - * prism.js Funky theme - * Based on “Polyfilling the gaps” talk slides http://lea.verou.me/polyfilling-the-gaps/ - * @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: #f8f8f2; + text-shadow: 0 1px rgba(0,0,0,0.3); font-family: Consolas, Monaco, 'Andale Mono', monospace; direction: ltr; text-align: left; @@ -301,35 +302,32 @@ pre[class*="language-"] { /* Code blocks */ pre[class*="language-"] { - padding: .4em .8em; + padding: 1em; margin: .5em 0; overflow: auto; - background: url('data:image/svg+xml;charset=utf-8,%0D%0A%0D%0A%0D%0A<%2Fsvg>'); - background-size: 1em 1em; + border-radius: 0.3em; } -code[class*="language-"] { - background: black; - color: white; - box-shadow: -.3em 0 0 .3em black, .3em 0 0 .3em black; +:not(pre) > code[class*="language-"], +pre[class*="language-"] { + background: #272822; } /* Inline code */ :not(pre) > code[class*="language-"] { - padding: .2em; + padding: .1em; border-radius: .3em; - box-shadow: none; } .token.comment, .token.prolog, .token.doctype, .token.cdata { - color: #aaa; + color: slategray; } .token.punctuation { - color: #999; + color: #f8f8f2; } .namespace { @@ -338,38 +336,47 @@ code[class*="language-"] { .token.property, .token.tag, -.token.boolean, -.token.number, .token.constant, .token.symbol { - color: #0cf; + color: #f92672; +} + +.token.boolean, +.token.number{ + color: #ae81ff; } .token.selector, .token.attr-name, .token.string, .token.builtin { - color: yellow; + color: #a6e22e; } + .token.operator, .token.entity, .token.url, .language-css .token.string, -.toke.variable { - color: yellowgreen; +.style .token.string, +.token.variable { + color: #f8f8f2; } .token.atrule, -.token.attr-value, -.token.keyword { - color: deeppink; +.token.attr-value +{ + color: #e6db74; } +.token.keyword{ +color: #66d9ef; +} + .token.regex, .token.important { - color: orange; + color: #fd971f; } .token.important {