mirror of
https://github.com/apache/superset.git
synced 2026-04-27 03:55:47 +00:00
feat(accessibility): add tabbing to chart menu in dashboard (#26138)
Co-authored-by: geido <diegopucci.me@gmail.com> Co-authored-by: Diego Pucci <geido@Diegos-MBP.wind3.hub>
This commit is contained in:
committed by
GitHub
parent
662c1ed618
commit
34b1db219c
@@ -58,6 +58,11 @@ const ErrorAlertDiv = styled.div<{ level: ErrorLevel }>`
|
||||
.link {
|
||||
color: ${({ level, theme }) => theme.colors[level].dark2};
|
||||
text-decoration: underline;
|
||||
&:focus-visible {
|
||||
border: 1px solid ${({ theme }) => theme.colors.primary.base};
|
||||
padding: ${({ theme }) => theme.gridUnit / 2}px;
|
||||
margin: -${({ theme }) => theme.gridUnit / 2 + 1}px;
|
||||
border-radius: ${({ theme }) => theme.borderRadius}px;
|
||||
}
|
||||
`;
|
||||
|
||||
@@ -131,6 +136,11 @@ export default function ErrorAlert({
|
||||
tabIndex={0}
|
||||
className="link"
|
||||
onClick={() => setIsModalOpen(true)}
|
||||
onKeyDown={event => {
|
||||
if (event.key === 'Enter') {
|
||||
setIsModalOpen(true);
|
||||
}
|
||||
}}
|
||||
>
|
||||
{t('See more')}
|
||||
</span>
|
||||
@@ -145,6 +155,11 @@ export default function ErrorAlert({
|
||||
tabIndex={0}
|
||||
className="link"
|
||||
onClick={() => setIsModalOpen(true)}
|
||||
onKeyDown={event => {
|
||||
if (event.key === 'Enter') {
|
||||
setIsModalOpen(true);
|
||||
}
|
||||
}}
|
||||
>
|
||||
{t('See more')}
|
||||
</span>
|
||||
@@ -162,6 +177,11 @@ export default function ErrorAlert({
|
||||
tabIndex={0}
|
||||
className="link"
|
||||
onClick={() => setIsBodyExpanded(true)}
|
||||
onKeyDown={event => {
|
||||
if (event.key === 'Enter') {
|
||||
setIsBodyExpanded(true);
|
||||
}
|
||||
}}
|
||||
>
|
||||
{t('See more')}
|
||||
</span>
|
||||
@@ -175,6 +195,11 @@ export default function ErrorAlert({
|
||||
tabIndex={0}
|
||||
className="link"
|
||||
onClick={() => setIsBodyExpanded(false)}
|
||||
onKeyDown={event => {
|
||||
if (event.key === 'Enter') {
|
||||
setIsBodyExpanded(false);
|
||||
}
|
||||
}}
|
||||
>
|
||||
{t('See less')}
|
||||
</span>
|
||||
@@ -213,6 +238,12 @@ export default function ErrorAlert({
|
||||
cta
|
||||
buttonStyle="primary"
|
||||
onClick={() => setIsModalOpen(false)}
|
||||
tabIndex={0}
|
||||
onKeyDown={event => {
|
||||
if (event.key === 'Enter') {
|
||||
setIsModalOpen(false);
|
||||
}
|
||||
}}
|
||||
>
|
||||
{t('Close')}
|
||||
</Button>
|
||||
|
||||
Reference in New Issue
Block a user