主色加入蓝色;
缓存读取日志
This commit is contained in:
tangly1024
2021-12-08 13:36:39 +08:00
parent c4a7fa3b86
commit 980531b1ee
10 changed files with 40 additions and 23 deletions

View File

@@ -19,18 +19,18 @@ const BlogPostCard = ({ post, tags }) => {
<div className='px-4 py-4 col-span-3'>
<div className='w-52'>
<Link href={`/category/${post.category}`} passHref>
<span className='cursor-pointer dark:text-gray-200 text-gray-400 text-sm py-1.5 mr-1 hover:underline hover:text-blue-500 transform'>
<span className='cursor-pointer dark:text-gray-200 text-gray-400 text-sm py-1.5 mr-1 hover:underline hover:text-blue-500 dark:hover:text-blue-400 transform'>
<FontAwesomeIcon icon={faFolder} size='sm' className='mr-1 text-sm' />{post.category}
</span>
</Link>
<span className='mx-1 dark:text-gray-400'>|</span>
<Link href={`/archive#${post?.date?.start_date?.substr(0, 7)}`} passHref>
<span className='mt-2 mx-2 text-gray-400 hover:text-blue-400 hover:underline cursor-pointer dark:text-gray-300 text-sm leading-4'>{post.date.start_date}</span>
<span className='mt-2 mx-2 text-gray-400 hover:text-blue-400 hover:underline cursor-pointer dark:text-gray-300 dark:hover:text-blue-400 text-sm leading-4'>{post.date.start_date}</span>
</Link>
</div>
<Link href={`${BLOG.path}/article/${post.slug}`} passHref>
<p className='cursor-pointer my-3 text-lg leading-tight font-bold text-black dark:text-gray-100 hover:underline'>
<p className='cursor-pointer my-3 text-lg leading-tight font-bold text-black dark:text-gray-100 hover:text-blue-500 dark:hover:text-blue-400 hover:underline'>
{post.title}
</p>
</Link>

View File

@@ -12,7 +12,7 @@ const CategoryGroup = ({ currentCategory, categories }) => {
<div className={(selected
? 'bg-gray-200 dark:bg-black text-black dark:text-white'
: 'dark:text-gray-400 text-gray-500') +
' duration-300 hover:text-black dark:hover:text-white hover:underline px-5 cursor-pointer py-2'}>
' duration-300 hover:text-blue-500 dark:hover:text-blue-400 hover:underline px-5 cursor-pointer py-2'}>
<FontAwesomeIcon icon={selected ? faFolderOpen : faFolder} className={`${selected ? 'text-black dark:text-white' : 'text-gray-400'} mr-2 `} />{category}({categories[category]})</div>
</Link>
})}

View File

