137 lines
2.1 KiB
SCSS
137 lines
2.1 KiB
SCSS
/**
|
|
* Essence's Prism Theme, based on Material Theme, but brighter.
|
|
*
|
|
* Author: Leo Nguyen
|
|
*/
|
|
$prism-bg: hsl(220, 15%, 20%);
|
|
$prism-gray: hsl(210, 30%, 65%);
|
|
$prism-red: hsl(0, 100%, 80%);
|
|
$prism-orange: hsl(25, 100%, 70%);
|
|
$prism-yellow: hsl(50, 100%, 70%);
|
|
$prism-green: hsl(100, 80%, 80%);
|
|
$prism-cyan: hsl(190, 100%, 80%);
|
|
$prism-blue: hsl(230, 100%, 80%);
|
|
$prism-purple: hsl(275, 100%, 80%);
|
|
|
|
pre {
|
|
margin: 0.5rem 0 1rem;
|
|
padding: 1.5rem;
|
|
border-radius: 0.5rem;
|
|
background: $prism-bg;
|
|
line-height: 1.5;
|
|
overflow: auto;
|
|
white-space: pre;
|
|
word-spacing: normal;
|
|
tab-size: 4;
|
|
hyphens: none;
|
|
|
|
code {
|
|
padding: 0;
|
|
color: #fff;
|
|
background: $prism-bg;
|
|
}
|
|
}
|
|
|
|
div.code-toolbar > .toolbar > .toolbar-item > a,
|
|
div.code-toolbar > .toolbar > .toolbar-item > button,
|
|
div.code-toolbar > .toolbar > .toolbar-item > span {
|
|
padding: 0.5em 1em;
|
|
margin: 0.25em 0.5em;
|
|
font-size: 0.9em;
|
|
color: #eee;
|
|
}
|
|
|
|
.token {
|
|
/* Red (constant, tag, selector) */
|
|
&.constant,
|
|
&.tag,
|
|
&.selector,
|
|
&.namespace,
|
|
&.deleted {
|
|
color: $prism-red;
|
|
}
|
|
|
|
/* Orange/Red (number, boolean, constant) */
|
|
&.number,
|
|
&.boolean {
|
|
color: $prism-orange;
|
|
}
|
|
|
|
/* Yellow (entity, class) */
|
|
&.entity,
|
|
&.class,
|
|
&.name,
|
|
&.class-name,
|
|
&.package,
|
|
&.scope,
|
|
&.attr-name {
|
|
color: $prism-yellow;
|
|
}
|
|
|
|
/* Green (string, attribute) */
|
|
&.string,
|
|
&.char,
|
|
&.property,
|
|
&.attr-value,
|
|
&.regex {
|
|
color: $prism-green;
|
|
}
|
|
|
|
/* Cyan (symbol) */
|
|
&.symbol,
|
|
&.punctuation,
|
|
&.operator,
|
|
&.url,
|
|
&.unit,
|
|
&.hexcode,
|
|
&.doctype-tag {
|
|
color: $prism-cyan;
|
|
}
|
|
|
|
/* Blue (function) */
|
|
&.function-name,
|
|
&.function {
|
|
color: $prism-blue;
|
|
}
|
|
|
|
/* Purple (keyword) */
|
|
&.keyword,
|
|
&.important,
|
|
&.builtin,
|
|
&.atrule {
|
|
color: $prism-purple;
|
|
}
|
|
|
|
/* White (variable, CSS pseudo class) */
|
|
&.variable,
|
|
&.pseudo-class {
|
|
color: #fff;
|
|
}
|
|
|
|
/* Gray (comment) */
|
|
&.comment,
|
|
&.block-comment,
|
|
&.prolog,
|
|
&.doctype,
|
|
&.cdata {
|
|
color: $prism-gray;
|
|
}
|
|
|
|
// &.important,
|
|
&.bold {
|
|
font-weight: bold;
|
|
}
|
|
|
|
&.italic {
|
|
font-style: italic;
|
|
}
|
|
|
|
&.entity {
|
|
cursor: help;
|
|
}
|
|
|
|
&.inserted {
|
|
color: green;
|
|
}
|
|
}
|