studio.status.im/scss/highlight.scss

125 lines
1.9 KiB
SCSS

$highlight-background: #fff;
$highlight-current-line: #efefef;
$highlight-selection: #d6d6d6;
$highlight-foreground: #4d4d4c;
$highlight-comment: #8e908c;
$highlight-red: #c82829;
$highlight-orange: #f5871f;
$highlight-yellow: #eab700;
$highlight-green: #718c00;
$highlight-aqua: #3e999f;
$highlight-blue: #4271ae;
$highlight-purple: #8959a8;
pre, code {
font-family: font-mono;
color: $highlight-foreground;
background: #eee;
font-size: 0.95em;
}
code {
padding: 0 5px;
}
pre {
padding: 10px 15px;
line-height: 22px;
code {
border: none;
display: block;
padding: 0;
}
}
.highlight {
background: #eee;
padding: 10px 15px;
color: $highlight-foreground;
overflow: auto;
margin: 0;
table {
margin: 0 !important;
border: 0;
th, td {
padding: 0;
}
}
figcaption {
margin: -5px 0 5px;
font-size: 0.9em;
color: color-gray;
a {
float: right;
}
}
pre {
padding: 0;
border: none;
background: none;
}
.line {
height: 22px;
}
}
pre {
.comment,
.title {
color: $highlight-comment;
}
.variable,
.attribute,
.tag,
.regexp,
.ruby .constant,
.xml .tag .title,
.xml .pi,
.xml .doctype,
.html .doctype,
.css .id,
.css .class,
.css .pseudo {
color: $highlight-red;
}
.number,
.preprocessor,
.built_in,
.literal,
.params,
.constant {
color: $highlight-orange;
}
.class,
.ruby .class .title,
.css .rules .attribute {
color: $highlight-green;
}
.string,
.value,
.inheritance,
.header,
.ruby .symbol,
.xml .cdata {
color: $highlight-green;
}
.css .hexcolor {
color: $highlight-aqua;
}
.function,
.python .decorator,
.python .title,
.ruby .function .title,
.ruby .title .keyword,
.perl .sub,
.javascript .title,
.coffeescript .title {
color: $highlight-blue;
}
.keyword,
.javascript .function {
color: $highlight-purple;
}
}