gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

make bonfire view look like html view

Browse Source
This commit is contained in:
Quincy Larson
2015-06-07 21:49:14 -07:00
parent 662c17de90
commit 0c799ec02f
5 changed files with 105 additions and 114 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
public/css/main.less
View File

@ -201,12 +201,12 @@ ul {
.responsive-container { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; }
.responsive-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.positive-5 {
margin-top: 5px;
.positive-10 {
margin-top: 10px;
}
.positive-10 {
padding-top: 10px;
.positive-15-bottom {
margin-bottom: 15px;
}
.positive-15 {

3
seed_data/challenges/basic-bonfires.json
View File

@ -43,9 +43,8 @@
"name": "Bonfire: Meet Bonfire",
"difficulty": "0",
"description": [
"Click the button below for further instructions.",
"Your goal is to fix the failing test.",
"First, run all the tests by clicking \"Run code\" or by pressing Control + Enter",
"First, run all the tests by clicking \"Run code\" or by pressing Control + Enter.",
"The failing test is in red. Fix the code so that all tests pass. Then you can move on to the next Bonfire.",
"Make this function return true no matter what."
],

4
seed_data/challenges/future-jquery-ajax-json.json
View File

@ -239,7 +239,7 @@
],
"tests": [
"assert(!editor.match(/nce\\'\\)\\;/g) && !editor.match(/ke\\'\\)\\;/g), 'Delete your <code>img</code> element selector statement and your \".btn\" selector statement.')",
"assert(editor.match(/css.*,.*background-color.*red.\\);/g), 'Select the element with the <code>id</code> of \"cat-photo-form\" give it the background color of red.')"
"assert(editor.match(/css.*,.*background-color.*gray.\\);/g), 'Select the element with the <code>id</code> of \"cat-photo-form\" give it the background color of gray.')"
],
"challengeSeed": [
"fccss",
@ -292,7 +292,7 @@
"challengeSeed": [
"fccss",
" $(document).ready(function() {",
" $('#cat-photo-form').css('background-color', 'red');",
" $('#cat-photo-form').css('background-color', 'gray');",
" });",
"fcces",
"<br>",

123
views/coursewares/showBonfire.jade
View File

@ -17,11 +17,11 @@ block content
script(type='text/javascript', src='/js/lib/coursewares/sandbox.js')
.row(ng-controller="pairedWithController")
.col-xs-12.col-sm-12.col-md-4.bonfire-top
#testCreatePanel
h1#bonfire-name.text-center= name
h2.text-center
.bonfire-flames Difficulty:&thinsp;
.col-xs-12.col-sm-12.col-md-4.col-lg-3
#testCreatePanel.well
h3.text-center.negative-10= name
.positive-15.positive-15-bottom
h4.text-center.bonfire-flames Difficulty:&thinsp;
if (difficulty == "0")
i.ion-ios-flame-outline
i.ion-ios-flame-outline
@ -58,67 +58,61 @@ block content
i.ion-ios-flame
i.ion-ios-flame
i.ion-ios-flame
.well
.row
.col-xs-12
.bonfire-instructions
p.wrappable= brief
#brief-instructions
#more-info.btn.btn-primary.btn-block.btn-primary-ghost
span.ion-arrow-down-b
| More information
#long-instructions.row.hide
.col-xs-12
for sentence in details
p.wrappable!= sentence
#MDN-links
p Here are some helpful links:
for link, index in MDNlinks
ul: li: a(href=""+link, target="_blank") !{MDNkeys[index]}
#less-info.btn.btn-primary.btn-block.btn-primary-ghost
span.ion-arrow-up-b
| Less information
.row
.col-xs-12
.bonfire-instructions
for sentence in details
p.wrappable.negative-10!= sentence
.negative-bottom-margin-30
#MDN-links
p.negative-10 Here are some helpful links:
for link, index in MDNlinks
.negative-10
ul: li: a(href=""+link, target="_blank") !{MDNkeys[index]}
if (user)
form.form-horizontal(novalidate='novalidate', name='completedWithForm')
.form-group.text-center
.col-xs-12
// extra field to distract password tools like lastpass from injecting css into our username field
input.form-control(ng-show="false")
input.form-control#completed-with(name="existingUser", placeholder="Your pair's username if pairing", existing-username='', ng-model="existingUser")
.col-xs-12(ng-cloak, ng-show="completedWithForm.$error.exists && !completedWithForm.existingUser.$pristine && existingUser.length > 0")
alert(type='danger')
span.ion-close-circled
| Username not found
#submitButton.btn.btn-primary.btn-big.btn-block Run code (ctrl + enter)
if (user && user.sentSlackInvite)
.button-spacer
.btn-group.input-group.btn-group-justified
label.btn.btn-success#trigger-help-modal
i.fa.fa-medkit
| &nbsp; Help
label.btn.btn-success#trigger-pair-modal
i.fa.fa-user-plus
| &nbsp; Pair
label.btn.btn-success#trigger-issue-modal
i.fa.fa-bug
| &nbsp; Bug
if (user)
form.form-horizontal(novalidate='novalidate', name='completedWithForm')
.form-group.text-center.negative-10
.col-xs-12
// extra field to distract password tools like lastpass from injecting css into our username field
input.form-control(ng-show="false")
input.form-control#completed-with(name="existingUser", placeholder="Your pair's username if pairing", existing-username='', ng-model="existingUser")
.col-xs-12(ng-cloak, ng-show="completedWithForm.$error.exists && !completedWithForm.existingUser.$pristine && existingUser.length > 0")
alert(type='danger')
span.ion-close-circled
| Username not found
label.negative-10.btn.btn-primary.btn-block#submitButton
i.fa.fa-play
| &nbsp; Run code (ctrl + enter)
if (user && user.sentSlackInvite)
.button-spacer
form.code
.form-group.codeMirrorView
textarea#codeOutput(style='display: none;')
br
#testSuite
br
script(type="text/javascript").
var tests = !{JSON.stringify(tests)};
var challengeSeed = !{JSON.stringify(challengeSeed)};
var challenge_Id = !{JSON.stringify(challengeId)};
var challenge_Name = !{JSON.stringify(name)};
var started = Math.floor(Date.now());
var challengeType = !{JSON.stringify(challengeType)};
var _ = R;
var dashed = !{JSON.stringify(dashedName)};
.btn-group.input-group.btn-group-justified
label.btn.btn-success#trigger-help-modal
i.fa.fa-medkit
| &nbsp; Help
label.btn.btn-success#trigger-pair-modal
i.fa.fa-user-plus
| &nbsp; Pair
label.btn.btn-success#trigger-issue-modal
i.fa.fa-bug
| &nbsp; Bug
.button-spacer
form.code
.form-group.codeMirrorView
textarea#codeOutput(style='display: none;')
br
#testSuite.negative-10
br
script(type="text/javascript").
var tests = !{JSON.stringify(tests)};
var challengeSeed = !{JSON.stringify(challengeSeed)};
var challenge_Id = !{JSON.stringify(challengeId)};
var challenge_Name = !{JSON.stringify(name)};
var started = Math.floor(Date.now());
var challengeType = !{JSON.stringify(challengeType)};
var _ = R;
var dashed = !{JSON.stringify(dashedName)};
.col-xs-12.col-sm-12.col-md-8
#mainEditorPanel
@ -140,7 +134,6 @@ block content
a.animated.fadeIn.btn.btn-lg.btn-primary.btn-block#next-courseware-button(name='_csrf', value=_csrf) Go to my next challenge (ctrl + enter)
if (user.progressTimestamps.length > 2)
a.animated.fadeIn.btn.btn-lg.btn-block.btn-twitter(target="_blank", href="https://twitter.com/intent/tweet?text=I%20just%20#{verb}%20%40FreeCodeCamp%20#{name}&url=http%3A%2F%2Ffreecodecamp.com/challenges/#{dashedName}&hashtags=LearnToCode, JavaScript")
i.fa.fa-twitter &thinsp;

81
views/coursewares/showHTML.jade
View File

@ -20,49 +20,48 @@ block content
script(src='/js/lib/codemirror/mode/htmlmixed/htmlmixed.js')
script(src='/js/lib/codemirror/addon/emmet/emmet.js')
.row.courseware-height
.vertical-scroll
.col-xs-12.col-sm-12.col-md-3.col-lg-3
.well
.row
.col-xs-12
h4.text-center.negative-10= name
.bonfire-instructions
for sentence in details
p.wrappable.negative-10!= sentence
.negative-bottom-margin-30
if (user)
label.btn.btn-primary.btn-block.negative-10#next-courseware-button
.ion-checkmark-circled
| &nbsp; Go to my next challenge (ctrl + enter)
.col-xs-12.col-sm-12.col-md-3.col-lg-3
.well
.row
.col-xs-12
h3.text-center.negative-10= name
.bonfire-instructions
for sentence in details
p.wrappable.negative-10!= sentence
.negative-bottom-margin-30
if (user)
label.btn.btn-primary.btn-block.negative-10#next-courseware-button
.ion-checkmark-circled
| &nbsp; Go to my next challenge (ctrl + enter)
if (user.sentSlackInvite)
.button-spacer
.btn-group.input-group.btn-group-justified
label.btn.btn-success#trigger-help-modal
i.fa.fa-medkit
| &nbsp; Help
label.btn.btn-success#trigger-issue-modal
i.fa.fa-bug
| &nbsp; Bug
.button-spacer
if (user.sentSlackInvite)
.button-spacer
.btn-group.input-group.btn-group-justified
label.btn.btn-success#trigger-help-modal
i.fa.fa-medkit
| &nbsp; Help
label.btn.btn-success#trigger-issue-modal
i.fa.fa-bug
| &nbsp; Bug
.button-spacer
script.
var userLoggedIn = true;
else
a.btn.signup-btn.btn-block.btn-block.negative-15(href='/login') Sign in so you can save your progress
script.
var userLoggedIn = true;
else
a.btn.signup-btn.btn-block.btn-block.negative-15(href='/login') Sign in so you can save your progress
script.
var userLoggedIn = false;
.button-spacer
ul#testSuite.list-group
br
script(type="text/javascript").
$('#next-courseware-button').attr('disabled', 'disabled');
var tests = !{JSON.stringify(tests)};
var challengeSeed = !{JSON.stringify(challengeSeed)};
var challenge_Id = !{JSON.stringify(challengeId)};
var challenge_Name = !{JSON.stringify(name)};
var prodOrDev = !{JSON.stringify(environment)};
var challengeType = !{JSON.stringify(challengeType)};
var started = Math.floor(Date.now());
var userLoggedIn = false;
.button-spacer
ul#testSuite.list-group
br
script(type="text/javascript").
$('#next-courseware-button').attr('disabled', 'disabled');
var tests = !{JSON.stringify(tests)};
var challengeSeed = !{JSON.stringify(challengeSeed)};
var challenge_Id = !{JSON.stringify(challengeId)};
var challenge_Name = !{JSON.stringify(name)};
var prodOrDev = !{JSON.stringify(environment)};
var challengeType = !{JSON.stringify(challengeType)};
var started = Math.floor(Date.now());
.col-xs-12.col-sm-12.col-md-5.col-lg-6
#mainEditorPanel
form.code