/** * xonokai theme for JavaScript, CSS and HTML * based on: https://github.com/MoOx/sass-prism-theme-base by Maxime Thirouin ~ MoOx --> http://moox.fr/ , which is Loosely based on Monokai textmate theme by http://www.monokai.nl/ * license: MIT; http://moox.mit-license.org/ */ code[class*="language-"], pre { color: #76d9e6; } pre, :not(pre)>code[class*="language-"] { background-color: #2a2a2a; } .token.namespace { opacity: .7; } .token.comment, .token.prolog, .token.doctype, .token.cdata { color: #6f705e; } .token.operator, .token.boolean, .token.number { color: #a77afe; } .token.attr-name, .token.string { color: #e6d06c; } .token.entity, .token.url, .language-css .token.string, .style .token.string { color: #e6d06c; } .token.selector, .token.inserted { color: #a6e22d; } .token.atrule, .token.attr-value, .token.keyword, .token.important, .token.deleted { color: #ef3b7d; } .token.regex, .token.statement { color: #76d9e6; } .token.placeholder, .token.variable { color: #fff; } .token.important, .token.statement, .token.bold { font-weight: bold; } .token.punctuation { color: #bebec5; } .token.entity { cursor: help; } .token.italic { font-style: italic; } code.language-markup { color: #f9f9f9; } code.language-markup .token.tag { color: #ef3b7d; } code.language-markup .token.attr-name { color: #a6e22d; } code.language-markup .token.attr-value { color: #e6d06c; } code.language-markup .token.style, code.language-markup .token.script { color: #76d9e6; } code.language-markup .token.script .token.keyword { color: #76d9e6; } /* Line highlight plugin */ pre[data-line] { position: relative; padding: 1em 0 1em 3em; } pre[data-line] .line-highlight { position: absolute; left: 0; right: 0; padding: 0; margin-top: 1em; background-color: rgba(255, 255, 255, 0.08); pointer-events: none; line-height: inherit; white-space: pre; } pre[data-line] .line-highlight:before, pre[data-line] .line-highlight[data-end]:after { content: attr(data-start); position: absolute; top: .4em; left: .6em; min-width: 1em; padding: 0.2em 0.5em; background-color: rgba(255, 255, 255, 0.4); color: black; font: bold 65%/1 sans-serif; height: 1em; line-height: 1em; text-align: center; border-radius: 999px; text-shadow: none; box-shadow: 0 1px 1px rgba(255, 255, 255, 0.7); } pre[data-line] .line-highlight[data-end]:after { content: attr(data-end); top: auto; bottom: .4em; }