kyy/swagger-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

improve(a11y): visibility accessibility via aria-label (#4127)

Browse Source 
* Added aria-label for visual readers.

* Increased font weight for Models section span to meet contrast ratio visibility requirements.
This commit is contained in:
maryscar
2018-01-25 12:41:26 -08:00
committed by kyle
parent 4599033b5a
commit 2f236982f8
2 changed files with 4 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/core/components/auth/authorize-operation-btn.jsx
View File

@@ -20,7 +20,9 @@ export default class AuthorizeOperationBtn extends React.Component {
let { isAuthorized } = this.props
return (
<button className={isAuthorized ? "authorization__btn locked" : "authorization__btn unlocked"} onClick={ this.onClick }>
<button className={isAuthorized ? "authorization__btn locked" : "authorization__btn unlocked"}
aria-label={isAuthorized ? "authorization button locked" : "authorization button unlocked"}
onClick={this.onClick}>
<svg width="20" height="20">
<use href={ isAuthorized ? "#locked" : "#unlocked" } xlinkHref={ isAuthorized ? "#locked" : "#unlocked" } />
</svg>

2
src/style/_variables.scss
View File

@@ -175,7 +175,7 @@ $section-models-border-color: $gray-custom-2 !default;
$section-models-isopen-h4-border-bottom-color: $section-models-border-color !default;
$section-models-h4-font-color: $gray-500 !default;
$section-models-h4-font-color: $gray-600 !default;
$section-models-h4-background-color-hover: $gray-base !default;
$section-models-h5-font-color: $gray-500 !default;