mirror of
https://github.com/d0zingcat/NotionNext.git
synced 2026-05-30 15:10:11 +00:00
starter主题logo修复
This commit is contained in:
@@ -33,7 +33,7 @@ export const Header = props => {
|
|||||||
return () => {
|
return () => {
|
||||||
window.removeEventListener('scroll', navBarScollListener)
|
window.removeEventListener('scroll', navBarScollListener)
|
||||||
}
|
}
|
||||||
}, [[isDarkMode]])
|
}, [isDarkMode])
|
||||||
|
|
||||||
// 滚动监听
|
// 滚动监听
|
||||||
const throttleMs = 200
|
const throttleMs = 200
|
||||||
@@ -58,7 +58,7 @@ export const Header = props => {
|
|||||||
<div className='container'>
|
<div className='container'>
|
||||||
<div className='relative -mx-4 flex items-center justify-between'>
|
<div className='relative -mx-4 flex items-center justify-between'>
|
||||||
{/* Logo */}
|
{/* Logo */}
|
||||||
<Logo />
|
<Logo {...props} />
|
||||||
|
|
||||||
<div className='flex w-full items-center justify-between px-4'>
|
<div className='flex w-full items-center justify-between px-4'>
|
||||||
{/* 中间菜单 */}
|
{/* 中间菜单 */}
|
||||||
|
|||||||
@@ -10,10 +10,12 @@ import { useEffect, useState } from 'react'
|
|||||||
* 站点图标
|
* 站点图标
|
||||||
* @returns
|
* @returns
|
||||||
*/
|
*/
|
||||||
export const Logo = ({ white }) => {
|
export const Logo = props => {
|
||||||
|
const { white, NOTION_CONFIG } = props
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
const { isDarkMode } = useGlobal()
|
|
||||||
const logoWhite = siteConfig('STARTER_LOGO_WHITE')
|
const logoWhite = siteConfig('STARTER_LOGO_WHITE')
|
||||||
|
const logoNormal = siteConfig('STARTER_LOGO')
|
||||||
|
const { isDarkMode } = useGlobal()
|
||||||
const [logo, setLogo] = useState(logoWhite)
|
const [logo, setLogo] = useState(logoWhite)
|
||||||
const [logoTextColor, setLogoTextColor] = useState('text-white')
|
const [logoTextColor, setLogoTextColor] = useState('text-white')
|
||||||
|
|
||||||
@@ -24,11 +26,12 @@ export const Logo = ({ white }) => {
|
|||||||
const scrollY = window.scrollY
|
const scrollY = window.scrollY
|
||||||
// 何时显示浅色或白底的logo
|
// 何时显示浅色或白底的logo
|
||||||
const homePageNavBar = router.route === '/' && scrollY < 10 // 在首页并且视窗在页面顶部
|
const homePageNavBar = router.route === '/' && scrollY < 10 // 在首页并且视窗在页面顶部
|
||||||
|
|
||||||
if (white || isDarkMode || homePageNavBar) {
|
if (white || isDarkMode || homePageNavBar) {
|
||||||
setLogo(siteConfig('STARTER_LOGO_WHITE'))
|
setLogo(logoWhite)
|
||||||
setLogoTextColor('text-white')
|
setLogoTextColor('text-white')
|
||||||
} else {
|
} else {
|
||||||
setLogo(siteConfig('STARTER_LOGO'))
|
setLogo(logoNormal)
|
||||||
setLogoTextColor('text-black')
|
setLogoTextColor('text-black')
|
||||||
}
|
}
|
||||||
}, throttleMs)
|
}, throttleMs)
|
||||||
@@ -50,8 +53,9 @@ export const Logo = ({ white }) => {
|
|||||||
router.push('/')
|
router.push('/')
|
||||||
}}
|
}}
|
||||||
src={logo}
|
src={logo}
|
||||||
|
height={14}
|
||||||
alt='logo'
|
alt='logo'
|
||||||
className='header-logo w-full'
|
className='header-logo w-full mr-1'
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
{/* logo文字 */}
|
{/* logo文字 */}
|
||||||
|
|||||||
@@ -81,6 +81,7 @@ const LayoutBase = props => {
|
|||||||
*/
|
*/
|
||||||
const LayoutIndex = props => {
|
const LayoutIndex = props => {
|
||||||
const count = siteConfig('STARTER_BLOG_COUNT', 3, CONFIG)
|
const count = siteConfig('STARTER_BLOG_COUNT', 3, CONFIG)
|
||||||
|
const { locale } = useGlobal()
|
||||||
const posts = props?.allNavPages ? props.allNavPages.slice(0, count) : []
|
const posts = props?.allNavPages ? props.allNavPages.slice(0, count) : []
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
@@ -108,7 +109,7 @@ const LayoutIndex = props => {
|
|||||||
<Blog posts={posts} />
|
<Blog posts={posts} />
|
||||||
<div className='container mx-auto flex justify-end mb-4'>
|
<div className='container mx-auto flex justify-end mb-4'>
|
||||||
<Link className='text-lg underline' href={'/archive'}>
|
<Link className='text-lg underline' href={'/archive'}>
|
||||||
<span>查看全部</span>
|
<span>{locale.COMMON.MORE}</span>
|
||||||
<i className='ml-2 fas fa-arrow-right' />
|
<i className='ml-2 fas fa-arrow-right' />
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user