fix the html mobile view to have taller iframe

This commit is contained in:
Quincy Larson
2015-06-03 15:50:28 -07:00
parent aa0ba45bf2
commit d6e09ad1e5
2 changed files with 53 additions and 52 deletions

View File

@ -773,7 +773,7 @@ iframe.iphone {
width: 100%;
border-radius: 5px;
overflow-y: visible;
height: 500px;
}
}
@ -1092,7 +1092,6 @@ hr {
.iframe-scroll {
position: fixed !important;
margin-top: 75px;
z-index: 9999;
}
}
@media only screen and (max-width: 992px) {

View File

@ -19,58 +19,59 @@ block content
script(src='/js/lib/codemirror/mode/css/css.js')
script(src='/js/lib/codemirror/mode/htmlmixed/htmlmixed.js')
.row.courseware-height
.col-xs-12.col-sm-12.col-md-3.col-lg-3
.well
.row
.col-xs-12
h2.text-center= name
.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
#less-info.btn.btn-primary.btn-block.btn-primary-ghost
span.ion-arrow-up-b
| Less information
br
if (user)
a.btn.btn-primary.btn-big.btn-block#next-courseware-button
| Go to my next challenge
.vertical-scroll
.col-xs-12.col-sm-12.col-md-3.col-lg-3
.well
.row
.col-xs-12
h2.text-center= name
.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
#less-info.btn.btn-primary.btn-block.btn-primary-ghost
span.ion-arrow-up-b
| Less information
br
| (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
|   Help
label.btn.btn-success#trigger-issue-modal
i.fa.fa-bug
|   Bug
.button-spacer
script.
var userLoggedIn = true;
else
a.btn.btn-lg.signup-btn.btn-block(href='/login') Sign in so you can save your progress
if (user)
a.btn.btn-primary.btn-big.btn-block#next-courseware-button
| Go to my next challenge
br
| (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
|   Help
label.btn.btn-success#trigger-issue-modal
i.fa.fa-bug
|   Bug
.button-spacer
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 = true;
else
a.btn.btn-lg.signup-btn.btn-block(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());
.col-xs-12.col-sm-12.col-md-5.col-lg-6
#mainEditorPanel
form.code
@ -80,6 +81,7 @@ block content
.hidden-xs.hidden-sm
img.iphone-position.iframe-scroll(src="https://s3.amazonaws.com/freecodecamp/iphone6-frame.png")
iframe.iphone.iframe-scroll#preview
.spacer
#complete-courseware-dialog.modal(tabindex='-1')
.modal-dialog.animated.zoomIn.fast-animation
.modal-content