more redesign work on challenge views

This commit is contained in:
Quincy Larson
2016-01-09 22:12:32 -06:00
committed by Berkeley Martinez
parent 7e481833cd
commit 7eefcb0705
14 changed files with 261 additions and 226 deletions

View File

@ -26,7 +26,7 @@
//## Settings for some of the most global styles.
//** Background color for `<body>`.
@body-bg: #fefefe;
@body-bg: #eee;
//** Global text color on `<body>`.
@text-color: @gray-dark;

View File

@ -291,6 +291,8 @@ ul {
margin-right: 10px;
white-space: nowrap;
}
background-color: #215f1e;
text-align: center;
}
.navbar {
white-space: nowrap;
@ -427,13 +429,6 @@ thead {
}
}
.signin-button-nav {
@media (min-width: 991px) and (max-width: 1010px) {
margin-left: -10px;
margin-right: -5px;
}
}
.navbar-nav a {
color: @gray-lighter;
font-size: 20px;
@ -444,16 +439,15 @@ thead {
color: @gray-lighter;
}
.navbar-right {
background-color: #215f1e;
text-align: center;
}
.signup-btn-nav {
margin-top: -2px !important;
padding-top: 10px !important;
padding-bottom: 10px !important;
margin-right: -12px;
@media (min-width: 991px) and (max-width: 1010px) {
margin-left: -10px;
margin-right: -5px;
}
}
.public-profile-img {

View File

@ -1,19 +1,18 @@
extends ../layout
block content
.jumbotron.text-center
.row
.col-xs-12
h2 Sign in with an email address here:
.col-sm-6.col-sm-offset-3
form(method='POST', action='/api/users/login')
input(type='hidden', name='_csrf', value=_csrf)
.form-group
input.input-lg.form-control(type='email', name='email', id='email', placeholder='Email', autofocus=true)
.form-group
input.input-lg.form-control(type='password', name='password', id='password', placeholder='Password')
button.btn.btn-primary.btn-lg.btn-block(type='submit')
span.ion-android-hand
| Login
.button-spacer
.button-spacer
a.btn.btn-info.btn-lg.btn-block(href='/forgot') Forgot your password?
.row
.col-xs-12
h2.text-center Sign in with an email address here:
.col-sm-6.col-sm-offset-3
form(method='POST', action='/api/users/login')
input(type='hidden', name='_csrf', value=_csrf)
.form-group
input.input-lg.form-control(type='email', name='email', id='email', placeholder='Email', autofocus=true)
.form-group
input.input-lg.form-control(type='password', name='password', id='password', placeholder='Password')
button.btn.btn-primary.btn-lg.btn-block(type='submit')
span.ion-android-hand
| Login
.button-spacer
.button-spacer
a.btn.btn-info.btn-lg.btn-block(href='/forgot') Forgot your password?

View File

@ -1,9 +1,8 @@
extends ../layout
block content
script.
var challengeName = 'Email Signup'
.jumbotron.text-center
h2 Sign up with an email address here:
script.
var challengeName = 'Email Signup'
h2.text-center Sign up with an email address here:
form.form-horizontal(method='POST', action='/api/users', name="signupForm")
.row
.col-sm-6.col-sm-offset-3
@ -13,6 +12,6 @@ block content
.form-group
input.input-lg.form-control(type='password', name='password', id='password', placeholder='password', required, pattern=".{8,50}", title="Must be at least 8 characters and no longer than 50 characters.")
.form-group
button.btn.btn-lg.btn-success.btn-block(type='submit')
button.btn.btn-lg.btn-primary.btn-block(type='submit')
span.ion-person-add
| Signup

View File

@ -1,12 +1,11 @@
extends ../layout
block content
.col-sm-8.col-sm-offset-2.jumbotron
.col-sm-6.col-sm-offset-3
form(method='POST', action="/forgot")
h2.text-center Forgot Password Reset
input(type='hidden', name='_csrf', value=_csrf)
.form-group
p Enter your email address. We'll send you password reset instructions.
p.large-p Enter your email address. We'll send you password reset instructions.
input.form-control.input-lg(type='email', name='email', id='email', placeholder='Email', autofocus=true required)
.form-group
button.btn.btn-primary.btn-lg.btn-block(type='submit')

View File

@ -4,7 +4,6 @@ block content
link(rel='stylesheet', href='/bower_components/CodeMirror/addon/lint/lint.css')
link(rel='stylesheet', href='/bower_components/CodeMirror/theme/monokai.css')
link(rel='stylesheet', href='/css/ubuntu.css')
.row
.col-md-4.col-lg-3
.scroll-locker(id = "scroll-locker")
@ -14,6 +13,7 @@ block content
if (isCompleted)
| &nbsp;
i.ion-checkmark-circled.text-primary(title="Completed")
hr
.row
.col-xs-12
.bonfire-instructions

View File

@ -4,7 +4,7 @@ block content
link(rel='stylesheet', href='/bower_components/CodeMirror/addon/lint/lint.css')
link(rel='stylesheet', href='/bower_components/CodeMirror/theme/monokai.css')
link(rel='stylesheet', href='/css/ubuntu.css')
.row.courseware-height
.row
.col-md-3.col-lg-3
.scroll-locker(id = "scroll-locker")
.innerMarginFix(style = "width: 99%;")

View File

@ -8,11 +8,12 @@ block content
.col-md-4.col-lg-3
.scroll-locker(id = "scroll-locker")
.innerMarginFix(style = "width: 99%;")
#testCreatePanel.well
#testCreatePanel
h3.text-center.negative-10= name
if (isCompleted)
| &nbsp;
i.ion-checkmark-circled.text-primary(title="Completed")
hr
.row
.col-xs-12
.bonfire-instructions

View File

@ -5,21 +5,17 @@ block content
.spacer
.row
.col-xs-12.col-sm-12.col-md-3
h3.nowrap Get connected
img.img-responsive.landing-icon.img-center(src= 'https://s3.amazonaws.com/freecodecamp/landingIcons_connect.svg.gz', alt='Get great references and connections to start your software engineer career')
p.landing-p Join a community of 100,000+ motivated people.
p.large-p Join a community of 100,000+ developers.
.col-xs-12.col-sm-12.col-md-3
h3.nowrap Learn JavaScript
img.img-responsive.landing-icon.img-center(src= 'https://s3.amazonaws.com/freecodecamp/landingIcons_learn.svg.gz', alt='Learn to code and learn full stack JavaScript')
p.landing-p Work together on Full Stack JavaScript coding challenges.
p.large-p Work together on coding challenges.
.col-xs-12.col-sm-12.col-md-3
h3.nowrap Build your portfolio
img.img-responsive.landing-icon.img-center(src= 'https://s3.amazonaws.com/freecodecamp/landingIcons_portfolio.svg.gz', alt='Build a portfolio of apps for nonprofits')
p.landing-p Build apps that solve real problems for real people.
p.large-p Build a portfolio of apps that solve real problems.
.col-xs-12.col-sm-12.col-md-3
h3.nowrap Help nonprofits
img.img-responsive.landing-icon.img-center(src= 'https://s3.amazonaws.com/freecodecamp/landingIcons_nonprofits.svg.gz', alt='Help empower nonprofits with code')
p.landing-p Give nonprofits a boost by empowering them with code.
p.large-p Empowering nonprofits with code.
.big-break
.row
.col-xs-12.col-sm-8.col-sm-offset-2
@ -90,14 +86,15 @@ block content
.spacer
.col-xs-offset-0.col-sm-offset-1.text-left
h2 Here's why you should join our open source community right now:
.spacer
ul.large-li
li.ion-code &thinsp; You'll get help in real time from our community chat rooms.
li.ion-code &thinsp; You'll meet up with other coders in your city.
li.ion-code &thinsp; You'll learn to code at your own pace, in your browser or on your phone.
li.ion-code &thinsp; You'll work through our focused, interactive courses and tutorials.
li.ion-code &thinsp; You'll learn state-of-the-art full stack JavaScript technologies.
li.ion-code &thinsp; You'll build projects that help nonprofits carry out their missions more effectively.
li.ion-code &thinsp; You'll assemble a portfolio of real apps used by real people.
li.ion-code.large-p &thinsp; You'll get help in real time from our community chat rooms.
li.ion-code.large-p &thinsp; You'll meet up with other coders in your city.
li.ion-code.large-p &thinsp; You'll learn to code at your own pace, in your browser or on your phone.
li.ion-code.large-p &thinsp; You'll work through our focused, interactive courses and tutorials.
li.ion-code.large-p &thinsp; You'll learn state-of-the-art full stack JavaScript technologies.
li.ion-code.large-p &thinsp; You'll build projects that help nonprofits carry out their missions more effectively.
li.ion-code.large-p &thinsp; You'll assemble a portfolio of real apps used by real people.
.big-break
.row
.col-xs-12.col-sm-8.col-sm-offset-2

View File

@ -2,77 +2,74 @@ extends ../layout
block content
script.
var challengeName = 'Nonprofits View';
.panel.panel-info
.panel-heading.text-center= title
.panel-body
.row
.col-xs-12.col-sm-10.col-sm-offset-1
.row
.col-xs-12.col-sm-10.col-sm-offset-1
.row
.col-xs-12
img.img-center.img-responsive(src=imageUrl)
.col-xs-12
img.img-center.img-responsive(src=imageUrl)
.spacer
.row
.col-xs-12.col-sm-4
img.img-responsive(src=logoUrl)
.col-xs-12.col-sm-8
.col-xs-12
h4= whatDoesNonprofitDo
h4
a(href=websiteLink)= websiteLink
.spacer
.row
.col-xs-12.col-sm-4
img.img-responsive(src=logoUrl)
.col-xs-12.col-sm-8
.col-xs-12
h4= whatDoesNonprofitDo
h4
a(href=websiteLink)= websiteLink
.spacer
h3 Project Description:
.col-xs-12
h4.negative-15 #{projectDescription} (About #{estimatedHours} hours per camper)
.spacer
h3 This project involves building:
h4.negative-15.col-xs-12
if (approvedWebsite)
.ion-android-globe &nbsp; Website
if (approvedDonor)
.ion-card &nbsp; Donor Management System
if (approvedInventory)
.ion-ios-box &nbsp; Inventory Management System
if (approvedVolunteer)
.ion-android-calendar &nbsp; Volunteer Management System
if (approvedForm)
.ion-ios-list &nbsp; Webform
if (approvedCommunity)
.ion-ios-people &nbsp; Community Management System
if (approvedELearning)
.ion-university &nbsp; E-learning Platform
if (approvedOther)
.ion-settings &nbsp; Other tools
h3 Project Status: #{currentStatus}
if (moneySaved > 0)
h3.text-primary Estimated Cost Savings for Nonprofit: $#{moneySaved.toString().replace(/000$/, ',000')}
h3 Project Description:
.col-xs-12
h4.negative-15 #{projectDescription} (About #{estimatedHours} hours per camper)
.spacer
h3 This project involves building:
h4.negative-15.col-xs-12
if (approvedWebsite)
.ion-android-globe &nbsp; Website
if (approvedDonor)
.ion-card &nbsp; Donor Management System
if (approvedInventory)
.ion-ios-box &nbsp; Inventory Management System
if (approvedVolunteer)
.ion-android-calendar &nbsp; Volunteer Management System
if (approvedForm)
.ion-ios-list &nbsp; Webform
if (approvedCommunity)
.ion-ios-people &nbsp; Community Management System
if (approvedELearning)
.ion-university &nbsp; E-learning Platform
if (approvedOther)
.ion-settings &nbsp; Other tools
h3 Project Status: #{currentStatus}
if (moneySaved > 0)
h3.text-primary Estimated Cost Savings for Nonprofit: $#{moneySaved.toString().replace(/000$/, ',000')}
if (interestedCampers && interestedCampers.length > 0)
h3 Interested campers:
.col-xs-12.text-left
for interestedCamper in interestedCampers
a(href='/' + interestedCamper.username class="interested-camper-image")
img.profile-picture.float-right(src=interestedCamper.picture)
if (assignedCampers && assignedCampers.length > 0)
h3 Assigned campers:
.col-xs-12.text-left
for assignedCamper in assignedCampers
a(href='/' + assignedCamper.username class="interested-camper-image")
img.profile-picture.float-right(src=assignedCamper.picture)
if (!buttonActive)
.col-xs-12.col-sm-8.col-sm-offset-2
.text-center
if !user
a.btn.btn-cta.signup-btn.btn-block(href="/login") Start learning to code (it's free)
.button-spacer
else
a.btn.btn-primary.btn-big.btn-block.disabled(href='/nonprofits/interested-in-nonprofit/#{dashedName}') I'm interested in building this project *
p * Complete all our Bonfires, Ziplines, and Basejumps to unlock this.
a.btn.btn-info.btn-big.btn-block(href='/nonprofits/directory') Show all Nonprofit Projects
.spacer
if (buttonActive)
.col-xs-12.col-sm-8.col-sm-offset-2
.text-center
a.btn.btn-primary.btn-big.btn-block(href='/nonprofits/interested-in-nonprofit/#{dashedName}') I'm interested in building this project
.button-spacer
a.btn.btn-info.btn-big.btn-block(href='/nonprofits/directory') Show all Nonprofit Projects
.spacer
if (interestedCampers && interestedCampers.length > 0)
h3 Interested campers:
.col-xs-12.text-left
for interestedCamper in interestedCampers
a(href='/' + interestedCamper.username class="interested-camper-image")
img.profile-picture.float-right(src=interestedCamper.picture)
if (assignedCampers && assignedCampers.length > 0)
h3 Assigned campers:
.col-xs-12.text-left
for assignedCamper in assignedCampers
a(href='/' + assignedCamper.username class="interested-camper-image")
img.profile-picture.float-right(src=assignedCamper.picture)
if (!buttonActive)
.col-xs-12.col-sm-8.col-sm-offset-2
.text-center
if !user
a.btn.btn-cta.signup-btn.btn-block(href="/login") Start learning to code (it's free)
.button-spacer
else
a.btn.btn-primary.btn-big.btn-block.disabled(href='/nonprofits/interested-in-nonprofit/#{dashedName}') I'm interested in building this project *
p * Complete all our Bonfires, Ziplines, and Basejumps to unlock this.
a.btn.btn-info.btn-big.btn-block(href='/nonprofits/directory') Show all Nonprofit Projects
.spacer
if (buttonActive)
.col-xs-12.col-sm-8.col-sm-offset-2
.text-center
a.btn.btn-primary.btn-big.btn-block(href='/nonprofits/interested-in-nonprofit/#{dashedName}') I'm interested in building this project
.button-spacer
a.btn.btn-info.btn-big.btn-block(href='/nonprofits/directory') Show all Nonprofit Projects
.spacer

View File

@ -24,9 +24,8 @@ nav.navbar.navbar-default.navbar-fixed-top.nav-height
li
a(href='/about') About
if !user
li &thinsp; &thinsp; &thinsp;
li
a.btn.signup-btn.signup-btn-nav.signin-button-nav(href='/login') Sign in
a(href='/login') Sign in
else
li.brownie-points-nav
a(href='/' + user.username) [&thinsp;#{user.progressTimestamps.length}&thinsp;]

View File

@ -0,0 +1,54 @@
extends ../layout
block content
table.table.link-table
tr
td.text-right
.ion-erlenmeyer-flask
td
a(href="/labs") Cool Apps Built by Campers
tr
td.text-right
.ion-chatbox
td
a(href="/stories") Stories from Campers
tr
td.text-right
.ion-speakerphone
td
a(href='//medium.freecodecamp.com', target='_blank') Medium Publication
tr
td.text-right
.ion-social-github
td
a(href="//github.com/freecodecamp", target='_blank') GitHub Repository
tr
td.text-right
.ion-social-reddit
td
a(href="//www.reddit.com/r/freecodecamp", target='_blank') Subreddit
tr
td.text-right
.ion-social-linkedin
td
a(href="//www.linkedin.com/edu/school?id=166029", target='_blank') LinkedIn University Page
tr
td.text-right
.ion-social-twitter
td
a(href="//twitter.com/freecodecamp", target='_blank') Twitter Feed
tr
td.text-right
.ion-social-facebook
td
a(href="//facebook.com/freecodecamp") Facebook Page
tr
td.text-right
.ion-social-twitch-outline
td
a(href="//twitch.tv/freecodecamp", target='_blank') Twitch.tv Channel
tr
td.text-right
.ion-locked
td
a(href="//github.com/FreeCodeCamp/freecodecamp/wiki/Free-Code-Camp's-Privacy-Policy") Privacy Policy
.spacer

View File

@ -1,77 +1,75 @@
extends ../layout
block content
.jumbotron
.text-center
.row
.col-xs-12
h1.landing-heading Get pro bono code for your nonprofit.
.text-center
.row
.col-xs-12
h1.landing-heading Get pro bono code for your nonprofit.
.big-break
.col-xs-12.col-sm-12.col-md-12
.embed-responsive.embed-responsive-16by9
iframe.embed-responsive-item(src='//player.vimeo.com/video/126228100')
.big-break
.col-xs-12.col-sm-12.col-md-12
.embed-responsive.embed-responsive-16by9
iframe.embed-responsive-item(src='//player.vimeo.com/video/126228100')
.big-break
h2 As featured in:
img.img-center.img-responsive(src='https://s3.amazonaws.com/freecodecamp/as-seen-on.png')
.spacer
hr
.spacer
h2 Our process:
.row
.col-xs-12.col-sm-12.col-md-4
h3.nowrap Your idea
img.img-responsive.landing-icon.img-center(src= 'https://s3.amazonaws.com/freecodecamp/landingIcons_portfolio.svg.gz', alt='Image of a briefcase')
p.landing-p You tell us how we can help you.
.col-xs-12.col-sm-12.col-md-4
h3.nowrap Our team
img.img-responsive.landing-icon.img-center(src= 'https://s3.amazonaws.com/freecodecamp/landingIcons_nonprofits.svg.gz', alt='Image of people putting their hands together in a huddle')
p.landing-p We'll hand pick developers and a project manager.
.col-xs-12.col-sm-12.col-md-4
h3.nowrap Your solution
img.img-responsive.landing-icon.img-center(src= 'https://s3.amazonaws.com/freecodecamp/landingIcons_connect.svg.gz', alt='image of two people high-fiving')
p.landing-p Together we'll set milestones and complete your project.
.spacer
hr
.spacer
h2 Solutions we can help you build:
.text-center.negative-35
.col-xs-12.col-sm-12.col-md-3
.landing-skill-icon.ion-android-globe
h2.black-text Websites
.col-xs-12.col-sm-12.col-md-3
.landing-skill-icon.ion-card
h2.black-text Donation Systems
.col-xs-12.col-sm-12.col-md-3
.landing-skill-icon.ion-android-calendar
h2.black-text Volunteer Systems
.col-xs-12.col-sm-12.col-md-3
.landing-skill-icon.ion-ios-box
h2.black-text Inventory Systems
.col-xs-12.col-sm-12.col-md-3
.landing-skill-icon.ion-university
h2.black-text E-learning Platforms
.col-xs-12.col-sm-12.col-md-3
.landing-skill-icon.ion-ios-list
h2.black-text Paperless Workflows
.col-xs-12.col-sm-12.col-md-3
.landing-skill-icon.ion-ios-people
h2.black-text Community Tools
.col-xs-12.col-sm-12.col-md-3
.landing-skill-icon.ion-settings
h2.black-text ...and other tools
.spacer
hr
.spacer
.large-p.text-left.col-xs-offset-0.col-sm-offset-1
h2 Our developers build projects for nonprofits who:
ul.large-li
li.ion-code &thinsp; already have people who benefit from their services.
li.ion-code &thinsp; are registered with their government and have tax-exempt status.
li.ion-code &thinsp; have a stakeholder who can meet with our developers to direct the project.
li.ion-code &thinsp; can budget at least $20 per month for their own cloud servers.
li.ion-code &thinsp; can commit to using and maintaining the solution that our developers build.
.big-break
.row
.col-xs-12.col-sm-8.col-sm-offset-2
a.btn.btn-cta.signup-btn.btn-block(href="/nonprofits-form") My nonprofit needs coding help
.button-spacer
a.btn.btn-lg.btn-primary.btn-primary-ghost.btn-block(href="/nonprofits/directory") Browse our directory of nonprofits we've helped
h2 As featured in:
img.img-center.img-responsive(src='https://s3.amazonaws.com/freecodecamp/as-seen-on.png')
.spacer
hr
.spacer
h2 Our process:
.spacer
.row
.col-xs-12.col-sm-12.col-md-4
img.img-responsive.landing-icon.img-center(src= 'https://s3.amazonaws.com/freecodecamp/landingIcons_portfolio.svg.gz', alt='Image of a briefcase')
p.large-p You tell us how we can help you.
.col-xs-12.col-sm-12.col-md-4
img.img-responsive.landing-icon.img-center(src= 'https://s3.amazonaws.com/freecodecamp/landingIcons_nonprofits.svg.gz', alt='Image of people putting their hands together in a huddle')
p.large-p We'll hand pick developers and a project manager.
.col-xs-12.col-sm-12.col-md-4
img.img-responsive.landing-icon.img-center(src= 'https://s3.amazonaws.com/freecodecamp/landingIcons_connect.svg.gz', alt='image of two people high-fiving')
p.large-p Together we'll set milestones and complete your project.
.spacer
hr
.spacer
h2 Solutions we can help you build:
.spacer
.text-center.negative-35
.col-xs-12.col-sm-12.col-md-3
.landing-skill-icon.ion-android-globe
h2.black-text Websites
.col-xs-12.col-sm-12.col-md-3
.landing-skill-icon.ion-card
h2.black-text Donation Systems
.col-xs-12.col-sm-12.col-md-3
.landing-skill-icon.ion-android-calendar
h2.black-text Volunteer Systems
.col-xs-12.col-sm-12.col-md-3
.landing-skill-icon.ion-ios-box
h2.black-text Inventory Systems
.col-xs-12.col-sm-12.col-md-3
.landing-skill-icon.ion-university
h2.black-text E-learning Platforms
.col-xs-12.col-sm-12.col-md-3
.landing-skill-icon.ion-ios-list
h2.black-text Paperless Workflows
.col-xs-12.col-sm-12.col-md-3
.landing-skill-icon.ion-ios-people
h2.black-text Community Tools
.col-xs-12.col-sm-12.col-md-3
.landing-skill-icon.ion-settings
h2.black-text ...and other tools
.spacer
hr
.spacer
.large-p.text-left.col-xs-offset-0.col-sm-offset-1
h2 Our developers build projects for nonprofits who:
ul.large-li
li.ion-code &thinsp; already have people who benefit from their services.
li.ion-code &thinsp; are registered with their government and have tax-exempt status.
li.ion-code &thinsp; have a stakeholder who can meet with our developers to direct the project.
li.ion-code &thinsp; can budget at least $20 per month for their own cloud servers.
li.ion-code &thinsp; can commit to using and maintaining the solution that our developers build.
.big-break
.row
.col-xs-12.col-sm-8.col-sm-offset-2
a.btn.btn-cta.signup-btn.btn-block(href="/nonprofits-form") My nonprofit needs coding help
.button-spacer
a.btn.btn-lg.btn-primary.btn-primary-ghost.btn-block(href="/nonprofits/directory") Browse our directory of nonprofits we've helped

View File

@ -1,27 +1,25 @@
extends ../layout
block content
.panel.panel-info
.panel-heading.text-center Stories from happy campers
.panel-body.text-left
h1.text-center Stories from happy campers
hr
.row
.col-xs-12.col-sm-10.col-sm-offset-1
.row
.col-xs-12.col-sm-10.col-sm-offset-1
.row
for story in stories
.col-xs-12.col-sm-6.col-md-4
.height-500
a(href=story.linkedin target='_blank')
img.testimonial-image.img-responsive.img-center(src=story.image)
h3.text-center= story.camper
| &nbsp;
a.fa.fa-linkedin-square.text-primary(alt="#{story.camper}'s LinkedIn Profile", href=story.linkedin, target='_blank')
p.text-justify= story.quote
.col-xs-12.col-sm-10.col-sm-offset-1
if moreStories
.text-center
a.btn.btn-lg.btn-primary.btn-primary-ghost.btn-block(href="/all-stories") Show more stories
.spacer
for story in stories
.col-xs-12.col-sm-6.col-md-4
.height-500
a(href=story.linkedin target='_blank')
img.testimonial-image.img-responsive.img-center(src=story.image)
h3.text-center= story.camper
| &nbsp;
a.fa.fa-linkedin-square.text-primary(alt="#{story.camper}'s LinkedIn Profile", href=story.linkedin, target='_blank')
p.text-justify= story.quote
.col-xs-12.col-sm-10.col-sm-offset-1
if moreStories
.text-center
a.btn.btn-lg.btn-primary.btn-primary-ghost.btn-block(href="/all-stories") Show more stories
.spacer
if !user
.text-center
a.btn.btn-cta.signup-btn.btn-block(href="/login") Start learning to code (it's free)
.spacer
if !user
.text-center
a.btn.btn-cta.signup-btn.btn-block(href="/login") Start learning to code (it's free)