pref: optimize fade-in-down-animation

This commit is contained in:
XPoet 2020-04-30 00:34:31 +08:00
parent 2406efdc5d
commit f23ac2d795
7 changed files with 73 additions and 59 deletions

View File

@ -1,4 +1,5 @@
<div class="about-container fade-in-down-animation"> <div class="fade-in-down-animation">
<div class="about-container">
<div class="about-content markdown-body"> <div class="about-content markdown-body">
<%- page.content %> <%- page.content %>
</div> </div>
@ -8,3 +9,4 @@
<% } %> <% } %>
</div> </div>
</div> </div>
</div>

View File

@ -1,3 +1,5 @@
<div class="archive-container fade-in-down-animation"> <div class="fade-in-down-animation">
<div class="archive-container ">
<%- partial('_partial/archive-list', {posts_new: site.posts}) %> <%- partial('_partial/archive-list', {posts_new: site.posts}) %>
</div> </div>
</div>

View File

@ -1,3 +1,4 @@
<div class="fade-in-down-animation">
<div class="article-content-container"> <div class="article-content-container">
<div class="article-title"> <div class="article-title">
@ -33,9 +34,11 @@
<%- partial('_partial/comments/comment') %> <%- partial('_partial/comments/comment') %>
</div> </div>
</div> </div>
</div>
<% if ( (theme.magic.enable && !theme.magic.sidebar.enable && theme.toc.enable) || (!theme.magic.enable && theme.toc.enable)) { %> <% if ( (theme.magic.enable && !theme.magic.sidebar.enable && theme.toc.enable) || (!theme.magic.enable && theme.toc.enable)) { %>
<div class="article-toc-container fade-in-down-animation"> <div class="article-toc-container fade-in-down-animation">
<div class="article-toc">
<%- partial('_partial/sidebar-toc') %> <%- partial('_partial/sidebar-toc') %>
</div> </div>
</div>
<% } %> <% } %>

View File

@ -1,6 +1,8 @@
<div class="category-container fade-in-down-animation"> <div class="fade-in-down-animation">
<div class="category-container">
<div class="category-name"> <div class="category-name">
<i class="fa fa-folder"></i> <%- __('category') %><%= page.category %> [<%= page.posts.length %>] <i class="fa fa-folder"></i> <%- __('category') %><%= page.category %> [<%= page.posts.length %>]
</div> </div>
<%- partial('_partial/archive-list', {posts_new: page.posts}) %> <%- partial('_partial/archive-list', {posts_new: page.posts}) %>
</div> </div>
</div>

View File

@ -1,4 +1,7 @@
<div class="tag-container fade-in-down-animation"> <div class="fade-in-down-animation">
<div class="tag-name"><i class="fa fa-tag"></i> <%- __('tag') %><%= page.tag %> [<%= page.posts.length %>]</div> <div class="tag-container">
<div class="tag-name"><i class="fa fa-tag"></i> <%- __('tag') %><%= page.tag %> [<%= page.posts.length %>]
</div>
<%- partial('_partial/archive-list', {posts_new: page.posts}) %> <%- partial('_partial/archive-list', {posts_new: page.posts}) %>
</div> </div>
</div>

View File

@ -43,7 +43,7 @@ $icon-size = 1.2em;
} }
.search-header { .search-header {
background: var(--border-color); background: var(--fourth-text-color);
border-top-left-radius: 2px; border-top-left-radius: 2px;
border-top-right-radius: 2px; border-top-right-radius: 2px;
display: flex; display: flex;

View File

@ -58,9 +58,6 @@ if ((hexo-config('magic.enable') && !hexo-config('magic.sidebar.enable') && hexo
.article-toc-container { .article-toc-container {
position: fixed; position: fixed;
top: $header-height + $component-interspace; top: $header-height + $component-interspace;
background: var(--background-color);
max-width: 200px;
max-height: 600px;
if (hexo-config('side-tools.position') == left) { if (hexo-config('side-tools.position') == left) {
right: 30px; right: 30px;
@ -68,6 +65,11 @@ if ((hexo-config('magic.enable') && !hexo-config('magic.sidebar.enable') && hexo
left: 30px; left: 30px;
} }
.article-toc {
max-width: 200px;
max-height: 600px;
background: var(--background-color);
if (hexo-config('magic.enable') == true) { if (hexo-config('magic.enable') == true) {
magic-container(1.02, 1.02, 20px); magic-container(1.02, 1.02, 20px);
} else { } else {
@ -75,7 +77,7 @@ if ((hexo-config('magic.enable') && !hexo-config('magic.sidebar.enable') && hexo
border: 1px solid var(--border-color); border: 1px solid var(--border-color);
padding: 20px; padding: 20px;
} }
}
} }