liz/wikijs-fork
liz/wikijs-fork
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: Dark/Light Theme support for code blocks

Browse Source
This commit is contained in:
NGPixel 2017-07-01 23:01:17 -04:00 committed by Nicolas Giard
parent 8cf3f6f066
commit 06b49e037b
2 changed files with 53 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

52
client/scss/components/markdown-content.scss
View File

@ -281,6 +281,58 @@
}
&.is-code-dark {
pre, pre.hljs {
background-color: mc('blue-grey', '900');
border-left-color: mc('blue-grey', '500');
> code {
color: mc('blue-grey', '100');
}
}
}
&.is-code-light {
@import 'node_modules/highlight.js/styles/atom-one-light';
pre, pre.hljs {
background-color: lighten(mc('blue-grey', '50'), 3%);
border-left: 7px solid mc('blue-grey', '100');
border-top: 1px solid mc('blue-grey', '100');
border-bottom: 1px solid mc('blue-grey', '100');
> code {
color: mc('blue-grey', '800');
}
}
}
&.is-code-dark, &.is-code-light {
pre, pre.hljs {
padding: 20px 20px 20px 13px;
font-family: $core-font-monospace;
white-space: pre;
overflow-x: auto;
> code {
border-radius: 5px;
font-weight: 400;
background-color: transparent;
padding: 0;
font-family: $core-font-monospace;
font-size: 13px;
}
& + p {
padding-top: 1em;
}
& + h1, & + h2, & + h3 {
margin-top: 1px;
}
}
}
.align-right {
float:right;
margin: 0 0 10px 10px;

2
server/views/pages/view.pug
View File

@ -77,7 +77,7 @@ block content
h1.title#title= pageData.meta.title
if pageData.meta.subtitle
h2.subtitle= pageData.meta.subtitle
.content.mkcontent(v-pre)
.content.mkcontent(v-pre, class=[appconfig.theme.code.dark ? 'is-code-dark' : 'is-code-light'])
!= pageData.html
modal-create-page(basepath=pageData.meta.path)