gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

fix accessibility issues

Browse Source 
report challenges' completion state and remove <code> tag in test suite
This commit is contained in:
huyenltnguyen
2018-07-05 22:27:00 +07:00
committed by Mrugesh Mohapatra
parent d8bee6a7ad
commit c6c1e347d0
3 changed files with 77 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
packages/learn/src/templates/Challenges/components/Test-Suite.js
View File

@ -13,6 +13,7 @@ const propTypes = {
function getAccessibleText(err, pass, text) {
let accessibleText = 'Waiting';
const cleanText = text.replace(/<\/?code>/g, '');
// Determine test status (i.e. icon)
if (err) {
@ -22,7 +23,7 @@ function getAccessibleText(err, pass, text) {
}
// Append the text itself
return accessibleText + ' - ' + text;
return accessibleText + ' - ' + cleanText;
}
function TestSuite({ tests }) {

49
packages/learn/src/templates/Challenges/components/icons/GreenNotCompleted.js
View File

@ -1,31 +1,34 @@
import React from 'react';
import React, { Fragment } from 'react';
const propTypes = {};
function GreenNotCompleted(props) {
return (
<svg
height='50'
viewBox='0 0 200 200'
width='50'
xmlns='http://www.w3.org/2000/svg'
{...props}
>
<g>
<title>Not Passed</title>
<circle
cx='100'
cy='99'
fill='#FFFFFF'
r='95'
stroke='#006400'
strokeDasharray='null'
strokeLinecap='null'
strokeLinejoin='null'
strokeWidth='5'
/>
</g>
</svg>
<Fragment>
<span className='sr-only'>Not Passed</span>
<svg
height='50'
viewBox='0 0 200 200'
width='50'
xmlns='http://www.w3.org/2000/svg'
{...props}
>
<g>
<title>Not Passed</title>
<circle
cx='100'
cy='99'
fill='#FFFFFF'
r='95'
stroke='#006400'
strokeDasharray='null'
strokeLinecap='null'
strokeLinejoin='null'
strokeWidth='5'
/>
</g>
</svg>
</Fragment>
);
}

95
packages/learn/src/templates/Challenges/components/icons/GreenPass.js
View File

@ -1,52 +1,55 @@
import React from 'react';
import React, { Fragment } from 'react';
function GreenPass(props) {
return (
<svg
height='50'
viewBox='0 0 200 200'
width='50'
xmlns='http://www.w3.org/2000/svg'
{...props}
>
<g>
<title>Passed</title>
<circle
cx='100'
cy='99'
fill='#006400'
r='95'
stroke='#006400'
strokeDasharray='null'
strokeLinecap='null'
strokeLinejoin='null'
/>
<rect
fill='#ffffff'
height='30'
stroke='#ffffff'
strokeDasharray='null'
strokeLinecap='null'
strokeLinejoin='null'
transform='rotate(-45, 120, 106.321)'
width='128.85878'
x='55.57059'
y='91.32089'
/>
<rect
fill='#ffffff'
height='30'
stroke='#ffffff'
strokeDasharray='null'
strokeLinecap='null'
strokeLinejoin='null'
transform='rotate(45, 66.75, 123.75)'
width='80.66548'
x='26.41726'
y='108.75'
/>
</g>
</svg>
<Fragment>
<span className='sr-only'>Passed</span>
<svg
height='50'
viewBox='0 0 200 200'
width='50'
xmlns='http://www.w3.org/2000/svg'
{...props}
>
<g>
<title>Passed</title>
<circle
cx='100'
cy='99'
fill='#006400'
r='95'
stroke='#006400'
strokeDasharray='null'
strokeLinecap='null'
strokeLinejoin='null'
/>
<rect
fill='#ffffff'
height='30'
stroke='#ffffff'
strokeDasharray='null'
strokeLinecap='null'
strokeLinejoin='null'
transform='rotate(-45, 120, 106.321)'
width='128.85878'
x='55.57059'
y='91.32089'
/>
<rect
fill='#ffffff'
height='30'
stroke='#ffffff'
strokeDasharray='null'
strokeLinecap='null'
strokeLinejoin='null'
transform='rotate(45, 66.75, 123.75)'
width='80.66548'
x='26.41726'
y='108.75'
/>
</g>
</svg>
</Fragment>
);
}