Merge pull request #2310 from Femoon/feat/add-icon-title-configuration

feat: add title icon configuration
This commit is contained in:
tangly1024
2024-04-23 14:30:36 +08:00
committed by GitHub
31 changed files with 35 additions and 29 deletions

View File

@@ -62,6 +62,7 @@ NEXT_PUBLIC_VERSION=4.4.3
# NEXT_PUBLIC_ALGOLIA_INDEX=
# NEXT_PUBLIC_PREVIEW_CATEGORY_COUNT=
# NEXT_PUBLIC_PREVIEW_TAG_COUNT=
# NEXT_PUBLIC_POST_TITLE_ICON=
# NEXT_PUBLIC_POST_DISABLE_GALLERY_CLICK=
# NEXT_PUBLIC_FIREWORKS=
# NEXT_PUBLIC_FIREWORKS_COLOR=

View File

@@ -230,6 +230,7 @@ const BLOG = {
PREVIEW_CATEGORY_COUNT: 16, // 首页最多展示的分类数量0为不限制
PREVIEW_TAG_COUNT: 16, // 首页最多展示的标签数量0为不限制
POST_TITLE_ICON: process.env.NEXT_PUBLIC_POST_TITLE_ICON || true, // 是否显示标题icon
POST_DISABLE_GALLERY_CLICK:
process.env.NEXT_PUBLIC_POST_DISABLE_GALLERY_CLICK || false, // 画册视图禁止点击,方便在友链页面的画册插入链接

View File

@@ -29,7 +29,7 @@ export default function PostHeader({ post }) {
{/* 文章Title */}
<div className="leading-snug font-bold xs:text-4xl sm:text-4xl md:text-5xl md:leading-snug text-4xl shadow-text-md flex justify-center text-center text-white">
<NotionIcon icon={post.pageIcon} className='text-4xl mx-1' /><div className='text-4xl mx-1'>{post.title}</div>
{siteConfig('POST_TITLE_ICON') && <NotionIcon icon={post.pageIcon} className='text-4xl mx-1' />}<div className='text-4xl mx-1'>{post.title}</div>
</div>
</div>

View File

@@ -16,7 +16,7 @@ const BlogPostCard = ({ post }) => {
<Link
href={`/${post.slug}`}
className="text-black dark:text-gray-100 text-xl md:text-2xl no-underline hover:underline">
<NotionIcon icon={post.pageIcon} />{post?.title}
{siteConfig('POST_TITLE_ICON') && <NotionIcon icon={post.pageIcon} />}{post?.title}
</Link>
</h2>

View File

@@ -12,7 +12,7 @@ export const Title = (props) => {
const description = post?.description || siteConfig('AUTHOR')
return <div className="text-center px-6 py-12 mb-6 bg-gray-100 dark:bg-hexo-black-gray dark:border-hexo-black-gray border-b">
<h1 className="text-xl md:text-4xl pb-4"><NotionIcon icon={post?.pageIcon} />{title}</h1>
<h1 className="text-xl md:text-4xl pb-4">{siteConfig('POST_TITLE_ICON') && <NotionIcon icon={post?.pageIcon} />}{title}</h1>
<p className="leading-loose text-gray-dark">
{description}
</p>

View File

@@ -10,6 +10,7 @@ import LazyImage from '@/components/LazyImage'
import { formatDateFmt } from '@/lib/utils/formatDate'
import WWAds from '@/components/WWAds'
import NotionIcon from '@/components/NotionIcon'
import { siteConfig } from '@/lib/config'
/**
*
@@ -37,7 +38,7 @@ export default function ArticleDetail(props) {
{/* 文章Title */}
<div className="font-bold text-4xl text-black dark:text-white">
<NotionIcon icon={post?.pageIcon} />{post.title}
{siteConfig('POST_TITLE_ICON') && <NotionIcon icon={post?.pageIcon} />}{post.title}
</div>
<section className="flex-wrap flex mt-2 text-gray-400 dark:text-gray-400 font-light leading-8">

View File

@@ -71,7 +71,7 @@ const BlogCard = ({ index, post, showSummary, siteInfo }) => {
passHref
href={url}
className={`break-words cursor-pointer font-bold hover:underline text-xl ${showPreview ? 'justify-center' : 'justify-start'} leading-tight text-gray-700 dark:text-gray-100 hover:text-blue-500 dark:hover:text-blue-400`}>
<NotionIcon icon={post.pageIcon} /> {post.title}
{siteConfig('POST_TITLE_ICON') && <NotionIcon icon={post.pageIcon} />} {post.title}
</Link>
</h2>

View File

@@ -15,7 +15,7 @@ const BlogPost = ({ post }) => {
<article key={post.id} className="mb-6 md:mb-8">
<header className="flex flex-col justify-between md:flex-row md:items-baseline">
<h2 className="text-lg md:text-xl font-medium mb-2 cursor-pointer text-black dark:text-gray-100">
<NotionIcon icon={post.pageIcon} />{post.title}
{siteConfig('POST_TITLE_ICON') && <NotionIcon icon={post.pageIcon} />}{post.title}
</h2>
<time className="flex-shrink-0 text-gray-600 dark:text-gray-400">
{post?.publishDay}

View File

@@ -1,6 +1,7 @@
import NotionIcon from '@/components/NotionIcon'
import Link from 'next/link'
import TagItem from './TagItem'
import { siteConfig } from '@/lib/config'
/**
* 文章详情页说明信息
@@ -25,7 +26,7 @@ export default function PostInfo(props) {
</div>
<h1 className='font-bold text-3xl text-black dark:text-white'>
<NotionIcon icon={post?.pageIcon} />
{siteConfig('POST_TITLE_ICON') && <NotionIcon icon={post?.pageIcon} />}
{post?.title}
</h1>

View File

@@ -14,7 +14,7 @@ const BlogPostCard = ({ post, className }) => {
<Link href={url} passHref>
<div key={post.id} className={`${className} relative py-1.5 cursor-pointer px-1.5 hover:bg-gray-50 rounded-md dark:hover:bg-gray-600 ${currentSelected ? 'bg-green-50 text-green-500 dark:bg-yellow-100 dark:text-yellow-600' : ''}`}>
<div className="w-full select-none">
<NotionIcon icon={post?.pageIcon}/> {post.title}
{siteConfig('POST_TITLE_ICON') && <NotionIcon icon={post?.pageIcon} />} {post.title}
</div>
{/* 最新文章加个红点 */}
{post?.isLatest && siteConfig('GITBOOK_LATEST_POST_RED_BADGE', false, CONFIG) && <Badge/>}

View File

@@ -275,7 +275,7 @@ const LayoutSlug = (props) => {
{!lock && <div id='container'>
{/* title */}
<h1 className="text-3xl pt-12 dark:text-gray-300"><NotionIcon icon={post?.pageIcon} />{post?.title}</h1>
<h1 className="text-3xl pt-12 dark:text-gray-300">{siteConfig('POST_TITLE_ICON') && <NotionIcon icon={post?.pageIcon} />}{post?.title}</h1>
{/* Notion文章主体 */}
{post && (<section id="article-wrapper" className="px-1">

View File

@@ -44,7 +44,7 @@ const BlogPostCard = ({ index, post, showSummary, siteInfo }) => {
href={url}
passHref
className={' group-hover:text-indigo-700 dark:hover:text-yellow-700 dark:group-hover:text-yellow-600 text-black dark:text-gray-100 line-clamp-2 replace cursor-pointer text-xl font-extrabold leading-tight'}>
<NotionIcon icon={post.pageIcon} /><span className='menu-link '>{post.title}</span>
{siteConfig('POST_TITLE_ICON') && <NotionIcon icon={post.pageIcon} />}<span className='menu-link '>{post.title}</span>
</Link>
</header>

View File

@@ -65,7 +65,7 @@ export default function PostHeader({ post, siteInfo }) {
{/* 文章Title */}
<div className="max-w-5xl font-bold text-3xl lg:text-5xl md:leading-snug shadow-text-md flex justify-center md:justify-start text-white">
<NotionIcon icon={post.pageIcon} />{post.title}
{siteConfig('POST_TITLE_ICON') && <NotionIcon icon={post.pageIcon} />}{post.title}
</div>
{/* 标题底部补充信息 */}

View File

@@ -25,7 +25,7 @@ export const BlogPostCardInfo = ({ post, showPreview, showPageCover, showSummary
className={`line-clamp-2 replace cursor-pointer text-2xl ${showPreview ? 'text-center' : ''
} leading-tight font-normal text-gray-600 dark:text-gray-100 hover:text-indigo-700 dark:hover:text-indigo-400`}>
<NotionIcon icon={post.pageIcon} /><span className='menu-link '>{post.title}</span>
{siteConfig('POST_TITLE_ICON') && <NotionIcon icon={post.pageIcon} />}<span className='menu-link '>{post.title}</span>
</Link>
</h2>

View File

@@ -40,7 +40,7 @@ export default function PostHeader({ post, siteInfo }) {
{/* 文章Title */}
<div className="leading-snug font-bold xs:text-4xl sm:text-4xl md:text-5xl md:leading-snug text-4xl shadow-text-md flex justify-center text-center text-white">
<NotionIcon icon={post.pageIcon} className='text-4xl mx-1' />{post.title}
{siteConfig('POST_TITLE_ICON') && <NotionIcon icon={post.pageIcon} className='text-4xl mx-1' />}{post.title}
</div>
<section className="flex-wrap shadow-text-md flex text-sm justify-center mt-4 text-white dark:text-gray-400 font-light leading-8">

View File

@@ -40,7 +40,7 @@ const BlogPostCard = ({ index, post, showSummary, siteInfo }) => {
className="h-full w-full group-hover:scale-125 group-hover:brightness-50 brightness-90 rounded-t-md transform object-cover duration-500"
/>
<h2 className='absolute bottom-0 left-0 text-white p-6 text-2xl replace break-words w-full shadow-text'>
<NotionIcon icon={post.pageIcon} />{post.title}
{siteConfig('POST_TITLE_ICON') && <NotionIcon icon={post.pageIcon} />}{post.title}
</h2>
</div>
</Link>

View File

@@ -1,5 +1,6 @@
import LazyImage from '@/components/LazyImage'
import NotionIcon from '@/components/NotionIcon'
import { siteConfig } from '@/lib/config'
/**
* 文章背景图
@@ -10,7 +11,7 @@ export default function PostHeader({ post, siteInfo }) {
return (
<div id='header' className="flex h-96 justify-center align-middle items-center w-full relative bg-black">
<div className="z-10 leading-snug font-bold xs:text-4xl sm:text-4xl md:text-5xl md:leading-snug text-4xl shadow-text-md flex justify-center text-center text-white">
<NotionIcon icon={post?.pageIcon} />{title}
{siteConfig('POST_TITLE_ICON') && <NotionIcon icon={post?.pageIcon} />}{title}
</div>
<LazyImage alt={title} src={headerImage} className='pointer-events-none select-none w-full h-full object-cover opacity-30 absolute'
placeholder='blur' blurDataURL='/bg_image.jpg' />

View File

@@ -13,7 +13,7 @@ export default function ArticleInfo(props) {
return (<>
{/* title */}
<h1 className="text-3xl pt-12 dark:text-gray-300"><NotionIcon icon={post?.pageIcon} />{post?.title}</h1>
<h1 className="text-3xl pt-12 dark:text-gray-300">{siteConfig('POST_TITLE_ICON') && <NotionIcon icon={post?.pageIcon} />}{post?.title}</h1>
{/* meta */}
<section className="py-2 items-center text-sm px-1">

View File

@@ -35,7 +35,7 @@ const BlogPostCard = ({ post, showSummary }) => {
{siteConfig('MEDIUM_POST_LIST_COVER', null, CONFIG) && <div className='w-full max-h-96 object-cover overflow-hidden mb-2'>
<LazyImage src={post.pageCoverThumbnail} style={post.pageCoverThumbnail ? {} : { height: '0px' }} className='w-full max-h-96 object-cover hover:scale-125 duration-150' />
</div>}
<NotionIcon icon={post.pageIcon} />{post.title}
{siteConfig('POST_TITLE_ICON') && <NotionIcon icon={post.pageIcon} />}{post.title}
</h2>
</Link>

View File

@@ -40,7 +40,7 @@ const BlogPostCard = ({ index, post, showSummary, siteInfo }) => {
</div>
{/* 阴影遮罩 */}
<h2 className='absolute bottom-10 px-6 transition-all duration-200 text-white text-2xl font-semibold break-words shadow-text z-20'>
<NotionIcon icon={post.pageIcon} />
{siteConfig('POST_TITLE_ICON') && <NotionIcon icon={post.pageIcon} />}
{post.title}
</h2>

View File

@@ -12,7 +12,7 @@ export const Title = (props) => {
const description = post?.description || siteConfig('AUTHOR')
return <div className="text-center px-6 py-12 mb-6 bg-gray-100 dark:bg-hexo-black-gray dark:border-hexo-black-gray border-b">
<h1 className="text-xl md:text-4xl pb-4"><NotionIcon icon={post?.pageIcon} />{title}</h1>
<h1 className="text-xl md:text-4xl pb-4">{siteConfig('POST_TITLE_ICON') && <NotionIcon icon={post?.pageIcon} />}{title}</h1>
<p className="leading-loose text-gray-dark">
{description}
</p>

View File

@@ -14,7 +14,7 @@ const BlogPostCard = ({ post, className }) => {
<Link href={`${url}`} target={(checkContainHttp(post.slug) ? '_blank' : '_self')} passHref>
<div key={post.id} className={`${className} h-full rounded-2xl p-4 dark:bg-neutral-800 cursor-pointer bg-white hover:bg-white dark:hover:bg-gray-800 ${currentSelected ? 'bg-green-50 text-green-500' : ''}`}>
<div className="stack-entry w-full flex space-x-3 select-none dark:text-neutral-200">
<NotionIcon icon={pageIcon} size='10' className='text-6xl w-11 h-11 mx-1 my-0 flex-none' />
{siteConfig('POST_TITLE_ICON') && <NotionIcon icon={pageIcon} size='10' className='text-6xl w-11 h-11 mx-1 my-0 flex-none' />}
<div className="stack-comment flex-auto">
<p className="title font-bold">{post.title}</p>
<p className="description font-normal">{post.summary ? post.summary : '暂无简介'}</p>

View File

@@ -240,7 +240,7 @@ const LayoutSlug = (props) => {
{!lock && <div id='container'>
{/* title */}
<h1 className="text-3xl pt-4 md:pt-12 dark:text-gray-300"><NotionIcon icon={post?.pageIcon} />{post?.title}</h1>
<h1 className="text-3xl pt-4 md:pt-12 dark:text-gray-300">{siteConfig('POST_TITLE_ICON') && <NotionIcon icon={post?.pageIcon} />}{post?.title}</h1>
{/* Notion文章主体 */}
{post && (<section id="article-wrapper" className="px-1">

View File

@@ -51,7 +51,7 @@ export default function ArticleDetail(props) {
{/* title */}
<div className=" text-center font-bold text-3xl text-black dark:text-white font-serif pt-6">
<NotionIcon icon={post.pageIcon} />{post.title}
{siteConfig('POST_TITLE_ICON') && <NotionIcon icon={post.pageIcon} />}{post.title}
</div>
{/* meta */}

View File

@@ -40,7 +40,7 @@ const BlogPostCard = ({ post, index, showSummary }) => {
passHref
className={`cursor-pointer text-3xl ${showPreview ? 'text-center' : ''} leading-tight text-gray-700 dark:text-gray-100 hover:text-blue-500 dark:hover:text-blue-400`}>
<NotionIcon icon={post.pageIcon} /> <span className='menu-link'>{post.title}</span>
{siteConfig('POST_TITLE_ICON') && <NotionIcon icon={post.pageIcon} />} <span className='menu-link'>{post.title}</span>
</Link>

View File

@@ -14,7 +14,7 @@ export const ArticleInfo = (props) => {
<div>
<h1 className="font-bold text-3xl text-black dark:text-white">
<NotionIcon icon={post?.pageIcon} />{post?.title}
{siteConfig('POST_TITLE_ICON') && <NotionIcon icon={post?.pageIcon} />}{post?.title}
</h1>
{post?.type !== 'Page' && <>

View File

@@ -15,7 +15,7 @@ const BlogPost = ({ post }) => {
<article key={post.id} className="mb-6 md:mb-8">
<header className="flex flex-col justify-between md:flex-row md:items-baseline">
<h2 className="text-lg md:text-xl font-medium mb-2 cursor-pointer text-black dark:text-gray-100">
<NotionIcon icon={post.pageIcon} />{post.title}
{siteConfig('POST_TITLE_ICON') && <NotionIcon icon={post.pageIcon} />}{post.title}
</h2>
<time className="flex-shrink-0 text-gray-600 dark:text-gray-400">
{post?.publishDay}

View File

@@ -14,7 +14,7 @@ export const ArticleInfo = (props) => {
<div>
<h1 className="font-bold text-3xl text-black dark:text-white">
<NotionIcon icon={post?.pageIcon} />{post?.title}
{siteConfig('POST_TITLE_ICON') && <NotionIcon icon={post?.pageIcon} />}{post?.title}
</h1>
{post?.type !== 'Page' && <>

View File

@@ -4,6 +4,7 @@ import { usePlogGlobal } from '..'
import { isMobile } from '@/lib/utils'
import LazyImage from '@/components/LazyImage'
import NotionIcon from '@/components/NotionIcon'
import { siteConfig } from '@/lib/config'
/**
* 博客照片卡牌
@@ -38,7 +39,7 @@ const BlogPost = (props) => {
<LazyImage src={pageThumbnail} className='aspect-[16/9] w-full h-full object-cover filter contrast-120' />
<h2 className="text-md absolute left-0 bottom-0 m-4 text-gray-100 shadow-text">
<NotionIcon icon={post.pageIcon} /> {post?.title}
{siteConfig('POST_TITLE_ICON') && <NotionIcon icon={post.pageIcon} />} {post?.title}
</h2>
{post?.category && <div className='text-xs rounded-lg absolute left-0 top-0 m-4 px-2 py-1 bg-gray-200 dark:bg-black dark:bg-opacity-25 hover:bg-blue-700 hover:text-white duration-200'>
<Link href={`/category/${post?.category}`}>

View File

@@ -19,7 +19,7 @@ export default function ArticleInfo (props) {
<section className="mt-2 text-gray-600 dark:text-gray-400 leading-8">
<h2
className="blog-item-title mb-5 font-bold text-black text-xl md:text-2xl no-underline">
<NotionIcon icon={post?.pageIcon} />{post?.title}
{siteConfig('POST_TITLE_ICON') && <NotionIcon icon={post?.pageIcon} />}{post?.title}
</h2>
<div className='flex flex-wrap text-gray-700 dark:text-gray-300'>

View File

@@ -35,7 +35,7 @@ export const BlogItem = props => {
<Link
href={url}
className="blog-item-title font-bold text-black text-2xl menu-link">
<NotionIcon icon={post.pageIcon} />{post.title}
{siteConfig('POST_TITLE_ICON') && <NotionIcon icon={post.pageIcon} />}{post.title}
</Link>
</h2>