Add dark mode (#554)

This commit is contained in:
Philip Molares 2020-09-13 18:04:02 +02:00 committed by GitHub
parent be2428f22c
commit 44637c753e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
80 changed files with 2474 additions and 178 deletions

View file

@ -1,42 +1,55 @@
.markdown-body {
@import '../../../../../../node_modules/highlight.js/styles/github-gist.css';
}
.markdown-body code.hljs {
.markdown-body {
@import '../../../../../../node_modules/highlight.js/styles/github';
padding: 16px;
display: grid;
grid-template-columns: auto minmax(0, 1fr);
body.dark & {
@import '../../../../../../node_modules/highlight.js/styles/tomorrow-night';
}
&.showGutter {
.linenumber {
position: relative;
cursor: default;
z-index: 4;
padding: 0 8px 0 0;
min-width: 20px;
box-sizing: content-box;
color: #afafaf;
border-right: 3px solid #6ce26c;
flex-direction: column;
overflow: hidden;
user-select: none;
code.hljs {
background-color: rgba(27, 31, 35, .05);
body.dark & {
background-color: rgb(27, 31, 35);
}
display: flex;
align-items: flex-end;
body.dark &, & {
padding: 16px;
display: grid;
grid-template-columns: auto minmax(0, 1fr);
&:before {
content: attr(data-line-number);
&.showGutter {
.linenumber {
position: relative;
cursor: default;
z-index: 4;
padding: 0 8px 0 0;
min-width: 20px;
box-sizing: content-box;
color: #afafaf;
border-right: 3px solid #6ce26c;
flex-direction: column;
overflow: hidden;
user-select: none;
display: flex;
align-items: flex-end;
&:before {
content: attr(data-line-number);
}
}
}
&.showGutter .codeline {
margin: 0 0 0 16px;
}
&.wrapLines .codeline {
white-space: pre-wrap;
}
}
}
&.showGutter .codeline {
margin: 0 0 0 16px;
}
&.wrapLines .codeline {
white-space: pre-wrap;
}
}