make map carets clickable, add full stack and interview prep sections

This commit is contained in:
Quincy Larson
2016-01-21 10:03:26 +08:00
parent b971abcebf
commit c94609de04
3 changed files with 74 additions and 11 deletions

View File

@ -105,6 +105,10 @@ h1, h2, h3, h4, h5, h6, p, li {
text-decoration: none;
}
.no-link-underline {
text-decoration: none;
}
.img-center {
margin: 0 auto;
}

View File

@ -9,7 +9,7 @@ block content
.big-break
.col-xs-12.col-sm-12.col-md-3
img.img-responsive.landing-icon.img-center(src= 'https://s3.amazonaws.com/freecodecamp/landingIcons_connect.svg', alt='Get great references and connections to start your software engineer career')
p.large-p Join a community of 100,000+ developers.
p.large-p Join a community of 200,000+ developers.
.col-xs-12.col-sm-12.col-md-3
img.img-responsive.landing-icon.img-center(src= 'https://s3.amazonaws.com/freecodecamp/landingIcons_learn.svg', alt='Learn to code and learn full stack JavaScript')
p.large-p Work together on coding challenges.

View File

@ -1,37 +1,36 @@
extends ../layout-wide
block content
.text-center.map-fixed-header
h1 Challenge Map
.text-center
p Required challenges are marked with a *
.row
.col-xs-10.col-xs-offset-1.col-sm-6.col-sm-offset-3.col-md-4.col-md-offset-4
.btn.btn-primary.btn-block.active#showAll Collapse all challenges
hr
#accordion.map-accordion
#accordion
for superBlock, index in superBlocks
h2
i.fa.fa-caret-down
|  
a(data-toggle='collapse', data-parent='#accordion', href='#collapse'+superBlock.name.split(' ').join('-'))
span.no-link-underline
i.fa.fa-caret-down  
| #{superBlock.name}
div.margin-left-10(id = 'collapse'+superBlock.name.split(' ').join('-') class = "collapse in map-collapse no-transition")
#nested
for challengeBlock in superBlock.blocks
h3
i.fa.fa-caret-down
|  
a(data-toggle='collapse', data-parent='#nested', href='#nested-collapse'+challengeBlock.name.replace(/(\W)/gi, '').split(' ').join('-'))
span.no-link-underline
i.fa.fa-caret-down  
| #{challengeBlock.name} (#{challengeBlock.time})
div.margin-left-10(id = "nested-collapse"+challengeBlock.name.replace(/\W/gi, '').split(' ').join('-') class = "collapse in map-collapse no-transition")
.button-spacer
for challenge in challengeBlock.challenges
if challenge.completed
p.text-primary.ion-checkmark-circled.padded-ionic-icon.negative-15(name="#{challenge.dashedName}")    
p.slightly-faded.text-primary.ion-checkmark-circled.padded-ionic-icon.negative-15(name="#{challenge.dashedName}")    
a(href="/challenges/#{challenge.dashedName}" target='_parent')
= challenge.title
span.sr-only= " Complete"
else if challenge.isRequired
p.slightly-faded.ion-ios-circle-outline.padded-ionic-icon.negative-15(name="#{challenge.dashedName}")    
p.ion-ios-circle-outline.padded-ionic-icon.negative-15(name="#{challenge.dashedName}")    
a(name="#{challenge.dashedName}" target='_parent' href="/challenges/#{challenge.dashedName}" class=challenge.isComingSoon ? 'disabled' : '')
span= challenge.title
span.sr-only= " Incomplete"
@ -46,7 +45,7 @@ block content
span.text-primary    
strong *
else
p.slightly-faded.ion-ios-circle-outline.padded-ionic-icon.negative-15(name="#{challenge.dashedName}")    
p.ion-ios-circle-outline.padded-ionic-icon.negative-15(name="#{challenge.dashedName}")    
a(name="#{challenge.dashedName}" target='_parent' href="/challenges/#{challenge.dashedName}" class=challenge.isComingSoon ? 'disabled' : '')
span= challenge.title
span.sr-only= " Incomplete"
@ -58,4 +57,64 @@ block content
span.text-info.small    
strong
em Coming Soon
h2
a(data-toggle='collapse', data-parent='#accordion', href='#collapse-full-stack-development-certification')
span.no-link-underline
i.fa.fa-caret-down  
| Full Stack Development Certification
div.margin-left-10(id = 'collapse-full-stack-development-certification' class = "collapse in map-collapse no-transition")
#nested
h3
a(data-toggle='collapse', data-parent='#nested', href='#nested-collapse-nonprofit-projects')
span.no-link-underline
i.fa.fa-caret-down  
| Nonprofit Projects (800 hours)
div.margin-left-10(id = "nested-collapse-nonprofit-projects" class = "collapse in map-collapse no-transition")
.button-spacer
p To qualify for these nonprofit projects, you must first earn all three foundational certifications: Front End, Data Visualization, and Back End
.button-spacer
p.disabled.text-primary.ion-locked.padded-ionic-icon.negative-15(name="Greenfield Nonprofit Project #1")     Greenfield Nonprofit Project #1
span.text-primary    
strong *
p.disabled.text-primary.ion-locked.padded-ionic-icon.negative-15(name="Greenfield Nonprofit Project #2")     Greenfield Nonprofit Project #2
span.text-primary    
strong *
p.disabled.text-primary.ion-locked.padded-ionic-icon.negative-15(name="Legacy Code Nonprofit Project #1")     Legacy Code Nonprofit Project #1
span.text-primary    
strong *
p.disabled.text-primary.ion-locked.padded-ionic-icon.negative-15(name="Legacy Code Nonprofit Project #2")     Legacy Code Nonprofit Project #2
span.text-primary    
strong *
p.disabled.text-primary.ion-locked.padded-ionic-icon.negative-15(name="Claim your Full Stack Development Certification")     Claim your Full Stack Development Certification
h2
a(data-toggle='collapse', data-parent='#accordion', href='#collapse-coding-interview-preparation')
span.no-link-underline
i.fa.fa-caret-down  
| Coding Interview Preparation
div.margin-left-10(id = 'collapse-coding-interview-preparation' class = "collapse in map-collapse no-transition")
#nested
h3
a(data-toggle='collapse', data-parent='#nested', href='#nested-collapse-coding-interview-training')
span.no-link-underline
i.fa.fa-caret-down  
| Coding Interview Training (70 hours)
div.margin-left-10(id = "nested-collapse-coding-interview-training" class = "collapse in map-collapse no-transition")
.button-spacer
p To qualify for this coding interview training, you must first earn all four certifications: Front End, Data Visualization, Back End, and Full Stack
.button-spacer
p.disabled.text-primary.ion-locked.padded-ionic-icon.negative-15(name="Soft Skill Training")     Soft Skill Training
p.disabled.text-primary.ion-locked.padded-ionic-icon.negative-15(name="Critical Thinking Training")     Critical Thinking Training
p.disabled.text-primary.ion-locked.padded-ionic-icon.negative-15(name="Whiteboard Coding Training")     Whiteboard Coding Training
h3
a(data-toggle='collapse', data-parent='#nested', href='#nested-collapse-mock-interviews')
span.no-link-underline
i.fa.fa-caret-down  
| Mock Interviews (10 hours)
div.margin-left-10(id = "nested-collapse-mock-interviews" class = "collapse in map-collapse no-transition")
.button-spacer
p To qualify for these mock interviews, you must first earn all four certifications: Front End, Data Visualization, Back End, and Full Stack
.button-spacer
p.disabled.text-primary.ion-locked.padded-ionic-icon.negative-15(name="Mock Interview #1")     Mock Interview #1
p.disabled.text-primary.ion-locked.padded-ionic-icon.negative-15(name="Mock Interview #2")     Mock Interview #2
p.disabled.text-primary.ion-locked.padded-ionic-icon.negative-15(name="Mock Interview #3")     Mock Interview #3
.spacer