mirror of
https://github.com/d0zingcat/NotionNext.git
synced 2026-05-31 23:16:54 +00:00
Example主题调整,规范组件命名
This commit is contained in:
@@ -1,68 +1,92 @@
|
||||
import { siteConfig } from '@/lib/config'
|
||||
import Live2D from '@/components/Live2D'
|
||||
import { siteConfig } from '@/lib/config'
|
||||
import { useGlobal } from '@/lib/global'
|
||||
import Link from 'next/link'
|
||||
import dynamic from 'next/dynamic'
|
||||
import Link from 'next/link'
|
||||
import Announcement from './Announcement'
|
||||
const ExampleRecentComments = dynamic(() => import('./ExampleRecentComments'))
|
||||
const ExampleRecentComments = dynamic(
|
||||
() => import('./RecentCommentListForExample')
|
||||
)
|
||||
|
||||
export const SideBar = (props) => {
|
||||
/**
|
||||
* 侧边栏
|
||||
*/
|
||||
export const SideBar = props => {
|
||||
const { locale } = useGlobal()
|
||||
const { latestPosts, categoryOptions, notice } = props
|
||||
return (
|
||||
<div className="w-full md:w-64 sticky top-8">
|
||||
|
||||
<aside className="rounded shadow overflow-hidden mb-6">
|
||||
<h3 className="text-sm bg-gray-100 text-gray-700 dark:bg-hexo-black-gray dark:text-gray-200 py-3 px-4 dark:border-hexo-black-gray border-b">{locale.COMMON.CATEGORY}</h3>
|
||||
|
||||
<div className="p-4">
|
||||
<ul className="list-reset leading-normal">
|
||||
{categoryOptions?.map(category => {
|
||||
return (
|
||||
<Link
|
||||
key={category.name}
|
||||
href={`/category/${category.name}`}
|
||||
passHref
|
||||
legacyBehavior>
|
||||
<li> <a href={`/category/${category.name}`} className="text-gray-darkest text-sm">{category.name}({category.count})</a></li>
|
||||
</Link>
|
||||
)
|
||||
})}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</aside>
|
||||
|
||||
<aside className="rounded shadow overflow-hidden mb-6">
|
||||
<h3 className="text-sm bg-gray-100 text-gray-700 dark:bg-hexo-black-gray dark:text-gray-200 py-3 px-4 dark:border-hexo-black-gray border-b">{locale.COMMON.LATEST_POSTS}</h3>
|
||||
|
||||
<div className="p-4">
|
||||
<ul className="list-reset leading-normal">
|
||||
{latestPosts?.map(p => {
|
||||
return (
|
||||
<Link key={p.id} href={`/${p.slug}`} passHref legacyBehavior>
|
||||
<li> <a href={`/${p.slug}`} className="text-gray-darkest text-sm">{p.title}</a></li>
|
||||
</Link>
|
||||
)
|
||||
})}
|
||||
</ul>
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
<Announcement post={notice}/>
|
||||
|
||||
{siteConfig('COMMENT_WALINE_SERVER_URL') && siteConfig('COMMENT_WALINE_RECENT') && <aside className="rounded shadow overflow-hidden mb-6">
|
||||
<h3 className="text-sm bg-gray-100 text-gray-700 dark:bg-hexo-black-gray dark:text-gray-200 py-3 px-4 dark:border-hexo-black-gray border-b">{locale.COMMON.RECENT_COMMENTS}</h3>
|
||||
|
||||
<div className="p-4">
|
||||
<ExampleRecentComments/>
|
||||
</div>
|
||||
</aside>}
|
||||
|
||||
<aside className="rounded overflow-hidden mb-6">
|
||||
<Live2D />
|
||||
</aside>
|
||||
<div className='w-full md:w-64 sticky top-8'>
|
||||
<aside className='rounded shadow overflow-hidden mb-6'>
|
||||
<h3 className='text-sm bg-gray-100 text-gray-700 dark:bg-hexo-black-gray dark:text-gray-200 py-3 px-4 dark:border-hexo-black-gray border-b'>
|
||||
{locale.COMMON.CATEGORY}
|
||||
</h3>
|
||||
|
||||
<div className='p-4'>
|
||||
<ul className='list-reset leading-normal'>
|
||||
{categoryOptions?.map(category => {
|
||||
return (
|
||||
<Link
|
||||
key={category.name}
|
||||
href={`/category/${category.name}`}
|
||||
passHref
|
||||
legacyBehavior>
|
||||
<li>
|
||||
{' '}
|
||||
<a
|
||||
href={`/category/${category.name}`}
|
||||
className='text-gray-darkest text-sm'>
|
||||
{category.name}({category.count})
|
||||
</a>
|
||||
</li>
|
||||
</Link>
|
||||
)
|
||||
})}
|
||||
</ul>
|
||||
</div>
|
||||
</aside>
|
||||
<aside className='rounded shadow overflow-hidden mb-6'>
|
||||
<h3 className='text-sm bg-gray-100 text-gray-700 dark:bg-hexo-black-gray dark:text-gray-200 py-3 px-4 dark:border-hexo-black-gray border-b'>
|
||||
{locale.COMMON.LATEST_POSTS}
|
||||
</h3>
|
||||
|
||||
<div className='p-4'>
|
||||
<ul className='list-reset leading-normal'>
|
||||
{latestPosts?.map(p => {
|
||||
return (
|
||||
<Link key={p.id} href={`/${p.slug}`} passHref legacyBehavior>
|
||||
<li>
|
||||
{' '}
|
||||
<a
|
||||
href={`/${p.slug}`}
|
||||
className='text-gray-darkest text-sm'>
|
||||
{p.title}
|
||||
</a>
|
||||
</li>
|
||||
</Link>
|
||||
)
|
||||
})}
|
||||
</ul>
|
||||
</div>
|
||||
</aside>
|
||||
{/* 公告栏 */}
|
||||
<Announcement post={notice} />
|
||||
|
||||
{/* 最近评论 */}
|
||||
{siteConfig('COMMENT_WALINE_SERVER_URL') &&
|
||||
siteConfig('COMMENT_WALINE_RECENT') && (
|
||||
<aside className='rounded shadow overflow-hidden mb-6'>
|
||||
<h3 className='text-sm bg-gray-100 text-gray-700 dark:bg-hexo-black-gray dark:text-gray-200 py-3 px-4 dark:border-hexo-black-gray border-b'>
|
||||
{locale.COMMON.RECENT_COMMENTS}
|
||||
</h3>
|
||||
|
||||
<div className='p-4'>
|
||||
<ExampleRecentComments />
|
||||
</div>
|
||||
</aside>
|
||||
)}
|
||||
<aside className='rounded overflow-hidden mb-6'>
|
||||
<Live2D />
|
||||
</aside>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user