start building the jquery playground bootstrap.json flow

challenges/bootstrap.json

@@ -6,7 +6,7 @@
       "id": "bad87fee1348bd9acde08812",
       "name": "Waypoint: Mobile Responsive Images",
       "dashedName": "waypoint-mobile-responsive-images",
-      "difficulty": 0.047,
+      "difficulty": 1,
       "description": [
         "Now let's go back to our Cat Photo App. This time, we'll style it using the popular Bootstrap responsive CSS framework. First, add a new image with the <code>src</code> attribute of \"http://bit.ly/fcc-kittens2\", and add the \"img-responsive\" Bootstrap class to that image.",
         "It would be great if the image could be exactly the width of our phone's screen.",
@@ -92,7 +92,7 @@
       "id": "bad87fee1348bd8acde08812",
       "name": "Waypoint: Center Text with Bootstrap",
       "dashedName": "waypoint-center-text-with-bootstrap",
-      "difficulty": 0.048,
+      "difficulty": 2,
       "description": [
         "Add Bootstrap's \"text-center\" class to your <code>h2</code> element.",
         "Now that we're using Bootstrap, we can center our heading elements to make them look better. All we need to do is add the class <code>text-center</code> to our <code>h1</code> and <code>h2</code> elements.",
@@ -174,7 +174,7 @@
       "id": "bad87fee1348cd8acdf08812",
       "name": "Waypoint: Create a Bootstrap Button",
       "dashedName": "waypoint-create-a-bootstrap-button",
-      "difficulty": 0.049,
+      "difficulty": 3,
       "description": [
         "Create a new <code>button</code> element below your large kitten photo. Give it the class \"btn\" and the text of \"like this photo\".",
         "Bootstrap has its own styles for <code>button</code> elements, which look much better than the plain HTML ones."
@@ -257,7 +257,7 @@
       "id": "bad87fee1348cd8acef08812",
       "name": "Waypoint: Create a Block Element Bootstrap Button",
       "dashedName": "waypoint-create-a-block-element-bootstrap-button",
-      "difficulty": 0.050,
+      "difficulty": 4,
       "description": [
         "Add Bootstrap's \"btn-block\" class to your Bootstrap button.",
         "Normally, your <code>button</code> elements are only as wide as the text that they contain. By making them block elements, your button will stretch to fill your page's entire horizontal space.",
@@ -344,7 +344,7 @@
       "id": "bad87fee1348cd8acef08811",
       "name": "Waypoint: Taste the Bootstrap Button Color Rainbow",
       "dashedName": "waypoint-taste-the-bootstrap-button-color-rainbow",
-      "difficulty": 0.051,
+      "difficulty": 5,
       "description": [
         "Add Bootstrap's \"btn-primary\" class to your button.",
         "The \"btn-primary\" class is the main color you'll use in your app. It is useful for highlighting actions you want your user to take.",
@@ -429,7 +429,7 @@
       "id": "bad87fee1348cd8acef08813",
       "name": "Waypoint: Call out Optional Actions with Button Info",
       "dashedName": "waypoint-call-out-optional-actions-with-button-info",
-      "difficulty": 0.052,
+      "difficulty": 6,
       "description": [
         "Create a new block-level Bootstrap button below your \"Like\" button with the text \"Info\", and add Bootstrap's \"btn-info\" and \"btn-block\" classes to it.",
         "Bootstrap comes with several pre-defined colors for buttons. The \"btn-info\" class is used to call attention to optional actions that the user can take.",
@@ -515,7 +515,7 @@
       "id": "bad87fee1348ce8acef08814",
       "name": "Waypoint: Warn your Users of a Dangerous Action",
       "dashedName": "waypoint-warn-your-users-of-a-dangerous-action",
-      "difficulty": 0.053,
+      "difficulty": 7,
       "description": [
         "Create a button with the text \"Delete\" and give it the class \"btn-danger\".",
         "Bootstrap comes with several pre-defined colors for buttons. The \"btn-danger\" class is the button color you'll use to notify users that the button performs a destructive action, such as deleting a cat photo.",
@@ -602,7 +602,7 @@
       "id": "bad88fee1348ce8acef08815",
       "name": "Waypoint: Use the Bootstrap Grid to Put Elements Side By Side",
       "dashedName": "waypoint-use-the-bootstrap-grid-to-put-elements-side-by-side",
-      "difficulty": 0.054,
+      "difficulty": 8,
       "description": [
         "Put the \"Like\", \"Info\" and \"Delete\" buttons side-by-side by wrapping all three of them within one <code>&#60;div class=\"row\"&#62;</code> element, then each of them within a <code>&#60;div class=\"col-xs-4\"&#62;</code> element.",
         "Bootstrap uses a responsive grid system, which makes it easy to put elements into rows and specify each element's relative width. Most of Bootstrap's classes can be applied to a <code>div</code> element.",
@@ -694,7 +694,7 @@
       "id": "bad87fee1348bd9aedf08845",
       "name": "Waypoint: Ditch Custom CSS for Bootstrap",
       "dashedName": "waypoint-ditch-custom-css-for-bootstrap",
-      "difficulty": 0.055,
+      "difficulty": 9,
       "description": [
         "Delete the \".red-text\", \"p\", and \".smaller-image\" CSS declarations from your <code>style</code> element so that the only declarations left in your <code>style</code> element are \"h2\" and \"thick-green-border\". Then Delete the <code>p</code> element that contains a dead link. Then remove the \"red-text\" class from your <code>h2</code> element and replace it with the \"text-primary\" Bootstrap class. Finally, remove the \"smaller-image\" class from your first <code>img</code> element and replace it with the <code>img-responsive</code> class.",
         "We can clean up our code and make our Cat Photo App look more conventional by using Bootstrap's built-in styles instead of the custom styles we created earlier.",
@@ -792,7 +792,7 @@
       "id": "bad87fee1348bd9aede08845",
       "name": "Waypoint: Create a Custom Heading",
       "dashedName": "waypoint-create-a-custom-heading",
-      "difficulty": 0.056,
+      "difficulty": 11,
       "description": [
         "Wrap your first image and your <code>h2</code> element within a single <code>&#60;div class='row'&#62;</code> element. Wrap your <code>h2</code> text within a <code>&#60;div class='col-xs-8'&#62;</code> and your image in a <code>&#60;div class='col-xs-4'&#62;</code> so that they are on the same line.",
         "We will make a simple heading for our Cat Photo App by putting them in the same row.",
@@ -879,7 +879,7 @@
       "id": "bad87fee1348bd9aedd08845",
       "name": "Waypoint: Add Font Awesome Icons to our Buttons",
       "dashedName": "waypoint-add-font-awesome-icons-to-our-buttons",
-      "difficulty": 0.057,
+      "difficulty": 12,
       "description": [
         "Use Font Awesome to add a \"thumbs-up\" icon to your like button by giving it a <code>i</code> element with the classes \"fa\" and \"fa-thumbs-up\".",
         "Font Awesome is a convenient library of icons. These icons are vector graphics, stored in the \".svg\" file format. These icons are treated just like fonts. You can specify their size using pixels, and they will assume the font size of their parent HTML elements.",
@@ -963,7 +963,7 @@
       "id": "bad87fee1348bd9aedc08845",
       "name": "Waypoint: Add Font Awesome Icons to all of our Buttons",
       "dashedName": "waypoint-add-font-awesome-icons-to-all-of-our-Buttons",
-      "difficulty": 0.058,
+      "difficulty": 13,
       "description": [
         "Use Font Awesome to add a \"info-circle\" icon to your info button and a \"trash\" icon to your delete button.",
         "Font Awesome is a convenient library of icons. These icons are vector graphics, stored in the \".svg\" file format. These icons are treated just like fonts. You can specify their size using pixels, and they will assume the font size of their parent HTML elements.",
@@ -1047,7 +1047,7 @@
       "id": "bad87fee1348bd9aedb08845",
       "name": "Waypoint: Responsively Style Radio Buttons",
       "dashedName": "waypoint-responsively-style-radio-buttons",
-      "difficulty": 0.059,
+      "difficulty": 14,
       "description": [
         "Wrap all of your radio buttons within a <code>&#60;div class='row'&#62;</code> element. Then wrap each of them within a <code>&#60;div class='col-xs-6'&#62;</code> element.",
         "You can use Bootstrap's \"col-xs-*\" classes on <code>form</code> elements, too! This way, our radio buttons will be evenly spread out across the page, regardless of how wide the screen resolution is."
@@ -1130,7 +1130,7 @@
       "id": "bad87fee1348bd9aeda08845",
       "name": "Waypoint: Responsively Style Checkboxes",
       "dashedName": "waypoint-responsively-style-checkboxes",
-      "difficulty": 0.060,
+      "difficulty": 15,
       "description": [
         "Wrap all your checkboxes in a <code>&#60;div class='row'&#62;</code> element. Then wrap each of them in a <code>&#60;div class='col-xs-4'&#62;</code> element.",
         "You can use Bootstrap's \"col-xs-*\" classes on <code>form</code> elements, too! This way, our checkboxes will be evenly spread out across the page, regardless of how wide the screen resolution is."
@@ -1220,7 +1220,7 @@
       "id": "bad87fee1348bd9aed908845",
       "name": "Waypoint: Style Text Inputs as Form Controls",
       "dashedName": "waypoint-style-text-inputs-as-form-controls",
-      "difficulty": 0.061,
+      "difficulty": 16,
       "description": [
         "Give your form's text input field a class of \"form-control\". Give your form's submit button the classes \"btn btn-primary\". Also give this button the Font Awesome icon of \"fa-paper-plane\".",
         "You can add the \"fa-paper-plane\" Font Awesome icon by adding <code>&#60;i class=\"fa fa-paper-plane\"&#62;&#60;/i&#62;</code> within your submit <code>button</code> element."
@@ -1319,7 +1319,7 @@
       "id": "bad87fee1348bd9aec908845",
       "name": "Waypoint: Line up Form Elements Responsively with Bootstrap",
       "dashedName": "waypoint-line-up-form-elements-responsively-with-bootstrap",
-      "difficulty": 0.062,
+      "difficulty": 17,
       "description": [
         "Now let's get your form <code>input</code> and your submission <code>button</code> on the same line. We'll do this the same way we have previously: by using a <code>div</code> element with the class \"row\", and other <code>div</code> elements within it using the \"col-xs-*\" class.",
         "Wrap both your form's text <code>input</code> and submit <code>button</code> within a <code>div</code> with the class \"row\". Wrap your form's text <code>input</code> within a div with the class of \"col-xs-7\". Wrap your form's submit <code>button</code> in a <code>div</code> with the class \"col-xs-5\".",
@@ -1414,6 +1414,410 @@
       "descriptionEs": [],
       "namePt": "",
       "descriptionPt": []
+    },
+    {
+      "id": "bad87fee1348bd9aec908846",
+      "name": "Waypoint: Build a jQuery Playground in Bootstrap",
+      "dashedName": "waypoint-line-up-form-elements-responsively-with-bootstrap",
+      "difficulty": 18,
+      "description": [
+      ],
+      "tests": [
+
+      ],
+      "challengeSeed": [
+        "",
+        "",
+        ""
+      ],
+      "challengeType": 0,
+      "nameCn": "",
+      "descriptionCn": [],
+      "nameFr": "",
+      "descriptionFr": [],
+      "nameRu": "",
+      "descriptionRu": [],
+      "nameEs": "",
+      "descriptionEs": [],
+      "namePt": "",
+      "descriptionPt": []
+    },
+    {
+      "id": "bad87fee1348bd9aec908847",
+      "name": "Waypoint: Build a jQuery Playground in Bootstrap",
+      "dashedName": "waypoint-line-up-form-elements-responsively-with-bootstrap",
+      "difficulty": 19,
+      "description": [
+      ],
+      "tests": [
+
+      ],
+      "challengeSeed": [
+        "<div class='row'>",
+        "</div>"
+      ],
+      "challengeType": 0,
+      "nameCn": "",
+      "descriptionCn": [],
+      "nameFr": "",
+      "descriptionFr": [],
+      "nameRu": "",
+      "descriptionRu": [],
+      "nameEs": "",
+      "descriptionEs": [],
+      "namePt": "",
+      "descriptionPt": []
+    },
+    {
+      "id": "bad87fee1348bd9aec908848",
+      "name": "Waypoint: Build a jQuery Playground in Bootstrap",
+      "dashedName": "waypoint-line-up-form-elements-responsively-with-bootstrap",
+      "difficulty": 20,
+      "description": [
+      ],
+      "tests": [
+
+      ],
+      "challengeSeed": [
+        "<div class='row'>",
+        "  <div class='col-xs-6'>",
+        "  </div>",
+        "  <div class='col-xs-6'>",
+        "  </div>",
+        "</div>"
+      ],
+      "challengeType": 0,
+      "nameCn": "",
+      "descriptionCn": [],
+      "nameFr": "",
+      "descriptionFr": [],
+      "nameRu": "",
+      "descriptionRu": [],
+      "nameEs": "",
+      "descriptionEs": [],
+      "namePt": "",
+      "descriptionPt": []
+    },
+    {
+      "id": "bad87fee1348bd9aec908849",
+      "name": "Waypoint: Build a jQuery Playground in Bootstrap",
+      "dashedName": "waypoint-line-up-form-elements-responsively-with-bootstrap",
+      "difficulty": 21,
+      "description": [
+      ],
+      "tests": [
+
+      ],
+      "challengeSeed": [
+        "<div class='row'>",
+        "  <div class='col-xs-6'>",
+        "    <div class='well'>",
+        "    </div>",
+        "  </div>",
+        "  <div class='col-xs-6'>",
+        "    <div class='well'>",
+        "    </div>",
+        "  </div>",
+        "</div>"
+      ],
+      "challengeType": 0,
+      "nameCn": "",
+      "descriptionCn": [],
+      "nameFr": "",
+      "descriptionFr": [],
+      "nameRu": "",
+      "descriptionRu": [],
+      "nameEs": "",
+      "descriptionEs": [],
+      "namePt": "",
+      "descriptionPt": []
+    },
+    {
+      "id": "bad87fee1348bd9aec908850",
+      "name": "Waypoint: Build a jQuery Playground in Bootstrap",
+      "dashedName": "waypoint-line-up-form-elements-responsively-with-bootstrap",
+      "difficulty": 22,
+      "description": [
+      ],
+      "tests": [
+
+      ],
+      "challengeSeed": [
+        "<div class='row'>",
+        "  <div class='col-xs-6'>",
+        "    <div class='well'>",
+        "      <button></button>",
+        "      <button></button>",
+        "      <button></button>",
+        "    </div>",
+        "  </div>",
+        "  <div class='col-xs-6'>",
+        "    <div class='well'>",
+        "      <button></button>",
+        "      <button></button>",
+        "      <button></button>",
+        "    </div>",
+        "  </div>",
+        "</div>"
+      ],
+      "challengeType": 0,
+      "nameCn": "",
+      "descriptionCn": [],
+      "nameFr": "",
+      "descriptionFr": [],
+      "nameRu": "",
+      "descriptionRu": [],
+      "nameEs": "",
+      "descriptionEs": [],
+      "namePt": "",
+      "descriptionPt": []
+    },
+    {
+      "id": "bad87fee1348bd9aec908852",
+      "name": "Waypoint: Build a jQuery Playground in Bootstrap",
+      "dashedName": "waypoint-line-up-form-elements-responsively-with-bootstrap",
+      "difficulty": 23,
+      "description": [
+      ],
+      "tests": [
+
+      ],
+      "challengeSeed": [
+        "<div class='row'>",
+        "  <div class='col-xs-6'>",
+        "    <div class='well'>",
+        "      <button class='btn btn-default'></button>",
+        "      <button class='btn btn-default'></button>",
+        "      <button class='btn btn-default'></button>",
+        "    </div>",
+        "  </div>",
+        "  <div class='col-xs-6'>",
+        "    <div class='well'>",
+        "      <button class='btn btn-default'></button>",
+        "      <button class='btn btn-default'></button>",
+        "      <button class='btn btn-default'></button>",
+        "    </div>",
+        "  </div>",
+        "</div>"
+      ],
+      "challengeType": 0,
+      "nameCn": "",
+      "descriptionCn": [],
+      "nameFr": "",
+      "descriptionFr": [],
+      "nameRu": "",
+      "descriptionRu": [],
+      "nameEs": "",
+      "descriptionEs": [],
+      "namePt": "",
+      "descriptionPt": []
+    },
+    {
+      "id": "bad87fee1348bd9aec908853",
+      "name": "Waypoint: Build a jQuery Playground in Bootstrap",
+      "dashedName": "waypoint-line-up-form-elements-responsively-with-bootstrap",
+      "difficulty": 24,
+      "description": [
+      ],
+      "tests": [
+
+      ],
+      "challengeSeed": [
+        "<div class='row'>",
+        "  <div class='col-xs-6'>",
+        "    <div class='well'>",
+        "      <button class='btn btn-default target'></button>",
+        "      <button class='btn btn-default target'></button>",
+        "      <button class='btn btn-default target'></button>",
+        "    </div>",
+        "  </div>",
+        "  <div class='col-xs-6'>",
+        "    <div class='well'>",
+        "      <button class='btn btn-default target'></button>",
+        "      <button class='btn btn-default target'></button>",
+        "      <button class='btn btn-default target'></button>",
+        "    </div>",
+        "  </div>",
+        "</div>"
+      ],
+      "challengeType": 0,
+      "nameCn": "",
+      "descriptionCn": [],
+      "nameFr": "",
+      "descriptionFr": [],
+      "nameRu": "",
+      "descriptionRu": [],
+      "nameEs": "",
+      "descriptionEs": [],
+      "namePt": "",
+      "descriptionPt": []
+    },
+    {
+      "id": "bad87fee1348bd9aec908854",
+      "name": "Waypoint: Build a jQuery Playground in Bootstrap",
+      "dashedName": "waypoint-line-up-form-elements-responsively-with-bootstrap",
+      "difficulty": 25,
+      "description": [
+      ],
+      "tests": [
+
+      ],
+      "challengeSeed": [
+        "<div class='row'>",
+        "  <div class='col-xs-6'>",
+        "    <div class='well' id='left-well'>",
+        "      <button class='btn btn-default target'></button>",
+        "      <button class='btn btn-default target'></button>",
+        "      <button class='btn btn-default target'></button>",
+        "    </div>",
+        "  </div>",
+        "  <div class='col-xs-6'>",
+        "    <div class='well' id='right-well'>",
+        "      <button class='btn btn-default target'></button>",
+        "      <button class='btn btn-default target'></button>",
+        "      <button class='btn btn-default target'></button>",
+        "    </div>",
+        "  </div>",
+        "</div>"
+      ],
+      "challengeType": 0,
+      "nameCn": "",
+      "descriptionCn": [],
+      "nameFr": "",
+      "descriptionFr": [],
+      "nameRu": "",
+      "descriptionRu": [],
+      "nameEs": "",
+      "descriptionEs": [],
+      "namePt": "",
+      "descriptionPt": []
+    },
+    {
+      "id": "bad87fee1348bd9aec908855",
+      "name": "Waypoint: Build a jQuery Playground in Bootstrap",
+      "dashedName": "waypoint-line-up-form-elements-responsively-with-bootstrap",
+      "difficulty": 26,
+      "description": [
+      ],
+      "tests": [
+
+      ],
+      "challengeSeed": [
+        "<div class='row'>",
+        "  <div class='col-xs-6'>",
+        "    <h4>#left-well</h4>",
+        "    <div class='well' id='left-well'>",
+        "      <button class='btn btn-default target'></button>",
+        "      <button class='btn btn-default target'></button>",
+        "      <button class='btn btn-default target'></button>",
+        "    </div>",
+        "  </div>",
+        "  <div class='col-xs-6'>",
+        "    <h4>#right-well</h4>",
+        "    <div class='well' id='right-well'>",
+        "      <button class='btn btn-default target'></button>",
+        "      <button class='btn btn-default target'></button>",
+        "      <button class='btn btn-default target'></button>",
+        "    </div>",
+        "  </div>",
+        "</div>"
+      ],
+      "challengeType": 0,
+      "nameCn": "",
+      "descriptionCn": [],
+      "nameFr": "",
+      "descriptionFr": [],
+      "nameRu": "",
+      "descriptionRu": [],
+      "nameEs": "",
+      "descriptionEs": [],
+      "namePt": "",
+      "descriptionPt": []
+    },
+    {
+      "id": "bad87fee1348bd9aec908856",
+      "name": "Waypoint: Build a jQuery Playground in Bootstrap",
+      "dashedName": "waypoint-line-up-form-elements-responsively-with-bootstrap",
+      "difficulty": 27,
+      "description": [
+      ],
+      "tests": [
+
+      ],
+      "challengeSeed": [
+        "<div class='row'>",
+        "  <div class='col-xs-6'>",
+        "    <h4>#left-well</h4>",
+        "    <div class='well' id='left-well'>",
+        "      <button class='btn btn-default target' id='target1'></button>",
+        "      <button class='btn btn-default target' id='target2'></button>",
+        "      <button class='btn btn-default target' id='target3'></button>",
+        "    </div>",
+        "  </div>",
+        "  <div class='col-xs-6'>",
+        "    <h4>#right-well</h4>",
+        "    <div class='well' id='right-well'>",
+        "      <button class='btn btn-default target' id='target4'></button>",
+        "      <button class='btn btn-default target' id='target5'></button>",
+        "      <button class='btn btn-default target' id='target6'></button>",
+        "    </div>",
+        "  </div>",
+        "</div>"
+      ],
+      "challengeType": 0,
+      "nameCn": "",
+      "descriptionCn": [],
+      "nameFr": "",
+      "descriptionFr": [],
+      "nameRu": "",
+      "descriptionRu": [],
+      "nameEs": "",
+      "descriptionEs": [],
+      "namePt": "",
+      "descriptionPt": []
+    },
+    {
+      "id": "bad87fee1348bd9aec908857",
+      "name": "Waypoint: Build a jQuery Playground in Bootstrap",
+      "dashedName": "waypoint-line-up-form-elements-responsively-with-bootstrap",
+      "difficulty": 28,
+      "description": [
+        "add <!-- You shouldn't need to modify code below this line -->"
+      ],
+      "tests": [
+
+      ],
+      "challengeSeed": [
+        "<div class='row'>",
+        "  <div class='col-xs-6'>",
+        "    <h4>#left-well</h4>",
+        "    <div class='well' id='left-well'>",
+        "      <button class='btn btn-default target' id='target1'>#target1</button>",
+        "      <button class='btn btn-default target' id='target2'>#target2</button>",
+        "      <button class='btn btn-default target' id='target3'>#target3</button>",
+        "    </div>",
+        "  </div>",
+        "  <div class='col-xs-6'>",
+        "    <h4>#right-well</h4>",
+        "    <div class='well' id='right-well'>",
+        "      <button class='btn btn-default target' id='target4'>#target4</button>",
+        "      <button class='btn btn-default target' id='target5'>#target5</button>",
+        "      <button class='btn btn-default target' id='target6'>#target6</button>",
+        "    </div>",
+        "  </div>",
+        "</div>"
+      ],
+      "challengeType": 0,
+      "nameCn": "",
+      "descriptionCn": [],
+      "nameFr": "",
+      "descriptionFr": [],
+      "nameRu": "",
+      "descriptionRu": [],
+      "nameEs": "",
+      "descriptionEs": [],
+      "namePt": "",
+      "descriptionPt": []
     }
   ]
 }