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

fix(client): learn layout on mobile

Browse Source
This commit is contained in:
Valeriy S
2019-05-14 17:37:13 +03:00
committed by mrugesh
parent 6b46736801
commit 672184d0c3
1 changed files with 24 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
client/src/templates/Challenges/classic/Show.js
View File

@ -250,33 +250,30 @@ class ShowClassic extends Component {
title={`Learn ${this.getBlockNameTitle()} | freeCodeCamp.org`}
/>
<Media maxWidth={MAX_MOBILE_WIDTH}>
{matches =>
matches ? (
<MobileLayout
editor={this.renderEditor()}
guideUrl={this.getGuideUrl()}
hasPreview={this.hasPreview()}
instructions={this.renderInstructionsPanel({
showToolPanel: false
})}
preview={this.renderPreview()}
testOutput={this.renderTestOutput()}
videoUrl={this.getVideoUrl()}
/>
) : (
<DesktopLayout
challengeFile={this.getChallengeFile()}
editor={this.renderEditor()}
hasPreview={this.hasPreview()}
instructions={this.renderInstructionsPanel({
showToolPanel: true
})}
preview={this.renderPreview()}
resizeProps={this.resizeProps}
testOutput={this.renderTestOutput()}
/>
)
}
<MobileLayout
editor={this.renderEditor()}
guideUrl={this.getGuideUrl()}
hasPreview={this.hasPreview()}
instructions={this.renderInstructionsPanel({
showToolPanel: false
})}
preview={this.renderPreview()}
testOutput={this.renderTestOutput()}
videoUrl={this.getVideoUrl()}
/>
</Media>
<Media minWidth={MAX_MOBILE_WIDTH + 1}>
<DesktopLayout
challengeFile={this.getChallengeFile()}
editor={this.renderEditor()}
hasPreview={this.hasPreview()}
instructions={this.renderInstructionsPanel({
showToolPanel: true
})}
preview={this.renderPreview()}
resizeProps={this.resizeProps}
testOutput={this.renderTestOutput()}
/>
</Media>
<CompletionModal />
<HelpModal />