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

matery

Browse Source
This commit is contained in:
tangly1024
2022-12-24 23:22:26 +08:00
parent d53785caa2
commit b81976edc1
5 changed files with 64 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
themes/matery/LayoutSlug.js
View File

@@ -45,7 +45,8 @@ export const LayoutSlug = props => {
showTag={false}
floatSlot={floatSlot}
>
<div className="-mt-32 rounded-md mx-3 lg:shadow-sm lg:hover:shadow lg:border lg:rounded-xl lg:px-2 lg:py-4 bg-white dark:bg-hexo-black-gray dark:border-black">
<div>
<div className="-mt-32 rounded-md mx-3 lg:shadow-sm lg:hover:shadow lg:border lg:rounded-xl lg:px-2 lg:py-4 bg-white dark:bg-hexo-black-gray dark:border-black">
{lock && <ArticleLock validPassword={validPassword} />}
{!lock && <div id="container" className="overflow-x-auto flex-grow md:w-full ">
@@ -81,9 +82,10 @@ export const LayoutSlug = props => {
</div>
<div className='px-3'>
{post.type === 'Post' && <ArticleAdjacent {...props} /> }
{post.type === 'Post' && <ArticleAdjacent {...props} /> }
</div>
</div>
<div className='block lg:hidden'>
<TocDrawer post={post} cRef={drawerRight} targetRef={targetRef} />
</div>

6
themes/matery/components/ArticleAdjacent.js
View File

@@ -10,14 +10,10 @@ export default function ArticleAdjacent ({ prev, next }) {
if (!prev || !next || !CONFIG_MATERY.ARTICLE_ADJACENT) {
return <></>
}
return <section className='flex-col space-y-3 text-gray-800 items-center text-xs md:text-sm justify-between m-1 '>
return <section className='flex-col py-3 space-y-3 text-gray-800 items-center text-xs md:text-sm md:flex md:flex-row md:space-y-0 md:space-x-4 justify-between m-1 '>
<div>
<BlogPostCard post={prev}/>
</div>
<div>
<BlogPostCard post={next}/>
</div>
</section>
}

6
themes/matery/components/BlogPostCard.js
View File

@@ -13,16 +13,14 @@ const BlogPostCard = ({ post, showSummary }) => {
{CONFIG_MATERY.POST_LIST_COVER && !showPreview && post?.page_cover && !post.results && (
<Link href={`${BLOG.SUB_PATH}/${post.slug}`} passHref>
<div className="flex w-full relative duration-200 bg-black rounded-t-md lg:rounded-r-md lg:rounded-t-none cursor-pointer transform overflow-hidden">
<div className="flex w-full relative duration-200 bg-black rounded-t-md cursor-pointer transform overflow-hidden">
{/* eslint-disable-next-line @next/next/no-img-element */}
<img
src={post?.page_cover}
alt={post.title}
className="opacity-50 max-h-52 lg:max-h-72 w-full hover:scale-125 rounded-t-md lg:rounded-r-md lg:rounded-t-none transform object-cover duration-500"
className="opacity-50 max-h-52 lg:max-h-72 w-full hover:scale-125 rounded-t-md transform object-cover duration-500"
/>
<span className='absolute bottom-0 left-0 text-white p-6 text-2xl' > {post.title}</span>
{/* <Image className='hover:scale-125 rounded-t-xl lg:rounded-r-xl lg:rounded-t-none transform duration-500' src={post?.page_cover} alt={post.title} layout='fill' objectFit='cover' loading='lazy' /> */}
</div>
</Link>
)}

2
themes/matery/components/BlogPostListPage.js
View File

@@ -21,7 +21,7 @@ const BlogPostListPage = ({ page = 1, posts = [], postCount }) => {
<div id="container" className='w-full'>
<div className='pt-6'></div>
{/* 文章列表 */}
<div className="space-y-6 px-4 pt-4">
<div className="space-y-6 px-4 pt-4 md:grid-cols-3 md:grid">
{posts.map(post => (
<BlogPostCard key={post.id} post={post} />
))}

112
themes/matery/components/TopNav.js
View File

@@ -90,70 +90,70 @@ const TopNav = props => {
}
const searchDrawerSlot = <>
{ categories && (
<section className='mt-8'>
<div className='text-sm flex flex-nowrap justify-between font-light px-2'>
<div className='text-gray-600 dark:text-gray-200'><i className='mr-2 fas fa-th-list' />{locale.COMMON.CATEGORY}</div>
<Link href={'/category'} passHref>
<a className='mb-3 text-gray-400 hover:text-black dark:text-gray-400 dark:hover:text-white hover:underline cursor-pointer'>
{locale.COMMON.MORE} <i className='fas fa-angle-double-right' />
</a>
</Link>
</div>
<CategoryGroup currentCategory={currentCategory} categories={categories} />
</section>
) }
{categories && (
<section className='mt-8'>
<div className='text-sm flex flex-nowrap justify-between font-light px-2'>
<div className='text-gray-600 dark:text-gray-200'><i className='mr-2 fas fa-th-list' />{locale.COMMON.CATEGORY}</div>
<Link href={'/category'} passHref>
<a className='mb-3 text-gray-400 hover:text-black dark:text-gray-400 dark:hover:text-white hover:underline cursor-pointer'>
{locale.COMMON.MORE} <i className='fas fa-angle-double-right' />
</a>
</Link>
</div>
<CategoryGroup currentCategory={currentCategory} categories={categories} />
</section>
)}
{ tags && (
<section className='mt-4'>
<div className='text-sm py-2 px-2 flex flex-nowrap justify-between font-light dark:text-gray-200'>
<div className='text-gray-600 dark:text-gray-200'><i className='mr-2 fas fa-tag'/>{locale.COMMON.TAGS}</div>
<Link href={'/tag'} passHref>
<a className='text-gray-400 hover:text-black dark:hover:text-white hover:underline cursor-pointer'>
{locale.COMMON.MORE} <i className='fas fa-angle-double-right' />
</a>
</Link>
</div>
<div className='p-2'>
<TagGroups tags={tags} currentTag={currentTag} />
</div>
</section>
) }
{tags && (
<section className='mt-4'>
<div className='text-sm py-2 px-2 flex flex-nowrap justify-between font-light dark:text-gray-200'>
<div className='text-gray-600 dark:text-gray-200'><i className='mr-2 fas fa-tag' />{locale.COMMON.TAGS}</div>
<Link href={'/tag'} passHref>
<a className='text-gray-400 hover:text-black dark:hover:text-white hover:underline cursor-pointer'>
{locale.COMMON.MORE} <i className='fas fa-angle-double-right' />
</a>
</Link>
</div>
<div className='p-2'>
<TagGroups tags={tags} currentTag={currentTag} />
</div>
</section>
)}
</>
return (<div id='top-nav'>
<SearchDrawer cRef={searchDrawer} slot={searchDrawerSlot}/>
<SearchDrawer cRef={searchDrawer} slot={searchDrawerSlot} />
{/* 导航栏 */}
<div id='sticky-nav' className={'flex justify-center top-0 shadow-black shadow-sm fixed bg-none animate__animated animate__fadeIn dark:bg-hexo-black-gray text-gray-200 w-full z-30 transform duration-200'}>
<div className='w-full max-w-6xl flex justify-between items-center px-4 py-2'>
{/* 左侧功能 */}
<div className='justify-start items-center block lg:hidden '>
<div onClick={toggleMenuOpen} className='w-8 justify-center items-center h-8 cursor-pointer flex lg:hidden'>
{isOpen ? <i className='fas fa-times' /> : <i className='fas fa-bars' />}
</div>
</div>
<div className='flex'>
<Logo {...props} />
</div>
{/* 右侧功能 */}
<div className='mr-1 justify-end items-center '>
<div className='hidden lg:flex'> <MenuButtonGroupTop {...props} /></div>
<div className='block lg:hidden'><Link href={'/search'}>
<a><i className='fas fa-search' /></a>
</Link></div>
</div>
</div>
{/* 导航栏 */}
<div id='sticky-nav' className={'flex justify-center top-0 shadow-black shadow-sm fixed bg-none animate__animated animate__fadeIn dark:bg-hexo-black-gray text-gray-200 w-full z-30 transform duration-200'}>
<div className='w-full max-w-6xl flex justify-between items-center px-4 py-2'>
{/* 左侧功能 */}
<div className='justify-start items-center block lg:hidden '>
<div onClick={toggleMenuOpen} className='w-8 justify-center items-center h-8 cursor-pointer flex lg:hidden'>
{ isOpen ? <i className='fas fa-times'/> : <i className='fas fa-bars'/> }
</div>
</div>
<div className='flex'>
<Logo {...props}/>
</div>
<SideBarDrawer isOpen={isOpen} onClose={toggleMenuClose}>
<SideBar {...props} />
</SideBarDrawer>
{/* 右侧功能 */}
<div className='mr-1 justify-end items-center '>
<div className='hidden lg:flex'> <MenuButtonGroupTop {...props}/></div>
<Link href={'/search'}>
<a><i className='fas fa-search'/></a>
</Link>
</div>
</div>
</div>
<SideBarDrawer isOpen={isOpen} onClose={toggleMenuClose}>
<SideBar {...props}/>
</SideBarDrawer>
</div>)
</div>)
}
export default TopNav