d0zingcat/NotionNext
1
0
Fork 0
mirror of https://github.com/d0zingcat/NotionNext.git synced 2026-05-14 07:26:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

HEXO 导航栏淡入

Browse Source
This commit is contained in:
tangly1024
2022-03-08 17:29:40 +08:00
parent 972633aa9e
commit 69dc390b0e
3 changed files with 7 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
themes/Hexo/components/Collapse.js
View File

@@ -5,6 +5,10 @@ const Collapse = props => {
const collapseRef = useRef(null)
const collapseSection = element => {
const sectionHeight = element.scrollHeight
const currentHeight = element.style.height
if (currentHeight === '0px') {
return
}
requestAnimationFrame(function () {
element.style.height = sectionHeight + 'px'
requestAnimationFrame(function () {

2
themes/Hexo/components/HeaderArticle.js
View File

@@ -36,7 +36,7 @@ export default function HeaderArticle ({ post }) {
return (
<div
id="header"
className="w-full h-96 relative md:flex-shrink-0 overflow-hidden bg-cover bg-center bg-no-repeat"
className="w-full h-96 relative md:flex-shrink-0 overflow-hidden bg-cover bg-center bg-no-repeat animate__animated animate__fadeIn"
style={{ backgroundImage: headerImage }}
>
<header className="animate__slideInDown animate__animated bg-black bg-opacity-70 absolute top-0 w-full h-96 py-10 flex justify-center items-center font-sans">

4
themes/Hexo/components/TopNav.js
View File

@@ -91,7 +91,7 @@ const TopNav = (props) => {
<SearchDrawer cRef={searchDrawer} slot={searchDrawerSlot}/>
{/* 导航栏 */}
<div id='sticky-nav' className={`${CONFIG_HEXO.NAV_TYPE !== 'normal' ? 'fixed bg-white' : ' bg-none -mb-10'} dark:bg-black dark:bg-opacity-50 dark:text-gray-200 bg-opacity-80 text-black w-full top-0 z-20 transform duration-500 font-sans`}>
<div id='sticky-nav' className={`${CONFIG_HEXO.NAV_TYPE !== 'normal' ? 'fixed bg-white' : ' bg-none -mb-10'} animate__animated animate__fadeIn dark:bg-black dark:bg-opacity-50 dark:text-gray-200 bg-opacity-80 text-black w-full top-0 z-20 transform duration-500 font-sans`}>
<div className='w-full flex justify-between items-center px-4 py-4 shadow'>
<div className='flex'>
<Logo/>
@@ -107,7 +107,7 @@ const TopNav = (props) => {
</div>
<Collapse isOpen={isOpen} className='shadow-xl'>
<div className='bg-white pt-1 py-2 px-5'>
<div className='bg-white pt-1 py-2 px-5 flex lg:hidden'>
<MenuList {...props}/>
</div>
</Collapse>