LoveIt/assets/css/_partial/_single/_code.scss

110 lines
2 KiB
SCSS
Raw Normal View History

2020-02-10 13:34:57 +01:00
code {
2019-08-11 19:36:19 +02:00
font-size: $code-font-size;
font-family: $code-font-family;
2020-02-10 13:34:57 +01:00
padding: .2rem .4rem;
color: $code-color;
2019-08-11 19:36:19 +02:00
.dark-theme & {
color: $code-color-dark;
2019-08-11 19:36:19 +02:00
}
}
2020-02-10 13:34:57 +01:00
code, pre, .highlight table, .highlight tr, .highlight td {
background: $code-background-color;
.dark-theme & {
background: $code-background-color-dark;
}
2019-08-11 19:36:19 +02:00
}
.highlight > .chroma {
2020-02-10 13:34:57 +01:00
margin: 1rem 0;
line-height: round($code-font-size * 1.4);
2019-08-11 19:36:19 +02:00
2020-02-10 13:34:57 +01:00
code, pre {
margin: 0;
2020-02-10 13:34:57 +01:00
padding: 0;
}
2020-02-10 13:34:57 +01:00
&::before {
display: block;
padding: .4rem;
font-family: $global-font-family;
font-size: $code-font-size;
font-weight: bold;
color: $code-info-color;
background: darken($code-background-color, 3%);
content: 'Code';
.dark-theme & {
color: $code-info-color-dark;
background: darken($code-background-color-dark, 3%);
2019-08-11 19:36:19 +02:00
}
}
2020-02-02 14:07:38 +01:00
@each $type, $text in $code-type-map {
2020-02-10 13:34:57 +01:00
&.#{$type}::before {
2019-08-11 19:36:19 +02:00
content: $text;
}
}
table, tr, td {
margin: 0;
2020-02-10 13:34:57 +01:00
border: none !important;
2019-08-11 19:36:19 +02:00
}
2020-02-10 13:34:57 +01:00
td {
padding: .2rem .4rem;
}
2020-02-10 13:34:57 +01:00
.lntd {
&:first-child {
width: 1.2rem;
2020-02-10 13:34:57 +01:00
/* LineNumbersTable */
.lnt {
color: $code-info-color;
}
/* LineHighlight */
.hl {
font-weight: bolder;
}
}
&:last-child {
/* LineHighlight */
.hl {
display: block;
background-color: darken($code-background-color, 5%);
.dark-theme & {
background-color: darken($code-background-color-dark, 5%);
}
}
}
}
}
2019-08-11 19:36:19 +02:00
2020-01-31 11:46:28 +01:00
.highlight {
2020-02-10 13:34:57 +01:00
font-family: $code-font-family;
/* Comment */ .c,
/* CommentHashbang */ .ch,
/* CommentMultiline */ .cm,
/* CommentSingle */ .c1,
/* CommentSpecial */ .cs,
/* CommentPreproc */ .cp,
/* CommentPreprocFile */ .cpf { font-style: italic }
/* GenericUnderline */ .gl { text-decoration: underline }
@each $class, $color in $code-highlight-color-map {
.#{$class} { color: $color; }
}
2019-08-11 19:36:19 +02:00
.dark-theme & {
2020-02-10 13:34:57 +01:00
@each $class, $color in $code-highlight-color-map-dark {
.#{$class} { color: $color; }
}
2019-08-11 19:36:19 +02:00
}
}