From 451e3c75f29d99e817ce08c6fa92c860ddbdfa2c Mon Sep 17 00:00:00 2001 From: Quincy Larson Date: Sun, 3 May 2015 00:34:46 -0700 Subject: [PATCH] improvements to portfolios and heatmaps --- public/css/main.less | 5 +- views/account/show.jade | 130 +++++++++++++++++++++------------------- views/home.jade | 20 +++---- views/stories/show.jade | 20 +++---- 4 files changed, 92 insertions(+), 83 deletions(-) diff --git a/public/css/main.less b/public/css/main.less index a39d2700dc..ba0a5db999 100644 --- a/public/css/main.less +++ b/public/css/main.less @@ -999,8 +999,9 @@ hr { border-bottom: dashed 1px @brand-success; } -#cal-heatmap { - width: 361px; +.d3-centered { + width: 771px; + margin: 0 auto; } .cal-heatmap-container { diff --git a/views/account/show.jade b/views/account/show.jade index b74f98d9b8..ba545fa551 100644 --- a/views/account/show.jade +++ b/views/account/show.jade @@ -10,7 +10,7 @@ block content .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 + .button-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 @@ -98,65 +98,73 @@ block content 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} - - 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 + .spacer + .hidden-xs.hidden-sm.col-md-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.d3-centered + script. + $(document).ready(function() { + setTimeout(function() { + var cal = new CalHeatMap(); + var calendar = !{JSON.stringify(calender)}; + cal.init({ + itemSelector: "#cal-heatmap", + domain: "month", + subDomain: "x_day", + domainGutter: 10, + data: calendar, + cellSize: 15, + align: 'center', + cellRadius: 3, + cellPadding: 2, + tooltip: true, + range: 6, + start: new Date().setDate(new Date().getDate() - 150), + legendColors: ["#cccccc", "#215f1e"], + legend: [1, 2, 3], + label: { + position: "top" + } + }); + }, 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} - 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 + - 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 + a(href='/challenges/' + challenge.name)= 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 + a(href='/bonfires/'+ bonfire.name)= 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/home.jade b/views/home.jade index b2ebcf44fb..434a117257 100644 --- a/views/home.jade +++ b/views/home.jade @@ -7,7 +7,7 @@ block content .row .col-xs-12.col-sm-12.col-md-3 h3.nowrap Get Connected - img.img-responsive.landing-icon.img-center(src= 'https://s3.amazonaws.com/freecodecamp/landingIcons_connect.svg.gz', alt='Get great references and connections for your resume or CV to help you get a job') + img.img-responsive.landing-icon.img-center(src= 'https://s3.amazonaws.com/freecodecamp/landingIcons_connect.svg.gz', alt='Get great references and connections for your reto help you get a job') p.landing-p Join a community of busy, motivated professionals. .col-xs-12.col-sm-12.col-md-3 h3.nowrap Learn JavaScript @@ -78,15 +78,15 @@ block content h2 Why you should join our community right now: h3.col-xs-offset-0.col-sm-offset-1 ul.text-left - li.ion-code   We're thousands of professionals, all learning to code together - li.ion-code   We're building projects for dozens of nonprofits - li.ion-code   Our community is 100% free and open source - li.ion-code   You'll learn Full Stack JavaScript and become a Software Engineer - li.ion-code   You'll work through our focused, interactive courses and tutorials - li.ion-code   You'll learn to code at your own pace, in your browser or on your phone - li.ion-code   You'll become qualified for thousands of jobs currently going unfilled - li.ion-code   You can get help in real time from our community chat rooms - li.ion-code   We all share one common goal: to boost our careers with code + li.ion-code   We're thousands of professionals. We all learn to code together. + li.ion-code   We're building projects for dozens of nonprofits. + li.ion-code   Our community is 100% free and open source. + li.ion-code   You'll learn Full Stack JavaScript and become a Software Engineer. + li.ion-code   You'll work through our focused, interactive courses and tutorials. + li.ion-code   You'll learn to code at your own pace, in your browser or on your phone. + li.ion-code   You'll become qualified for thousands of jobs currently going unfilled. + li.ion-code   You can get help in real time from our community chat rooms. + li.ion-code   We all share one common goal: to boost our careers with code. .big-break .row .col-xs-12.col-sm-8.col-sm-offset-2 diff --git a/views/stories/show.jade b/views/stories/show.jade index b8c0763846..0214588e07 100644 --- a/views/stories/show.jade +++ b/views/stories/show.jade @@ -26,14 +26,18 @@ h3.row .col-xs-12 h4= description .negative-5 - a#reply-to-main-post.btn.btn-no-shadow.btn-primary.btn-xs.btn-primary-ghost Reply - |  ·   - if !hasUserVoted - a#upvote.btn.btn-no-shadow.btn-primary.btn-xs.btn-primary-ghost Upvote + if !user + a#upvote.btn.signup-btn.btn-xs(href='/signin') Sign in to reply or upvote |  ·  else - a#upvote.btn.disabled.btn-no-shadow.btn-primary.btn-xs.btn-primary-ghost Upvoted! - |  ·  + a#reply-to-main-post.btn.btn-no-shadow.btn-primary.btn-xs.btn-primary-ghost Reply + |  ·   + if !hasUserVoted + a#upvote.btn.btn-no-shadow.btn-primary.btn-xs.btn-primary-ghost Upvote + |  ·  + else + a#upvote.btn.disabled.btn-no-shadow.btn-primary.btn-xs.btn-primary-ghost Upvoted! + |  ·  span#storyRank= rank + (rank > 1 ? " points" : " point") |  ·  span Posted #{timeAgo} @@ -56,10 +60,6 @@ script. $('#image-display').removeClass('hidden-element') } $('#reply-to-main-post').on('click', function() { - if (!isLoggedIn) { - window.location.href = '/signin'; - return; - } $('#initial-comment-submit').removeClass('hidden-element'); $(this).unbind('click'); $('.comment-to-comment-formgroup').empty();