red-text
class's color rgb
value to be red.",
+ "Another way to represent color in CSS is with rgb
, or red-green-blue notation.",
+ "For each of the three colors, you specify a value between 0 and 256.",
+ "For example, black is rgb(0, 0, 0)
, white is rgb(255, 255, 255)
, bright green is rgb(0, 255, 0)
. You can also get less intense colors by using values lower than 255. For example, light green is rgb(0, 123, 0).",
+ "If you think about it, this is just as precise as using hex code
, because 16 times 16 is 256. In practice, most developers use hex code
since it's faster to say out loud and to type.",
+ "We'll use 6-digit hex code
in all our challenges going forward, but it's good to be aware of this rgb
notation."
+ ],
+ "tests": [
+ "expect($('h2')).to.have.css('color', 'rgb(255, 0, 0)');",
+ "expect($('h2')).to.have.class('red-text');"
+ ],
+ "challengeSeed": [
+ "",
+ "",
+ "hello world
",
+ "cat photo app
",
+ "lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
"
+ ],
+ "challengeType": 0
+ },
+
{
"_id" : "bad87fee1348bd9aedf08810",
"name": "Use Hex Codes for Precise Colors",
@@ -478,7 +508,7 @@
{
"_id" : "bad87fee1348bd9aedf08811",
- "name": "Use rgb Codes for Precise Colors",
+ "name": "Set the Alpha of a Color with rgba",
"difficulty" : "0.17",
"description": [
"Change the red-text
class's color rgb
value to be red.",
diff --git a/views/partials/about.jade b/views/partials/about.jade
index 429e3a2850..33663d77f0 100644
--- a/views/partials/about.jade
+++ b/views/partials/about.jade
@@ -1,4 +1,4 @@
-.panel.panel-primary
+.panel.panel-info
.panel-heading.landing-panel-heading.text-center Our Team of Volunteer Camp Counselors
.panel-body
.landing-panel-body.text-center
@@ -12,121 +12,121 @@
}
});
#shuffle
- .col-xs-12.col-sm-4.col-md-3.team-member
+ .col-xs-12.col-sm-12.col-md-12.col-lg-6.team-member
h3.negative-10.text-nowrap Ammar Shah
h4.negative-10.text-nowrap Community Builder
img.profile-image(src='https://s3.amazonaws.com/freecodecamp/ammar-shah.jpg' alt="Ammar Shah's picture")
h4.text-nowrap Karachi, Pakistan
p.negative-10 "I code whenever I'm not sleeping or in school. Making computers obey me is a dream come true."
- .col-xs-12.col-sm-4.col-md-3.team-member
+ .col-xs-12.col-sm-12.col-md-12.col-lg-6.team-member
h3.negative-10.text-nowrap Branden Byers
h4.negative-10.text-nowrap Instructional Designer
img.profile-image(src='https://s3.amazonaws.com/freecodecamp/branden-byers.jpg' alt="Branden Byers picture")
h4.text-nowrap Madison, Wisconsin
p.negative-10 "Cookbook author and stay-at-home-dad. Started coding as a kid, got distracted, but now I'm back in full JavaScript force!"
- .col-xs-12.col-sm-4.col-md-3.team-member
+ .col-xs-12.col-sm-12.col-md-12.col-lg-6.team-member
h3.negative-10.text-nowrap Michael Johnson
h4.negative-10.text-nowrap Nonprofit Coordinator
img.profile-image(src='https://s3.amazonaws.com/freecodecamp/michael-johnson.jpeg' alt="Michael Johnson's picture")
h4.text-nowrap Washington, D.C.
p.negative-10 "I’m a recent Harvard University graduate who took a pass on Wall Street to code for a cause, and help others do the same."
- .col-xs-12.col-sm-4.col-md-3.team-member
+ .col-xs-12.col-sm-12.col-md-12.col-lg-6.team-member
h3.negative-10.text-nowrap Berkeley Martinez
h4.negative-10.text-nowrap JavaScript Engineer
img.profile-image(src='https://s3.amazonaws.com/freecodecamp/berkeley-martinez.jpg' alt="Berkeley Martinez's picture")
h4.text-nowrap San Francisco, California
p.negative-10 "Former mechanical engineer. Coding is pure creation. I can fly, but only once."
- .col-xs-12.col-sm-4.col-md-3.team-member
+ .col-xs-12.col-sm-12.col-md-12.col-lg-6.team-member
h3.negative-10.text-nowrap Mychael Zuniga
h4.negative-10.text-nowrap JavaScript Engineer
img.profile-image(src='https://s3.amazonaws.com/freecodecamp/mychael-zuniga.jpg' alt="Mychael Zuniga's picture")
h4.text-nowrap San Diego, California
p.negative-10 "I'm a college student who turned to code as an avenue for creative expression. I love political science and economics."
- .col-xs-12.col-sm-4.col-md-3.team-member
+ .col-xs-12.col-sm-12.col-md-12.col-lg-6.team-member
h3.negative-10.text-nowrap Jeanette Casteñeta
h4.negative-10.text-nowrap Product Manager
img.profile-image(src='https://s3.amazonaws.com/freecodecamp/jeanette-casteneta.jpg' alt="Jeanette Casteñeta's picture")
h4.text-nowrap San Francisco, California
p.negative-10 "Home-ec diva. I can envision a dress, then stitch it together. Now I'm learning how to do the same thing with code."
- .col-xs-12.col-sm-4.col-md-3.team-member
+ .col-xs-12.col-sm-12.col-md-12.col-lg-6.team-member
h3.negative-10.text-nowrap Darryl Dixon
h4.negative-10.text-nowrap Community Builder
img.profile-image(src='https://s3.amazonaws.com/freecodecamp/darryl-dixon.jpg' alt="Darryl Dixon's picture")
h4.text-nowrap Newport News, Virginia
p.negative-10 "I'm a self-taught graphic designer. I'm learning web development here and want you to learn with me."
- .col-xs-12.col-sm-4.col-md-3.team-member
+ .col-xs-12.col-sm-12.col-md-12.col-lg-6.team-member
h3.negative-10.text-nowrap Kathy O'Driscoll
h4.negative-10.text-nowrap Community Builder
img.profile-image(src='https://s3.amazonaws.com/freecodecamp/kathy-odriscoll.jpg' alt="Kathy O'Driscoll's picture")
h4.text-nowrap Los Angeles, California
p.negative-10 "Mother and grandmother. All my life I've dabbled in getting machines to do my bidding. Now it's becoming my career."
- .col-xs-12.col-sm-4.col-md-3.team-member
+ .col-xs-12.col-sm-12.col-md-12.col-lg-6.team-member
h3.negative-10.text-nowrap Ryan Malm
h4.negative-10.text-nowrap Visual Designer
img.profile-image(src='https://s3.amazonaws.com/freecodecamp/ryan-malm.jpg' alt="Ryan Malm's picture")
h4.text-nowrap Omaha, Nebraska
p.negative-10 "I love origami, piano, and playing minecraft with my kids. My JavaScript grows stronger every day."
- .col-xs-12.col-sm-4.col-md-3.team-member
+ .col-xs-12.col-sm-12.col-md-12.col-lg-6.team-member
h3.negative-10.text-nowrap Charles Watson
h4.negative-10.text-nowrap JavaScript Engineer
img.profile-image(src='https://s3.amazonaws.com/freecodecamp/charles-watson.jpg' alt="Charles Watson's picture")
h4.text-nowrap Minneapolis, Minnesota
p.negative-10 "I skipped college. I build iOS apps. I love the obstacles and puzzles that coding presents me."
- .col-xs-12.col-sm-4.col-md-3.team-member
+ .col-xs-12.col-sm-12.col-md-12.col-lg-6.team-member
h3.negative-10.text-nowrap Quincy Larson
h4.negative-10.text-nowrap Instructional Designer
img.profile-image(src='https://s3.amazonaws.com/freecodecamp/quincy-larson.jpg' alt="Quincy Larson's picture")
h4.text-nowrap San Francisco, California
p.negative-10 "I worked as a school director in China before learning to code. It's clear that everyone can - and should - learn to code."
- .col-xs-12.col-sm-4.col-md-3.team-member
+ .col-xs-12.col-sm-12.col-md-12.col-lg-6.team-member
h3.negative-10.text-nowrap Mark Howard
h4.negative-10.text-nowrap Digital Marketer
img.profile-image(src='https://s3.amazonaws.com/freecodecamp/mark-howard.jpg' alt="Mark Howard's picture")
h4.text-nowrap San Diego, California
p.negative-10 "I enjoy helping people, at scale. Code is the best way to do that."
- .col-xs-12.col-sm-4.col-md-3.team-member
+ .col-xs-12.col-sm-12.col-md-12.col-lg-6.team-member
h3.negative-10.text-nowrap Nathan Leniz
h4.negative-10.text-nowrap JavaScript Engineer
img.profile-image(src='https://s3.amazonaws.com/freecodecamp/nathan-leniz.jpg' alt="Nathan Leniz's picture")
h4.text-nowrap Seoul, South Korea
p.negative-10 "I learned to code for the games, and stayed for the algorithms."
- .col-xs-12.col-sm-4.col-md-3.team-member
+ .col-xs-12.col-sm-12.col-md-12.col-lg-6.team-member
h3.negative-10.text-nowrap Jason Rueckert
h4.negative-10.text-nowrap Live Content Manager
img.profile-image(src='https://s3.amazonaws.com/freecodecamp/jason-rueckert.jpg' alt="Jason Rueckert's picture")
h4.text-nowrap Seattle, Washington
p.negative-10 "My high school job was testing basketball shoes for Nike. I learned code to work smarter, not harder. I have no thyroid."
- .col-xs-12.col-sm-4.col-md-3.team-member
+ .col-xs-12.col-sm-12.col-md-12.col-lg-6.team-member
h3.negative-10.text-nowrap Christopher Nguyen
h4.negative-10.text-nowrap QA Engineer
img.profile-image(src='https://s3.amazonaws.com/freecodecamp/christopher-nguyen.jpg' alt="Christopher Nguyen's picture")
h4.text-nowrap Seattle, Washington
p.negative-10 "Morning Owl. Code is an equalizer. Barriers exist everywhere, but if you can say 'hello world', the world will say hello back."
- .col-xs-12.col-sm-4.col-md-3.team-member
+ .col-xs-12.col-sm-12.col-md-12.col-lg-6.team-member
h3.negative-10.text-nowrap Dominic Jones
h4.negative-10.text-nowrap Community Builder
img.profile-image(src='https://s3.amazonaws.com/freecodecamp/dominic-jones.jpg' alt="Dominic Jones's picture")
h4.text-nowrap York, Pennsylvania
p.negative-10 "Born with Sickle Cell Anemia. Professional writer, working on becoming a professional code writer."
- .col-xs-12.col-sm-4.col-md-3.team-member
+ .col-xs-12.col-sm-12.col-md-12.col-lg-6.team-member
h3.negative-10.text-nowrap James McShane
h4.negative-10.text-nowrap JavaScript Engineer
img.profile-image(src='https://s3.amazonaws.com/freecodecamp/james-mcshane.jpg' alt="James McShane's picture")
h4.text-nowrap Minneapolis, Minnesota
p.negative-10 "I just bought our first house, ending a 10 year streak of moving each year. I've used code to solve problems since I was a child."
- .col-xs-12.col-sm-4.col-md-3.team-member
+ .col-xs-12.col-sm-12.col-md-12.col-lg-6.team-member
h3.negative-10.text-nowrap Ellie Adam
h4.negative-10.text-nowrap Visual Designer
img.profile-image(src='https://s3.amazonaws.com/freecodecamp/ellie-adam.jpg' alt="Eliie Adam's picture")
h4.text-nowrap Seattle, Washington
p.negative-10 "I photograph birds and flowers. I'm a designer who recently decided to learn coding and front end web developement."
- .col-xs-12.col-sm-4.col-md-3.team-member
+ .col-xs-12.col-sm-12.col-md-12.col-lg-6.team-member
h3.negative-10.text-nowrap Kamal Sharif
h4.negative-10.text-nowrap JavaScript Engineer
img.profile-image(src='https://s3.amazonaws.com/freecodecamp/kamal-sharif.jpg' alt="Kamal Sharif's picture")
h4.text-nowrap Dhaka, Bangladesh
p.negative-10 "I build applications that help other people improve their own lives."
- .col-xs-12.col-sm-4.col-md-3.team-member
+ .col-xs-12.col-sm-12.col-md-12.col-lg-6.team-member
h3.negative-10.text-nowrap Patrick Ly
h4.negative-10.text-nowrap Community Builder
img.profile-image(src='https://s3.amazonaws.com/freecodecamp/patrick-ly.jpg' alt="Patrick Ly's picture")
diff --git a/views/partials/blog.jade b/views/partials/blog.jade
index a8a47e2473..946a659966 100644
--- a/views/partials/blog.jade
+++ b/views/partials/blog.jade
@@ -1,20 +1,10 @@
-.panel.panel-primary
- .panel-heading.landing-panel-heading.text-center Our Blog and Tweets
- .panel-body
- .landing-panel-body.text-center
- .row
- .col-xs-12.col-sm-12.col-md-6
- h2
- a(href=blog1Link)= blog1Title
- h2
- a(href=blog2Link)= blog2Title
- h2
- a(href=blog3Link)= blog3Title
- h2
- a(href=blog4Link)= blog4Title
- h2
- a(href=blog5Link)= blog5Title
- .col-xs-12.col-sm-12.col-md-6
- a.twitter-timeline(data-dnt='true', href='https://twitter.com/FreeCodeCamp', data-widget-id='560847186548621312') Tweets by @FreeCodeCamp
- script.
- !function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");
\ No newline at end of file
+h2
+ a(href=blog1Link)= blog1Title
+h2
+ a(href=blog2Link)= blog2Title
+h2
+ a(href=blog3Link)= blog3Title
+h2
+ a(href=blog4Link)= blog4Title
+h2
+ a(href=blog5Link)= blog5Title
\ No newline at end of file
diff --git a/views/partials/faq.jade b/views/partials/faq.jade
index 569969a62e..6b55904968 100644
--- a/views/partials/faq.jade
+++ b/views/partials/faq.jade
@@ -1,4 +1,4 @@
-.panel.panel-primary
+.panel.panel-info
.panel-heading.landing-panel-heading.text-center Frequently Asked Questions
.panel-body
.landing-panel-body
@@ -16,11 +16,12 @@
p.landing-p Then you'll learn computer science and the art of programming:
ul
li.landing-p • JavaScript - the one programming language that all web browsers use
- li.landing-p • Git - a version control system for saving and sharing your projects
li.landing-p • Algorithms - step-by-step recipes for getting things done
+ li.landing-p • Automated Testing - write tests to test the limits of your code
p.landing-p You'll spend the last half of Free Code Camp using Agile Methodologies and Full Stack JavaScript to build projects for nonprofits:
ul
li.landing-p • Agile - a set of software development principles that focus the design and production of a project on the needs of its users
+ li.landing-p • Git - a version control system for saving and sharing your projects
li.landing-p • MongoDB - a popular non-relational database
li.landing-p • Angular.js - a tool for making exciting web interfaces
li.landing-p • Express.js - a powerful web development framework
diff --git a/views/partials/stats.jade b/views/partials/stats.jade
index a7ede7f9f8..7cebe88e30 100644
--- a/views/partials/stats.jade
+++ b/views/partials/stats.jade
@@ -1,46 +1,39 @@
-.panel.panel-primary
- .panel-heading.landing-panel-heading.text-center Free Code Camp Stats
- .panel-body
- .landing-panel-body.text-center
- .row
- .col-xs-6.text-right
- h2 Days since we Launched:
- .col-xs-6.text-left
- h2
- = daysRunning
- .row
- .col-xs-6.text-right
- h2 Nonprofit Projects:
- .col-xs-6.text-left
- h2
- =nonprofitProjects
- |  
- a(href="https://trello.com/b/BA3xVpz9/nonprofit-projects") (view)
- .row
- .col-xs-6.text-right
- h2 Campers with at least...
- .col-xs-6
- .row
- .col-xs-6.text-right
- h2 3 Points:
- .col-xs-6.text-left
- h2
- = c3
- .row
- .col-xs-6.text-right
- h2 10 Points:
- .col-xs-6.text-left
- h2
- = c10
- .row
- .col-xs-6.text-right
- h2 30 Points:
- .col-xs-6.text-left
- h2
- = c30
- .row
- .col-xs-6.text-right
- h2 All 54 Points:
- .col-xs-6.text-left
- h2
- = all
\ No newline at end of file
+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= nonprofitProjects
+ |  
+ a(href="https://trello.com/b/BA3xVpz9/nonprofit-projects") (view)
+ .row
+ .col-xs-6.text-right Open Issues:
+ .col-xs-6.text-left= pulls
+ |  
+ a(href="https://github.com/freecodecamp/freecodecamp/issues") (view)
+ .row
+ .col-xs-6.text-right Pull Requests:
+ .col-xs-6.text-left= pulls
+ |  
+ a(href="https://github.com/freecodecamp/freecodecamp/pulls") (view)
+ .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 30 Points:
+ .col-xs-6.text-left= c30
+ .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 12c1d64b61..9b09218e92 100644
--- a/views/resources/learn-to-code.jade
+++ b/views/resources/learn-to-code.jade
@@ -1,8 +1,47 @@
-extends ../layout
+extends ../layout-wide
block content
+ img.img-responsive.img-center(src='https://s3.amazonaws.com/freecodecamp/wide-social-banner.png')
+ br
+ a.btn.btn-big.btn-block.btn-primary.next-challenge-button(href="/challenges/") Take me to my next challenge
+ br
script.
var challengeName = 'Learn to code'
- include ../partials/stats
- include ../partials/blog
- include ../partials/about
- include ../partials/faq
\ No newline at end of file
+ .row
+ .col-xs-12.col-sm-12.col-md-6
+ include ../partials/faq
+ .col-xs-12.col-sm-12.col-md-6
+ .panel.panel-info
+ .panel-heading.landing-panel-heading.text-center Stats
+ .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/blog
+ .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) {
+ var js, fjs = d.getElementsByTagName(s)[0], p = /^http:/.test(d.location) ? 'http' : 'https';
+ if (!d.getElementById(id)) {
+ js = d.createElement(s);
+ js.id = id;
+ js.src = p + "://platform.twitter.com/widgets.js";
+ fjs.parentNode.insertBefore(js, fjs);
+ }
+ }(document, "script", "twitter-wjs");
+ .text-center
+ html.
+
+ Follow @FreeCodeCamp
+
+
+ include ../partials/about