xfy/DefectingCat.github.io
1
0
Fork 0
mirror of https://github.com/DefectingCat/DefectingCat.github.io synced 2025-07-15 16:51:37 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update image component

Browse Source
This commit is contained in:
DefectingCat
2022-08-18 16:56:29 +08:00
parent 562ba00912
commit 3ad3d96f67
38 changed files with 139 additions and 219 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
components/mdx/Image.tsx
View File

@ -1,17 +1,12 @@
import NextImage, { ImageProps } from 'next/image';
import NextImage, { ImageProps } from 'next/future/image';
interface Props extends ImageProps {}
const Image = ({ alt, ...rest }: Props) => {
const supportImg = ['jpeg', 'png', 'webp', 'avif'];
const placeholder = supportImg.includes((rest.src as { src: string }).src)
? 'blur'
: 'empty';
return (
<>
<span className="block text-center">
<NextImage alt={alt} placeholder={placeholder} {...rest} />
<NextImage alt={alt} {...rest} />
{alt && <span className="block text-center text-gray-400">{alt}</span>}
</span>
</>

2
components/mdx/components.ts
View File

@ -1,9 +1,11 @@
import RUASandpack from 'components/RUA/RUASandpack';
import Anchor from 'components/mdx/Anchor';
import Image from 'components/mdx/Image';
const components = {
RUASandpack,
a: Anchor,
Image,
};
export default components;