d0zingcat/NotionNext
1
0
Fork 0
mirror of https://github.com/d0zingcat/NotionNext.git synced 2026-05-21 07:26:49 +00:00
Code Issues Packages Projects Releases Wiki Activity

feature:

Browse Source 
加入loading页面
This commit is contained in:
tangly1024
2021-12-13 14:40:47 +08:00
parent 3f79b18878
commit 0f46dc518c
4 changed files with 34 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
components/BlogPostCard.js
View File

@@ -12,7 +12,7 @@ const BlogPostCard = ({ post, tags }) => {
w-full bg-white dark:bg-gray-800 dark:hover:bg-gray-700'>
<Link href={`${BLOG.path}/article/${post.slug}`} passHref>
<div className='w-full h-60 rounded-t-xl md:rounded-t-none md:rounded-l-xl md:h-full duration-200 cursor-pointer transform col-span-2 overflow-hidden'>
<Image className='hover:scale-105 transform duration-500' src={(post.page_cover && post.page_cover.length > 1) ? post.page_cover : BLOG.defaultImgCover} alt={post.title} layout='fill' objectFit='cover' loading='lazy' />
<Image className='hover:scale-105 transform duration-500 rounded-t-xl md:rounded-t-none md:rounded-l-xl' src={(post.page_cover && post.page_cover.length > 1) ? post.page_cover : BLOG.defaultImgCover} alt={post.title} layout='fill' objectFit='cover' loading='lazy' />
</div>
</Link>

11
components/LoadingCover.js Normal file
View File

@@ -0,0 +1,11 @@
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faSpinner } from '@fortawesome/free-solid-svg-icons'
export default function LoadingCover () {
return (<div id="loading-cover" className={'bg-white dark:bg-gray-800 dark:text-white text-black animate__animated animate__fadeIn flex-grow flex flex-col justify-center z-10 w-full h-screen container mx-auto'}>
<div className="mx-auto">
<FontAwesomeIcon icon={faSpinner} spin={true} className="text-2xl" />
</div>
</div>
)
}