From 749954542fc07f02b2c6fbfb47d708aa76ead81d Mon Sep 17 00:00:00 2001 From: Michael Q Larson Date: Wed, 18 Feb 2015 22:58:10 -0800 Subject: [PATCH] refactor learn-to-code view to look more visual and have fewer components --- controllers/resources.js | 23 +++------ public/css/main.less | 4 +- views/partials/faq.jade | 10 ++-- views/partials/github.jade | 2 +- views/partials/stats.jade | 26 ---------- views/resources/learn-to-code.jade | 78 ++++++++++++++++++++---------- 6 files changed, 69 insertions(+), 74 deletions(-) diff --git a/controllers/resources.js b/controllers/resources.js index 86b74627e1..01e7d9a072 100644 --- a/controllers/resources.js +++ b/controllers/resources.js @@ -142,29 +142,22 @@ module.exports = { var timeDiff = Math.abs(date2.getTime() - date1.getTime()); var daysRunning = Math.ceil(timeDiff / (1000 * 3600 * 24)); var announcements = resources.announcements; - User.count({'points': {'$gt': 2}}, function (err, c3) { + User.count({}, function (err, c3) { if (err) { debug('User err: ', err); next(err); } - User.count({'points': {'$gt': 9}}, function (err, c10) { + User.count({'points': {'$gt': 53}}, function (err, all) { if (err) { debug('User err: ', err); next(err); } - User.count({'points': {'$gt': 53}}, function (err, all) { - if (err) { - debug('User err: ', err); - next(err); - } - res.render('resources/learn-to-code', { - title: 'About Free Code Camp and Our Team of Volunteers', - daysRunning: daysRunning, - c3: c3, - c10: c10, - all: all, - announcements: announcements - }); + res.render('resources/learn-to-code', { + title: 'About Free Code Camp and Our Team of Volunteers', + daysRunning: daysRunning, + c3: c3, + all: all, + announcements: announcements }); }); }); diff --git a/public/css/main.less b/public/css/main.less index eef9b6b785..613774804c 100644 --- a/public/css/main.less +++ b/public/css/main.less @@ -700,8 +700,8 @@ iframe.iphone { line-height: 150%; } -.github-button-container { - padding-top: 5px; +.github-and-twitter-button-text { + padding-top: 10px; } //uncomment this to see the dimensions of all elements outlined in red diff --git a/views/partials/faq.jade b/views/partials/faq.jade index 6b55904968..19144be470 100644 --- a/views/partials/faq.jade +++ b/views/partials/faq.jade @@ -36,23 +36,23 @@ table.table thead th Time budgeted - th Hours per week + th.hidden-xs Hours per week th Weeks to complete tr.info td Weekends - td 10 hours/week + td.hidden-xs 10 hours/week td 100 weeks (2 years) tr.success td Nights and Weekends - td 20 hours/week + td.hidden-xs 20 hours/week td 50 weeks (1 year) tr.warning td Full time - td 40 hours/week + td.hidden-xs 40 hours/week td 25 weeks (6 months) tr.danger td Traditional Bootcamp Pacing - td 80 hours/week + td.hidden-xs 80 hours/week td 12 weeks (3 months) h2 Why does Free Code Camp use JavaScript instead of Ruby or Python? ul diff --git a/views/partials/github.jade b/views/partials/github.jade index 2b0b77e914..51a549c290 100644 --- a/views/partials/github.jade +++ b/views/partials/github.jade @@ -7,7 +7,7 @@ script. }).done( function(data) { var github = document.createElement('div'); - $(github).html('
Open Issues:
' + data.issues + ' (create one)
Open Pull Requests:
' + data.pulls + ' (create one)
').prependTo($('#github')) + $(github).html('
Open GitHub Issues:
' + data.issues + ' (create one)
Open Pull Requests:
' + data.pulls + ' (create one)
').prependTo($('#github')) } ); })(); \ No newline at end of file diff --git a/views/partials/stats.jade b/views/partials/stats.jade index 5ba1c45c2f..e69de29bb2 100644 --- a/views/partials/stats.jade +++ b/views/partials/stats.jade @@ -1,26 +0,0 @@ -h2.stats-text - .row - .col-xs-6.text-right Days since we launched: - .col-xs-6.text-left= daysRunning - .row - .col-xs-6.text-right Nonprofit Projects: - .col-xs-6.text-left - include ../partials/trello - include ../partials/github - .row - .col-xs-6.text-right Campers with at least... - .col-xs-4 - .row - .col-xs-6.text-right 3 Points: - .col-xs-6.text-left= c3 - .row - .col-xs-6.text-right 10 Points: - .col-xs-6.text-left= c10 - .row - .col-xs-6.text-right All 54 Points: - .col-xs-6.text-left= all - .row - .col-xs-6.text-right Star our project here: - .col-xs-6.text-left.github-button-container - html. - \ No newline at end of file diff --git a/views/resources/learn-to-code.jade b/views/resources/learn-to-code.jade index aee9a0c3c0..22e1ff5bbc 100644 --- a/views/resources/learn-to-code.jade +++ b/views/resources/learn-to-code.jade @@ -5,12 +5,47 @@ block content .text-center a.btn.btn-cta.signup-btn.next-challenge-button(href="/challenges") Take me to my next challenge br + .row + .col-xs-12.col-sm-12.col-md-4 + .panel.panel-info + .panel-heading.landing-panel-heading.text-center Get Connected + .panel-body + img.img-responsive.img-center(src="https://s3.amazonaws.com/freecodecamp/about-chatroom.jpg") + h3 + .row + .col-xs-9.text-right Campers doing challenges: + .col-xs-3.text-left= c3 + .row + .col-xs-9.text-right Campers coding for nonprofits: + .col-xs-3.text-left= all + .col-xs-12.col-sm-12.col-md-4 + .panel.panel-info + .panel-heading.landing-panel-heading.text-center Learn JavaScript + .panel-body + img.img-responsive.img-center(src="https://s3.amazonaws.com/freecodecamp/about-github.jpg") + h3 + include ../partials/github + .col-xs-12.col-sm-12.col-md-4 + .panel.panel-info + .panel-heading.landing-panel-heading.text-center Help Nonprofits + .panel-body + img.img-responsive.img-center(src="https://s3.amazonaws.com/freecodecamp/about-trello.jpg") + h3 + .row + .col-xs-6.text-right Days since we launched: + .col-xs-6.text-left= daysRunning + .row + .col-xs-6.text-right Nonprofit Projects: + .col-xs-6.text-left + include ../partials/trello + + br script. var challengeName = 'Learn to code' .row .col-xs-12.col-sm-12.col-md-6 .panel.panel-info - .panel-heading.landing-panel-heading.text-center Announcements + .panel-heading.landing-panel-heading.text-center News .panel-body .landing-panel-body.text-center for announcement in announcements @@ -19,22 +54,7 @@ block content a(href=announcement[1])= announcement[0] else = announcement[0] - include ../partials/faq - .col-xs-12.col-sm-12.col-md-6 - .panel.panel-info - .panel-heading.landing-panel-heading.text-center Statistics - .panel-body - .landing-panel-body - include ../partials/stats - .panel.panel-info - .panel-heading.landing-panel-heading.text-center Blog - .panel-body - .landing-panel-body.text-center include ../partials/blogger - .panel.panel-info - .panel-heading.landing-panel-heading.text-center Tweets - .panel-body - .landing-panel-body.text-center a.twitter-timeline(data-dnt='true', href='https://twitter.com/FreeCodeCamp', data-widget-id='560847186548621312') Tweets by @FreeCodeCamp script. !function (d, s, id) { @@ -46,13 +66,21 @@ block content fjs.parentNode.insertBefore(js, fjs); } }(document, "script", "twitter-wjs"); - .text-center - html. - - Follow @FreeCodeCamp - - + h3 + .col-xs-12 Follow us on Twitter here: + .col-xs-12.github-and-twitter-button-text + html. + + Follow @FreeCodeCamp + + + .col-xs-12.github-and-twitter-button-text Star us on GitHub here: + .col-xs-12.github-and-twitter-button-text + html. + include ../partials/about + .col-xs-12.col-sm-12.col-md-6 + include ../partials/faq \ No newline at end of file