matery-微调

This commit is contained in:
tangly1024
2022-12-25 19:39:30 +08:00
parent 5678b89001
commit 6ee7870847
3 changed files with 5 additions and 18 deletions

View File

@@ -37,20 +37,12 @@ const BlogPostCard = ({ post, showSummary }) => {
{/* 描述 */}
<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' }}
className="replace my-2 text-sm font-light leading-7">
{post.summary}
</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'>
<Link

View File

@@ -2,12 +2,12 @@ export default function HeaderArticle({ post, siteInfo }) {
const headerImage = post?.page_cover ? post?.page_cover : siteInfo?.pageCover
const title = post?.title
return (
<div className="flex h-96 justify-center align-middle items-center w-full relative duration-200 bg-black rounded-t-md">
<div id='header' className="flex h-96 justify-center align-middle items-center w-full relative duration-200 bg-black rounded-t-md">
{/* eslint-disable-next-line @next/next/no-img-element */}
<img
src={headerImage}
alt={title}
className="opacity-50 h-full w-full rounded-t-md object-cover"
className="opacity-50 dark:opacity-40 h-full w-full rounded-t-md object-cover"
/>
<span className='absolute text-white p-6 text-3xl'>{title}</span>
</div>

View File

@@ -7,7 +7,6 @@ import Logo from './Logo'
import SearchDrawer from './SearchDrawer'
import TagGroups from './TagGroups'
import MenuButtonGroupTop from './MenuButtonGroupTop'
import { useRouter } from 'next/router'
import SideBarDrawer from '@/components/SideBarDrawer'
import SideBar from './SideBar'
@@ -23,27 +22,23 @@ const TopNav = props => {
const { locale } = useGlobal()
const searchDrawer = useRef()
const { isDarkMode } = useGlobal()
const router = useRouter()
const scrollTrigger = throttle(() => {
const scrollS = window.scrollY
const nav = document.querySelector('#sticky-nav')
// const header = document.querySelector('#header')
const header = document.querySelector('#header')
const showNav = scrollS <= windowTop || scrollS < 5 // 非首页无大图时影藏顶部 滚动条置顶时隐藏
// 是否将导航栏透明
const navTransparent = (scrollS < document.documentElement.clientHeight - 12 && router.route === '/') || scrollS < 300 // 透明导航条的条件
console.log('导航栏透明', navTransparent)
const navTransparent = header && scrollS < 300 // 透明导航条的条件
if (navTransparent) {
nav && nav.classList.replace('bg-indigo-700', 'bg-none')
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('dark:bg-hexo-black-gray', 'transparent')
} else {
nav && nav.classList.replace('bg-none', 'bg-indigo-700')
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('transparent', 'dark:bg-hexo-black-gray')
}