import React from 'react';

var TechnicalPathwayLegend = React.createClass({
    displayName: 'TechnicalPathwayLegend',
    render: function () {
        return (
            <div>
                <div className="modal_title">Legend</div>
                <div className="modal_body">
                    <div className="tech-row tech-color--service">                
                        <div className="TechnicalCourse is">Ineligible Course</div>
                        <div className="TechnicalCourse is-ready">Eligible Course</div>
                        <div className="TechnicalCourse is-complete">Completed Course</div>
                        <div className="TechnicalCourse is-complete is-credit">Credited Course</div>        
                    </div>

                    <div className="tech-row">
                        <div className="TechnicalCourse-blank">
                            <p>Course prerequisites have not been completed or credited.</p>
                        </div>
                        <div className="TechnicalCourse-blank">
                            <p>Staff member has completed the required learning to be eligible to complete this course.</p>
                        </div>
                        <div className="TechnicalCourse-blank">
                            <p>Staff member has attended and/or completed this course.</p>
                        </div>
                        <div className="TechnicalCourse-blank">
                            <p>A 'recognition of prior learning' has been credited to this staff member, or they have completed an 'exam for credit' for this course.</p>
                        </div>
                    </div>       

                    <div className='js-removeModal Button l-right'>Okay</div>
                </div>
            </div>
        );
    }
});

module.exports = TechnicalPathwayLegend;