1
0
Fork 0

chore: Add figcaptions:

This commit is contained in:
joostdecock 2024-10-06 13:27:08 +02:00
parent db63870415
commit a686383a85
2 changed files with 22 additions and 12 deletions

View file

@ -618,3 +618,10 @@ figure.develop.example div.develop {
.technique {
background: hsl(var(--pink-500));
}
figcaption.mdx {
font-style: italic;
margin-top: -0.5rem;
padding: 0 0.5rem;
font-size: 90%;
}

View file

@ -1,17 +1,20 @@
import React from 'react';
import clsx from 'clsx';
import styles from './styles.module.css';
import React from 'react'
import clsx from 'clsx'
import styles from './styles.module.css'
function transformImgClassName(className) {
return clsx(className, styles.img);
return clsx(className, styles.img)
}
export default function MDXImg(props) {
// eslint-disable-next-line jsx-a11y/alt-text
return (
// eslint-disable-next-line jsx-a11y/alt-text
<img
decoding="async"
loading="lazy"
{...props}
className={transformImgClassName(props.className)}
/>
);
<figure>
<img
decoding="async"
loading="lazy"
{...props}
className={transformImgClassName(props.className)}
/>
<figcaption className="mdx">{props.title}</figcaption>
</figure>
)
}