turned the challenges list into a modal
This commit is contained in:
@ -29,7 +29,7 @@ html {
|
||||
|
||||
body {
|
||||
padding-top: 80px;
|
||||
margin-bottom: 75px;
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
|
||||
.footer {
|
||||
|
@ -31,8 +31,8 @@ $(document).ready(function() {
|
||||
});
|
||||
});
|
||||
|
||||
$('.skip-challenge').on('click', function() {
|
||||
$('#skip-dialog').modal('show');
|
||||
$('.all-challenges').on('click', function() {
|
||||
$('#all-challenges-dialog').modal('show');
|
||||
});
|
||||
|
||||
$('.next-button').on('click', function() {
|
||||
|
@ -1,12 +1,13 @@
|
||||
extends ../layout
|
||||
block content
|
||||
.row
|
||||
.col-sm-12.col-md-8.col-xs-12
|
||||
.col-sm-12.col-md-12.col-xs-12
|
||||
.panel.panel-primary
|
||||
.panel-heading #{name} (takes #{time} minutes)
|
||||
.panel-heading.text-center #{name} (takes #{time} minutes)
|
||||
.panel.panel-body
|
||||
.embed-responsive.embed-responsive-16by9
|
||||
iframe.embed-responsive-item(src='//player.vimeo.com/video/#{video}')
|
||||
.col-xs-12.col-sm-10.col-sm-offset-1.col-md-8.col-md-offset-2
|
||||
h3 Steps:
|
||||
h4
|
||||
ol
|
||||
@ -14,8 +15,8 @@ block content
|
||||
li!= step
|
||||
.btn.btn-primary.btn-big.btn-block.completed-challenge I've completed this challenge
|
||||
.ten-pixel-break
|
||||
.btn.btn-success.btn-large.btn-block.skip-challenge I want to skip this challenge for now
|
||||
#complete-dialog.modal
|
||||
.btn.btn-success.btn-big.btn-block.all-challenges Show me all the challenges
|
||||
#complete-dialog.modal(tabindex='-1')
|
||||
.modal-dialog.animated.zoomIn.fast-animation
|
||||
.modal-content
|
||||
.modal-header
|
||||
@ -32,16 +33,9 @@ block content
|
||||
= phrase
|
||||
- else
|
||||
a.animated.fadeIn.delay-2.btn.btn-lg.signup-btn.btn-block(href='/login') Sign in so you can save your progress
|
||||
#skip-dialog.modal
|
||||
#all-challenges-dialog.modal(tabindex='-1')
|
||||
.modal-dialog.animated.zoomIn.fast-animation
|
||||
.modal-content
|
||||
.modal-header
|
||||
a.close(href='#', data-dismiss='modal', aria-hidden='true') ×
|
||||
.text-center
|
||||
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-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
|
@ -1,6 +1,3 @@
|
||||
.panel.panel-primary
|
||||
.panel-heading Challenges
|
||||
.panel-body
|
||||
ol(start='0')
|
||||
for challenge in challenges
|
||||
li
|
||||
|
Reference in New Issue
Block a user