theme 优化

This commit is contained in:
tangly1024.com
2024-01-30 18:05:37 +08:00
parent 51d3cdc9fc
commit b5bfdcba4b
16 changed files with 180 additions and 205 deletions

View File

@@ -44,7 +44,10 @@ const LayoutBase = props => {
const { onLoading, fullWidth } = useGlobal()
const router = useRouter()
const containerSlot= router.route==='/' ? <Announcement {...props} /> : <BlogListBar {...props} />
const headerSlot= siteConfig('MATERY_HOME_BANNER_ENABLE', null, CONFIG) && router.route==='/' ? <Hero {...props} /> : null
const headerSlot= siteConfig('MATERY_HOME_BANNER_ENABLE', null, CONFIG) && router.route==='/'
? <Hero {...props} /> : (post && !fullWidth ? <PostHeader {...props} /> : null)
const floatRightBottom = post ? <JumpToCommentButton /> : null
return (
<div id='theme-matery' className="min-h-screen flex flex-col justify-between bg-hexo-background-gray dark:bg-black w-full">
@@ -61,7 +64,7 @@ const LayoutBase = props => {
appear={true}
enter="transition ease-in-out duration-700 transform order-first"
enterFrom="opacity-0 -translate-y-16"
enterTo="opacity-100"
enterTo="opacity-100 w-full"
leave="transition ease-in-out duration-300 transform"
leaveFrom="opacity-100 translate-y-0"
leaveTo="opacity-0 translate-y-16"
@@ -82,7 +85,7 @@ const LayoutBase = props => {
appear={true}
enter="transition ease-in-out duration-700 transform order-first"
enterFrom="opacity-0 translate-y-16"
enterTo="opacity-100"
enterTo="opacity-100 w-full"
leave="transition ease-in-out duration-300 transform"
leaveFrom="opacity-100 translate-y-0"
leaveTo="opacity-0 -translate-y-16"
@@ -101,7 +104,7 @@ const LayoutBase = props => {
</div>
{/* 右下角悬浮 */}
<RightFloatButtons {...props} />
<RightFloatButtons {...props} floatRightBottom={floatRightBottom}/>
{/* 页脚 */}
<Footer title={siteConfig('TITLE')} />
@@ -155,13 +158,13 @@ const LayoutSearch = props => {
}
})
return (
<div {...props} currentSearch={currentSearch}>
<>
{!currentSearch
? <SearchNave {...props} />
: <div id="posts-wrapper">
{siteConfig('POST_LIST_STYLE') === 'page' ? <BlogPostListPage {...props} /> : <BlogPostListScroll {...props} />}
</div>}
</div>
</>
)
}
@@ -172,7 +175,7 @@ const LayoutSearch = props => {
*/
const LayoutArchive = (props) => {
const { archivePosts } = props
return <div {...props} headerSlot={<PostHeader {...props} />} >
return <>
<Card className='w-full -mt-32'>
<div className="mb-10 pb-20 bg-white md:p-12 p-3 min-h-full dark:bg-hexo-black-gray">
{Object.keys(archivePosts).map(archiveTitle => (
@@ -184,7 +187,7 @@ const LayoutArchive = (props) => {
))}
</div>
</Card>
</div>
</>
}
/**
@@ -195,9 +198,8 @@ const LayoutArchive = (props) => {
const LayoutSlug = props => {
const { post, lock, validPassword } = props
const { fullWidth } = useGlobal()
const headerSlot = fullWidth ? null : <PostHeader {...props} />
return (<div {...props} headerSlot={headerSlot} showCategory={false} showTag={false} floatRightBottom={<JumpToCommentButton />}>
return (<>
<div id='inner-wrapper' className={`w-full ${fullWidth ? '' : 'lg:max-w-3xl 2xl:max-w-4xl'}`} >
@@ -260,7 +262,7 @@ const LayoutSlug = props => {
</div>
</div>
</>
)
}
@@ -283,7 +285,7 @@ const Layout404 = props => {
}, 3000)
})
return (
<div {...props}>
<>
<div className="text-black w-full h-screen text-center justify-center content-center items-center flex flex-col">
<div className="dark:text-gray-200">
<h2 className="inline-block border-r-2 border-gray-600 mr-2 px-3 py-2 align-top">
@@ -294,7 +296,7 @@ const Layout404 = props => {
</div>
</div>
</div>
</div>
</>
)
}
@@ -307,7 +309,7 @@ const LayoutCategoryIndex = props => {
const { categoryOptions } = props
return (
<div {...props} headerSlot={<PostHeader {...props} />} >
<>
<div id='inner-wrapper' className='w-full'>
<div className="drop-shadow-xl -mt-32 rounded-md mx-3 px-5 lg:border lg:rounded-xl lg:px-2 lg:py-4 bg-white dark:bg-hexo-black-gray dark:border-black dark:text-gray-300">
@@ -324,7 +326,7 @@ const LayoutCategoryIndex = props => {
</div>
</div>
</div>
</div>
</>
)
}
@@ -337,7 +339,7 @@ const LayoutTagIndex = props => {
const { tagOptions } = props
const { locale } = useGlobal()
return (
<div {...props} headerSlot={<PostHeader {...props} />} >
<>
<div id='inner-wrapper' className='w-full drop-shadow-xl'>
<div className="-mt-32 rounded-md mx-3 px-5 lg:border lg:rounded-xl lg:px-2 lg:py-4 bg-white dark:bg-hexo-black-gray dark:border-black">
@@ -357,7 +359,7 @@ const LayoutTagIndex = props => {
</div>
</div>
</div>
</div>
</>
)
}