xaoxuu
/
hexo-theme-stellar
mirror of https://github.com/xaoxuu/hexo-theme-stellar
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

add valine comment

This commit is contained in:
xaoxuu 2021-03-13 22:30:07 +08:00
parent 0835ab6716
commit 8f414e1fc4
9 changed files with 263 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
_config.yml
View File

@ -67,7 +67,7 @@ article:
######## Comments ########
comments:
service: utterances # utterances
service: # utterances, valine
# utterances
# https://utteranc.es/
utterances:
@ -77,19 +77,33 @@ comments:
theme:
light: github-light
dark: github-dark
valine:
js: https://cdn.jsdelivr.net/npm/valine@1.4/dist/Valine.min.js
appId: # your appId
appKey: # your appKey
placeholder:
meta: [nick,mail,link] # valine comment header info
requiredFields: [nick,mail]
enableQQ: true # Unstable avatar link
recordIP: false # Record commenter IP
avatar: robohash # gravatar style https://valine.js.org/avatar
pageSize: 10 # comment list page size
lang: zh-cn
highlight: true
mathJax: false
######## Footer ########
footer:
social:
- icon: '<img src="https://cdn.jsdelivr.net/gh/cdn-x/placeholder@1.0.1/social/25678f144c438.svg"/>'
url: /atom.xml
- icon: '<img src="https://cdn.jsdelivr.net/gh/cdn-x/placeholder@1.0.1/social/08a41b181ce68.svg"/>'
url: /
- icon: '<img src="https://cdn.jsdelivr.net/gh/cdn-x/placeholder@1.0.1/social/cf1ae151f9e83.svg"/>'
url: /
- icon: '<img src="https://cdn.jsdelivr.net/gh/cdn-x/placeholder@1.0.1/social/942ebbf1a4b91.svg"/>'
url: /
# - icon: '<img src="https://cdn.jsdelivr.net/gh/cdn-x/placeholder@1.0.1/social/25678f144c438.svg"/>'
# url: /atom.xml
# - icon: '<img src="https://cdn.jsdelivr.net/gh/cdn-x/placeholder@1.0.1/social/08a41b181ce68.svg"/>'
# url: /
# - icon: '<img src="https://cdn.jsdelivr.net/gh/cdn-x/placeholder@1.0.1/social/cf1ae151f9e83.svg"/>'
# url: /
# - icon: '<img src="https://cdn.jsdelivr.net/gh/cdn-x/placeholder@1.0.1/social/942ebbf1a4b91.svg"/>'
# url: /
license: '[CC BY-NC-SA 4.0](https://creativecommons.org/licenses/by-nc-sa/4.0/)'
source: #'[GitHub](https://github.com/xaoxuu/hexo-theme-stellar)'

19
layout/_partial/plugins/comments/valine/layout.ejs Normal file
View File

@ -0,0 +1,19 @@
<%
function layoutDiv() {
var el = '';
el += '<div id="valine_container" class="valine_thread"';
let cfg = {};
if (page.comment_id) {
cfg['comment_id'] = page.comment_id;
}
for (let key of Object.keys(cfg)) {
if (cfg[key]) {
el += ' ' + key + '="' + cfg[key] + '"';
}
}
el += '><svg class="loading" style="vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2709"><path d="M832 512c0-176-144-320-320-320V128c211.2 0 384 172.8 384 384h-64zM192 512c0 176 144 320 320 320v64C300.8 896 128 723.2 128 512h64z" p-id="2710"></path></svg></div>';
return el;
}
%>
<%- layoutDiv() %>

41
layout/_partial/plugins/comments/valine/script.ejs Normal file
View File

@ -0,0 +1,41 @@
<%- js(theme.comments.valine.js) %>
<script>
function emoji(path, idx, ext) {
return path + "/" + path + "-" + idx + "." + ext;
}
var emojiMaps = {};
for (var i = 1; i <= 54; i++) {
emojiMaps['tieba-' + i] = emoji('tieba', i, 'png');
}
for (var i = 1; i <= 101; i++) {
emojiMaps['qq-' + i] = emoji('qq', i, 'gif');
}
for (var i = 1; i <= 116; i++) {
emojiMaps['aru-' + i] = emoji('aru', i, 'gif');
}
for (var i = 1; i <= 125; i++) {
emojiMaps['twemoji-' + i] = emoji('twemoji', i, 'png');
}
for (var i = 1; i <= 4; i++) {
emojiMaps['weibo-' + i] = emoji('weibo', i, 'png');
}
function load_comment(){
if(!document.getElementById("valine_container"))return;
const el = document.getElementById("valine_container");
var path = el.getAttribute('comment_id');
const placeholder = "<%= theme.comments.valine.placeholder %>";
if (!path) {
path = decodeURI(window.location.pathname);
}
var valine = new Valine();
valine.init(Object.assign(<%- JSON.stringify(theme.comments.valine) %>, {
el: '#valine_container',
path: path,
placeholder: placeholder,
emojiCDN: 'https://cdn.jsdelivr.net/gh/volantis-x/cdn-emoji/valine/',
emojiMaps: emojiMaps,
}));
}
load_comment();
</script>

2
scripts/tags/about.js
View File

@ -17,6 +17,7 @@ hexo.extend.tag.register('about', function(args, content) {
el += '<div class="tag-plugin about">';
el += '<div class="about-header">';
// avatar
if (args.avatar) {
el += '<div class="avatar">'
el += '<img src="' + args.avatar + '"';
if (args.height && args.height.length > 0) {
@ -25,6 +26,7 @@ hexo.extend.tag.register('about', function(args, content) {
el += '/>';
}
el += '</div>';
}
// title
if (rows.length > 0) {
// el += '<div class="title">';

4
source/css/_common/input.styl
View File

@ -1,11 +1,9 @@
input
display: block
input
background: none
border: none
input.copy-area
display: block
font-family: $ff-code
font-size: $fs-12
font-weight: 700

2
source/css/_layout/md.styl
View File

@ -12,6 +12,8 @@ article.md.excerpt
article.md.content
position: relative
margin-bottom: 2rem
>:first-child
margin-top: 0
h1.article-title
margin-top: 0.5rem
line-height: 1.2

1
source/css/_layout/partial/bread-nav.styl
View File

@ -1,7 +1,6 @@
// 面包屑导航
.bread-nav
padding: 1rem 1rem 0
margin-top: 1rem
color: var(--text-p3)
font-weight: 500
div#breadcrumb

166
source/css/_plugins/comments/valine.styl Normal file
View File

@ -0,0 +1,166 @@
.cmt-body.valine
margin-top: 1rem
#valine_container
line-height: 1.5 !important
img
display: inline
.vwrap
background: var(--card)
border-radius: $border-block
border-style: dashed
border: 1px dashed var(--text-meta)
&:hover
border-color: $color-theme
.vheader
border-color: $color-theme
.cancel-reply
margin-top: 0
margin-bottom: 0
.vheader
margin: -10px
padding: 5px 10px 0
background: var(--site-bg)
border-bottom: 1px dashed var(--text-meta)
.vinput
border: none
.vedit
.vicon
height: 22px
.vemojis,.vpreview
background: var(--block)
border-radius: 4px
padding: 0.5rem
scrollbar(0, 0)
.vemoji
max-height: 22px
max-width: 100px
i
width: auto
padding: 8px
border-radius: 4px
trans2: box-shadow background
&:hover
background: linear-gradient(145deg, #eee, #fff)
box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1), -1px -1px 2px rgba(255, 255, 255, 0.5), inset 8px 8px 16px rgba(0, 0, 0, 0.05), inset -8px -8px 16px rgba(255, 255, 255, 0.4)
&:active
background: linear-gradient(145deg, #eee, #fff)
box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.1), -0px -0px 0px rgba(255, 255, 255, 0.8), inset 2px 2px 4px rgba(0, 0, 0, 0.1), inset -2px -2px 4px rgba(255, 255, 255, 1), inset -8px -8px 16px rgba(255, 255, 255, 0.4)
.vedit
.vctrl span
padding: 0
margin: 10px
span
fill: var(--text-p1)
&.actived
fill: $color-theme
.vcount
color: var(--text-p1)
font-size: $fs-13
padding: 0
font-weight: inherit
.vnum
color: var(--text-p1)
font-size: $fs-h2
font-weight: 700
button
border: none
padding: 4px 2rem
border-radius: 4px
background: var(--block)
color: var(--text-p1)
line-height: 2
font-size: 14px
font-weight: 500
trans()
&:hover
background: var(--block-hover)
&.vmore
width: 100%
padding: 8px 2rem
.vcards
margin-top: 0.5rem
>.vcard
border-radius: $border-block
background: var(--card)
border: 1px dashed var(--block-border)
padding: 1rem
margin-bottom: 1rem
.vh
border-bottom: none
.vquote
border-left: none
.vimg
border: 1px solid white
padding: 0
background: var(--block)
.vhead
span
&.vnick
color: var(--text-p3)
cursor: default
a
&.vnick
color: #ff9800
font-weight: 700
&:hover
color: $color-hover
.vsys
margin: 2px
padding: 1px 8px
background-color: var(--block)
display: none
.vmeta
.vat
font-weight: bold
color: var(--text-p1)
float: none
trans()
padding: 4px 8px
border-radius: 2px
&:hover
color: $color-hover
background-color: var(--block)
.vcontent
padding-top: 0
blockquote
padding-top: 1rem
padding-bottom: 1rem
background: var(--block)
border-left: 3px solid $color-theme
code
color: var(--text-p1)
pre
background: var(--color-codeblock)
code
border: none
a
color: $color-link
line-height: inherit
trans()
&:hover
color: $color-hover
text-decoration: underline
p
color: var(--text-p1)
line-height: inherit
.vemoji
max-height: 24px
border-radius: 0
margin-top: -10px
max-width: 100px
.vempty
color: var(--color-meta)
.vpower
&,a
font-size: $fs-12
a
color: var(--text-p1)
&:hover
text-decoration: underline
color: $color-hover
.vinput
color: var(--text-p1)
p
color: var(--text-p1)

2
source/css/_plugins/index.styl
View File

@ -9,3 +9,5 @@ if hexo-config('plugins.scrollreveal.enable')
// 评论
if hexo-config('comments.service') == 'utterances'
@import 'comments/utterances'
if hexo-config('comments.service') == 'valine'
@import 'comments/valine'