Add descriptions to ambiguous links for screen readers (#7310)
* add title to room share link Signed-off-by: Kerry Archibald <kerrya@element.io> * add ExternalLink component Signed-off-by: Kerry Archibald <kerrya@element.io> * unit test ExternalLink Signed-off-by: Kerry Archibald <kerrya@element.io> * default target and rel for external link Signed-off-by: Kerry Archibald <kerrya@element.io> * use scss $font variables Signed-off-by: Kerry Archibald <kerrya@element.io>
This commit is contained in:
parent
d7a6e3ec65
commit
1216285ed2
9 changed files with 160 additions and 8 deletions
|
@ -28,6 +28,7 @@ import AccessibleButton from '../elements/AccessibleButton';
|
|||
import AvatarSetting from './AvatarSetting';
|
||||
|
||||
import { logger } from "matrix-js-sdk/src/logger";
|
||||
import ExternalLink from '../elements/ExternalLink';
|
||||
|
||||
interface IState {
|
||||
userId?: string;
|
||||
|
@ -165,12 +166,11 @@ export default class ProfileSettings extends React.Component<{}, IState> {
|
|||
{ _t(
|
||||
"<a>Upgrade</a> to your own domain", {},
|
||||
{
|
||||
a: sub => <a href={hostingSignupLink} target="_blank" rel="noreferrer noopener">{ sub }</a>,
|
||||
a: sub => <ExternalLink href={hostingSignupLink} target="_blank" rel="noreferrer noopener">
|
||||
{ sub }
|
||||
</ExternalLink>,
|
||||
},
|
||||
) }
|
||||
<a href={hostingSignupLink} target="_blank" rel="noreferrer noopener">
|
||||
<img src={require("../../../../res/img/external-link.svg")} width="11" height="10" alt='' />
|
||||
</a>
|
||||
</span>;
|
||||
}
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue