mirror of
https://github.com/d0zingcat/NotionNext.git
synced 2026-06-02 07:26:45 +00:00
压缩封面图
This commit is contained in:
@@ -41,7 +41,7 @@ const BlogPostCard = ({ post }) => {
|
||||
{showPageCover && (
|
||||
<div className="md:w-5/12 w-full overflow-hidden p-1">
|
||||
<Link href={`${BLOG.SUB_PATH}/${post.slug}`} passHref legacyBehavior>
|
||||
<div className='h-44 bg-center bg-cover hover:scale-110 duration-200' style={{ backgroundImage: `url('${post?.page_cover}')` }} />
|
||||
<div className='h-44 bg-center bg-cover hover:scale-110 duration-200' style={{ backgroundImage: `url('${post?.pageCoverThumbnail}')` }} />
|
||||
</Link>
|
||||
</div>
|
||||
)}
|
||||
|
||||
@@ -22,10 +22,10 @@ export default function ArticleDetail(props) {
|
||||
const date = formatDate(post?.date?.start_date || post?.createdTime, locale.LOCALE)
|
||||
return (
|
||||
<div id="container" className="max-w-5xl overflow-x-auto flex-grow mx-auto w-screen md:w-full ">
|
||||
{post?.type && !post?.type !== 'Page' && post?.page_cover && (
|
||||
{post?.type && !post?.type !== 'Page' && post?.pageCover && (
|
||||
<div className="w-full relative md:flex-shrink-0 overflow-hidden">
|
||||
{/* eslint-disable-next-line @next/next/no-img-element */}
|
||||
<img alt={post.title} src={post?.page_cover} className='object-center w-full' />
|
||||
<img alt={post.title} src={post?.pageCover} className='object-center w-full' />
|
||||
</div>
|
||||
)}
|
||||
<article itemScope itemType="https://schema.org/Movie"
|
||||
|
||||
@@ -7,10 +7,10 @@ import CONFIG_FUKA from '../config_fuka'
|
||||
const BlogCard = ({ index, post, showSummary, siteInfo }) => {
|
||||
const showPreview = CONFIG_FUKA.POST_LIST_PREVIEW && post.blockMap
|
||||
// matery 主题默认强制显示图片
|
||||
if (post && !post.page_cover) {
|
||||
post.page_cover = siteInfo?.pageCover
|
||||
if (post && !post.pageCover) {
|
||||
post.pageCoverThumbnail = siteInfo?.pageCover
|
||||
}
|
||||
const showPageCover = CONFIG_FUKA.POST_LIST_COVER && post?.page_cover
|
||||
const showPageCover = CONFIG_FUKA.POST_LIST_COVER && post?.pageCoverThumbnail
|
||||
|
||||
return (
|
||||
<div data-aos="fade-up" data-aos-duration="500" data-aos-once="true"
|
||||
@@ -33,17 +33,17 @@ const BlogCard = ({ index, post, showSummary, siteInfo }) => {
|
||||
{post.summary}
|
||||
</p>
|
||||
)}
|
||||
|
||||
|
||||
{/* 分类标签 */}
|
||||
<div className="mt-1 text-gray-400 justify-between flex">
|
||||
<Link
|
||||
href={`/category/${post.category}`}
|
||||
passHref
|
||||
className="cursor-pointer font-light text-sm hover:underline hover:text-indigo-700 dark:hover:text-indigo-400 transform">
|
||||
|
||||
|
||||
<i className="mr-1 far fa-folder" />
|
||||
{post.category}
|
||||
|
||||
|
||||
</Link>
|
||||
<div className="md:flex-nowrap flex-wrap md:justify-start inline-block">
|
||||
<div>
|
||||
@@ -61,11 +61,11 @@ const BlogCard = ({ index, post, showSummary, siteInfo }) => {
|
||||
<div className="h-40 w-full relative duration-200 cursor-pointer transform overflow-hidden">
|
||||
{/* eslint-disable-next-line @next/next/no-img-element */}
|
||||
<img
|
||||
src={post?.page_cover}
|
||||
src={post?.pageCoverThumbnail}
|
||||
alt={post.title}
|
||||
className="w-full hover:scale-125 transform duration-500"
|
||||
></img>
|
||||
{/* <Image className='hover:scale-105 transform duration-500' src={post?.page_cover} alt={post.title} layout='fill' objectFit='cover' loading='lazy' /> */}
|
||||
{/* <Image className='hover:scale-105 transform duration-500' src={post?.pageCover} alt={post.title} layout='fill' objectFit='cover' loading='lazy' /> */}
|
||||
</div>
|
||||
</Link>
|
||||
)}
|
||||
|
||||
@@ -29,8 +29,8 @@ export default function ArticleRecommend({ recommendPosts, siteInfo }) {
|
||||
</div>
|
||||
<div className="grid grid-cols-2 md:grid-cols-3 gap-4">
|
||||
{recommendPosts.map(post => {
|
||||
const headerImage = post?.page_cover
|
||||
? `url("${post.page_cover}")`
|
||||
const headerImage = post?.pageCoverThumbnail
|
||||
? `url("${post.pageCoverThumbnail}")`
|
||||
: `url("${siteInfo?.pageCover}")`
|
||||
|
||||
return (
|
||||
|
||||
@@ -7,10 +7,10 @@ import BLOG from '@/blog.config'
|
||||
|
||||
const BlogPostCard = ({ index, post, showSummary, siteInfo }) => {
|
||||
const showPreview = CONFIG_HEXO.POST_LIST_PREVIEW && post.blockMap
|
||||
if (post && !post.page_cover && CONFIG_HEXO.POST_LIST_COVER_DEFAULT) {
|
||||
post.page_cover = siteInfo?.pageCover
|
||||
if (post && !post.pageCoverThumbnail && CONFIG_HEXO.POST_LIST_COVER_DEFAULT) {
|
||||
post.pageCover = siteInfo?.pageCoverThumbnail
|
||||
}
|
||||
const showPageCover = CONFIG_HEXO.POST_LIST_COVER && post?.page_cover && !showPreview
|
||||
const showPageCover = CONFIG_HEXO.POST_LIST_COVER && post?.pageCoverThumbnail && !showPreview
|
||||
// const delay = (index % 2) * 200
|
||||
|
||||
return (
|
||||
@@ -36,7 +36,7 @@ const BlogPostCard = ({ index, post, showSummary, siteInfo }) => {
|
||||
{showPageCover && (
|
||||
<div className="md:w-5/12 overflow-hidden">
|
||||
<Link href={`${BLOG.SUB_PATH}/${post.slug}`} passHref legacyBehavior>
|
||||
<div className='h-56 bg-center bg-cover hover:scale-110 duration-200' style={{ backgroundImage: `url('${post?.page_cover}')` }} />
|
||||
<div className='h-56 bg-center bg-cover hover:scale-110 duration-200' style={{ backgroundImage: `url('${post?.pageCoverThumbnail}')` }} />
|
||||
</Link>
|
||||
</div>
|
||||
)}
|
||||
|
||||
@@ -11,7 +11,7 @@ export default function HeaderArticle({ post, siteInfo }) {
|
||||
if (!post) {
|
||||
return <></>
|
||||
}
|
||||
const headerImage = post?.page_cover ? `url("${post.page_cover}")` : `url("${siteInfo?.pageCover}")`
|
||||
const headerImage = post?.pageCover ? `url("${post.pageCover}")` : `url("${siteInfo?.pageCover}")`
|
||||
|
||||
const date = formatDate(
|
||||
post?.date?.start_date || post?.createdTime,
|
||||
|
||||
@@ -29,7 +29,7 @@ const LatestPostsGroup = ({ latestPosts, siteInfo }) => {
|
||||
{latestPosts.map(post => {
|
||||
const selected = currentPath === `${BLOG.SUB_PATH}/${post.slug}`
|
||||
|
||||
const headerImage = post?.page_cover ? post.page_cover : siteInfo?.pageCover
|
||||
const headerImage = post?.pageCoverThumbnail ? post.pageCoverThumbnail : siteInfo?.pageCover
|
||||
|
||||
return (
|
||||
(<Link
|
||||
|
||||
@@ -29,8 +29,8 @@ export default function ArticleRecommend({ recommendPosts, siteInfo }) {
|
||||
</div>
|
||||
<div className="grid grid-cols-2 md:grid-cols-3 gap-4">
|
||||
{recommendPosts.map(post => {
|
||||
const headerImage = post?.page_cover
|
||||
? `url("${post.page_cover}")`
|
||||
const headerImage = post?.pageCoverThumbnail
|
||||
? `url("${post.pageCoverThumbnail}")`
|
||||
: `url("${siteInfo?.pageCover}")`
|
||||
|
||||
return (
|
||||
|
||||
@@ -9,10 +9,10 @@ import TwikooCommentCount from '@/components/TwikooCommentCount'
|
||||
const BlogPostCard = ({ index, post, showSummary, siteInfo }) => {
|
||||
const showPreview = CONFIG_MATERY.POST_LIST_PREVIEW && post.blockMap
|
||||
// matery 主题默认强制显示图片
|
||||
if (post && !post.page_cover) {
|
||||
post.page_cover = siteInfo?.pageCover
|
||||
if (post && !post.pageCoverThumbnail) {
|
||||
post.pageCoverThumbnail = siteInfo?.pageCover
|
||||
}
|
||||
const showPageCover = CONFIG_MATERY.POST_LIST_COVER && post?.page_cover
|
||||
const showPageCover = CONFIG_MATERY.POST_LIST_COVER && post?.pageCoverThumbnail
|
||||
const delay = (index % 3) * 300
|
||||
return (
|
||||
<div
|
||||
@@ -33,7 +33,7 @@ const BlogPostCard = ({ index, post, showSummary, siteInfo }) => {
|
||||
className="flex flex-grow 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}
|
||||
src={post?.pageCoverThumbnail}
|
||||
alt={post.title}
|
||||
className="opacity-50 h-full w-full hover:scale-125 rounded-t-md transform object-cover duration-500"
|
||||
/>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import Image from 'next/image'
|
||||
|
||||
export default function HeaderArticle({ post, siteInfo }) {
|
||||
const headerImage = post?.page_cover ? post?.page_cover : siteInfo?.pageCover
|
||||
const headerImage = post?.pageCoverThumbnail ? post?.pageCoverThumbnail : siteInfo?.pageCover
|
||||
const title = post?.title
|
||||
return (
|
||||
<div
|
||||
|
||||
@@ -27,8 +27,8 @@ const LatestPostsGroup = ({ latestPosts, siteInfo }) => {
|
||||
</div>
|
||||
{latestPosts.map(post => {
|
||||
const selected = currentPath === `${BLOG.SUB_PATH}/${post.slug}`
|
||||
const headerImage = post?.page_cover
|
||||
? `url("${post.page_cover}")`
|
||||
const headerImage = post?.pageCoverThumbnail
|
||||
? `url("${post.pageCoverThumbnail}")`
|
||||
: `url("${siteInfo?.pageCover}")`
|
||||
|
||||
return (
|
||||
|
||||
@@ -31,7 +31,7 @@ const BlogPostCard = ({ post, showSummary }) => {
|
||||
<div>
|
||||
{CONFIG_MEDIUM.POST_LIST_COVER && <div className='w-full max-h-96 object-cover overflow-hidden mb-2'>
|
||||
{/* eslint-disable-next-line @next/next/no-img-element */}
|
||||
<img src={post.page_cover} className='w-full max-h-96 object-cover hover:scale-125 duration-150' />
|
||||
<img src={post.pageCoverThumbnail} className='w-full max-h-96 object-cover hover:scale-125 duration-150' />
|
||||
</div>}
|
||||
{post.title}
|
||||
</div>
|
||||
|
||||
@@ -39,10 +39,10 @@ export default function ArticleDetail(props) {
|
||||
|
||||
{showArticleInfo && <header>
|
||||
{/* 头图 */}
|
||||
{CONFIG_NEXT.POST_HEADER_IMAGE_VISIBLE && post?.type && !post?.type !== 'Page' && post?.page_cover && (
|
||||
{CONFIG_NEXT.POST_HEADER_IMAGE_VISIBLE && post?.type && !post?.type !== 'Page' && post?.pageCover && (
|
||||
<div className="w-full relative md:flex-shrink-0 overflow-hidden">
|
||||
{/* eslint-disable-next-line @next/next/no-img-element */}
|
||||
<img alt={post.title} src={post?.page_cover} className='object-center w-full' />
|
||||
<img alt={post.title} src={post?.pageCover} className='object-center w-full' />
|
||||
</div>
|
||||
)}
|
||||
|
||||
|
||||
@@ -114,12 +114,12 @@ const BlogPostCard = ({ post, showSummary }) => {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{CONFIG_NEXT.POST_LIST_COVER && post?.page_cover && (
|
||||
{CONFIG_NEXT.POST_LIST_COVER && post?.pageCoverThumbnail && (
|
||||
<Link href={`${BLOG.SUB_PATH}/${post.slug}`} passHref legacyBehavior>
|
||||
<div className="h-72 w-full relative duration-200 cursor-pointer transform overflow-hidden">
|
||||
<Image
|
||||
className="hover:scale-105 transform duration-500"
|
||||
src={post?.page_cover}
|
||||
src={post?.pageCoverThumbnail}
|
||||
alt={post.title}
|
||||
layout="fill"
|
||||
objectFit="cover"
|
||||
|
||||
Reference in New Issue
Block a user