Add facebook Open Graph Url and image. Fix PATH env conflict with Vercel environment

This commit is contained in:
txs
2022-04-04 08:13:18 +08:00
parent 305a476f6f
commit ebdaf4273f
33 changed files with 901 additions and 469 deletions

View File

@@ -7,33 +7,44 @@ import Card from './Card'
const BlogCard = ({ post, showSummary }) => {
const showPreview = CONFIG_FUKA.POST_LIST_PREVIEW && post.blockMap
return (
<Card className='w-full lg:max-w-sm p-2'>
<div key={post.id} className='animate__animated animate__fadeIn flex flex-col-reverse justify-between duration-300'>
<Card className="w-full lg:max-w-sm p-2">
<div
key={post.id}
className="animate__animated animate__fadeIn flex flex-col-reverse justify-between duration-300"
>
<div className="p-2 flex flex-col w-full">
<Link href={`${BLOG.SUB_PATH}/article/${post.slug}`} passHref>
<a
className={`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`}
>
{post.title}
</a>
</Link>
<div className='p-2 flex flex-col w-full'>
<Link href={`${BLOG.PATH}/article/${post.slug}`} passHref>
<a className={`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`}>
{post.title}
</a>
</Link>
{(!showPreview || showSummary) && <p className='mt-4 mb-4 text-gray-700 dark:text-gray-300 text-sm font-light leading-7 overflow-hidden'>
{post.summary}
</p>}
</div>
{CONFIG_FUKA.POST_LIST_COVER && post?.page_cover && (
<Link href={`${BLOG.PATH}/article/${post.slug}`} passHref>
<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} alt={post.title} className='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' /> */}
{(!showPreview || showSummary) && (
<p className="mt-4 mb-4 text-gray-700 dark:text-gray-300 text-sm font-light leading-7 overflow-hidden">
{post.summary}
</p>
)}
</div>
</Link>
)}
</div >
</Card>
{CONFIG_FUKA.POST_LIST_COVER && post?.page_cover && (
<Link href={`${BLOG.SUB_PATH}/article/${post.slug}`} passHref>
<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}
alt={post.title}
className="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' /> */}
</div>
</Link>
)}
</div>
</Card>
)
}