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

tighten up the interface for mobile

Browse Source
This commit is contained in:
Michael Q Larson
2015-03-07 16:48:57 -08:00
parent 49886ca097
commit 87ac659038
5 changed files with 68 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
views/stories/index.jade
View File

@ -15,7 +15,13 @@ block content
if (page === 'recent')
include ./new-stories
if (page === 'submit')
if (user)
include ./preliminary-submit
else
.spacer
.text-center
a.btn.btn-cta.signup-btn.btn-primary(href="/login") Sign in to post your story (it's free)
.spacer
if (page === 'search')
include ./search-stories
if (page === 'storySubmission')

19
views/stories/news-nav.jade
View File

@ -1,16 +1,35 @@
.col-xs-12
.visible-xs.visible-sm
.btn-group.input-group.btn-group-justified(data-toggle='buttons')
label.btn.btn-primary.btn-big(class="#{ page === 'hot' ? 'active' : '' }")
input#option1(href='/stories/hot', type='radio', name='options')
i.ion-ios-pulse-strong
label.btn.btn-primary.btn-big(class="#{ page === 'recent' ? 'active' : '' }")
input#option2(href='/stories/recent', type='radio', name='options')
i.ion-ios-clock
label.btn.btn-primary.btn-big(class="#{ page === 'submit' ? 'active' : page === 'storySubmission' ? 'active' : '' }")
input#option3(href='/stories/submit', type='radio', name='options')
i.ion-plus-circled
label.btn.btn-primary.btn-big(class="#{ page === 'search' ? 'active' : '' }")
input#option4(href='/stories/search', type='radio', name='options')
i.ion-search
.visible-md.visible-lg
.btn-group.input-group.btn-group-justified(data-toggle='buttons')
label.btn.btn-primary.btn-big(class="#{ page === 'hot' ? 'active' : '' }")
input#option1(href='/stories/hot', type='radio', name='options')
i.ion-ios-pulse-strong  
| Hot
label.btn.btn-primary.btn-big(class="#{ page === 'recent' ? 'active' : '' }")
input#option2(href='/stories/recent', type='radio', name='options')
i.ion-ios-clock  
| New
label.btn.btn-primary.btn-big(class="#{ page === 'submit' ? 'active' : page === 'storySubmission' ? 'active' : '' }")
input#option3(href='/stories/submit', type='radio', name='options')
i.ion-plus-circled  
| Submit
label.btn.btn-primary.btn-big(class="#{ page === 'search' ? 'active' : '' }")
input#option4(href='/stories/search', type='radio', name='options')
i.ion-search  
| Search
script.

15
views/stories/preliminary-submit.jade
View File

@ -1,17 +1,24 @@
.spacer
.col-xs-12
.spacer
.input-group
input#story-url.big-text-field.form-control(placeholder='Paste your link here', name='Link', autofocus)
span.input-group-btn
button#preliminary-story-submit.btn.btn-big.btn-primary(type='button') Submit
.spacer
//
.col-xs-12
form.form-horizontal.control-label-story-submission#story-submission-form
.col-xs-2.img-story-post
img.img-responsive(src='#{user.profile.picture}')
.col-xs-10
.form-group
.col-xs-1
label.control-label.control-label-story-submission(for='name') Link
.col-xs-11
input#story-url.form-control(placeholder='Paste your link here', name='Link')
.spacer
.form-group
button.btn.btn-big.btn-block.btn-primary#preliminary-story-submit Submit
button.btn.btn-big.btn-block.btn-primary Submit
script.
$('#story-url').on('keypress', function(e) {
if (e.which === 13 || e === 13) {

2
views/stories/search-stories.jade
View File

@ -1,7 +1,7 @@
.col-xs-12
.spacer
.input-group
input#searchArea.big-text-field.form-control(type='text', placeholder='Search for...', autofocus)
input#searchArea.big-text-field.form-control(type='text', placeholder='Search our stories', autofocus)
span.input-group-btn
button#searchbutton.btn.btn-big.btn-primary(type='button') Search
.spacer

18
views/stories/submit-story.jade
View File

@ -4,23 +4,21 @@
var storyURL = !{JSON.stringify(storyURL)};
var storyTitle = !{JSON.stringify(storyTitle)};
form.form-horizontal.control-label-story-submission#story-submission-form
.col-xs-2.img-story-post
img.img-responsive(src='#{user.profile.picture}')
.col-xs-10
.col-xs-12
.form-group
.col-xs-1
.col-xs-12.col-md-1
label.control-label.control-label-story-submission(for='name') Link
.col-xs-11
.col-xs-12.col-md-11
input#story-url.form-control(placeholder='Paste your link here', name='Link')
.form-group
.col-xs-1
.col-xs-12.col-md-1
label.control-label.control-label-story-submission(for='name') Title
.col-xs-11
.col-xs-12.col-md-11
input#story-title.form-control(placeholder='Type a headline for your link here', name='Title')
.form-group
.col-xs-1
label.control-label.control-label-story-submission(for='name')
.col-xs-11
.col-xs-12.col-md-1
label.control-label.control-label-story-submission(for='name') Description
.col-xs-12.col-md-11
textarea#description-box.form-control(name="comment-box", rows=5, placeholder="Start off the discussion with a description of your post")
.spacer