make pages look better by putting them into panels

This commit is contained in:
Michael Q Larson
2014-11-07 14:46:17 -08:00
parent 9739f9b43d
commit f6229ef94b
5 changed files with 33 additions and 23 deletions

View File

@ -7,6 +7,7 @@
// Scaffolding
// -------------------------
html {
position: relative;
min-height: 100%;
@ -157,7 +158,7 @@ ul {
}
.text-success {
color: #5cb85c;
color: @brand-success;
}
.delay-half {
@ -239,3 +240,7 @@ ul {
.dropdown-toggle {
margin-top: -5px;
}
.btn-social {
width: 250px;
}

View File

@ -1,14 +1,17 @@
extends ../layout
block content
.page-header
.panel
.text-center
h3 Sign in to Free Code Camp with any of these social network accounts:
a.btn.btn-block.btn-linkedin.btn-social(href='/auth/linkedin')
a.btn.btn-lg.btn-linkedin.btn-social(href='/auth/linkedin')
i.fa.fa-linkedin
| Sign in with LinkedIn
a.btn.btn-block.btn-twitter.btn-social(href='/auth/twitter')
.ten-pixel-break
a.btn.btn-lg.btn-twitter.btn-social(href='/auth/twitter')
i.fa.fa-twitter
| Sign in with Twitter
br
br
// a.btn.btn-block.btn-facebook.btn-social(href='/auth/facebook')
// i.fa.fa-facebook
// | Sign in with Facebook

View File

@ -9,7 +9,7 @@ block content
h3.text-center
span.ion-android-clock
span Takes about #{time}
.btn.btn-success.btn-large.btn-block.start-challenge Start the challenge
.btn.btn-primary.btn-large.btn-block.start-challenge Start the challenge
.challenge-content.hidden-element
.responsive-container
iframe(src='//player.vimeo.com/video/#{video}', frameborder='0', webkitallowfullscreen='', mozallowfullscreen='', allowfullscreen='')
@ -18,9 +18,9 @@ block content
ol
for step in steps
li!= step
.btn.btn-success.btn-large.btn-block.completed-challenge I've completed this challenge
.btn.btn-primary.btn-large.btn-block.completed-challenge I've completed this challenge
.ten-pixel-break
.btn.btn-primary.btn-large.btn-block.skip-challenge I want to skip this challenge for now
.btn.btn-success.btn-large.btn-block.skip-challenge I want to skip this challenge for now
.panel-footer.text-center
span Need a break?  
a(href="http://blog.freecodecamp.com", target="_blank") Check out our blog
@ -35,8 +35,8 @@ block content
.text-center
h1.animated.zoomInDown Nicely done!
.animated.zoomInUp.delay-1
span.landing-icon.ion-checkmark-circled.text-success
a.animated.fadeIn.delay-2.btn.btn-primary.btn-block.next-button(name='_csrf', value=_csrf, aria-hidden='true') Take me to my next challenge
span.landing-icon.ion-checkmark-circled.text-primary
a.animated.fadeIn.delay-2.btn.btn-lg.btn-primary.btn-block.next-button(name='_csrf', value=_csrf, aria-hidden='true') Take me to my next challenge
#skip-dialog.modal
.modal-dialog.animated.zoomIn.fast-animation
.modal-content
@ -46,7 +46,7 @@ block content
h1.animated.zoomInDown No problem.
h2.animated.zoomInDown You can retry this challenge any time.
.animated.zoomInUp.delay-1
span.landing-icon.ion-skip-forward.text-primary
a.animated.fadeIn.delay-2.btn.btn-primary.btn-block.next-button(aria-hidden='true') Take me to my next challenge
span.landing-icon.ion-skip-forward.text-success
a.animated.fadeIn.delay-2.btn.btn-lg.btn-primary.btn-block.next-button(aria-hidden='true') Take me to my next challenge
.col-sm-12.col-md-4.col-xs-12
include ../partials/challenges

View File

@ -103,3 +103,4 @@ block content
br
.text-center
a.btn.btn-cta.btn-primary(href="/login") Sign in now to start coding (it's free)
br

View File

@ -2,6 +2,7 @@ doctype html
html
head
script(src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js")
link(href='http://fonts.googleapis.com/css?family=Lato&subset=latin,latin-ext', rel='stylesheet', type='text/css')
include partials/meta
title #{title} | Free Code Camp