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

Optimize header animation

Browse Source
This commit is contained in:
Mimi 2020-06-28 21:55:51 +08:00
parent b39ba186d9
commit 5b72a1de42
4 changed files with 11 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
layout/_scripts/noscript.njk
View File

@ -2,6 +2,8 @@
<style>
body { margin-top: 2rem; }
.use-motion .header-inner,
.use-motion .site-brand-container .toggle,
.use-motion .menu-item,
.sidebar-inner,
.use-motion .post-block,
@ -13,7 +15,7 @@
.use-motion .site-title,
.use-motion .site-subtitle,
.use-motion .site-brand-container .toggle {
.use-motion .custom-logo-image {
opacity: initial;
top: initial;
}

6
source/css/_common/outline/header/header.styl
View File

@ -23,6 +23,12 @@
padding: 0 10px;
}
.use-motion {
.header-inner, .site-brand-container .toggle {
opacity: 0;
}
}
@import 'site-meta';
@import 'site-nav';
@import 'menu';

8
source/css/_common/outline/header/site-nav.styl
View File

@ -26,11 +26,3 @@
display: block;
}
}
.use-motion {
.site-brand-container .toggle {
opacity: 0;
position: relative;
top: -10px;
}
}

7
source/js/motion.js
View File

@ -29,6 +29,7 @@ NexT.motion.integrator = {
NexT.motion.middleWares = {
logo: function(integrator) {
const sequence = [];
const header = document.querySelector('.header-inner');
const image = document.querySelector('.custom-logo-image');
const title = document.querySelector('.site-title');
const subtitle = document.querySelector('.site-subtitle');
@ -62,16 +63,12 @@ NexT.motion.middleWares = {
});
}
header && pushToSequence(header);
CONFIG.scheme === 'Mist' && logoLine.length && getMistLineSettings(logoLine);
CONFIG.scheme === 'Muse' && image && pushToSequence(image);
title && pushToSequence(title);
subtitle && pushToSequence(subtitle);
toggle.length && pushToSequence(toggle);
(CONFIG.scheme === 'Pisces' || CONFIG.scheme === 'Gemini') && image && pushToSequence(image);
if (sequence.length > 0) {