diff options
| author | Oskar Nyberg <oskar@mullvad.net> | 2020-09-10 16:38:42 +0200 |
|---|---|---|
| committer | Oskar Nyberg <oskar@mullvad.net> | 2020-09-11 13:33:51 +0200 |
| commit | 8bf6b6f4b3237770cf115fc3a1b2baeb30a43650 (patch) | |
| tree | 2a1468334715091b58bf3a996f1c675b39d4f975 | |
| parent | 3adad221d645a3c2ba4ba6be6566e28755e1119f (diff) | |
| download | mullvadvpn-8bf6b6f4b3237770cf115fc3a1b2baeb30a43650.tar.xz mullvadvpn-8bf6b6f4b3237770cf115fc3a1b2baeb30a43650.zip | |
Make notification area and connectivity label live areas
| -rw-r--r-- | gui/src/renderer/components/NotificationArea.tsx | 2 | ||||
| -rw-r--r-- | gui/src/renderer/components/SecuredLabel.tsx | 6 |
2 files changed, 6 insertions, 2 deletions
diff --git a/gui/src/renderer/components/NotificationArea.tsx b/gui/src/renderer/components/NotificationArea.tsx index 2d4b0cd2d2..9c5d8f13f6 100644 --- a/gui/src/renderer/components/NotificationArea.tsx +++ b/gui/src/renderer/components/NotificationArea.tsx @@ -66,7 +66,7 @@ export default function NotificationArea(props: IProps) { return ( <NotificationBanner className={props.className} visible> <NotificationIndicator type={notification.indicator} /> - <NotificationContent> + <NotificationContent role="alert" aria-live="assertive"> <NotificationTitle>{notification.title}</NotificationTitle> <NotificationSubtitle>{notification.subtitle}</NotificationSubtitle> </NotificationContent> diff --git a/gui/src/renderer/components/SecuredLabel.tsx b/gui/src/renderer/components/SecuredLabel.tsx index 7f68b100ae..36cee2db18 100644 --- a/gui/src/renderer/components/SecuredLabel.tsx +++ b/gui/src/renderer/components/SecuredLabel.tsx @@ -29,7 +29,11 @@ interface ISecuredLabelProps { } export default function SecuredLabel(props: ISecuredLabelProps) { - return <StyledSecuredLabel {...props}>{getLabelText(props.displayStyle)}</StyledSecuredLabel>; + return ( + <StyledSecuredLabel {...props} role="alert" aria-live="polite"> + {getLabelText(props.displayStyle)} + </StyledSecuredLabel> + ); } function getLabelText(displayStyle: SecuredDisplayStyle) { |