mirror of
https://github.com/d0zingcat/NotionNext.git
synced 2026-06-03 15:10:19 +00:00
@@ -17,7 +17,7 @@ export const LayoutSlug = props => {
|
|||||||
|
|
||||||
const scrollListener = () => {
|
const scrollListener = () => {
|
||||||
const scrollY = window.pageYOffset
|
const scrollY = window.pageYOffset
|
||||||
const shouldShow = scrollY > 220
|
const shouldShow = scrollY > 220 && post?.toc?.length > 0
|
||||||
|
|
||||||
if (shouldShow !== show) {
|
if (shouldShow !== show) {
|
||||||
switchShow(shouldShow)
|
switchShow(shouldShow)
|
||||||
@@ -46,7 +46,7 @@ export const LayoutSlug = props => {
|
|||||||
>
|
>
|
||||||
|
|
||||||
<div id='inner-wrapper' className='flex'>
|
<div id='inner-wrapper' className='flex'>
|
||||||
<div className='drop-shadow-xl max-w-4xl 2xl:ml-52'>
|
<div className={'drop-shadow-xl max-w-4xl 2xl:ml-36'}>
|
||||||
<div className="-mt-32 rounded-md mx-3 lg:border lg:rounded-xl lg:py-4 bg-white dark:bg-hexo-black-gray dark:border-black">
|
<div className="-mt-32 rounded-md mx-3 lg:border lg:rounded-xl lg:py-4 bg-white dark:bg-hexo-black-gray dark:border-black">
|
||||||
{lock && <ArticleLock validPassword={validPassword} />}
|
{lock && <ArticleLock validPassword={validPassword} />}
|
||||||
|
|
||||||
|
|||||||
@@ -37,20 +37,12 @@ const BlogPostCard = ({ post, showSummary }) => {
|
|||||||
{/* 描述 */}
|
{/* 描述 */}
|
||||||
<div className="px-4 flex flex-col w-full text-gray-700 dark:text-gray-300">
|
<div className="px-4 flex flex-col w-full text-gray-700 dark:text-gray-300">
|
||||||
|
|
||||||
{(!showPreview || showSummary) && !post.results && post.summary && (
|
{(!showPreview || showSummary) && post.summary && (
|
||||||
<p style={{ overflow: 'hidden', textOverflow: 'ellipsis', display: '-webkit-box', WebkitLineClamp: '4', WebkitBoxOrient: 'vertical' }}
|
<p style={{ overflow: 'hidden', textOverflow: 'ellipsis', display: '-webkit-box', WebkitLineClamp: '4', WebkitBoxOrient: 'vertical' }}
|
||||||
className="replace my-2 text-sm font-light leading-7">
|
className="replace my-2 text-sm font-light leading-7">
|
||||||
{post.summary}
|
{post.summary}
|
||||||
</p>
|
</p>
|
||||||
)}
|
)}
|
||||||
{/* 搜索结果 */}
|
|
||||||
{post.results && (
|
|
||||||
<p className="mt-4 replace text-sm font-light leading-7">
|
|
||||||
{post.results.map(r => (
|
|
||||||
<span key={r}>{r}</span>
|
|
||||||
))}
|
|
||||||
</p>
|
|
||||||
)}
|
|
||||||
|
|
||||||
<div className='text-gray-800 justify-between flex my-2 dark:text-gray-300'>
|
<div className='text-gray-800 justify-between flex my-2 dark:text-gray-300'>
|
||||||
<Link
|
<Link
|
||||||
|
|||||||
@@ -1,17 +1,15 @@
|
|||||||
export default function HeaderArticle({ post, siteInfo }) {
|
export default function HeaderArticle({ post, siteInfo }) {
|
||||||
const headerImage = post?.page_cover ? `url("${post?.page_cover}")` : `url("${siteInfo?.pageCover}")`
|
const headerImage = post?.page_cover ? post?.page_cover : siteInfo?.pageCover
|
||||||
const title = post?.title
|
const title = post?.title
|
||||||
return (
|
return (
|
||||||
<div
|
<div id='header' className="flex h-96 justify-center align-middle items-center w-full relative duration-200 bg-black rounded-t-md">
|
||||||
id="header"
|
{/* eslint-disable-next-line @next/next/no-img-element */}
|
||||||
className="w-full h-80 md:flex-shrink-0 bg-cover bg-center bg-no-repeat"
|
<img
|
||||||
style={{ backgroundImage: headerImage }}
|
src={headerImage}
|
||||||
>
|
alt={title}
|
||||||
<div className="flex flex-col h-80 justify-center ">
|
className="opacity-50 dark:opacity-40 h-full w-full rounded-t-md object-cover"
|
||||||
<div className="font-bold text-xl shadow-text flex justify-center text-center text-white dark:text-white ">
|
/>
|
||||||
{title}
|
<span className='absolute text-white p-6 text-3xl'>{title}</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -7,7 +7,6 @@ import Logo from './Logo'
|
|||||||
import SearchDrawer from './SearchDrawer'
|
import SearchDrawer from './SearchDrawer'
|
||||||
import TagGroups from './TagGroups'
|
import TagGroups from './TagGroups'
|
||||||
import MenuButtonGroupTop from './MenuButtonGroupTop'
|
import MenuButtonGroupTop from './MenuButtonGroupTop'
|
||||||
import { useRouter } from 'next/router'
|
|
||||||
import SideBarDrawer from '@/components/SideBarDrawer'
|
import SideBarDrawer from '@/components/SideBarDrawer'
|
||||||
import SideBar from './SideBar'
|
import SideBar from './SideBar'
|
||||||
|
|
||||||
@@ -23,26 +22,23 @@ const TopNav = props => {
|
|||||||
const { locale } = useGlobal()
|
const { locale } = useGlobal()
|
||||||
const searchDrawer = useRef()
|
const searchDrawer = useRef()
|
||||||
const { isDarkMode } = useGlobal()
|
const { isDarkMode } = useGlobal()
|
||||||
const router = useRouter()
|
|
||||||
|
|
||||||
const scrollTrigger = throttle(() => {
|
const scrollTrigger = throttle(() => {
|
||||||
const scrollS = window.scrollY
|
const scrollS = window.scrollY
|
||||||
const nav = document.querySelector('#sticky-nav')
|
const nav = document.querySelector('#sticky-nav')
|
||||||
const header = document.querySelector('#header')
|
const header = document.querySelector('#header')
|
||||||
const showNav = scrollS <= windowTop || scrollS < 5 || (header && scrollS <= header.clientHeight)// 非首页无大图时影藏顶部 滚动条置顶时隐藏
|
const showNav = scrollS <= windowTop || scrollS < 5 // 非首页无大图时影藏顶部 滚动条置顶时隐藏
|
||||||
// 是否将导航栏透明
|
// 是否将导航栏透明
|
||||||
const navTransparent = (scrollS < document.documentElement.clientHeight - 12 && router.route === '/') || scrollS < 300 // 透明导航条的条件
|
const navTransparent = header && scrollS < 300 // 透明导航条的条件
|
||||||
|
|
||||||
if (header && navTransparent) {
|
if (navTransparent) {
|
||||||
nav && nav.classList.replace('bg-indigo-700', 'bg-none')
|
nav && nav.classList.replace('bg-indigo-700', 'bg-none')
|
||||||
nav && nav.classList.replace('text-black', 'text-white')
|
nav && nav.classList.replace('text-black', 'text-white')
|
||||||
nav && nav.classList.replace('border', 'border-transparent')
|
|
||||||
nav && nav.classList.replace('shadow-sm', 'shadow-none')
|
nav && nav.classList.replace('shadow-sm', 'shadow-none')
|
||||||
nav && nav.classList.replace('dark:bg-hexo-black-gray', 'transparent')
|
nav && nav.classList.replace('dark:bg-hexo-black-gray', 'transparent')
|
||||||
} else {
|
} else {
|
||||||
nav && nav.classList.replace('bg-none', 'bg-indigo-700')
|
nav && nav.classList.replace('bg-none', 'bg-indigo-700')
|
||||||
nav && nav.classList.replace('text-white', 'text-black')
|
nav && nav.classList.replace('text-white', 'text-black')
|
||||||
nav && nav.classList.replace('border-transparent', 'border')
|
|
||||||
nav && nav.classList.replace('shadow-none', 'shadow-sm')
|
nav && nav.classList.replace('shadow-none', 'shadow-sm')
|
||||||
nav && nav.classList.replace('transparent', 'dark:bg-hexo-black-gray')
|
nav && nav.classList.replace('transparent', 'dark:bg-hexo-black-gray')
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user