diff --git a/RELEASE.md b/RELEASE.md index 79b3c8b60..053d81cd9 100644 --- a/RELEASE.md +++ b/RELEASE.md @@ -41,6 +41,12 @@ - ... --> +## Versione X.X.X (dd/mm/yyyy) + +### Migliorie + +- Migliorata l'accessibilità del blocco Icone. + ## Versione 11.7.0 (15/03/2024) ### Novità diff --git a/src/components/ItaliaTheme/Blocks/IconBlocks/Block/ViewBlock.jsx b/src/components/ItaliaTheme/Blocks/IconBlocks/Block/ViewBlock.jsx index 6af951579..0f4adebb8 100644 --- a/src/components/ItaliaTheme/Blocks/IconBlocks/Block/ViewBlock.jsx +++ b/src/components/ItaliaTheme/Blocks/IconBlocks/Block/ViewBlock.jsx @@ -37,7 +37,7 @@ const ViewBlock = ({ data, isOpen, toggle, id, index }) => { {data.icon?.length > 0 && (
- +
)} diff --git a/src/components/ItaliaTheme/Icons/FontAwesomeIcon.jsx b/src/components/ItaliaTheme/Icons/FontAwesomeIcon.jsx index 70b8a39ac..1cd0d7e56 100644 --- a/src/components/ItaliaTheme/Icons/FontAwesomeIcon.jsx +++ b/src/components/ItaliaTheme/Icons/FontAwesomeIcon.jsx @@ -6,7 +6,7 @@ import React from 'react'; import { fontAwesomeAliases } from 'design-comuni-plone-theme/helpers/index'; const FontAwesomeIcon = (props) => { - const { className, icon, prefix, title } = props; + const { className, icon, prefix, title, ariaHidden } = props; const [loadedIcon, setLoadedIcon] = React.useState({ module: null, iconName: '', @@ -74,6 +74,7 @@ const FontAwesomeIcon = (props) => { ? `${title}${loadedIcon.module.content}` : loadedIcon.module.content, }} + aria-hidden={ariaHidden || null} /> ) : icon ? ( diff --git a/src/components/ItaliaTheme/Icons/Icon.jsx b/src/components/ItaliaTheme/Icons/Icon.jsx index 06939fb88..4c9582966 100644 --- a/src/components/ItaliaTheme/Icons/Icon.jsx +++ b/src/components/ItaliaTheme/Icons/Icon.jsx @@ -11,7 +11,8 @@ import XTwitterSVG from './svg/XTwitterSVG'; import { FontAwesomeIcon } from 'design-comuni-plone-theme/components/ItaliaTheme'; const Icon = (props) => { - const { icon, className, color, size, padding, ...rest } = props; + const { icon, className, color, size, padding, ariaHidden, ...rest } = props; + if (icon) { const classes = classNames( 'icon', @@ -35,11 +36,21 @@ const Icon = (props) => { return ; } else if (parts.length > 1) { return ( - + ); } else { return ( - + ); } }