codecombat/app/templates/courses/mock1/courses.jade
2015-08-07 10:12:11 -07:00

102 lines
3.4 KiB
Text

extends /templates/base
block content
//- DO NOT localize / i18n
div TODO: Add already enrolled view checkbox
div(style='border-bottom: 1px solid black')
span *UNDER CONSTRUCTION, send feedback to
a.spl(href='mailto:team@codecombat.com') team@codecombat.com
.modal#continueModal
.modal-dialog
.modal-header
button.close(data-dismiss='modal')
span ×
h3.modal-title Loading...
.modal-body
.container-fluid
.row.button-row.row-pick-class
.col-md-12
.well.well-sm
p
div.instruction-label Pick your class
.container-fluid
.row
.col-md-8
select.form-control.select-session
each inst in instances
option= inst.name
.col-md-4
button.btn.btn-success.btn-enter Enter
.row.button-row.center.row-pick-class
.col-md-12
div.or Or
.row.button-row
.col-md-12
.well.well-sm
p
div.instruction-label Enter an unlock code
.container-fluid
.row
.col-md-8
input.code-input(type='text', placeholder="Enter unlock code")
.col-md-4
button.btn.btn-success.btn-enroll Enroll
.row.button-row.center
.col-md-12
div.or Or
.row.button-row.center
.col-md-12
button.btn.btn-success.btn-lg.btn-buy Buy this course
h1.center Courses on CodeCombat
.info-container
p Courses are designed to introduce computer science concepts using CodeCombat's fun and engaging environment. CodeCombat levels are organized around key topics to encourage progressive learning, over the course of 5 hours.
.container-fluid
.row
.col-md-6
ul
li Learn more in less time
li No coding experience necesssary
li Easily monitor student progress
div Purchase a course for your entire class. It's easy to sign up your students!
.col-md-6
.well.well-sm
div.praise-quote "#{praise.quote}"
div.caption-text - #{praise.source}
h2.center Choose Your Course:
.container-fluid
- var i = 0
while i < courses.length
.row
+course-block(courses[i], i)
- i++
if i < courses.length
+course-block(courses[i], i)
- i++
mixin course-block(course, courseID)
.col-md-6
.well.panel.course-panel(class=course.unlocked ? 'panel-success' : 'panel-info')
.panel-heading
.panel-title
span.spr #{course.title}
strong #{course.unlocked ? '[ enrolled ]' : ''}
.panel-body
.container-fluid
.row.button-row
.col-md-6
strong Topics
ul
each topic in course.topics
li= topic
strong Hours of content: #{course.duration}
.col-md-6.center
button.btn.btn-lg.btn-success.btn-continue(data-toggle='modal', data-target="#continueModal", data-course-title="#{course.title}", data-course-id="#{courseID}") #{course.unlocked ? 'Continue' : 'Enter'}