diff --git a/public/css/main.less b/public/css/main.less index 19f77ef32a8..47037ca3449 100644 --- a/public/css/main.less +++ b/public/css/main.less @@ -913,12 +913,28 @@ iframe.iphone { // background-color: #e5e5e5; //} -.media-news { - width: 100%; +.news-box { + @media (min-width: 768px) { + margin-top: -40px; + } + @media (max-width: 767px) { + padding: 5px; + border-color: @brand-info; + border-width: 1px; + border-style: solid; + border-radius: 5px; + width: 100%; + float: left; + } } .story-headline { font-size: 20px; + @media (max-width: 767px) { + text-align: center; + margin-top: 10px; + margin-bottom: 10px; + } } #reply-to-main-post, #upvote { @@ -954,6 +970,19 @@ iframe.iphone { height: 40px; } +.news-number { + font-size: 30px; + text-align: center; +} + +.mobile-story-image { + border-radius: 5px; + width: 100%; + @media (max-width: 768px) { + margin-top: 5px; + } +} + .alert a { text-decoration: underline; } @@ -980,6 +1009,9 @@ iframe.iphone { margin-right: -20px; } +.border-radius-5 { + border-radius: 5px; +} //uncomment this to see the dimensions of all elements outlined in red //* { diff --git a/views/account/show.jade b/views/account/show.jade index deb8168b4f5..b74f98d9b8d 100644 --- a/views/account/show.jade +++ b/views/account/show.jade @@ -2,162 +2,161 @@ extends ../layout block content script. var challengeName = 'Profile View'; - .col-xs-12.col-sm-12.col-md-12 - .panel.panel-info - .panel-heading.text-center - h1 #{username}'s portfolio - .panel-body - if (user && user.profile.username === username) - .row.text-center - .col-xs-12.col-sm-10.col-sm-offset-1 - a.btn.btn-big.btn-primary.btn-block(href="/account") Update my portfolio page or manage my account - .spacer - .col-xs-12.col-sm-10.col-sm-offset-1 - a.btn.btn-big.btn-success.btn-block(href="/signout") Sign out of Free Code Camp - .spacer - .row - .col-xs-12 - .col-xs-12.col-sm-12.col-md-5 - if picture - img.img-center.img-responsive.public-profile-img(src=picture) - else - img.img-center.img-responsive.public-profile-img(src='https://s3.amazonaws.com/freecodecamp/camper-image-placeholder.png') - h1.text-center.negative-5 - - if (twitterHandle) - a.ion-social-twitter.text-primary(title="@#{username}'s Twitter Profile", href="http://twitter.com/#{twitterHandle}", target='_blank') - - if (githubProfile) - a.ion-social-github.text-primary(title="@#{username}'s GitHub Profile", href=githubProfile, target='_blank') - - if (linkedinProfile) - a.ion-social-linkedin.text-primary(title="@#{username}'s LinkedIn Profile", href=linkedinProfile, target='_blank') - - if (codepenProfile) - a.ion-social-codepen.text-primary(title="@#{username}'s CodePen Profile", href=codepenProfile, target='_blank') - .visible-md.visible-lg - .col-xs-12.col-sm-12.col-md-4.text-justify - h1.flat-top.wrappable= name - h3.flat-top.bolded.wrappable= location - h4.flat-top.wrappable= bio - .visible-xs.visible-sm - .col-xs-12.col-sm-12.col-md-4.text-center - h1.flat-top.wrappable= name - h3.flat-top.bolded.wrappable= location - h4.flat-top.wrappable= bio - .col-xs-12.col-sm-12.col-md-3.text-center - .background-svg.img-center - .points-on-top - = "[ " + (user ? user.progressTimestamps.length : 0) + " ]" + .panel.panel-info + .panel-heading.text-center + h1 #{username}'s portfolio + .panel-body + if (user && user.profile.username === username) + .row.text-center + .col-xs-12.col-sm-10.col-sm-offset-1 + a.btn.btn-big.btn-primary.btn-block(href="/account") Update my portfolio page or manage my account + .spacer + .col-xs-12.col-sm-10.col-sm-offset-1 + a.btn.btn-big.btn-success.btn-block(href="/signout") Sign out of Free Code Camp + .spacer + .row + .col-xs-12 + .col-xs-12.col-sm-12.col-md-5 + if picture + img.img-center.img-responsive.public-profile-img(src=picture) + else + img.img-center.img-responsive.public-profile-img(src='https://s3.amazonaws.com/freecodecamp/camper-image-placeholder.png') + h1.text-center.negative-5 + - if (twitterHandle) + a.ion-social-twitter.text-primary(title="@#{username}'s Twitter Profile", href="http://twitter.com/#{twitterHandle}", target='_blank') + - if (githubProfile) + a.ion-social-github.text-primary(title="@#{username}'s GitHub Profile", href=githubProfile, target='_blank') + - if (linkedinProfile) + a.ion-social-linkedin.text-primary(title="@#{username}'s LinkedIn Profile", href=linkedinProfile, target='_blank') + - if (codepenProfile) + a.ion-social-codepen.text-primary(title="@#{username}'s CodePen Profile", href=codepenProfile, target='_blank') + .visible-md.visible-lg + .col-xs-12.col-sm-12.col-md-4.text-justify + h1.flat-top.wrappable= name + h3.flat-top.bolded.wrappable= location + h4.flat-top.wrappable= bio + .visible-xs.visible-sm + .col-xs-12.col-sm-12.col-md-4.text-center + h1.flat-top.wrappable= name + h3.flat-top.bolded.wrappable= location + h4.flat-top.wrappable= bio + .col-xs-12.col-sm-12.col-md-3.text-center + .background-svg.img-center + .points-on-top + = "[ " + (user ? user.progressTimestamps.length : 0) + " ]" - .row - .col-xs-12 - if (website1Title && website1Link && website1Image) - .row - .col-xs-12.col-md-5 - img.img-center.img-responsive.portfolio-image(src=website1Image, alt="@#{username}'s #{website1Title}") - .col-xs-12.col-md-7 - h3.text-center.wrappable.flat-top= website1Title - a.btn.btn-lg.btn-block.btn-info(href=website1Link, target='_blank') - i.fa.icon-beaker - | Try it out - br - if (website1Title && website1Link && !website1Image) - .col-xs-12.col-md-12 + .row + .col-xs-12 + if (website1Title && website1Link && website1Image) + .row + .col-xs-12.col-md-5 + img.img-center.img-responsive.portfolio-image(src=website1Image, alt="@#{username}'s #{website1Title}") + .col-xs-12.col-md-7 h3.text-center.wrappable.flat-top= website1Title a.btn.btn-lg.btn-block.btn-info(href=website1Link, target='_blank') i.fa.icon-beaker | Try it out - br - if (website2Title && website2Link && website2Image) - .row - .col-xs-12.col-md-5 - img.img-responsive.portfolio-image.img-center(src=website2Image, alt="@#{username}'s #{website2Title}") - .col-xs-12.col-md-7 - h3.text-center.wrappable.flat-top= website2Title - a.btn.btn-lg.btn-block.btn-info(href=website2Link, target='_blank') - i.fa.icon-beaker - | Try it out + br + if (website1Title && website1Link && !website1Image) + .col-xs-12.col-md-12 + h3.text-center.wrappable.flat-top= website1Title + a.btn.btn-lg.btn-block.btn-info(href=website1Link, target='_blank') + i.fa.icon-beaker + | Try it out br - if (website2Title && website2Link && !website2Image) - .col-xs-12.col-md-12 + if (website2Title && website2Link && website2Image) + .row + .col-xs-12.col-md-5 + img.img-responsive.portfolio-image.img-center(src=website2Image, alt="@#{username}'s #{website2Title}") + .col-xs-12.col-md-7 h3.text-center.wrappable.flat-top= website2Title a.btn.btn-lg.btn-block.btn-info(href=website2Link, target='_blank') i.fa.icon-beaker | Try it out - br - if (website3Title && website3Link && website3Image) - .row - .col-xs-12.col-md-5 - img.img-responsive.portfolio-image.img-center(src=website3Image, alt="@#{username}'s #{website1Title}") - .col-xs-12.col-md-7 - h3.text-center.wrappable.flat-top= website3Title - a.btn.btn-lg.btn-block.btn-info(href=website3Link, target='_blank') - i.fa.icon-beaker - | Try it out - if (website3Title && website3Link && !website3Image) - .col-xs-12.col-md-12 + br + if (website2Title && website2Link && !website2Image) + .col-xs-12.col-md-12 + h3.text-center.wrappable.flat-top= website2Title + a.btn.btn-lg.btn-block.btn-info(href=website2Link, target='_blank') + i.fa.icon-beaker + | Try it out + br + if (website3Title && website3Link && website3Image) + .row + .col-xs-12.col-md-5 + img.img-responsive.portfolio-image.img-center(src=website3Image, alt="@#{username}'s #{website1Title}") + .col-xs-12.col-md-7 h3.text-center.wrappable.flat-top= website3Title a.btn.btn-lg.btn-block.btn-info(href=website3Link, target='_blank') i.fa.icon-beaker | Try it out + if (website3Title && website3Link && !website3Image) + .col-xs-12.col-md-12 + h3.text-center.wrappable.flat-top= website3Title + a.btn.btn-lg.btn-block.btn-info(href=website3Link, target='_blank') + i.fa.icon-beaker + | Try it out - .hidden-xs.col-sm-12 - script(src="//d3js.org/d3.v3.min.js") - script(src="//cdn.jsdelivr.net/cal-heatmap/3.3.10/cal-heatmap.min.js") - #cal-heatmap.img-center - script. - $(document).ready(function() { - setTimeout(function() { - var cal = new CalHeatMap(); - var calendar = !{JSON.stringify(calender)}; - cal.init({ - itemSelector: "#cal-heatmap", - domain: "month", - subDomain: "day", - data: calendar, - cellSize: 15, - align: 'center', - cellRadius: 3, - cellPadding: 2, - tooltip: true, - range: 4, - start: new Date().setDate(new Date().getDate() - 90), - legendColors: ["#cccccc", "#215f1e"], - legend: [1, 2, 3] - }); - }, 300); - }); - .row - .hidden-xs.col-sm-12.text-center - .row.text-primary - h4.col-sm-6.text-right Longest Streak: #{longestStreak} - h4.col-sm-6.text-left Current Streak: #{currentStreak} + .hidden-xs.col-sm-12 + script(src="//d3js.org/d3.v3.min.js") + script(src="//cdn.jsdelivr.net/cal-heatmap/3.3.10/cal-heatmap.min.js") + #cal-heatmap.img-center + script. + $(document).ready(function() { + setTimeout(function() { + var cal = new CalHeatMap(); + var calendar = !{JSON.stringify(calender)}; + cal.init({ + itemSelector: "#cal-heatmap", + domain: "month", + subDomain: "day", + data: calendar, + cellSize: 15, + align: 'center', + cellRadius: 3, + cellPadding: 2, + tooltip: true, + range: 4, + start: new Date().setDate(new Date().getDate() - 90), + legendColors: ["#cccccc", "#215f1e"], + legend: [1, 2, 3] + }); + }, 300); + }); + .row + .hidden-xs.col-sm-12.text-center + .row.text-primary + h4.col-sm-6.text-right Longest Streak: #{longestStreak} + h4.col-sm-6.text-left Current Streak: #{currentStreak} - - if (challenges.length > 0) - .col-sm-12 - table.table.table-striped - thead - tr - th.col-xs-4 Challenge - th.col-xs-2 Completed - th.col-xs-6 Link - for challenge in challenges - tr - td.col-xs-4= challenge.name - td.col-xs-2= moment(challenge.completedDate, 'x').format("MMM DD, YYYY") - td.col-xs-6 - a(href=challenge.solution) View my solution + - if (challenges.length > 0) + .col-sm-12 + table.table.table-striped + thead + tr + th.col-xs-4 Challenge + th.col-xs-2 Completed + th.col-xs-6 Link + for challenge in challenges + tr + td.col-xs-4= challenge.name + td.col-xs-2= moment(challenge.completedDate, 'x').format("MMM DD, YYYY") + td.col-xs-6 + a(href=challenge.solution) View my solution - br - - if (bonfires.length > 0) - .col-sm-12 - table.table.table-striped - thead - tr - th.col-xs-4 Bonfire - th.col-xs-2 Completed - th.col-xs-6 Solution - for bonfire in bonfires - tr - td.col-xs-4= bonfire.name - td.col-xs-2= moment(bonfire.completedDate, 'x').format("MMM DD, YYYY") - td.col-xs-6= bonfire.solution - br + br + - if (bonfires.length > 0) + .col-sm-12 + table.table.table-striped + thead + tr + th.col-xs-4 Bonfire + th.col-xs-2 Completed + th.col-xs-6 Solution + for bonfire in bonfires + tr + td.col-xs-4= bonfire.name + td.col-xs-2= moment(bonfire.completedDate, 'x').format("MMM DD, YYYY") + td.col-xs-6= bonfire.solution + br diff --git a/views/challengeMap/show.jade b/views/challengeMap/show.jade index bd4a76ea7bc..273aff08558 100644 --- a/views/challengeMap/show.jade +++ b/views/challengeMap/show.jade @@ -1,116 +1,114 @@ extends ../layout block content - .col-xs-12.col-sm-12.col-md-12 - .panel.panel-info - .panel-heading.text-center - h1 Challenge Map - .panel-body - .col-xs-12 - if (Math.random() > 0.99) - img.img-responsive.img-center(src='https://s3.amazonaws.com/freecodecamp/wide-social-banner-dino.png') - else - img.img-responsive.img-center(src='https://s3.amazonaws.com/freecodecamp/wide-social-banner.png') - .col-xs-12.col-md-8.col-md-offset-2 - h2.text-center - span.text-primary #{camperCount}   - | campers have joined our community - br - | since we launched   - span.text-primary #{daysRunning}   - | days ago. - h2 - span.fa.fa-flag - |   Waypoints (200 hours of lessons) + .panel.panel-info + .panel-heading.text-center + h1 Challenge Map + .panel-body + if (Math.random() > 0.99) + img.img-responsive.img-center.border-radius-5(src='https://s3.amazonaws.com/freecodecamp/wide-social-banner-dino.png') + else + img.img-responsive.img-center.border-radius-5(src='https://s3.amazonaws.com/freecodecamp/wide-social-banner.png') + .col-xs-12.col-md-8.col-md-offset-2 + h2.text-center + span.text-primary #{camperCount}   + | campers have joined our community + br + | since we launched   + span.text-primary #{daysRunning}   + | days ago. + h2 + span.fa.fa-flag + |   Waypoints (200 hours of lessons) - .col-xs-12 - h3.negative-15 - ol - for waypoint in waypoints - if completedCoursewareList.indexOf(waypoint._id) > -1 - .row - .hidden-xs.col-sm-3.col-md-2.text-primary.ion-checkmark-circled.padded-ionic-icon.text-center - .col-xs-12.col-sm-9.col-md-10 - li.faded - a(href="/challenges/#{waypoint.name}")= waypoint.name + .col-xs-12.no-right-padding + h3.negative-15 + ol + for waypoint in waypoints + if completedCoursewareList.indexOf(waypoint._id) > -1 + .row + .hidden-xs.col-sm-3.col-md-2.text-primary.ion-checkmark-circled.padded-ionic-icon.text-center + .col-xs-12.col-sm-9.col-md-10 + li.faded + a(href="/challenges/#{waypoint.name}")= waypoint.name - else - .row - .hidden-xs.col-sm-3.col-md-2 - span - .col-xs-12.col-sm-9.col-md-10 - li - a(href="/challenges/#{waypoint.name}")= waypoint.name - h2 - span.ion-bonfire - |   Bonfires (200 hours of JavaScript algorithm practice) - .col-xs-12 - h3.negative-15 - ol - for bonfire in bonfires - if completedBonfireList.indexOf(bonfire._id) > -1 - .row - .hidden-xs.col-sm-3.col-md-2.text-primary.ion-checkmark-circled.padded-ionic-icon.text-center - .col-xs-12.col-sm-9.col-md-10 - li.faded - a(href="/bonfires/#{bonfire.name}")= bonfire.name - else - .row - .hidden-xs.col-sm-3.col-md-2 - span - .col-xs-12.col-sm-9.col-md-10 - li - a(href="/bonfires/#{bonfire.name}")= bonfire.name - h2 - span.fa.fa-angle-double-right - |   Ziplines (200 hours of front end development) - .col-xs-12 - h3.negative-15 - ol - for zipline in ziplines - if completedCoursewareList.indexOf(zipline._id) > -1 - .row - .hidden-xs.col-sm-3.col-md-2.text-primary.ion-checkmark-circled.padded-ionic-icon.text-center - .col-xs-12.col-sm-9.col-md-10 - li.faded - a(href="/challenges/#{zipline.name}")= zipline.name - else - .row - .hidden-xs.col-sm-3.col-md-2 - span - .col-xs-12.col-sm-9.col-md-10 - li - a(href="/challenges/#{zipline.name}")= zipline.name - h2 - span.fa.fa-level-down - |   Basejumps (200 hours of full stack development) - .col-xs-12 - h3.negative-15 - ol - for basejump in basejumps - if completedCoursewareList.indexOf(basejump._id) > -1 - .row - .hidden-xs.col-sm-3.col-md-2.text-primary.ion-checkmark-circled.padded-ionic-icon.text-center - .col-xs-12.col-sm-9.col-md-10 - li.faded - a(href="/challenges/#{basejump.name}")= basejump.name - else - .row - .hidden-xs.col-sm-3.col-md-2 - span - .col-xs-12.col-sm-9.col-md-10 - li - a(href="/challenges/#{basejump.name}")= basejump.name - h2 - span.ion-ios-heart   Nonprofit Projects (800 hours of real-world experience)* - h3.negative-15 - ul + else .row .hidden-xs.col-sm-3.col-md-2 span .col-xs-12.col-sm-9.col-md-10 li - a(href="/nonprofits/directory") Browse our nonprofit projects - p * Complete all Waypoints, Bonfires, Ziplines and Basejumps to be assigned your first nonprofit project + a(href="/challenges/#{waypoint.name}")= waypoint.name + h2 + span.ion-bonfire + |   Bonfires (200 hours of JavaScript algorithm practice) + .col-xs-12 + h3.negative-15 + ol + for bonfire in bonfires + if completedBonfireList.indexOf(bonfire._id) > -1 + .row + .hidden-xs.col-sm-3.col-md-2.text-primary.ion-checkmark-circled.padded-ionic-icon.text-center + .col-xs-12.col-sm-9.col-md-10 + li.faded + a(href="/bonfires/#{bonfire.name}")= bonfire.name + else + .row + .hidden-xs.col-sm-3.col-md-2 + span + .col-xs-12.col-sm-9.col-md-10 + li + a(href="/bonfires/#{bonfire.name}")= bonfire.name + h2 + span.fa.fa-angle-double-right + |   Ziplines (200 hours of front end development) + .col-xs-12 + h3.negative-15 + ol + for zipline in ziplines + if completedCoursewareList.indexOf(zipline._id) > -1 + .row + .hidden-xs.col-sm-3.col-md-2.text-primary.ion-checkmark-circled.padded-ionic-icon.text-center + .col-xs-12.col-sm-9.col-md-10 + li.faded + a(href="/challenges/#{zipline.name}")= zipline.name + else + .row + .hidden-xs.col-sm-3.col-md-2 + span + .col-xs-12.col-sm-9.col-md-10 + li + a(href="/challenges/#{zipline.name}")= zipline.name + h2 + span.fa.fa-level-down + |   Basejumps (200 hours of full stack development) + .col-xs-12 + h3.negative-15 + ol + for basejump in basejumps + if completedCoursewareList.indexOf(basejump._id) > -1 + .row + .hidden-xs.col-sm-3.col-md-2.text-primary.ion-checkmark-circled.padded-ionic-icon.text-center + .col-xs-12.col-sm-9.col-md-10 + li.faded + a(href="/challenges/#{basejump.name}")= basejump.name + else + .row + .hidden-xs.col-sm-3.col-md-2 + span + .col-xs-12.col-sm-9.col-md-10 + li + a(href="/challenges/#{basejump.name}")= basejump.name + h2 + span.ion-ios-heart   Nonprofit Projects (800 hours of real-world experience)* + h3.negative-15 + ul + .row + .hidden-xs.col-sm-3.col-md-2 + span + .col-xs-12.col-sm-9.col-md-10 + li + a(href="/nonprofits/directory") Browse our nonprofit projects + p * Complete all Waypoints, Bonfires, Ziplines and Basejumps to be assigned your first nonprofit project //#announcementModal.modal(tabindex='-1') // .modal-dialog diff --git a/views/field-guide/show.jade b/views/field-guide/show.jade index cf78f27c390..d62cf4ddbca 100644 --- a/views/field-guide/show.jade +++ b/views/field-guide/show.jade @@ -2,40 +2,37 @@ extends ../layout block content script. var challengeName = 'Field Guide View'; - .col-xs-12.col-sm-12.col-md-12 - .panel.panel-info - .panel-heading.text-center - h1= title - .panel-body - .row - .col-xs-12 - div!= description - .spacer - .spacer - .spacer - .col-xs-12.col-sm-6.col-sm-offset-3 - .text-center - if user - .next-field-guide-button.btn.btn-primary.btn-big.btn-block Next article (ctrl + enter) - .ten-pixel-break - #showAllButton.btn.btn-info.btn-big.btn-block Show me all articles - if !user - .ten-pixel-break - a.btn.btn-big.signup-btn.btn-block(href="/login") Start learning to code (it's free) + .panel.panel-info.no-padding + .panel-heading.text-center + h1= title + .panel-body + div!= description .spacer - #show-all-dialog.modal(tabindex='-1') - .modal-dialog.animated.fadeInUp.fast-animation - .modal-content - .modal-header.all-list-header Field Guide Articles - a.close.closing-x(href='#', data-dismiss='modal', aria-hidden='true') × - .modal-body - include ../partials/field-guide - #fieldGuideId.hidden= fieldGuideId - script. - $(document).ready(function() { - $('body').keydown(function(e) { - if (e.ctrlKey && e.keyCode == 13) { - $('.next-field-guide-button').click(); - } - }); + .spacer + .spacer + .col-xs-12.col-sm-6.col-sm-offset-3 + .text-center + if user + .next-field-guide-button.btn.btn-primary.btn-big.btn-block Next article (ctrl + enter) + .ten-pixel-break + #showAllButton.btn.btn-info.btn-big.btn-block Show me all articles + if !user + .ten-pixel-break + a.btn.btn-big.signup-btn.btn-block(href="/login") Start learning to code (it's free) + .spacer +#show-all-dialog.modal(tabindex='-1') + .modal-dialog.animated.fadeInUp.fast-animation + .modal-content + .modal-header.all-list-header Field Guide Articles + a.close.closing-x(href='#', data-dismiss='modal', aria-hidden='true') × + .modal-body + include ../partials/field-guide +#fieldGuideId.hidden= fieldGuideId +script. + $(document).ready(function() { + $('body').keydown(function(e) { + if (e.ctrlKey && e.keyCode == 13) { + $('.next-field-guide-button').click(); + } }); + }); diff --git a/views/nonprofits/show.jade b/views/nonprofits/show.jade index de4d7358156..90027eb82d4 100644 --- a/views/nonprofits/show.jade +++ b/views/nonprofits/show.jade @@ -2,77 +2,76 @@ extends ../layout block content script. var challengeName = 'Nonprofits View'; - .col-xs-12.col-sm-12.col-md-12 - .panel.panel-info - .panel-heading.text-center= title - .panel-body - .row - .col-xs-12.col-sm-10.col-sm-offset-1 - .row + .panel.panel-info + .panel-heading.text-center= title + .panel-body + .row + .col-xs-12.col-sm-10.col-sm-offset-1 + .row + .col-xs-12 + img.img-center.img-responsive(src=imageUrl) + .spacer + .row + .col-xs-12.col-sm-4 + img.img-responsive(src=logoUrl) + .col-xs-12.col-sm-8 .col-xs-12 - img.img-center.img-responsive(src=imageUrl) - .spacer - .row - .col-xs-12.col-sm-4 - img.img-responsive(src=logoUrl) - .col-xs-12.col-sm-8 - .col-xs-12 - h4= whatDoesNonprofitDo - h4 - a(href=websiteLink)= websiteLink - .spacer - h3 Project Description: - .col-xs-12 - h4.negative-15 #{projectDescription} (About #{estimatedHours} hours per camper) - .spacer - h3 This project involves building: - h4.negative-15.col-xs-12 - if (approvedWebsite) - .ion-android-globe   Website - if (approvedDonor) - .ion-card   Donor Management System - if (approvedInventory) - .ion-ios-box   Inventory Management System - if (approvedVolunteer) - .ion-android-calendar   Volunteer Management System - if (approvedForm) - .ion-ios-list   Webform - if (approvedCommunity) - .ion-ios-people   Community Management System - if (approvedELearning) - .ion-university   E-learning Platform - if (approvedOther) - .ion-settings   Other tools - h3 Project Status: #{currentStatus} - if (interestedCampers && interestedCampers.length > 0) - h3 Interested campers: - .col-xs-12.text-left - for interestedCamper in interestedCampers - a(href='/' + interestedCamper.username class="interested-camper-image") - img.profile-picture.float-right(src=interestedCamper.picture) - if (assignedCampers && assignedCampers.length > 0) - h3 Assigned campers: - .col-xs-12.text-left - for assignedCamper in assignedCampers - a(href='/' + assignedCamper.username class="interested-camper-image") - img.profile-picture.float-right(src=assignedCamper.picture) - .spacer - if (!buttonActive) - .col-xs-12.col-sm-8.col-sm-offset-2 - .text-center - a.btn.btn-primary.btn-big.btn-block.disabled(href='/nonprofits/interested-in-nonprofit/#{dashedName}') I'm interested in building this project * - p * Complete all our Bonfires, Ziplines, and Basejumps to unlock this. - #showAllButton.btn.btn-info.btn-big.btn-block Show all Nonprofits Projects - if (buttonActive) - .col-xs-12.col-sm-8.col-sm-offset-2 - .text-center - a.btn.btn-primary.btn-big.btn-block(href='/nonprofits/interested-in-nonprofit/#{dashedName}') I'm interested in building this project - #showAllButton.btn.btn-info.btn-big.btn-block Show all Nonprofits Projects - .row - .col-xs-12.text-center - if !user - a.btn.btn-cta.signup-btn.btn-primary(href="/login") Start learning to code (it's free) + h4= whatDoesNonprofitDo + h4 + a(href=websiteLink)= websiteLink + .spacer + h3 Project Description: + .col-xs-12 + h4.negative-15 #{projectDescription} (About #{estimatedHours} hours per camper) + .spacer + h3 This project involves building: + h4.negative-15.col-xs-12 + if (approvedWebsite) + .ion-android-globe   Website + if (approvedDonor) + .ion-card   Donor Management System + if (approvedInventory) + .ion-ios-box   Inventory Management System + if (approvedVolunteer) + .ion-android-calendar   Volunteer Management System + if (approvedForm) + .ion-ios-list   Webform + if (approvedCommunity) + .ion-ios-people   Community Management System + if (approvedELearning) + .ion-university   E-learning Platform + if (approvedOther) + .ion-settings   Other tools + h3 Project Status: #{currentStatus} + if (interestedCampers && interestedCampers.length > 0) + h3 Interested campers: + .col-xs-12.text-left + for interestedCamper in interestedCampers + a(href='/' + interestedCamper.username class="interested-camper-image") + img.profile-picture.float-right(src=interestedCamper.picture) + if (assignedCampers && assignedCampers.length > 0) + h3 Assigned campers: + .col-xs-12.text-left + for assignedCamper in assignedCampers + a(href='/' + assignedCamper.username class="interested-camper-image") + img.profile-picture.float-right(src=assignedCamper.picture) .spacer + if (!buttonActive) + .col-xs-12.col-sm-8.col-sm-offset-2 + .text-center + a.btn.btn-primary.btn-big.btn-block.disabled(href='/nonprofits/interested-in-nonprofit/#{dashedName}') I'm interested in building this project * + p * Complete all our Bonfires, Ziplines, and Basejumps to unlock this. + #showAllButton.btn.btn-info.btn-big.btn-block Show all Nonprofits Projects + if (buttonActive) + .col-xs-12.col-sm-8.col-sm-offset-2 + .text-center + a.btn.btn-primary.btn-big.btn-block(href='/nonprofits/interested-in-nonprofit/#{dashedName}') I'm interested in building this project + #showAllButton.btn.btn-info.btn-big.btn-block Show all Nonprofits Projects + .row + .col-xs-12.text-center + if !user + a.btn.btn-cta.signup-btn.btn-primary(href="/login") Start learning to code (it's free) + .spacer #show-all-dialog.modal(tabindex='-1') .modal-dialog.animated.fadeInUp.fast-animation .modal-content diff --git a/views/stories/hot-stories.jade b/views/stories/hot-stories.jade index a7d96781bf9..0dda80688f1 100644 --- a/views/stories/hot-stories.jade +++ b/views/stories/hot-stories.jade @@ -1,55 +1,70 @@ .spacer -.col-xs-12 - #story-list.story-list +.spacer +#story-list.story-list - script(src="https://cdn.jsdelivr.net/ramda/0.10.0/ramda.min.js") - script. + script(src="https://cdn.jsdelivr.net/ramda/0.10.0/ramda.min.js") + script. - var getLinkedName = function getLinkedName(name) { - return name.trim().toLowerCase().replace(/\s/g, '-'); - } - $.ajax({ - url: '/stories/hotStories', - type: 'GET' - }) - .success( - function(data) { - for (var i = 0; i < data.length; i++) { - var div = document.createElement('div'); - var linkedName = getLinkedName(data[i].storyLink); - var rank = data[i].rank; + var getLinkedName = function getLinkedName(name) { + return name.trim().toLowerCase().replace(/\s/g, '-'); + } + $.ajax({ + url: '/stories/hotStories', + type: 'GET' + }) + .success( + function(data) { + for (var i = 0; i < data.length; i++) { + var div = document.createElement('div'); + var linkedName = getLinkedName(data[i].storyLink); + var rank = data[i].rank; - $(div) - .html( - "
" + - "

" + - (i + 1) + - "

" + - "
" + - "" + - "" + - "" + - "
" + - "
" + - "
" + - "
" + - "" + - data[i].headline + - "" + + $(div) + .html( + "
" + + "" + + "
" + + "" + + "" + + "" + + "
" + + "" + + "
" + + "
" + + "
" + + "" + + data[i].headline + + "" + + "
" + + "" + + "
" + + "
" + + rank + (rank > 1 ? " points" : " point") + " · posted " + + moment(data[i].timePosted).fromNow() + + " by @" + data[i].author.username + " " + "
" + "
" + - "" + - "discuss · " + - rank + (rank > 1 ? " points" : " point") + " · posted " + - moment(data[i].timePosted).fromNow() + - " by @" + data[i].author.username + " " + - "" + + "
discuss" + "
" + "
" + "
" + - "
" - ); - $(div).addClass('story-list') - $(div).appendTo($('#story-list')); - } - }); \ No newline at end of file + "
" + + "
" + ); + $(div).addClass('story-list news-box') + $(div).appendTo($('#story-list')); + } + }); diff --git a/views/stories/index.jade b/views/stories/index.jade index 39d3efcea22..588f453f78c 100644 --- a/views/stories/index.jade +++ b/views/stories/index.jade @@ -19,8 +19,6 @@ block content .spacer if (page === 'hot') include ./hot-stories - if (page === 'recent') - include ./new-stories if (page === 'submit') if (user) include ./preliminary-submit @@ -29,8 +27,6 @@ block content .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') include ./submit-story if (page === 'show') diff --git a/views/stories/news-nav.jade b/views/stories/news-nav.jade index e6d9414e364..0a8f2178d0f 100644 --- a/views/stories/news-nav.jade +++ b/views/stories/news-nav.jade @@ -1,43 +1,63 @@ -.col-xs-12 - - a.btn.btn-primary.btn-big.btn-block(href='/stories/submit' class="#{ page === 'hot' ? '' : 'hidden' }") Submit a Code-related Link - a.btn.btn-success.btn-big.btn-block(href='/stories/hot' class="#{ (page === 'show' || page === 'submit' || page === 'storySubmission') ? '' : 'hidden' }") Show all Links - //.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. - $('label').on('click', function() { - window.location = ($(this).children('input').attr('href')); - }); - +a.btn.btn-primary.btn-big.btn-block(href='/stories/submit' class="#{ page === 'hot' ? '' : 'hidden' }") Submit a link +a.btn.btn-success.btn-big.btn-block(href='/stories/hot' class="#{ (page === 'show' || page === 'submit' || page === 'storySubmission') ? '' : 'hidden' }") Show all Links .spacer +.input-group(class="#{ page === 'hot' ? '' : 'hidden' }") + input#searchArea.big-text-field.field-responsive.form-control(type='text', placeholder='Search our links', autofocus) + span.input-group-btn + button#searchbutton.btn.btn-big.btn-primary.btn-responsive(type='button') Search +.spacer +#search-results +.spacer +#story-list + ul#stories +script. + $('#searchArea').keypress(function (event) { + if (event.keyCode === 13 || event.which === 13) { + executeSearch(); + $('#searchArea').focus(); + event.preventDefault(); + } + }); + $('#searchbutton').on('click', function () { + executeSearch(); + }); + function executeSearch() { + $('#stories').empty(); + var searchTerm = $('#searchArea').val(); + var getLinkedName = function getLinkedName(name) { + return name.toLowerCase().replace(/\s/g, '-'); + } + $.post('/stories/search', + { + data: { + searchValue: searchTerm + } + }) + .fail(function (xhr, textStatus, errorThrown) { + }) + .done(function (data, textStatus, xhr) { + for (var i = 0; i < data.length; i++) { + var div = document.createElement('div'); + var linkedName = getLinkedName(data[i].storyLink); + var rank = data[i].rank; + $(div).html( + "
" + + "
" + + "" + + "" + + "
" + + "
" + + "
" + + "" + + data[i].storyLink + + "
" + + "
" + + "Posted " + + moment(data[i].timePosted).fromNow() + + " by @" + data[i].author.username + " " + + "
" + + "
") + $(div).appendTo($('#search-results')); + } + }); + } diff --git a/views/stories/search-stories.jade b/views/stories/search-stories.jade index f031eb09560..e69de29bb2d 100644 --- a/views/stories/search-stories.jade +++ b/views/stories/search-stories.jade @@ -1,73 +0,0 @@ -.col-xs-12 - .spacer - h1.text-center Search - .input-group - input#searchArea.big-text-field.field-responsive.form-control(type='text', placeholder='Search our links', autofocus) - span.input-group-btn - button#searchbutton.btn.btn-big.btn-primary.btn-responsive(type='button') Search - .spacer - -#story-list - ul#stories -script. - $('#searchArea').keypress(function(event) { - if (event.keyCode === 13 || event.which === 13) { - executeSearch(); - $('#searchArea').focus(); - event.preventDefault(); - } - }); - $('#searchbutton').on('click', function() { - executeSearch(); - }); - function executeSearch() { - $('#stories').empty(); - var searchTerm = $('#searchArea').val(); - var getLinkedName = function getLinkedName(name) { - return name.toLowerCase().replace(/\s/g, '-'); - } - $.post('/stories/search', - { - data: { - searchValue: searchTerm - } - }) - .fail(function (xhr, textStatus, errorThrown) { - }) - .done(function (data, textStatus, xhr) { - for (var i = 0; i < data.length; i++) { - var li = document.createElement('li'); - var linkedName = getLinkedName(data[i].storyLink); - var rank = data[i].rank; - - $(li).html( - "
" + - "
" + - "
" + - "" + rank + "" + - "
" + - "
" + - "
" + - "" + - "
" + - "
" + - "
" + - "
" + - "" - + data[i].storyLink + - "" + - "
" + - "
" + - "Posted " + - moment(data[i].timePosted).fromNow() + - " by @" + data[i].author.username + " " + - "
" + - "
" + - "
" + - "
" + - ""); - $(li).appendTo($('#stories')); - } - }); - - }