-
Notifications
You must be signed in to change notification settings - Fork 8
Accessibility enhancement added to Link #1827
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: master
Are you sure you want to change the base?
Conversation
|
--STORYBOOK-PREVIEW--
|
…129bb536649b389971d5464b1.0
--EXAMPLE-APPS-PREVIEW--
|
@@ -9,7 +9,8 @@ export default { | |||
size: 'm', | |||
disabled: false, | |||
variant: 'bold', | |||
download: "" | |||
download: "", | |||
AriaLabel: 'Link', |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
could you change this to be lowercase? just to be consistent here
@@ -88,7 +100,7 @@ export default { | |||
}; | |||
|
|||
const DefaultTemplate = args => | |||
`<ifx-link href="${args.href}" target="${args.target}" size="${args.size}" variant="${args.variant}" disabled="${args.disabled}" download="${args.download}" > | |||
`<ifx-link href="${args.href}" aria-label="${args.AriaLabel}" target="${args.target}" size="${args.size}" variant="${args.variant}" disabled="${args.disabled}" download="${args.download}" > | |||
${args.label} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
and same here then :)
@@ -15,6 +15,7 @@ export class Link { | |||
@Prop() size: string; | |||
@Prop() disabled: boolean = false; | |||
@Prop() download: string; | |||
@Prop() AriaLabel: string; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
AriaLabel should be lowercase > ariaLabel
…com/Infineon/infineon-design-system-stencil into 1264-accessibility-enhancement-link
…2a7191e77c8327f1a89e582c7.0
By creating this pull request you agree to the terms in CONTRIBUTING.md.
https://github.com/Infineon/.github/blob/master/CONTRIBUTING.md
--- DO NOT DELETE ANYTHING ABOVE THIS LINE ---
CONTRIBUTING.md also tells you what to expect in the PR process.
Description
Made link focusable if href is not empty. Added keyboard navigation and aria-label property.
Related Issue
#1264
Context
Accessibility enhancement
📦 Published PR as canary version:
33.1.2--canary.1827.d19d80549c3441a2a7191e77c8327f1a89e582c7.0
✨ Test out this PR locally via:
npm install @infineon/infineon-design-system-stencil@33.1.2--canary.1827.d19d80549c3441a2a7191e77c8327f1a89e582c7.0 # or yarn add @infineon/infineon-design-system-stencil@33.1.2--canary.1827.d19d80549c3441a2a7191e77c8327f1a89e582c7.0