github/hexo-theme-next
1
0
Fork 0
mirror of https://github.com/next-theme/hexo-theme-next.git synced 2026-01-20 19:02:33 +00:00
Code Issues Packages Projects Releases Wiki Activity

Optimize post-reward style

Browse Source
This commit is contained in:
Mimi 2020-06-24 18:13:47 +08:00
parent 7d25c16d21
commit 35355277f8
6 changed files with 28 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
layout/_partials/post/post-reward.njk
View File

@ -1,9 +1,9 @@
<div class="reward-container"> <div class="reward-container">
<div>{{ page.reward_settings.comment }}</div> <div>{{ page.reward_settings.comment }}</div>
<button onclick="var qr = document.getElementById('qr'); qr.style.display = (qr.style.display === 'none') ? 'block' : 'none';"> <button onclick="document.getElementById('post-reward').classList.toggle('active');">
{{ __('reward.donate') }} {{ __('reward.donate') }}
</button> </button>
<div id="qr" style="display: none;"> <div id="post-reward">
{%- for name, image in theme.reward %} {%- for name, image in theme.reward %}
{%- set builtin = ['wechatpay', 'alipay', 'paypal', 'bitcoin'] %} {%- set builtin = ['wechatpay', 'alipay', 'paypal', 'bitcoin'] %}
@ -12,7 +12,7 @@
{% else %} {% else %}
{%- set translation = name %} {%- set translation = name %}
{%- endif %} {%- endif %}
<div style="display: inline-block;"> <div>
<img src="{{ url_for(image) }}" alt="{{ author }} {{ translation }}"> <img src="{{ url_for(image) }}" alt="{{ author }} {{ translation }}">
<p>{{ translation }}</p> <p>{{ translation }}</p>
</div> </div>

39
source/css/_common/components/post/post-reward.styl
View File

@ -24,8 +24,25 @@
} }
} }
#qr { #post-reward {
padding-top: 20px; padding-top: 20px;
display: none;
&.active {
display: block;
}
div {
display: inline-block;
if (hexo-config('reward_settings.animation')) {
&:hover p {
animation: roll .1s infinite linear;
// The animation may affect :hover of img in dark mode
pointer-events: none;
}
}
}
img { img {
display: inline-block; display: inline-block;
@ -33,20 +50,14 @@
max-width: 100%; max-width: 100%;
width: 180px; width: 180px;
} }
}
if (hexo-config('reward_settings.animation')) { @keyframes roll {
div:hover p { from {
animation: roll .1s infinite linear; transform: rotateZ(30deg);
} }
@keyframes roll { to {
from { transform: rotateZ(-30deg);
transform: rotateZ(30deg);
}
to {
transform: rotateZ(-30deg);
}
}
} }
} }

1
source/css/_common/components/third-party/related-posts.styl vendored
View File

@ -9,7 +9,6 @@
padding: 0; padding: 0;
.popular-posts-item { .popular-posts-item {
// list-style: none;
margin-left: 2em; margin-left: 2em;
.popular-posts-title { .popular-posts-title {

1
source/css/_common/outline/sidebar/sidebar-toc.styl
View File

@ -20,7 +20,6 @@
line-height: 1.8; line-height: 1.8;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
// text-align: justify;
if (!hexo-config('toc.wrap')) { if (!hexo-config('toc.wrap')) {
white-space: nowrap; white-space: nowrap;

1
source/css/_schemes/Mist/_posts-expand.styl
View File

@ -51,7 +51,6 @@
text-align: left; text-align: left;
.btn { .btn {
// color: $grey-dim;
background: none; background: none;
border: 0; border: 0;
border-bottom: 2px solid var(--btn-default-border-color); border-bottom: 2px solid var(--btn-default-border-color);

2
source/css/_schemes/Pisces/_sidebar.styl
View File

@ -90,8 +90,6 @@
} }
.links-of-blogroll-item { .links-of-blogroll-item {
//padding: 0;
if (hexo-config('links_settings.layout') == 'inline') { if (hexo-config('links_settings.layout') == 'inline') {
display: inline-block; display: inline-block;
sidebar-inline-links-item(); sidebar-inline-links-item();