diff options
| author | Armand Philippot <git@armandphilippot.com> | 2022-06-07 17:44:17 +0200 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2022-06-07 17:44:17 +0200 |
| commit | a640a5dee88f82398111142d6a4ca089bf0924cb (patch) | |
| tree | 3e786789f8dfdb42d9e524171d2dfa5812c1fff0 /src/components/molecules/images | |
| parent | 22eeede34778d8e903a1999bfc6bc715c361d9ce (diff) | |
| parent | b1103a9554c5593c065466d1e289db2680cf2993 (diff) | |
chore: improve accessibility (#20)
Improve images, code blocks, cards and progress bar accessibility.
Diffstat (limited to 'src/components/molecules/images')
| -rw-r--r-- | src/components/molecules/images/responsive-image.tsx | 8 |
1 files changed, 6 insertions, 2 deletions
diff --git a/src/components/molecules/images/responsive-image.tsx b/src/components/molecules/images/responsive-image.tsx index 4541df8..5373561 100644 --- a/src/components/molecules/images/responsive-image.tsx +++ b/src/components/molecules/images/responsive-image.tsx @@ -49,6 +49,7 @@ const ResponsiveImage: FC<ResponsiveImageProps> = ({ layout, objectFit, target, + title, withBorders, ...props }) => { @@ -59,15 +60,17 @@ const ResponsiveImage: FC<ResponsiveImageProps> = ({ return ( <figure + aria-label={caption ? undefined : title} className={`${styles.wrapper} ${styles[bordersModifier]} ${styles[linkModifier]} ${className}`} > {target ? ( <Link href={target} className={styles.link}> <Image alt={alt} + className={styles.img} layout={layout || 'intrinsic'} objectFit={objectFit || 'contain'} - className={styles.img} + title={title} {...props} /> {caption && ( @@ -78,9 +81,10 @@ const ResponsiveImage: FC<ResponsiveImageProps> = ({ <> <Image alt={alt} + className={styles.img} layout={layout || 'intrinsic'} objectFit={objectFit || 'contain'} - className={styles.img} + title={title} {...props} /> {caption && ( |