feat(valine): add valine dark theme

This commit is contained in:
Dillon 2020-02-15 00:38:15 +08:00
parent e8d72608ea
commit b9c7510260
6 changed files with 131 additions and 95 deletions

View file

@ -5,3 +5,4 @@ katex@0.11.1
aplayer@1.10.1
animate.css@3.7.2
mermaid@8.4.2
valine@1.3.10

View file

@ -1,5 +1,4 @@
.aplayer {
.dark-theme & {
.dark-theme .aplayer {
background: #212121;
&.aplayer-withlist {
@ -110,5 +109,4 @@
}
}
}
}
}

View file

@ -0,0 +1,32 @@
.dark-theme {
// copied from https://github.com/xCss/Valine/issues/221
.v *,
.v .vwrap input,
.v .vwrap input::placeholder,
.v .veditor,
.v .veditor::placeholder,
.v a,
.v a:hover {
color: hsla(0,0%,100%,.75);
opacity: 1;
}
.v .vbtn {
color: hsla(0,0%,100%,.75);
background: #333;
border: none;
}
.v .vbtn:hover {
color: #3090e4;
border-color: #3090e4;
}
.v .vlist .vcard .vhead .vsys {
background: #333;
}
.v code, .v pre {
background: #272C34;
}
}
.v code, .v pre {
text-align: left;
}

View file

@ -13,7 +13,7 @@
{{- /* Gitalk Comment System */ -}}
{{- if .Site.Params.gitalk.owner -}}
<div id="gitalk_container"></div>
<div id="gitalk"></div>
{{- with $CDN.gitalk_css -}}
{{- slice . | $.Scratch.Add "linkCDN" -}}
{{- else -}}
@ -36,7 +36,7 @@
admin: ['{{ .Site.Params.gitalk.owner }}'],
body: decodeURI(location.href),
});
gitalk.render('gitalk_container');
gitalk.render('gitalk');
});
</script>
<noscript>
@ -46,7 +46,8 @@
{{- /* Valine Comment System */ -}}
{{- if .Site.Params.valine.enable -}}
<div id="valine_container"></div>
<div id="valine"></div>
{{- slice "css/lib/valine/dark.scss" | .Scratch.Add "linkLocal" -}}
{{- with $CDN.valine_js -}}
{{- slice . | $.Scratch.Add "scriptCDN" -}}
{{- else -}}
@ -55,7 +56,7 @@
<script>
document.addEventListener("DOMContentLoaded", function(event) {
new Valine({
el: '#valine_container',
el: '#valine',
appId: '{{ .Site.Params.valine.appId }}',
appKey: '{{ .Site.Params.valine.appKey }}',
{{- with .Site.Params.valine.placeholder -}}

View file

@ -0,0 +1,3 @@
.dark-theme .v *,.dark-theme .v .vwrap input,.dark-theme .v .vwrap input::placeholder,.dark-theme .v .veditor,.dark-theme .v .veditor::placeholder,.dark-theme .v a,.dark-theme .v a:hover{color:rgba(255,255,255,0.75);opacity:1}.dark-theme .v .vbtn{color:rgba(255,255,255,0.75);background:#333;border:none}.dark-theme .v .vbtn:hover{color:#3090e4;border-color:#3090e4}.dark-theme .v .vlist .vcard .vhead .vsys{background:#333}.dark-theme .v code,.dark-theme .v pre{background:#272C34}.v code,.v pre{text-align:left}
/*# sourceMappingURL=dark.css.map */

View file

@ -0,0 +1 @@
{"Target":"css/lib/valine/dark.css","MediaType":"text/css","Data":{}}