From 4959675d74f0a095af5f99d65c0767f9c3a03352 Mon Sep 17 00:00:00 2001 From: Logan Tegman Date: Sun, 1 Nov 2015 17:11:23 -0800 Subject: [PATCH] Fix Sidebar Code Indentation Character Closes #3988 --- seed/challenges/basic-javascript.json | 34 ++++++------- seed/challenges/html5-and-css.json | 48 +++++++++---------- seed/challenges/json-apis-and-ajax.json | 30 ++++++------ ...t-oriented-and-functional-programming.json | 14 +++--- 4 files changed, 63 insertions(+), 63 deletions(-) diff --git a/seed/challenges/basic-javascript.json b/seed/challenges/basic-javascript.json index a871f43675..6eaf92406d 100644 --- a/seed/challenges/basic-javascript.json +++ b/seed/challenges/basic-javascript.json @@ -653,7 +653,7 @@ "In JavaScript, we can divide up our code into reusable parts called functions.", "Here's an example of a function:", "function functionName(a, b) {", - "  return a + b;", + "  return a + b;", "}", "After writing the above lines in our code, we can then pass values to our function and the result following the return statement will be returned.", "For example, we can pass numbers 4 and 2 by “calling” the function later in our code like this: functionName(4, 2).", @@ -694,10 +694,10 @@ "Objects are similar to arrays, except that instead of using indexes to access and modify their data, you access the data in objects through what are called properties.", "Here's a sample object:", "var cat = {", - "  \"name\": \"Whiskers\",", - "  \"legs\": 4,", - "  \"tails\": 1,", - "  \"enemies\": [\"Water\", \"Dogs\"]", + "  \"name\": \"Whiskers\",", + "  \"legs\": 4,", + "  \"tails\": 1,", + "  \"enemies\": [\"Water\", \"Dogs\"]", "};", "", "Objects are useful for storing data in a structured way, and can represent real world objects, like a cat.", @@ -741,10 +741,10 @@ "After you've created a JavaScript object, you can update its properties at any time just like you would update any other variable.", "For example, let's look at ourDog:", "var ourDog = {", - "  \"name\": \"Camper\",", - "  \"legs\": 4,", - "  \"tails\": 1,,", - "  \"friends\": [\"everything!\"]", + "  \"name\": \"Camper\",", + "  \"legs\": 4,", + "  \"tails\": 1,,", + "  \"friends\": [\"everything!\"]", "};", "Since he's a particularly happy dog, let's change his name to \"Happy Camper\". Here's how we update his object's name property:", "ourDog.name = \"Happy Camper\";", @@ -874,7 +874,7 @@ "In the following example we initialize with i = 0 and iterate while our condition i < 5 is true. We'll increment i by 1 in each loop iteration with i++ as our final-expression.", "var ourArray = [];", "for(var i = 0; i < 5; i++) {", - "  ourArray.push(i);", + "  ourArray.push(i);", "}", "ourArray will now contain [0,1,2,3,4].", "Let's try getting a for loop to work by pushing values to an array." @@ -912,7 +912,7 @@ "We'll start at i = 0 and loop while i < 10. We'll increment i by 2 each loop with i += 2.", "var ourArray = [];", "for(var i = 0; i < 10; i += 2) {", - "  ourArray.push(i);", + "  ourArray.push(i);", "}", "ourArray will now contain [0,2,4,6,8] ", "Let's change our initialization and final-expression so we can count by odd numbers.", @@ -952,7 +952,7 @@ "We'll start at i = 10 and loop while i > 0. We'll decrement i by 2 each loop with i -= 2.", "var ourArray = [];", "for(var i = 10; i > 0; i -= 2) {", - "  ourArray.push(i);", + "  ourArray.push(i);", "}", "ourArray will now contain [10,8,6,4,2]", "Let's change our initialization and final-expression so we can count backward by twos for numbers.", @@ -992,8 +992,8 @@ "var ourArray = [];", "var i = 0;", "while(i < 5) {", - "  ourArray.push(i);", - "  i++;", + "  ourArray.push(i);", + "  i++;", "}", "Let's try getting a while loop to work by pushing values to an array.", "Push the numbers 0 through 4 to myArray using a while loop." @@ -1140,9 +1140,9 @@ "if statements require some sort of boolean condition to evaluate.", "For example:", "if (1 === 2) {", - "  return true;", + "  return true;", "} else {", - "  return false;", + "  return false;", "}", "Let's use if and else statements to make a coin-flip game.", "Create if and else statements to return the string \"heads\" if the flip variable is zero, or else return the string \"tails\" if the flip variable is not zero." @@ -1460,7 +1460,7 @@ "If all three numbers match, we should return the number that we have in three of slots or leave it as null.", "Let's create an if statement with multiple conditions in order to check whether all numbers are equal.", "if(slotOne !== slotTwo || slotTwo !== slotThree){", - "  return null;", + "  return null;", "}" ], "tests": [ diff --git a/seed/challenges/html5-and-css.json b/seed/challenges/html5-and-css.json index 82f2c72603..dc5fd59eed 100644 --- a/seed/challenges/html5-and-css.json +++ b/seed/challenges/html5-and-css.json @@ -381,7 +381,7 @@ "</style>", "Inside that style element, you can create a CSS selector for all h2 elements. For example, if you wanted all h2 elements to be red, your style element would look like this:", "<style>", - "  h2 {color: red;}", + "  h2 {color: red;}", "</style>", "Note that it's important to have both opening and closing curly braces ({ and }) around each element's style. You also need to make sure your element's style is between the opening and closing style tags. Finally, be sure to add the semicolon to the end of each of your element's styles.", "Delete your h2 element's style attribute and instead create a CSS style element. Add the necessary CSS to turn all h2 elements blue." @@ -436,9 +436,9 @@ "Classes are reusable styles that can be added to HTML elements.", "Here's an example CSS class declaration:", "<style>", - "  .blue-text {", - "    color: blue;", - "  }", + "  .blue-text {", + "    color: blue;", + "  }", "</style>", "You can see that we've created a CSS class called blue-text within the <style> tag.", "You can apply a class to an HTML element like this:", @@ -504,7 +504,7 @@ "Remember that you can attach classes to HTML elements by using class=\"your-class-here\" within the relevant element's opening tag.", "Remember that CSS class selectors require a period at the beginning like this:", ".blue-text {", - "  color: blue;", + "  color: blue;", "}", "But also remember that class declarations don't use a period, like this:", "<h2 class=\"blue-text\">CatPhotoApp<h2>", @@ -556,7 +556,7 @@ "description": [ "Font size is controlled by the font-size CSS property, like this:", "h1 {", - "  font-size: 30px;", + "  font-size: 30px;", "}", "See if you can figure out how to give both of your p elements the font-size of 16 pixels (16px). You can do this inside the same <style> tag that we created for your red-text class.", "Create a second p element with the following kitty ipsum text: Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.", @@ -611,7 +611,7 @@ "You can set an element's font by using the font-family property.", "For example, if you wanted to set your h2 element's font to Sans-serif, you would use the following CSS:", "h2 {", - "  font-family: Sans-serif;", + "  font-family: Sans-serif;", "}", "Make all of your p elements use the Monospace font." ], @@ -715,7 +715,7 @@ "When one font isn't available, you can tell the browser to \"degrade\" to another font.", "For example, if you wanted an element to use the Helvetica font, but also degrade to the Sans-Serif font when Helvetica wasn't available, you could use this CSS style:", "p {", - "  font-family: Helvetica, Sans-Serif;", + "  font-family: Helvetica, Sans-Serif;", "}", "Now comment out your call to Google Fonts, so that the Lobster font isn't available. Notice how it degrades to the Monospace font." ], @@ -832,9 +832,9 @@ "CSS has a property called width that controls an element's width. Just like with fonts, we'll use px (pixels) to specify the image's width.", "For example, if we wanted to create a CSS class called larger-image that gave HTML elements a width of 500 pixels, we'd use:", "<style>", - "  .larger-image {", - "    width: 500px;", - "  }", + "  .larger-image {", + "    width: 500px;", + "  }", "</style>", "Create a class called smaller-image and use it to resize the image so that it's only 100 pixels wide." ], @@ -892,11 +892,11 @@ "CSS borders have properties like style, color and width", "For example, if we wanted to create a red, 5 pixel border around an HTML element, we could use this class:", "<style>", - "  .thin-red-border {", - "    border-color: red;", - "    border-width: 5px;", - "    border-style: solid;", - "  }", + "  .thin-red-border {", + "    border-color: red;", + "    border-width: 5px;", + "    border-style: solid;", + "  }", "</style>", "Create a class called thick-green-border that puts a 10-pixel-wide green border with a style of solid around an HTML element, and apply that class to your cat photo.", "Remember that you can apply multiple classes to an element by separating each class with a space within its class attribute. For example:", @@ -1453,8 +1453,8 @@ "Unordered lists start with a <ul> element. Then they contain some number of <li> elements.", "For example: ", "<ul>", - "  <li>milk</li>", - "  <li>cheese</li>", + "  <li>milk</li>", + "  <li>cheese</li>", "</ul>", "would create a bullet point-style list of \"milk\" and \"cheese\".", "Replace your p elements with an unordered list of three things that cats love." @@ -1530,8 +1530,8 @@ "Ordered lists start with a <ol> element. Then they contain some number of <li> elements.", "For example:", "<ol>", - "  <li>Garfield</li>", - "  <li>Sylvester</li>", + "  <li>Garfield</li>", + "  <li>Sylvester</li>", "</ol>", "would create a numbered list of \"Garfield\" and \"Sylvester\".", "Create an ordered list of the top 3 things cats hate the most." @@ -2386,7 +2386,7 @@ "You can set an element's background color with the background-color property.", "For example, if you wanted an element's background color to be green, you'd put this within your style element:", ".green-background {", - "  background-color: green;", + "  background-color: green;", "}", "Create a class called gray-background with the background-color of gray. Assign this class to your div element." ], @@ -2566,7 +2566,7 @@ "One cool thing about id attributes is that, like classes, you can style them using CSS.", "Here's an example of how you can take your element with the id attribute of cat-photo-element and give it the background color of green. In your style element:", "#cat-photo-element {", - "  background-color: green;", + "  background-color: green;", "}", "Note that inside your style element, you always reference classes by putting a . in front of their names. You always reference ids by putting a # in front of their names.", "Try giving your form, which now has the id attribute of cat-photo-form, a green background." @@ -3153,7 +3153,7 @@ "We can prove that the body element exists here by giving it a background-color of black.", "We can do this by adding the following to our style element:", "body {", - "  background-color: black;", + "  background-color: black;", "}" ], "tests": [ @@ -3316,7 +3316,7 @@ "Leave the blue-text and pink-text classes on your h1 element.", "Create a CSS declaration for your orange-text id in your style element. Here's an example of what this looks like:", "#brown-text {", - "  color: brown;", + "  color: brown;", "}" ], "tests": [ diff --git a/seed/challenges/json-apis-and-ajax.json b/seed/challenges/json-apis-and-ajax.json index 6c44cabac4..5d3b0a5e6f 100644 --- a/seed/challenges/json-apis-and-ajax.json +++ b/seed/challenges/json-apis-and-ajax.json @@ -58,7 +58,7 @@ "When our click event happens, we can use Ajax to update an HTML element.", "Let's make it so that when a user clicks the \"Get Message\" button, we change the text of the element with the class message to say \"Here is the message\".", "We can do this by adding the following code within our click event:", - "  $(\".message\").html(\"Here is the message\");" + "  $(\".message\").html(\"Here is the message\");" ], "tests": [ "assert(editor.match(/\\$\\s*?\\(\\s*?(?:'|\")\\.message(?:'|\")\\s*?\\)\\s*?\\.html\\s*?\\(\\s*?(?:'|\")Here\\sis\\sthe\\smessage(?:'|\")\\s*?\\);/gi), 'Clicking the \"Get Message\" button should give the element with the class message the text \"Here is the message\".')" @@ -107,9 +107,9 @@ "These properties and their values are often referred to as \"key-value pairs\".", "Let's get the JSON from Free Code Camp's Cat Photo API.", "Here's the code you can put in your click event to do this:", - "  $.getJSON(\"/json/cats.json\", function(json) {", - "    $(\".message\").html(JSON.stringify(json));", - "  });", + "  $.getJSON(\"/json/cats.json\", function(json) {", + "    $(\".message\").html(JSON.stringify(json));", + "  });", "Once you've added this, click the \"Get Message\" button. Your Ajax function will replace the \"The message will go here\" text with the raw JSON output from the Free Code Camp Cat Photo API." ], "tests": [ @@ -165,12 +165,12 @@ "Then, let's loop through our JSON, adding more HTML to that variable. When the loop is finished, we'll render it.", "Here's the code that does this:", "json.map(function(val) {", - "  var keys = Object.keys(val);", - "  html += \"<div class = 'cat'>\";", - "  keys.map(function(key) {", - "    html += \"<b>\" + key + \"</b>: \" + val[key] + \"<br>\";", - "  });", - "  html += \"</div><br>\";", + "  var keys = Object.keys(val);", + "  html += \"<div class = 'cat'>\";", + "  keys.map(function(key) {", + "    html += \"<b>\" + key + \"</b>: \" + val[key] + \"<br>\";", + "  });", + "  html += \"</div><br>\";", "});" ], "tests": [ @@ -225,7 +225,7 @@ "We've seen from the last two lessons that each object in our JSON array contains an imageLink key with a value that is the url of a cat's image.", "When we're looping through these objects, let's use this imageLink property to display this image in an img element.", "Here's the code that does this:", - "  html += \"<img src = '\" + val.imageLink + \"'>\";" + "  html += \"<img src = '\" + val.imageLink + \"'>\";" ], "tests": [ "assert(editor.match(/val.imageLink/gi), 'You should have used the imageLink property to display the images.')" @@ -289,7 +289,7 @@ "Let's filter out the cat who's \"id\" key has a value of 1.", "Here's the code to do this:", "json = json.filter(function(val) {", - "  return(val.id !== 1);", + "  return(val.id !== 1);", "});" ], "tests": [ @@ -358,9 +358,9 @@ "By selecting allow you will see the text on the output phone change to your latitude and longitude", "Here's some code that does this:", "if (navigator.geolocation) {", - "  navigator.geolocation.getCurrentPosition(function(position) {", - "    $(\"#data\").html(\"latitude: \" + position.coords.latitude + \"<br>longitude: \" + position.coords.longitude);", - "  });", + "  navigator.geolocation.getCurrentPosition(function(position) {", + "    $(\"#data\").html(\"latitude: \" + position.coords.latitude + \"<br>longitude: \" + position.coords.longitude);", + "  });", "}" ], "tests": [ diff --git a/seed/challenges/object-oriented-and-functional-programming.json b/seed/challenges/object-oriented-and-functional-programming.json index 3be9cb4a20..810fc81323 100644 --- a/seed/challenges/object-oriented-and-functional-programming.json +++ b/seed/challenges/object-oriented-and-functional-programming.json @@ -54,9 +54,9 @@ "We are also able to create objects using constructor functions.", "Here's an example of a constructor function:", "var Car = function() {", - "  this.wheels = 4;", - "  this.engines = 1;", - "  this.seats = 1;", + "  this.wheels = 4;", + "  this.engines = 1;", + "  this.seats = 1;", "};", "Give your myMotorBike object a wheels, engines and seats attribute and set them to numbers.", "You may be confused by the this keyword here. Don't worry, we will get to that very soon." @@ -190,7 +190,7 @@ "description":[ "The map method is a convenient way to iterate through arrays. Here's an example usage:", "var timesFour = oldArray.map(function(val){", - "  return val * 4;", + "  return val * 4;", "});", "", "The map method will iterate through every element of the array, creating a new array with values that have been modified by the callback function, and return it.", @@ -228,7 +228,7 @@ "reduce has an optional second argument which can be used to set the initial value of the accumulator. If no initial value is specified it will be the first array element and currentVal will start with the second array element.", "Here is an example of reduce being used to subtract all the values of an array:", "var singleVal = array.reduce(function(previousVal, currentVal) {", - "  return previousVal - currentVal;", + "  return previousVal - currentVal;", "}, 0);", "Use the reduce method to sum all the values in array and assign it to singleVal." ], @@ -263,7 +263,7 @@ "The following code is an example of using filter to remove array elements that are not even numbers:", "Note: We omit the second and third arguments since we only need the value", "array = array.filter(function(val) {", - "  return val % 2 === 0;", + "  return val % 2 === 0;", "});", "Use filter to remove all elements from array that are greater than 5." ], @@ -296,7 +296,7 @@ "Here is an example of using sort with a compare function that will sort the elements from smallest to largest number:", "var array = [1, 12, 21, 2];", "array.sort(function(a, b) {", - "  return a - b;", + "  return a - b;", "});", "Use sort to sort array from largest to smallest." ],