diff --git a/CHANGELOG.md b/CHANGELOG.md index de8dcd0085..d9b9459d1b 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -27,6 +27,9 @@ This project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.htm - Add `loading` prop for `Dropdown` @layershifter ([#729](https://github.com/stardust-ui/react/pull/729)) - Export `close` icon in Teams theme @alinais ([#774](https://github.com/stardust-ui/react/pull/774)) +### Fixes +- Make `headerMedia` visible for screen readers in `ListItem` @layershifter ([#772](https://github.com/stardust-ui/react/pull/772)) + ## [v0.18.0](https://github.com/stardust-ui/react/tree/v0.18.0) (2019-01-24) [Compare changes](https://github.com/stardust-ui/react/compare/v0.17.0...v0.18.0) diff --git a/src/themes/teams/components/List/listItemStyles.ts b/src/themes/teams/components/List/listItemStyles.ts index 7de65f3b79..57c97afd0d 100644 --- a/src/themes/teams/components/List/listItemStyles.ts +++ b/src/themes/teams/components/List/listItemStyles.ts @@ -1,4 +1,5 @@ import { pxToRem } from '../../../../lib' +import { screenReaderContainerStyles } from '../../../../lib/accessibility/Styles/accessibilityStyles' import { ComponentSlotStylesInput, ICSSInJSStyle } from '../../../types' import { ListItemProps, ListItemState } from '../../../../components/List/ListItem' @@ -13,7 +14,7 @@ const selectableHoverStyle = (p: ListItemPropsAndState, v): ICSSInJSStyle => ({ '& .ui-item-layout__content': { color: 'inherit' }, // hide the header media and content media on hover - '& .ui-item-layout__headerMedia': { display: 'none', color: 'inherit' }, + '& .ui-item-layout__headerMedia': { ...screenReaderContainerStyles, color: 'inherit' }, '& .ui-item-layout__contentMedia': { display: 'none', color: 'inherit' }, // show the end media on hover