压缩封面图

This commit is contained in:
tangly1024
2023-06-18 11:12:54 +08:00
parent 2cd67c1d82
commit 437f969115
17 changed files with 69 additions and 69 deletions

View File

@@ -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>
)}

View File

@@ -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"

View File

@@ -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>
)}

View File

@@ -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 (

View File

@@ -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>
)}

View File

@@ -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,

View File

@@ -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

View File

@@ -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 (

View File

@@ -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"
/>

View File

@@ -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

View File

@@ -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 (

View File

@@ -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>

View File

@@ -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>
)}

View File

@@ -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"