@@ -38,7 +38,7 @@ const LatestPostsGroup = ({ posts, sliceCount = 5 }) => {
<div
className={
(selected ? 'dark:text-white text-black ' : 'text-gray-500') +
' text-sm flex w-50 overflow-x-hidden whitespace-nowrap hover:text-black dark:hover:text-white cursor-pointer hover:underline'
' text-sm flex w-50 overflow-x-hidden whitespace-nowrap hover:text-blue-500 dark:hover:text-blue-400 cursor-pointer hover:underline'
}>
{post.title}
</div>

View File

@@ -27,7 +27,7 @@ const MenuButtonGroup = ({ allowCollapse = false }) => {
if (link.show) {
const selected = (router.pathname === link.to) || (router.asPath === link.to)
return <Link key={link.id + link.icon} title={link.to} href={link.to} >
<a className={'py-2 px-5 hover:text-black dark:hover:text-white hover:bg-gray-100 cursor-pointer dark:hover:bg-gray-600 duration-100 flex flex-nowrap align-middle ' +
<a className={'py-2 px-5 hover:text-white hover:bg-blue-500 cursor-pointer duration-100 flex flex-nowrap align-middle ' +
(selected ? 'font-bold bg-gray-200 dark:bg-black dark:text-white text-black ' : '')} >
<div className='my-auto w-5 justify-center flex'>
<FontAwesomeIcon icon={link.icon} />

View File

@@ -25,7 +25,11 @@ const RecommendPosts = ({ currentPost, totalPosts }) => {
if (currentPost.tags && currentPost.tags.length) {
const currentTag = currentPost.tags[0]
filteredPosts = totalPosts.filter(
post => post && post.tags && post.tags.includes(currentTag) && post.slug !== currentPost.slug
post =>
post &&
post.tags &&
post.tags.includes(currentTag) &&
post.slug !== currentPost.slug
)
}
shuffleSort(filteredPosts)
@@ -37,13 +41,21 @@ const RecommendPosts = ({ currentPost, totalPosts }) => {
const { locale } = useGlobal()
return <div className='dark:text-gray-300 dark:bg-gray-800 bg-gray-100 p-2 my-2 border-l-4 border-yellow-500'>
<div className='mb-2 font-bold text-xl'>{locale.COMMON.RELATE_POSTS}</div>
<ul className='list-disc px-5 text-sm '>
{filteredPosts.map(post => (
<li className='py-1' key={post.id} ><Link href={`/article/${post.slug}`}><a className='cursor-pointer hover:underline'>{post.title}</a></Link></li>
))}
</ul>
</div>
return (
<div className="dark:text-gray-300">
<div className="mb-2 text-2xl">{locale.COMMON.RELATE_POSTS}</div>
<ul className="list-disc pl-6 text-sm dark:bg-gray-900 bg-gray-100 p-2 my-2 border-l-4 border-yellow-500">
{filteredPosts.map(post => (
<li className="py-1" key={post.id}>
<Link href={`/article/${post.slug}`}>
<a className="cursor-pointer hover:text-blue-500 hover:underline">
{post.title}
</a>
</Link>
</li>
))}
</ul>
</div>
)
}
export default RecommendPosts

View File

@@ -13,7 +13,7 @@ const TagItem = ({ tag, selected }) => {
<Link href={selected ? '/' : `/tag/${encodeURIComponent(tag.name)}`} passHref>
<li
className={`notion-${tag.color}_background list-none cursor-pointer hover:bg-gray-300 rounded-md
duration-200 mr-1 my-1 px-2 py-1 font-medium font-light text-sm whitespace-nowrap
duration-200 mr-1 my-1 px-2 py-1 text-sm whitespace-nowrap
dark:hover:bg-gray-800 dark:hover:text-white hover:text-black
${selected
? ' text-white dark:text-white bg-black dark:hover:bg-gray-900 dark:bg-black'

View File

@@ -4,11 +4,11 @@ import Link from 'next/link'
const TagItemMini = ({ tag, selected = false }) => {
return <Link key={tag} href={selected ? '/' : `/tag/${encodeURIComponent(tag.name)}`} passHref>
<div className={`cursor-pointer inline-block rounded hover:bg-gray-500 duration-200
mr-2 my-1 py-1 px-2 font-medium font-light text-xs whitespace-nowrap dark:hover:text-white
<div className={`cursor-pointer inline-block rounded hover:bg-blue-500 hover:text-white duration-200
mr-2 my-1 py-1 px-2 text-xs whitespace-nowrap dark:hover:text-white
${selected
? 'text-white dark:text-gray-300 bg-black dark:bg-black dark:hover:bg-gray-900'
: `text-gray-600 dark:text-gray-600 hover:shadow-xl hover:text-white dark:hover:bg-gray-600 dark:border-gray-600 notion-${tag.color}_background `}` }>
: `text-gray-600 dark:text-gray-600 hover:shadow-xl dark:border-gray-400 notion-${tag.color}_background `}` }>
<div>{selected && <FontAwesomeIcon icon={faTag} className='mr-1'/>} {tag.name + (tag.count ? `(${tag.count})` : '')} </div>
</div>
</Link>

View File

@@ -12,7 +12,10 @@ import { getPostBlocks } from '@/lib/notion/getPostBlocks'
export async function getNotionPageData ({ pageId = BLOG.notionPageId, from }) {
// 尝试从缓存获取
const data = await getDataFromCache('page_record_map_' + pageId)
if (data) return data
if (data) {
console.log('[请求缓存]:', `from:${from}`, `id:${pageId}`)
return data
}
const pageRecordMap = await getPageRecordMapByNotionAPI({ pageId, from })
// 存入缓存
if (pageRecordMap) {

View File

@@ -5,6 +5,7 @@ import { getDataFromCache, setDataToCache } from '@/lib/cache/cache_manager'
export async function getPostBlocks (id, from) {
let pageBlock = await getDataFromCache('page_block_' + id)
if (pageBlock) {
console.log('[请求缓存]:', `from:${from}`, `id:${id}`)
return pageBlock
}
const authToken = BLOG.notionAccessToken || null

View File

@@ -100,11 +100,12 @@ const ArticleDetail = ({ post, blockMap, tags, prev, next, allPosts, categories
<RecommendPosts currentPost={post} totalPosts={allPosts} />
{/* 版权声明 */}
<section className='text-sm overflow-auto dark:bg-gray-800 dark:text-gray-300 bg-gray-100 p-5 leading-8 border-l-4 border-red-500'>
<ul>
<section className='dark:text-gray-300 mt-6'>
<div className='text-2xl mb-2'>版权声明</div>
<ul className='text-sm dark:bg-gray-900 bg-gray-100 p-5 leading-8 border-l-4 border-red-500'>
<li>本文作者: <Link href='/article/about'><a className='hover:underline'>{BLOG.author}</a></Link></li>
<li>本文链接: <a className='hover:underline' href={url}>{url}</a></li>
<li>版权声明: 本博客所有文章除特别声明外均采用 BY-NC-SA 许可协议转载请注明出处</li>
<li>本博客所有文章除特别声明外均采用 BY-NC-SA 许可协议转载请注明出处</li>
</ul>
</section>