@ -16,7 +16,6 @@
|
||||
"strict": false, // Require `use strict` pragma in every file.
|
||||
"trailing": true, // Prohibit trailing whitespaces.
|
||||
"smarttabs": false, // Suppresses warnings about mixed tabs and spaces
|
||||
"esnext": true, // Allow ES6 maybe :p
|
||||
"globals": { // Globals variables.
|
||||
"jasmine": true,
|
||||
"angular": true,
|
||||
|
@ -2,7 +2,8 @@ window.common = (function(global) {
|
||||
const {
|
||||
$,
|
||||
Rx: { Observable },
|
||||
common = { init: [] }
|
||||
common = { init: [] },
|
||||
Mousetrap
|
||||
} = global;
|
||||
|
||||
common.ctrlEnterClickHandler = function ctrlEnterClickHandler(e) {
|
||||
@ -42,6 +43,11 @@ window.common = (function(global) {
|
||||
);
|
||||
});
|
||||
|
||||
// set focus keybind
|
||||
Mousetrap.bind(['command+shift+e', 'ctrl+shift+e'], () => {
|
||||
common.editor.focus();
|
||||
});
|
||||
|
||||
// video checklist binding
|
||||
$('.challenge-list-checkbox').on('change', function() {
|
||||
var checkboxId = $(this).parent().parent().attr('id');
|
||||
|
@ -28,7 +28,7 @@ window.common = (function(global) {
|
||||
seedData = Array.isArray(seedData) ? seedData : [seedData];
|
||||
return seedData.reduce(function(seed, line) {
|
||||
return '' + seed + line + '\n';
|
||||
}, '');
|
||||
}, '\n');
|
||||
};
|
||||
|
||||
common.seed = common.arrayToNewLineString(common.challengeSeed);
|
||||
|
@ -499,6 +499,22 @@ thead {
|
||||
}
|
||||
}
|
||||
|
||||
a[href="/email-signup"], a[href="/email-signin"] {
|
||||
&.btn-social.btn-lg > :first-child {
|
||||
line-height:43px;
|
||||
font-size:26px;
|
||||
}
|
||||
}
|
||||
|
||||
form.email-update .btn{
|
||||
margin:0;
|
||||
width:40%;
|
||||
display:inline-block;
|
||||
&:last-child {
|
||||
float:right;
|
||||
}
|
||||
}
|
||||
|
||||
.public-profile-img {
|
||||
height: 200px;
|
||||
width: 200px;
|
||||
|
@ -306,6 +306,48 @@ module.exports = function(User) {
|
||||
}
|
||||
);
|
||||
|
||||
User.prototype.updateEmail = function updateEmail(email) {
|
||||
if (this.email && this.email === email) {
|
||||
return Promise.reject(new Error(
|
||||
`${email} is already associated with this account.`
|
||||
));
|
||||
}
|
||||
return User.doesExist(null, email)
|
||||
.then(exists => {
|
||||
if (exists) {
|
||||
return Promise.reject(
|
||||
new Error(`${email} is already associated with another account.`)
|
||||
);
|
||||
}
|
||||
return this.update$({ email }).toPromise();
|
||||
});
|
||||
};
|
||||
|
||||
User.remoteMethod(
|
||||
'updateEmail',
|
||||
{
|
||||
isStatic: false,
|
||||
description: 'updates the email of the user object',
|
||||
accepts: [
|
||||
{
|
||||
arg: 'email',
|
||||
type: 'string',
|
||||
required: true
|
||||
}
|
||||
],
|
||||
returns: [
|
||||
{
|
||||
arg: 'status',
|
||||
type: 'object'
|
||||
}
|
||||
],
|
||||
http: {
|
||||
path: '/update-email',
|
||||
verb: 'POST'
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
User.giveBrowniePoints =
|
||||
function giveBrowniePoints(receiver, giver, data = {}, dev = false, cb) {
|
||||
const findUser = observeMethod(User, 'findOne');
|
||||
|
@ -235,6 +235,13 @@
|
||||
"principalId": "$everyone",
|
||||
"permission": "ALLOW",
|
||||
"property": "giveBrowniePoints"
|
||||
},
|
||||
{
|
||||
"accessType": "EXECUTE",
|
||||
"principalType": "ROLE",
|
||||
"principalId": "$owner",
|
||||
"permission": "ALLOW",
|
||||
"property": "updateEmail"
|
||||
}
|
||||
],
|
||||
"methods": []
|
||||
|
@ -43,6 +43,7 @@
|
||||
"compression": "^1.6.0",
|
||||
"connect-mongo": "~1.1.0",
|
||||
"cookie-parser": "^1.4.0",
|
||||
"csurf": "^1.8.3",
|
||||
"debug": "^2.2.0",
|
||||
"dedent": "~0.6.0",
|
||||
"dotenv": "^2.0.0",
|
||||
|
@ -43,7 +43,7 @@ var links = {
|
||||
|
||||
// ======== STRING METHODS
|
||||
"String.charAt()": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/charAt",
|
||||
"String.charCodeAt()": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/charCodeAt",
|
||||
"String.prototype.charCodeAt()": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/charCodeAt",
|
||||
"String.concat()": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/concat",
|
||||
"String.indexOf()": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/indexOf",
|
||||
"String.fromCharCode()": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/fromCharCode",
|
||||
|
@ -148,7 +148,7 @@
|
||||
"assert.isString(checkCashRegister(19.50, 20.00, [[\"PENNY\", 0.01], [\"NICKEL\", 0], [\"DIME\", 0], [\"QUARTER\", 0], [\"ONE\", 0], [\"FIVE\", 0], [\"TEN\", 0], [\"TWENTY\", 0], [\"ONE HUNDRED\", 0]]), 'message: <code>checkCashRegister(19.50, 20.00, [[\"PENNY\", 0.01], [\"NICKEL\", 0], [\"DIME\", 0], [\"QUARTER\", 0], [\"ONE\", 0], [\"FIVE\", 0], [\"TEN\", 0], [\"TWENTY\", 0], [\"ONE HUNDRED\", 0]])</code> should return a string.');",
|
||||
"assert.isString(checkCashRegister(19.50, 20.00, [[\"PENNY\", 0.50], [\"NICKEL\", 0], [\"DIME\", 0], [\"QUARTER\", 0], [\"ONE\", 0], [\"FIVE\", 0], [\"TEN\", 0], [\"TWENTY\", 0], [\"ONE HUNDRED\", 0]]), 'message: <code>checkCashRegister(19.50, 20.00, [[\"PENNY\", 0.50], [\"NICKEL\", 0], [\"DIME\", 0], [\"QUARTER\", 0], [\"ONE\", 0], [\"FIVE\", 0], [\"TEN\", 0], [\"TWENTY\", 0], [\"ONE HUNDRED\", 0]])</code> should return a string.');",
|
||||
"assert.deepEqual(checkCashRegister(19.50, 20.00, [[\"PENNY\", 1.01], [\"NICKEL\", 2.05], [\"DIME\", 3.10], [\"QUARTER\", 4.25], [\"ONE\", 90.00], [\"FIVE\", 55.00], [\"TEN\", 20.00], [\"TWENTY\", 60.00], [\"ONE HUNDRED\", 100.00]]), [[\"QUARTER\", 0.50]], 'message: <code>checkCashRegister(19.50, 20.00, [[\"PENNY\", 1.01], [\"NICKEL\", 2.05], [\"DIME\", 3.10], [\"QUARTER\", 4.25], [\"ONE\", 90.00], [\"FIVE\", 55.00], [\"TEN\", 20.00], [\"TWENTY\", 60.00], [\"ONE HUNDRED\", 100.00]])</code> should return <code>[[\"QUARTER\", 0.50]]</code>.');",
|
||||
"assert.deepEqual(checkCashRegister(3.26, 100.00, [[\"PENNY\", 1.01], [\"NICKEL\", 2.05], [\"DIME\", 3.10], [\"QUARTER\", 4.25], [\"ONE\", 90.00], [\"FIVE\", 55.00], [\"TEN\", 20.00], [\"TWENTY\", 60.00], [\"ONE HUNDRED\", 100.00]]), [[\"TWENTY\", 60.00], [\"TEN\", 20.00], [\"FIVE\", 15], [\"ONE\", 1], [\"QUARTER\", 0.50], [\"DIME\", 0.20], [\"PENNY\", 0.04]], 'message: <code>checkCashRegister(3.26, 100.00, [[\"PENNY\", 1.01], [\"NICKEL\", 2.05], [\"DIME\", 3.10], [\"QUARTER\", 4.25], [\"ONE\", 90.00], [\"FIVE\", 55.00], [\"TEN\", 20.00], [\"TWENTY\", 60.00], [\"ONE HUNDRED\", 100.00]])</code> should return <code>[[\"TWENTY\", 60.00], [\"TEN\", 20.00], [\"FIVE\", 15], [\"ONE\", 1], [\"QUARTER\", 0.50], [\"DIME\", 0.20], [\"PENNY\", 0.04]]</code>.');",
|
||||
"assert.deepEqual(checkCashRegister(3.26, 100.00, [[\"PENNY\", 1.01], [\"NICKEL\", 2.05], [\"DIME\", 3.10], [\"QUARTER\", 4.25], [\"ONE\", 90.00], [\"FIVE\", 55.00], [\"TEN\", 20.00], [\"TWENTY\", 60.00], [\"ONE HUNDRED\", 100.00]]), [[\"TWENTY\", 60.00], [\"TEN\", 20.00], [\"FIVE\", 15.00], [\"ONE\", 1.00], [\"QUARTER\", 0.50], [\"DIME\", 0.20], [\"PENNY\", 0.04]], 'message: <code>checkCashRegister(3.26, 100.00, [[\"PENNY\", 1.01], [\"NICKEL\", 2.05], [\"DIME\", 3.10], [\"QUARTER\", 4.25], [\"ONE\", 90.00], [\"FIVE\", 55.00], [\"TEN\", 20.00], [\"TWENTY\", 60.00], [\"ONE HUNDRED\", 100.00]])</code> should return <code>[[\"TWENTY\", 60.00], [\"TEN\", 20.00], [\"FIVE\", 15.00], [\"ONE\", 1.00], [\"QUARTER\", 0.50], [\"DIME\", 0.20], [\"PENNY\", 0.04]]</code>.');",
|
||||
"assert.deepEqual(checkCashRegister(19.50, 20.00, [[\"PENNY\", 0.01], [\"NICKEL\", 0], [\"DIME\", 0], [\"QUARTER\", 0], [\"ONE\", 0], [\"FIVE\", 0], [\"TEN\", 0], [\"TWENTY\", 0], [\"ONE HUNDRED\", 0]]), \"Insufficient Funds\", 'message: <code>checkCashRegister(19.50, 20.00, [[\"PENNY\", 0.01], [\"NICKEL\", 0], [\"DIME\", 0], [\"QUARTER\", 0], [\"ONE\", 0], [\"FIVE\", 0], [\"TEN\", 0], [\"TWENTY\", 0], [\"ONE HUNDRED\", 0]])</code> should return \"Insufficient Funds\".');",
|
||||
"assert.deepEqual(checkCashRegister(19.50, 20.00, [[\"PENNY\", 0.01], [\"NICKEL\", 0], [\"DIME\", 0], [\"QUARTER\", 0], [\"ONE\", 1.00], [\"FIVE\", 0], [\"TEN\", 0], [\"TWENTY\", 0], [\"ONE HUNDRED\", 0]]), \"Insufficient Funds\", 'message: <code>checkCashRegister(19.50, 20.00, [[\"PENNY\", 0.01], [\"NICKEL\", 0], [\"DIME\", 0], [\"QUARTER\", 0], [\"ONE\", 1.00], [\"FIVE\", 0], [\"TEN\", 0], [\"TWENTY\", 0], [\"ONE HUNDRED\", 0]])</code> should return \"Insufficient Funds\".');",
|
||||
"assert.deepEqual(checkCashRegister(19.50, 20.00, [[\"PENNY\", 0.50], [\"NICKEL\", 0], [\"DIME\", 0], [\"QUARTER\", 0], [\"ONE\", 0], [\"FIVE\", 0], [\"TEN\", 0], [\"TWENTY\", 0], [\"ONE HUNDRED\", 0]]), \"Closed\", 'message: <code>checkCashRegister(19.50, 20.00, [[\"PENNY\", 0.50], [\"NICKEL\", 0], [\"DIME\", 0], [\"QUARTER\", 0], [\"ONE\", 0], [\"FIVE\", 0], [\"TEN\", 0], [\"TWENTY\", 0], [\"ONE HUNDRED\", 0]])</code> should return \"Closed\".');"
|
||||
@ -244,7 +244,10 @@
|
||||
"assert.strictEqual(permAlone('aabb'), 8, 'message: <code>permAlone(\"aabb\")</code> should return 8.');",
|
||||
"assert.strictEqual(permAlone('abcdefa'), 3600, 'message: <code>permAlone(\"abcdefa\")</code> should return 3600.');",
|
||||
"assert.strictEqual(permAlone('abfdefa'), 2640, 'message: <code>permAlone(\"abfdefa\")</code> should return 2640.');",
|
||||
"assert.strictEqual(permAlone('zzzzzzzz'), 0, 'message: <code>permAlone(\"zzzzzzzz\")</code> should return 0.');"
|
||||
"assert.strictEqual(permAlone('zzzzzzzz'), 0, 'message: <code>permAlone(\"zzzzzzzz\")</code> should return 0.');",
|
||||
"assert.strictEqual(permAlone('a'), 1, 'message: <code>permAlone(\"a\")</code> should return 1.');",
|
||||
"assert.strictEqual(permAlone('aaab'), 0, 'message: <code>permAlone(\"aaab\")</code> should return 0.');",
|
||||
"assert.strictEqual(permAlone('aaabb'), 12, 'message: <code>permAlone(\"aaabb\")</code> should return 12.');"
|
||||
],
|
||||
"type": "bonfire",
|
||||
"MDNlinks": [
|
||||
@ -368,7 +371,7 @@
|
||||
"The array will contain objects in the format <code>{name: 'name', avgAlt: avgAlt}</code>.",
|
||||
"You can read about orbital periods <a href=\"http://en.wikipedia.org/wiki/Orbital_period\" target='_blank'>on wikipedia</a>.",
|
||||
"The values should be rounded to the nearest whole number. The body being orbited is Earth.",
|
||||
"The radius of the earth is 6367.4447 kilometers, and the GM value of earth is 398600.4418",
|
||||
"The radius of the earth is 6367.4447 kilometers, and the GM value of earth is 398600.4418 km<sup>3</sup>s<sup>-2</sup>.",
|
||||
"Remember to use <a href='//github.com/FreeCodeCamp/freecodecamp/wiki/How-to-get-help-when-you-get-stuck' target='_blank'>Read-Search-Ask</a> if you get stuck. Try to pair program. Write your own code."
|
||||
],
|
||||
"challengeSeed": [
|
||||
@ -398,7 +401,7 @@
|
||||
"El arreglo debe contener objetos en el formato <code>{name: 'name', avgAlt: avgAlt}</code>.",
|
||||
"Puedes leer acerca de períodos orbitales <a href=\"http://en.wikipedia.org/wiki/Orbital_period\" target='_blank'>en wikipedia</a>.",
|
||||
"Los valores deben estar redondeados al número entero más próximo. El cuerpo orbitado es la Tierra",
|
||||
"El radio de la Tierra es 6367.4447 kilómetros, y el valor GM del planeta es de 398600.4418",
|
||||
"El radio de la Tierra es 6367.4447 kilómetros, y el valor GM del planeta es de 398600.4418 km<sup>3</sup>s<sup>-2</sup>.",
|
||||
"Recuerda utilizar <a href='//github.com/FreeCodeCamp/freecodecamp/wiki/How-to-get-help-when-you-get-stuck' target='_blank'>Read-Search-Ask</a> si te sientes atascado. Intenta programar en pareja. Escribe tu propio código."
|
||||
]
|
||||
},
|
||||
|
@ -542,7 +542,8 @@
|
||||
"assert(mutation([\"Mary\", \"Aarmy\"]) === true, 'message: <code>mutation([\"Mary\", \"Aarmy\"])</code> should return true.');",
|
||||
"assert(mutation([\"Alien\", \"line\"]) === true, 'message: <code>mutation([\"Alien\", \"line\"])</code> should return true.');",
|
||||
"assert(mutation([\"floor\", \"for\"]) === true, 'message: <code>mutation([\"floor\", \"for\"])</code> should return true.');",
|
||||
"assert(mutation([\"hello\", \"neo\"]) === false, 'message: <code>mutation([\"hello\", \"neo\"])</code> should return false.');"
|
||||
"assert(mutation([\"hello\", \"neo\"]) === false, 'message: <code>mutation([\"hello\", \"neo\"])</code> should return false.');",
|
||||
"assert(mutation([\"voodoo\", \"no\"]) === false, 'message: <code>mutation([\"voodoo\", \"no\"])</code> should return false.');"
|
||||
],
|
||||
"type": "bonfire",
|
||||
"isRequired": true,
|
||||
@ -715,7 +716,7 @@
|
||||
],
|
||||
"type": "bonfire",
|
||||
"MDNlinks": [
|
||||
"String.charCodeAt()",
|
||||
"String.prototype.charCodeAt()",
|
||||
"String.fromCharCode()"
|
||||
],
|
||||
"challengeType": 5,
|
||||
|
@ -46,7 +46,7 @@
|
||||
"id": "bd7123c9c443eddfaeb5bdef",
|
||||
"title": "Declare JavaScript Variables",
|
||||
"description": [
|
||||
"In computer science, <dfn>data</dfn> is anything that is meaningful to the computer. JavaScript provides seven different <dfn>data types</dfn> which are <code>undefined</code>, <code>null</code>, <code>Boolean</code>, <code>string</code>, <code>symbol</code>, <code>number</code>, and <code>object</code>.",
|
||||
"In computer science, <dfn>data</dfn> is anything that is meaningful to the computer. JavaScript provides seven different <dfn>data types</dfn> which are <code>Undefined</code>, <code>Null</code>, <code>Boolean</code>, <code>String</code>, <code>Symbol</code>, <code>Number</code>, and <code>Object</code>.",
|
||||
"For example, computers distinguish between numbers, such as the number <code>12</code>, and <code>strings</code>, such as <code>\"12\"</code>, <code>\"dog\"</code>, or <code>\"123 cats\"</code>, which are collections of characters. Computers can perform mathematical operations on a number, but not on a string.",
|
||||
"<dfn>Variables</dfn> allow computers to store and manipulate data in a dynamic fashion. They do this by using a \"label\" to point to the data rather than using the data itself. Any of the seven data types may be stored in a variable.",
|
||||
"<code>Variables</code> are similar to the x and y variables you use in mathematics, which means they're a simple name to represent the data we want to refer to. Computer <code>variables</code> differ from mathematical variables in that they can store different values at different times.",
|
||||
@ -433,7 +433,8 @@
|
||||
"<code>i = i + 1;</code>",
|
||||
"<strong>Note</strong><br>The entire line becomes <code>i++;</code>, eliminating the need for the equal sign.",
|
||||
"<h4>Instructions</h4>",
|
||||
"Change the code to use the <code>++</code> operator on <code>myVar</code>."
|
||||
"Change the code to use the <code>++</code> operator on <code>myVar</code>.",
|
||||
"<strong>Hint</strong><br>Learn more about <a href=\"https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators#Increment_()\" target=\"_blank\">Arithmetic operators - Increment (++)</a>."
|
||||
],
|
||||
"releasedOn": "January 1, 2016",
|
||||
"challengeSeed": [
|
||||
@ -971,7 +972,7 @@
|
||||
],
|
||||
"tests": [
|
||||
"assert(code.match(/\\\\\"/g).length === 4 && code.match(/[^\\\\]\"/g).length === 2, 'message: You should use two double quotes (<code>"</code>) and four escaped double quotes (<code>\"</code>) ');",
|
||||
"assert(myStr === \"I am a \\\"double quoted\\\" string inside \\\"double quotes\\\"\", 'message: Variable myStr should equal to (<code>\"I am a \"double quoted\" string inside \"double quotes\"\"</code>).');"
|
||||
"assert(myStr === \"I am a \\\"double quoted\\\" string inside \\\"double quotes\\\"\", 'message: Variable myStr should equal to (<code>I am a \"double quoted\" string inside \"double quotes\"</code>).');"
|
||||
],
|
||||
"type": "waypoint",
|
||||
"challengeType": 1,
|
||||
@ -2733,7 +2734,7 @@
|
||||
"assert(testStrict(10) === \"Not Equal\", 'message: <code>testStrict(10)</code> should return \"Not Equal\"');",
|
||||
"assert(testStrict(7) === \"Equal\", 'message: <code>testStrict(7)</code> should return \"Equal\"');",
|
||||
"assert(testStrict(\"7\") === \"Not Equal\", 'message: <code>testStrict(\"7\")</code> should return \"Not Equal\"');",
|
||||
"assert(code.match(/val\\s*===\\s*\\d+/g).length > 0, 'message: You should use the <code>===</code> operator');"
|
||||
"assert(code.match(/(val\\s*===\\s*\\d+)|(\\d+\\s*===\\s*val)/g).length > 0, 'message: You should use the <code>===</code> operator');"
|
||||
],
|
||||
"type": "waypoint",
|
||||
"challengeType": 1,
|
||||
@ -3507,11 +3508,11 @@
|
||||
"function switchOfStuff(val) {\n var answer = \"\";\n\n switch(val) {\n case \"a\":\n answer = \"apple\";\n break;\n case \"b\":\n answer = \"bird\";\n break;\n case \"c\":\n answer = \"cat\";\n break;\n default:\n answer = \"stuff\";\n }\n return answer; \n}"
|
||||
],
|
||||
"tests": [
|
||||
"assert(switchOfStuff(\"a\") === \"apple\", 'message: <code>switchOfStuff(\"a\") should have a value of \"apple\"');",
|
||||
"assert(switchOfStuff(\"b\") === \"bird\", 'message: <code>switchOfStuff(\"b\") should have a value of \"bird\"');",
|
||||
"assert(switchOfStuff(\"c\") === \"cat\", 'message: <code>switchOfStuff(\"c\") should have a value of \"cat\"');",
|
||||
"assert(switchOfStuff(\"d\") === \"stuff\", 'message: <code>switchOfStuff(\"d\") should have a value of \"stuff\"');",
|
||||
"assert(switchOfStuff(4) === \"stuff\", 'message: <code>switchOfStuff(4) should have a value of \"stuff\"');",
|
||||
"assert(switchOfStuff(\"a\") === \"apple\", 'message: <code>switchOfStuff(\"a\")</code> should have a value of \"apple\"');",
|
||||
"assert(switchOfStuff(\"b\") === \"bird\", 'message: <code>switchOfStuff(\"b\")</code> should have a value of \"bird\"');",
|
||||
"assert(switchOfStuff(\"c\") === \"cat\", 'message: <code>switchOfStuff(\"c\")</code> should have a value of \"cat\"');",
|
||||
"assert(switchOfStuff(\"d\") === \"stuff\", 'message: <code>switchOfStuff(\"d\")</code> should have a value of \"stuff\"');",
|
||||
"assert(switchOfStuff(4) === \"stuff\", 'message: <code>switchOfStuff(4)</code> should have a value of \"stuff\"');",
|
||||
"assert(!/else/g.test(code) || !/if/g.test(code), 'message: You should not use any <code>if</code> or <code>else</code> statements');",
|
||||
"assert(code.match(/break/g).length > 2, 'message: You should have at least 3 <code>break</code> statements');"
|
||||
],
|
||||
|
@ -180,7 +180,7 @@
|
||||
"<strong>Objective:</strong> Build a <a href='https://codepen.io' target='_blank'>CodePen.io</a> app that is functionally similar to this: <a href='https://codepen.io/FreeCodeCamp/full/YqLyXB/' target='_blank'>https://codepen.io/FreeCodeCamp/full/YqLyXB/</a>.",
|
||||
"<strong>Rule #1:</strong> Don't look at the example project's code. Figure it out for yourself.",
|
||||
"<strong>Rule #2:</strong> Fulfill the below <a href='https://en.wikipedia.org/wiki/User_story' target='_blank'>user stories</a>. Use whichever libraries you need. Give it your own personal style.",
|
||||
"<strong>Rule #3:</strong> You may use your own CSS and frameworks other than Bootstrap.",
|
||||
"<strong>Rule #3:</strong> You can use Bootstrap, or any other framework of your choice.",
|
||||
"<strong>User Story:</strong> I can access all of the portfolio webpage's content just by scrolling.",
|
||||
"<strong>User Story:</strong> I can click different buttons that will take me to the portfolio creator's different social media pages.",
|
||||
"<strong>User Story:</strong> I can see thumbnail images of different projects the portfolio creator has built (if you haven't built any websites before, use placeholders.)",
|
||||
|
@ -8,7 +8,7 @@
|
||||
"id": "bad87fee1348bd9acde08712",
|
||||
"title": "Use Responsive Design with Bootstrap Fluid Containers",
|
||||
"description": [
|
||||
"Now let's go back to our Cat Photo App. This time, we'll style it using the popular Bootstrap responsive CSS framework.",
|
||||
"In the HTML5 and CSS section of FreeCodeCamp we built a Cat Photo App. Now let's go back to it. This time, we'll style it using the popular Bootstrap responsive CSS framework.",
|
||||
"Bootstrap will figure out how wide your screen is and respond by resizing your HTML elements - hence the name <code>Responsive Design</code>.",
|
||||
"With responsive design, there is no need to design a mobile version of your website. It will look good on devices with screens of any width.",
|
||||
"You can add Bootstrap to any app just by including it by adding the following code to the top of your HTML:",
|
||||
|
@ -317,7 +317,7 @@
|
||||
],
|
||||
"title": "Fill in the Blank with Placeholder Text",
|
||||
"description": [
|
||||
"Web developers traditionally use <code>lorem ipsum text</code> as placeholder text. It's called lorem ipsum text because those are the first two words of a famous passage by Cicero of Ancient Rome.",
|
||||
"Web developers traditionally use <code>lorem ipsum text</code> as placeholder text. The 'lorem ipsum' text is randomly scraped from a famous passage by Cicero of Ancient Rome.",
|
||||
"Lorem ipsum text has been used as placeholder text by typesetters since the 16th century, and this tradition continues on the web.",
|
||||
"Well, 5 centuries is long enough. Since we're building a CatPhotoApp, let's use something called <code>kitty ipsum text</code>.",
|
||||
"Replace the text inside your <code>p</code> element with the first few words of this kitty ipsum text: <code>Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</code>"
|
||||
@ -3830,7 +3830,8 @@
|
||||
],
|
||||
"tests": [
|
||||
"assert($(\"body\").css(\"background-color\") === \"rgb(0, 0, 0)\", 'message: Give your <code>body</code> element the <code>background-color</code> of black.');",
|
||||
"assert(code.match(/<style>\\s*body\\s*\\{\\s*background.*\\s*:\\s*.*;?\\s*\\}\\s*<\\/style>/i), 'message: Make sure your CSS rule is properly formatted with both opening and closing curly brackets.');"
|
||||
"assert(code.match(/<style>\\s*body\\s*\\{\\s*background.*\\s*:\\s*.*;\\s*\\}\\s*<\\/style>/i), 'message: Make sure your CSS rule is properly formatted with both opening and closing curly brackets.');",
|
||||
"assert(code.match(/<style>\\s*body\\s*\\{\\s*background.*\\s*:\\s*.*;\\s*\\}\\s*<\\/style>/i), 'message: Make sure your CSS rule ends with a semi-colon.');"
|
||||
],
|
||||
"descriptionPtBR": [
|
||||
"Agora vamos recomeçar e falar sobre herança em CSS.",
|
||||
|
@ -59,6 +59,16 @@
|
||||
"Dentro de tu elemento <code>script</code>, agrega este código: <code>$(document).ready(function () {</code> A continuación, ciérralo en la línea siguiente (aún dentro de tu elemento <code>script</code>) con: <code>})</code>",
|
||||
"Más adelante aprenderemos más acerca de funciones. Lo importante es saber que el código que pongas dentro de esta función (<code>function</code>) se ejecutará tan pronto como tu navegador haya cargado la página.",
|
||||
"Esto es importante porque sin tu <code>función de documento listo</code>, tu código puede ejecutarse antes de que se haya presentado el HTML, lo que podría causar errores."
|
||||
],
|
||||
"titleDe": "Lerne, wie Script Tags und Document Ready funktionieren",
|
||||
"descriptionDe": [
|
||||
"Jetzt sind wir bereit jQuery zu lernen, das populärste JavaScript-Tool aller Zeiten. Mach dir über JavaScript keine Sorgen - über dieses werden wir bald sprechen.",
|
||||
"Bevor wir jQuery nutzen können, müssen wir erst ein paar Dinge zu unserem HTML hinzufügen.",
|
||||
"Füge als erstes ein <code>script</code> Element am Beginn deiner Seite ein. Vergewissere dich, dass du das Element in der nächsten Zeile geschlossen hast.",
|
||||
"Dein Browser wird jegliches JavaScript, jQuery eingeschlossen, innerhalb eines <code>script</code> Elements ausführen.",
|
||||
"Füge innerhalb deines <code>script</code> Elements folgenden Code hinzu: <code>$(document).ready(function() {</code>. Schließe ihn danach in der nächsten Zeile (noch immer innerhalb deines <code>script</code> Elements) mit: <code>});</code>",
|
||||
"Wir werden später noch mehr über <code>Funktionen</code> lernen. Wichtig zu wissen ist, dass der Code innerhalb der <code>Funktion</code> ausgeführt wird, sobald der Browser die Seite geladen hat.",
|
||||
"Das ist wichtig, denn ohne deine <code>Document Ready Funktion</code> könnte dein Code ausgeführt werden, bevor das HTML gerendert wurde - was zu Fehlern führen kann."
|
||||
]
|
||||
},
|
||||
{
|
||||
@ -117,6 +127,15 @@
|
||||
"Por ejemplo, hagamos que todos tus elementos <code>button</code> reboten. Sólo tienes que añadir este código dentro de la función de documento listo: ",
|
||||
"<code>$(\"button\").addClass(\"animated bounce\")</code>",
|
||||
"Ten en cuenta que ya hemos incluido tanto la biblioteca jQuery como la biblioteca Animate.css en segundo plano para que pueda utilizarlos en el editor. Así que estás usando jQuery para aplicar la clase <code>bounce</code> de Animate.css a tus elementos <code>button</code>."
|
||||
],
|
||||
"titleDe": "HTML-Elemente mit Selektoren durch jQuery auswählen",
|
||||
"descriptionDe": [
|
||||
"Jetzt haben wir eine <code>Document Ready Funktion</code>.",
|
||||
"Lass uns unser erstes jQuery Statement schreiben. Alle jQuery Funktionen starten mit einem <code>$</code>, für gewöhnlich als <code>Dollar-Zeichen Operator</code> bezeichnet.",
|
||||
"jQuery wählt oft HTML-Elemente mit einem <code>Selektor</code> aus, um dann mit diesen Elementen etwas zu machen.",
|
||||
"Zum Beispiel, lasse alle deine <code>Button</code> Elemente hüpfen. Dazu musst du nur folgenden Code in deine <code>Document Ready Funktion</code> hinzufügen:",
|
||||
"<code>$(\"button\").addClass(\"animated bounce\");</code>",
|
||||
"Beachte, dass wir bereits jQuery und Animate.css im Hintergrund hinzugefügt haben, damit du diese im Editor nutzen kannst. Du nutzt also jQuery um die <code>bounce</code> Klasse von Animate.css zu deinen <code>Button</code> Elementen hinzuzufügen."
|
||||
]
|
||||
},
|
||||
{
|
||||
@ -177,6 +196,16 @@
|
||||
"A continuación, utiliza la función <code>.addClass()</code> de jQuery para agregar las clases <code>animated</code> y <code>shake</code>.",
|
||||
"Por ejemplo, podrías hacer que todos los elementos con la clase <code>text-primary</code> se sacudieran añadiendo lo siguiente a tu <code>función de documento listo</code>:",
|
||||
"<code>$(\".text-primary\").addClass(\"animated shake\");</code>"
|
||||
],
|
||||
"titleDe": "Elemente anhand von Klassen mit jQuery auswählen",
|
||||
"descriptionDe": [
|
||||
"Siehst du, wie wir alle deine <code>Button</code> Elemente hüpfen haben lassen? Wir haben sie mit <code>$(\"button\")</code> ausgewählt, dann CSS-Klassen mit <code>.addClass(\"animated bounce\");</code> hinzugefügt.",
|
||||
"Du hast gerade jQuery's <code>.addClass()</code> Funktion genutzt, die dir erlaubt, Klassen zu Elemente hinzuzufügen.",
|
||||
"Wähle als erstes deine <code>div</code> Elemente mit der Klasse <code>well</code>, indem du den <code>$(\".well\")</code> Selektor nutzt.",
|
||||
"Bedenke, dass du - genauso wie bei CSS-Deklarationen - einen <code>.</code> vor den Namen der Klasse setzen musst.",
|
||||
"Dann nutze die jQuery Funktion <code>.addClass()</code> um die Klassen <code>animated</code> und <code>shake</code> hinzuzufügen.",
|
||||
"Zum Beispiel könntest du alle Elemente mit der Klasse <code>text-primary</code> schütteln lassen, indem du folgendes zu deiner <code>Document Ready Funktion</code> hinzufügst:",
|
||||
"<code>$(\".text-primary\").addClass(\"animated shake\");</code>"
|
||||
]
|
||||
},
|
||||
{
|
||||
@ -238,6 +267,15 @@
|
||||
"A continuación, utiliza la función <code>.addClass()</code> de jQuery para agregar las clases <code>animated</code> y <code>fadeOut</code>.",
|
||||
"He aquí cómo haces que desaparezca el elemento <code>button</code> con la identificación <code>target6</code>:",
|
||||
"<code>$(\"#target6\").addClass(\"animated fadeOut\")</code>."
|
||||
],
|
||||
"titleDe": "Elemente anhand der ID mit jQuery auswählen",
|
||||
"descriptionDe": [
|
||||
"Du kannst Elemente auch anhand deren ID-Attributs auswählen.",
|
||||
"Wähle als erstes dein <code>Button</code> Element mit der ID <code>target3</code>, indem du den <code>$(\"#target3\")</code> Selektor nutzt.",
|
||||
"Bedenke, dass du - genauso wie bei CSS-Deklarationen - eine <code>#</code> vor den Namen der Klasse setzen musst.",
|
||||
"Dann nutze die jQuery Funktion <code>.addClass()</code> um die Klassen <code>animated</code> und <code>fadeOut</code> hinzuzufügen.",
|
||||
"So könntest du das <code>Button</code> Element mit der ID <code>target6</code> ausblenden lassen:",
|
||||
"<code>$(\"#target6\").addClass(\"animated fadeOut\")</code>."
|
||||
]
|
||||
},
|
||||
{
|
||||
@ -294,6 +332,11 @@
|
||||
"descriptionEs": [
|
||||
"Estas animaciones eran divertidas al principio, pero ahora se están volviendo una distracción.",
|
||||
"Elimina esas tres funciones jQuery de tu <code>función de documento listo</code>, pero deja intacta la declaración de la <code>función de documento listo</code>."
|
||||
],
|
||||
"titleDe": "Lösche deine jQuery Funktionen",
|
||||
"descriptionDe": [
|
||||
"Anfangs waren diese Animationen noch cool, jetzt sind sie aber ein wenig störend.",
|
||||
"Lösche alle drei jQuery Funktionen deiner <code>Document Ready Funktion</code>, aber lasse die <code>Document Ready Funktion</code> selbst intakt."
|
||||
]
|
||||
},
|
||||
{
|
||||
@ -356,6 +399,15 @@
|
||||
"Agregar la clase <code>animated</code> a todos los elementos con tipo <code>button</code>.",
|
||||
"Agregar la clase <code>shake</code> a todos los botones con clase <code>.btn</code>.",
|
||||
"Agregar la clase <code>btn-primary</code> al botón con identificación <code>#target1</code>."
|
||||
],
|
||||
"titleDe": "Wähle das gleiche Element mit mehreren jQuery Selektoren aus",
|
||||
"descriptionDe": [
|
||||
"Bis jetzt kennst du drei verschiedene Wege um Elemente auszuwählen: mit dem Element-Typ: <code>$(\"button\")</code>, mit der Element-Klasse: <code>$(\".btn\")</code>, und der Element-ID: <code>$(\"#target1\")</code>.",
|
||||
"Auch wenn es möglich ist, mehrere Klassen in einem einzigen <code>.addClass()</code> Aufruf hinzuzufügen, lass uns jetzt die Klassen in drei verschiedenen Wegen dem Element hinzufügen.",
|
||||
"Nutze jeden der oben erwähnten jQuery Selektoren und die <code>addClass()</code> Funktion:",
|
||||
"Füge die Klasse <code>animated</code> zu allen Elementen des Typs <code>button</code> hinzu.",
|
||||
"Füge die Klasse <code>shake</code> zu allen Buttons mit der Klasse <code>.btn</code> hinzu.",
|
||||
"Füge die Klasse <code>btn-primary</code> zu dem Button mit der ID <code>#target1</code> hinzu."
|
||||
]
|
||||
},
|
||||
{
|
||||
@ -414,6 +466,13 @@
|
||||
"He aquí cómo puedes hacerlo para un botón específico:",
|
||||
"<code>$(\"#target2\").removeClass(\"btn-default\");</code>",
|
||||
"Vamos a quitar la clase <code>btn-default</code> de todos nuestros elementos <code>button</code>."
|
||||
],
|
||||
"titleDe": "Entferne Klassen von einem Element mit jQuery",
|
||||
"descriptionDe": [
|
||||
"Genauso wie du Klassen mit der jQuery Funktion <code>addClass()</code> hinzufügen kannst, kannst du mit der jQuery Funktion <code>removeClass()</code> Klassen entfernen.",
|
||||
"So könntest du das bei einem spezifischen Button machen:",
|
||||
"<code>$(\"#target2\").removeClass(\"btn-default\");</code>",
|
||||
"Lass uns alle <code>btn-default</code> Klassen von unseren <code>Button</code> Elementen entfernen."
|
||||
]
|
||||
},
|
||||
{
|
||||
@ -478,6 +537,16 @@
|
||||
"Esto es un poco diferente a una declaración normal CSS, porque la propiedad CSS y su valor están entre comillas y separadas por una coma en lugar de dos puntos.",
|
||||
"Elimina tus selectores jQuery, dejando en blanco la <code>función de documento listo</code>.",
|
||||
"Selecciona <code>target1</code> y cambia su color a rojo."
|
||||
],
|
||||
"titleDe": "Das CSS eines Elements mit jQuery ändern",
|
||||
"descriptionDe": [
|
||||
"Wir können auch das CSS eines HTML-Elements mit jQuery verändern.",
|
||||
"jQuery hat die Funktion <code>.css()</code>, welche dir erlaubt, das CSS eines Elements zu ändern.",
|
||||
"So können wir die Farbe einer ID zu Blau ändern:",
|
||||
"<code>$(\"#target1\").css(\"color\", \"blue\");</code>",
|
||||
"Das ist ein wenig anders als eine normale CSS-Deklaration, weil die CSS-Eigenschaft und deren Wert in Anführungszeichen sind und durch ein Komma anstatt eines Doppelpunkts getrennt werden.",
|
||||
"Lösche deine jQuery Selektoren, damit eine leere <code>Document Ready Funktion</code> übrig bleibt.",
|
||||
"Wähle <code>target1</code> und ändere dessen Farbe zu Rot."
|
||||
]
|
||||
},
|
||||
{
|
||||
@ -538,6 +607,15 @@
|
||||
"He aquí cómo puedes desactivar todos los botones:",
|
||||
"<code>$(\"button\").prop(\"disabled\", true);</code>",
|
||||
"Desactiva sólo el botón <code>target1</code>."
|
||||
],
|
||||
"titleDe": "Elemente mit jQuery deaktivieren",
|
||||
"descriptionDe": [
|
||||
"Du kannst auch die nicht-CSS Eigenschaften eines HTML-Elements mit jQuery ändern. Zum Beispiel kannst du <code>Buttons</code> deaktivieren.",
|
||||
"Wenn du einen <code>Button</code> deaktivierst, wird er grau unterlegt und kann nicht mehr geklickt werden.",
|
||||
"jQuery hat eine Funktion namens <code>.prop()</code>, die es dir erlaubt, die Eigenschaften von Elementen anzupassen.",
|
||||
"So kannst du alle <code>Buttons</code> deaktivieren:",
|
||||
"<code>$(\"button\").prop(\"disabled\", true);</code>",
|
||||
"Deaktiviere nur den <code>target1</code> Button."
|
||||
]
|
||||
},
|
||||
{
|
||||
@ -600,6 +678,15 @@
|
||||
"<code>$(\"h3\").html(\"<i>jQuery Playground</i>\");</code>",
|
||||
"jQuery también tiene una función similar llamada <code>.text()</code> que sólo altera el texto sin añadir etiquetas.",
|
||||
"Cambia el botón con identificación <code>target4</code> de forma que su texto quede en itálicas."
|
||||
],
|
||||
"titleDe": "Ändere den Text innerhalb eines Elements mit jQuery",
|
||||
"descriptionDe": [
|
||||
"Mit jQuery kannst du den Text zwischen dem Start- und dem End-Tag eines Elements ändern. Du kannst sogar das HTML-Markup ändern.",
|
||||
"jQuery hat eine Funktion namens <code>.html()</code>, die dich HTML-Tags und Text innerhalb eines Elements hinzufügen lässt. Jeglicher Content der sich vorher innerhalb des Elements befand, wird mit jenem Content ersetzt, den du durch diese Funktion bereitstellst.",
|
||||
"So kannst du den Text unserer Überschrift überschreiben und hervorheben:",
|
||||
"<code>$(\"h3\").html(\"<em>jQuery Playground</em>\");</code>",
|
||||
"jQuery hat auch eine weitere ähnliche Funktion namens <code>.text()</code>, welche nur den Text ändert, ohne Tags hinzuzufügen. In anderen Worten: diese Funktion evaluiert keinerlei HTML-Tags, die an sie übergeben werden, sondern behandelt diese als Text, den du mit der Funktion ersetzen willst.",
|
||||
"Ändere den Button mit der ID <code>target4</code> indem du seinen Text hervorhebst."
|
||||
]
|
||||
},
|
||||
{
|
||||
@ -654,6 +741,12 @@
|
||||
"Ahora quitemos un elemento HTML de tu página usando jQuery.",
|
||||
"jQuery tiene una función llamada <code>.remove()</code> que eliminará un elemento HTML por completo",
|
||||
"Elimina el elemento con identificación <code>target4</code> de la página utilizando la función <code>.remove()</code>."
|
||||
],
|
||||
"titleDe": "Entferne ein Element mit jQuery",
|
||||
"descriptionDe": [
|
||||
"Lass uns jetzt ein HTML-Element mit jQuery von deiner Seite entfernen.",
|
||||
"jQuery hat eine Funktion namens <code>.remove()</code>, die ein HTML-Element komplett entfernt.",
|
||||
"Entferne das Element <code>target4</code> von der Seite, indem du die <code>.remove()</code> Funktion nutzt."
|
||||
]
|
||||
},
|
||||
{
|
||||
@ -714,6 +807,14 @@
|
||||
"Por ejemplo, si quisiéramos mover <code>target4</code> de nuestro pozo (<em>well</em>) derecho a nuestro pozo izquierdo, usaríamos:",
|
||||
"<code>$(\"#target4\").appendTo(\"#left-well\");</code>",
|
||||
"Mueve tu elemento <code>target2</code> de tu <code>left-well</code> a tu <code>right-well</code>."
|
||||
],
|
||||
"titleDe": "Verwende appendTo um Elemente mit jQuery zu verschieben.",
|
||||
"descriptionDe": [
|
||||
"Lass uns jetzt versuchen, ein Element von einem <code>div</code> zum Nächsten zu verschieben.",
|
||||
"jQuery hat eine Funktion namens <code>appendTo()</code>, die es dir erlaubt HTML-Elemente auszuwählen und diese zu einem anderen Element anzuhängen.",
|
||||
"Wenn wir zum Beispiel <code>target4</code> von <code>right-well</code> zu <code>left-well</code> verschieben wollen, würden wir folgenden Code nutzen:",
|
||||
"<code>$(\"#target4\").appendTo(\"#left-well\");</code>",
|
||||
"Verschiebe dein <code>target2</code> Element von <code>left-well</code> zu <code>right-well</code>."
|
||||
]
|
||||
},
|
||||
{
|
||||
@ -777,6 +878,15 @@
|
||||
"<code>$(\"#target2\").clone().appendTo(\"#right-well\");</code>",
|
||||
"¿Te diste cuenta que esto implica pegar dos funciones jQuery? Esto se conoce como <code>encadenamiento</code> y es una manera conveniente de hacer las cosas con jQuery. ",
|
||||
"Clona tu elemento <code>target5</code> y añadelo a tu <code>left-well</code>."
|
||||
],
|
||||
"titleDe": "Ein Element kopieren mit jQuery",
|
||||
"descriptionDe": [
|
||||
"Neben der Möglichkeit Elemente zu verschieben, können diese auch von einem Platz zum nächsten kopiert werden.",
|
||||
"jQuery hat eine Funktion namens <code>clone()</code>, die eine Kopie eines Elements anfertigt.",
|
||||
"Wenn wir zum Beispiel <code>target2</code> von <code>left-well</code> zu <code>right-well</code> kopieren wollen, würden wir folgenden Code nutzen:",
|
||||
"<code>$(\"#target2\").clone().appendTo(\"#right-well\");</code>",
|
||||
"Ist dir aufgefallen, dass wir dazu zwei jQuery Funktionen miteinander verknüpfen? Das nennt sich <code>function chaining</code> und ist eine praktische Art um mit jQuery zu Lösungen zu kommen.",
|
||||
"Kopiere dein <code>target5</code> Element und verschiebe es zu <code>left-well</code>."
|
||||
]
|
||||
},
|
||||
{
|
||||
@ -844,6 +954,15 @@
|
||||
"He aquí un ejemplo de cómo se utiliza la función <code>parent()</code> si quisieras darle al elemento padre del elemento <code>left-well</code> un color de fondo azul:",
|
||||
"<code>$(\"#left-well\").parent().css(\"background-color\", \"blue\")</code>",
|
||||
"Dale al padre del elemento <code>#target1</code> un color de fondo (<code>background-color</code>) rojo."
|
||||
],
|
||||
"titleDe": "Wähle das Eltern-Element mit jQuery aus",
|
||||
"descriptionDe": [
|
||||
"Jedes HTML-Element hat ein <code>Eltern-Element</code>, von dem es Eigenschaften <code>erbt</code>.",
|
||||
"Dein <code>jQuery Playground</code> <code>h3</code> Element hat zum Beispiel das Eltern-Element <code><div class=\"container-fluid\"></code>, welches das <code>body</code> Element als Eltern-Element hat.",
|
||||
"jQuery hat eine Funktion namens <code>parent()</code>, die es dir erlaubt auf die Eltern-Elemente eines von dir ausgewählten Elements zuzugreifen.",
|
||||
"Hier ist ein Beispiel, wie du die <code>parent()</code> Funktion nutzen kannst, wenn du dem Eltern-Element des <code>left-well</code> Elements eine blaue Hintergrundfarbe geben willst:",
|
||||
"<code>$(\"#left-well\").parent().css(\"background-color\", \"blue\")</code>",
|
||||
"Gib dem Eltern-Element des <code>#target1</code> Elements eine rote Hintergrundfarbe."
|
||||
]
|
||||
},
|
||||
{
|
||||
@ -909,6 +1028,15 @@
|
||||
"He aquí un ejemplo de cómo se utiliza la función <code>children()</code> para darle a los hijos de tu elemento <code>left-well</code> el color azul:",
|
||||
"<code>$(\"#left-well\").children().css(\"color\", \"blue\")</code>",
|
||||
"Da a todos los hijos de tu elemento <code>right-well</code> el color naranja."
|
||||
],
|
||||
"titleDe": "Wähle Kinder-Elemente mit jQuery aus",
|
||||
"descriptionDe": [
|
||||
"Viele HTML-Elemente haben <code>Kinder-Elemente</code>, die ihre Eigenschaften von ihren Eltern-Elementen <code>erben</code>.",
|
||||
"Zum Beispiel ist jedes HTML-Element ein Kind-Element des <code>body</code> Elements und dein <code>\"jQuery Playground\"</code> <code>h3</code> Element ist ein Kind-Element deines <code><div class=\"container-fluid\"></code> Elements.",
|
||||
"jQuery hat eine Funktion namens <code>children()</code>, die es dir erlaubt, auf die Kinder-Elemente des von dir ausgewählten Elements zuzugreifen.",
|
||||
"Hier ist ein Beispiel, wie du die <code>children()</code> Funktion nutzen kannst, wenn du den Kinder-Elementen von <code>left-well</code> die Farbe Blau geben willst:",
|
||||
"<code>$(\"#left-well\").children().css(\"color\", \"blue\")</code>",
|
||||
"Gib allen Kinder-Elementen von <code>#right-well</code> die Farbe Orange."
|
||||
]
|
||||
},
|
||||
{
|
||||
@ -975,6 +1103,15 @@
|
||||
"He aquí cómo le asignarás la clase <code>bounce</code> al tercer elemento de cada pozo:",
|
||||
"<code>$(\".target:nth-child(3)\").addClass(\"animated bounce\");</code>",
|
||||
"Haz que rebote el segundo hijo de cada uno de los elementos de tus pozos. Debes elegir los hijos de elementos con clase <code>target</code>."
|
||||
],
|
||||
"titleDe": "Wähle ein spezifisches Kinder-Element mit jQuery aus",
|
||||
"descriptionDe": [
|
||||
"Du hast gesehen, warum ID-Attribute so praktisch sind, um Elemente mit jQuery Selektoren auszuwählen. Leider hast du aber nicht immer so praktische IDs, mit denen du arbeiten kannst.",
|
||||
"Zum Glück hat jQuery einige Tricks auf Lager, um die richtigen Elemente auszuwählen.",
|
||||
"jQuery nutzt CSS-Selektoren um Elemente auszuwählen. Der <code>target:nth-child(n)</code> CSS-Selektor erlaubt dir das n-te Element aus einer Zielklasse oder Element-Typ zu wählen.",
|
||||
"Hier siehst du, wie du dem dritten Kind-Element einer jeden Vertiefung eine <code>bounce</code> Klasse hinzufügen kannst.",
|
||||
"<code>$(\".target:nth-child(3)\").addClass(\"animated bounce\");</code>",
|
||||
"Lasse das zweite Kind-Element jeder Vertiefung hüpfen. Dazu musst das Kind-Element mit der <code>target</code> Klasse auswählen."
|
||||
]
|
||||
},
|
||||
{
|
||||
@ -1040,6 +1177,14 @@
|
||||
"He aquí cómo elegirías todos los elementos impares con clase <code>target</code> y como les agregarías unas clases:",
|
||||
"<code>$(\".target:odd\").addClass(\"animated shake\");</code>",
|
||||
"Intenta seleccionar todos los elementos de número par y agrégales las clases <code>animated</code> y <code>shake</code>."
|
||||
],
|
||||
"titleDe": "Wähle gerade Zahlen mit jQuery aus",
|
||||
"descriptionDe": [
|
||||
"Du kannst auch alle geradzahligen Elemente auswählen.",
|
||||
"Hier siehst du, wie du ungeradzahlige Elemente mit der Klasse <code>target</code> auswählen und ihnen folgende Klassen geben kannst:",
|
||||
"<code>$(\".target:odd\").addClass(\"animated shake\");</code>",
|
||||
"Bedenke, dass jQuery null-indexiert ist; das bedeutet, dass - kontraintuitiverweise - <code>:odd</code> das zweite Element, das vierte Element und so weiter auswählt.",
|
||||
"Versuche alle geradzahligen Elemente auszuwählen und ihnen die Klassen <code>animated</code> und <code>shake</code> hinzuzufügen."
|
||||
]
|
||||
},
|
||||
{
|
||||
@ -1103,6 +1248,13 @@
|
||||
"jQuery también puede elegir el elemento <code>body</code>.",
|
||||
"Así es como haríamos que el cuerpo entero desapareciera: <code>$(\"body\").addClass('animated fadeOut');</code>",
|
||||
"Pero vamos a hacer algo más dramático. Añade las clases <code>animated</code> y <code>hinge</code> a tu elemento <code>body</code>."
|
||||
],
|
||||
"titleDe": "Mit jQuery die gesamte Seite modifizieren",
|
||||
"descriptionDe": [
|
||||
"Genug mit unserem jQuery Spielplatz herumgespielt. Reißen wir ihn ein!",
|
||||
"jQuery kann auch das <code>body</code> Element auswählen.",
|
||||
"Hier siehst du, wie wir den gesamten <code>body</code> Bereich ausblenden können: <code> $(\"body\").addClass(\"animated fadeOut\");</code>",
|
||||
"Aber lass uns noch etwas Dramatischeres machen. Füge die Klassen <code>animated</code> und <code>hinge</code> zu deinem <code>body</code> Element hinzu."
|
||||
]
|
||||
}
|
||||
]
|
||||
|
@ -138,7 +138,7 @@
|
||||
"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:",
|
||||
"<blockquote>$.getJSON(\"/json/cats.json\", function(json) {</code></br> $(\".message\").html(JSON.stringify(json));</br>});</blockquote>",
|
||||
"<blockquote>$.getJSON(\"/json/cats.json\", function(json) {<br> $(\".message\").html(JSON.stringify(json));<br>});</blockquote>",
|
||||
"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."
|
||||
],
|
||||
"challengeSeed": [
|
||||
@ -175,11 +175,11 @@
|
||||
"</div>"
|
||||
],
|
||||
"tests": [
|
||||
"assert(code.match(/\\$\\s*?\\(\\s*?(\\\"|\\')\\#getMessage(\\\"|\\')\\s*?\\)\\s*?\\.\\s*?on\\s*?\\(\\s*?(\\\"|\\')click(\\\"|\\')\\s*?\\,\\s*?function\\s*?\\(\\s*?\\)\\s*?\\{/gi), 'message: You should have a click handler on the getMessage button to trigger the AJAX request.');",
|
||||
"assert(code.match(/\\$\\s*?\\(\\s*?(\\\"|\\')\\#getMessage(\\\"|\\')\\s*?\\)\\s*?\\.\\s*?on\\s*?\\(\\s*?(\\\"|\\')click(\\\"|\\')\\s*?\\,\\s*?function\\s*?\\(\\s*?\\)\\s*?\\{/gi), 'message: You should have a click handler on the <code>getMessage</code> button to trigger the AJAX request.');",
|
||||
"assert(code.match(/\\s*?\\}\\s*?\\)\\s*?\\;/gi), 'message: You should have at least one closing set of brackets and parenthesis.');",
|
||||
"assert(code.match(/\\s*?\\}\\s*?\\)\\s*?\\;/gi) && code.match(/\\,\\s*?function\\s*?\\(\\s*?\\w*?\\s*?\\)\\s*?\\{/gi) && code.match(/\\s*?\\}\\s*?\\)\\s*?\\;/gi).length === code.match(/\\s*?function\\s*?\\(\\s*?\\w*?\\s*?\\)\\s*?\\{/gi).length, 'message: Each callback function should have a closing set of brackets and parenthesis.');",
|
||||
"assert(code.match(/\\$\\s*?\\.\\s*?getJSON\\s*?\\(\\s*?(\\\"|\\')\\/json\\/cats\\.json(\\\"|\\')\\s*?\\,\\s*?function\\s*?\\(\\s*?json\\s*?\\)\\s*?\\{/gi), 'message: You should be making use of the getJSON method given in the description to load data from the json file.');",
|
||||
"assert(code.match(/\\$\\s*?\\(\\s*?(\\\"|\\')\\.message(\\\"|\\')\\s*?\\)\\s*?\\.\\s*?html\\s*?\\(\\s*?JSON\\s*?\\.\\s*?stringify\\s*?\\(\\s*?json\\s*?\\)\\s*?\\)/gi), 'message: Don't forget to make the <code>.html</code> change the contents of the message box so that it contains the result of the getJSON.');"
|
||||
"assert(code.match(/\\$\\s*?\\.\\s*?getJSON\\s*?\\(\\s*?(\\\"|\\')\\/json\\/cats\\.json(\\\"|\\')\\s*?\\,\\s*?function\\s*?\\(\\s*?json\\s*?\\)\\s*?\\{/gi), 'message: You should be making use of the <code>getJSON</code> method given in the description to load data from the JSON file.');",
|
||||
"assert(code.match(/\\$\\s*?\\(\\s*?(\\\"|\\')\\.message(\\\"|\\')\\s*?\\)\\s*?\\.\\s*?html\\s*?\\(\\s*?JSON\\s*?\\.\\s*?stringify\\s*?\\(\\s*?json\\s*?\\)\\s*?\\)/gi), 'message: Don't forget to make the <code>.html</code> change the contents of the message box so that it contains the result of the <code>getJSON</code>.');"
|
||||
],
|
||||
"type": "waypoint",
|
||||
"challengeType": 0,
|
||||
@ -192,19 +192,19 @@
|
||||
"Estas propiedades y sus valores a menudo se denominan \" pares llave-valor\".",
|
||||
"Vamos a obtener el JSON de la API de fotos de gato de Free Code Camp.",
|
||||
"Aquí está el código que puedes poner en tu evento de pulsación para lograrlo:",
|
||||
"<blockquote>$.getJSON(\"/json/cats.json\", function(json) {</code></br> $(\".message\").html(JSON.stringify(json));</br>});</blockquote>",
|
||||
"<blockquote>$.getJSON(\"/json/cats.json\", function(json) {<br> $(\".message\").html(JSON.stringify(json));<br>});</blockquote>",
|
||||
"Una vez lo añadas, pulsa el botón \"Get Message\". Tu función Ajax sustituirá el texto \"The message will go here\" con la salida JSON en bruto de la API de fotos de gato de Free Code Camp."
|
||||
],
|
||||
"titlePt": "Obter um JSON com o método getJSON do jQuery",
|
||||
"descriptionPt": [
|
||||
"Também é possivel solicitar os dados de uma fonte externa. É aqui onde as API's entram em jogo. ",
|
||||
"Também é possivel solicitar os dados de uma fonte externa. É aqui onde as API's entram em jogo.",
|
||||
"Lembre que as API's - Interface de Programação de Aplicativos - são ferramentas que os computadores usam para se comunicar entre si.",
|
||||
"A maioria das API's transferem de dados para web em um formato chamado JSON. JSON significa notação de objeto JavaScript (<em>JavaScript Object Notation</em>).",
|
||||
"Você já usou JSON para criar objetos em JavaScript. O JSON não é mais que as propriedades de um objeto e seus valores atuais, separados entre <code>{</code> e um <code>}</code>. ",
|
||||
"Você já usou JSON para criar objetos em JavaScript. O JSON não é mais que as propriedades de um objeto e seus valores atuais, separados entre <code>{</code> e um <code>}</code>.",
|
||||
"Estas propriedades e seus valores são muitas vezes denominados de \" pares chave-valor\".",
|
||||
"Vamos obter o JSON da API de fotos de gatos do Free Code Camp.",
|
||||
"Aqui esta o código que você pode por no nosso evento de clique para fazer isso:",
|
||||
"<blockquote>$.getJSON(\"/json/cats.json\", function(json) {</code></br> $(\".message\").html(JSON.stringify(json));</br>});</blockquote>",
|
||||
"<blockquote>$.getJSON(\"/json/cats.json\", function(json) {<br> $(\".message\").html(JSON.stringify(json));<br>});</blockquote>",
|
||||
"Uma vez adicionadas, aperte o botão \"Get Message\". Sua função Ajax substituirá o texto \"The message will go here\" com a saída bruta do JSON da API de gatos do Free Code Camp."
|
||||
]
|
||||
},
|
||||
|
@ -212,7 +212,7 @@
|
||||
"You can view this Node School module's source code on GitHub at <a href='https://github.com/azat-co/expressworks'>https://github.com/azat-co/expressworks</a>.",
|
||||
"Complete \"Hello World!\"",
|
||||
"Complete \"Static\"",
|
||||
"Complete \"Jade\"",
|
||||
"Complete \"Jade\" (Jade has been renamed to Pug)",
|
||||
"Complete \"Good Old Form\"",
|
||||
"Complete \"Stylish CSS\"",
|
||||
"Complete \"Param Pam Pam\"",
|
||||
@ -243,7 +243,7 @@
|
||||
"Puedes ver el código fuente de este módulo de Node School en GitHub visitando <a href='https://github.com/azat-co/expressworks'>https://github.com/azat-co/expressworks</a>..",
|
||||
"Completa \"Hello World!\"",
|
||||
"Completa \"Static\"",
|
||||
"Completa \"Jade\"",
|
||||
"Completa \"Jade\" (Jade ahora se llama Pug)",
|
||||
"Completa \"Good Old Form\"",
|
||||
"Completa \"Stylish CSS\"",
|
||||
"Completa \"Param Pam Pam\"",
|
||||
|
@ -16,6 +16,15 @@ function getCertCount(userCount, cert) {
|
||||
::timeCache(2, 'hours');
|
||||
}
|
||||
|
||||
function getAllThreeCertsCount(userCount) {
|
||||
return userCount({
|
||||
isFrontEndCert: true,
|
||||
isDataVisCert: true,
|
||||
isBackEndCert: true
|
||||
})
|
||||
::timeCache(2, 'hours');
|
||||
}
|
||||
|
||||
export default function about(app) {
|
||||
const router = app.loopback.Router();
|
||||
const User = app.models.User;
|
||||
@ -23,6 +32,7 @@ export default function about(app) {
|
||||
const frontEndCount$ = getCertCount(userCount, 'isFrontEndCert');
|
||||
const dataVisCount$ = getCertCount(userCount, 'isDataVisCert');
|
||||
const backEndCount$ = getCertCount(userCount, 'isBackEndCert');
|
||||
const allThreeCount$ = getAllThreeCertsCount(userCount);
|
||||
|
||||
function showAbout(req, res, next) {
|
||||
const daysRunning = moment().diff(new Date('10/15/2014'), 'days');
|
||||
@ -31,17 +41,30 @@ export default function about(app) {
|
||||
frontEndCount$,
|
||||
dataVisCount$,
|
||||
backEndCount$,
|
||||
(frontEndCount = 0, dataVisCount = 0, backEndCount = 0) => ({
|
||||
allThreeCount$,
|
||||
(
|
||||
frontEndCount = 0,
|
||||
dataVisCount = 0,
|
||||
backEndCount = 0,
|
||||
allThreeCount = 0
|
||||
) => ({
|
||||
frontEndCount,
|
||||
dataVisCount,
|
||||
backEndCount
|
||||
backEndCount,
|
||||
allThreeCount
|
||||
})
|
||||
)
|
||||
.doOnNext(({ frontEndCount, dataVisCount, backEndCount }) => {
|
||||
.doOnNext(({
|
||||
frontEndCount,
|
||||
dataVisCount,
|
||||
backEndCount,
|
||||
allThreeCount
|
||||
}) => {
|
||||
res.render('resources/about', {
|
||||
frontEndCount: numberWithCommas(frontEndCount),
|
||||
dataVisCount: numberWithCommas(dataVisCount),
|
||||
backEndCount: numberWithCommas(backEndCount),
|
||||
allThreeCount: numberWithCommas(allThreeCount),
|
||||
daysRunning,
|
||||
title: dedent`
|
||||
About our Open Source Community, our social media presence,
|
||||
|
@ -148,6 +148,8 @@ module.exports = function(app) {
|
||||
router.post('/reset-password', postReset);
|
||||
router.get('/email-signup', getEmailSignup);
|
||||
router.get('/email-signin', getEmailSignin);
|
||||
router.get('/deprecated-signin', getDepSignin);
|
||||
router.get('/update-email', getUpdateEmail);
|
||||
router.get(
|
||||
'/toggle-lockdown-mode',
|
||||
sendNonUserToMap,
|
||||
@ -225,6 +227,25 @@ module.exports = function(app) {
|
||||
res.redirect('/');
|
||||
}
|
||||
|
||||
|
||||
function getDepSignin(req, res) {
|
||||
if (req.user) {
|
||||
return res.redirect('/');
|
||||
}
|
||||
return res.render('account/deprecated-signin', {
|
||||
title: 'Sign in to Free Code Camp using a Deprecated Login'
|
||||
});
|
||||
}
|
||||
|
||||
function getUpdateEmail(req, res) {
|
||||
if (!req.user) {
|
||||
return res.redirect('/');
|
||||
}
|
||||
return res.render('account/email-update', {
|
||||
title: 'Update your Email'
|
||||
});
|
||||
}
|
||||
|
||||
function getEmailSignin(req, res) {
|
||||
if (req.user) {
|
||||
return res.redirect('/');
|
||||
@ -312,6 +333,16 @@ module.exports = function(app) {
|
||||
return data;
|
||||
}, {});
|
||||
|
||||
if (userPortfolio.isCheater) {
|
||||
req.flash('errors', {
|
||||
msg: dedent`
|
||||
Upon review, this account has been flagged for academic
|
||||
dishonesty. If you’re the owner of this account contact
|
||||
team@freecodecamp.com for details.
|
||||
`
|
||||
});
|
||||
}
|
||||
|
||||
return buildDisplayChallenges(userPortfolio.challengeMap, timezone)
|
||||
.map(displayChallenges => ({
|
||||
...userPortfolio,
|
||||
@ -367,13 +398,6 @@ module.exports = function(app) {
|
||||
}
|
||||
|
||||
if (user.isCheater) {
|
||||
req.flash('errors', {
|
||||
msg: dedent`
|
||||
Upon review, this account has been flagged for academic
|
||||
dishonesty. If you’re the owner of this account contact
|
||||
team@freecodecamp.com for details.
|
||||
`
|
||||
});
|
||||
return res.redirect(`/${user.username}`);
|
||||
}
|
||||
|
||||
|
@ -42,6 +42,7 @@
|
||||
"helmet#xssFilter": {},
|
||||
"helmet#noSniff": {},
|
||||
"helmet#frameguard": {},
|
||||
"./middlewares/csurf": {},
|
||||
"./middlewares/constant-headers": {},
|
||||
"./middlewares/csp": {},
|
||||
"./middlewares/express-rx": {},
|
||||
|
5
server/middlewares/csurf.js
Normal file
5
server/middlewares/csurf.js
Normal file
@ -0,0 +1,5 @@
|
||||
import csurf from 'csurf';
|
||||
|
||||
export default function() {
|
||||
return csurf({ cookie: true });
|
||||
}
|
@ -2,6 +2,7 @@ export default function globalLocals() {
|
||||
return function(req, res, next) {
|
||||
// Make user object available in templates.
|
||||
res.locals.user = req.user;
|
||||
res.locals._csrf = req.csrfToken();
|
||||
next();
|
||||
};
|
||||
}
|
||||
|
56
server/views/account/deprecated-signin.jade
Normal file
56
server/views/account/deprecated-signin.jade
Normal file
@ -0,0 +1,56 @@
|
||||
extends ../layout
|
||||
block content
|
||||
.text-center
|
||||
h2 Sign in with one of these options if you used them as your original login methods :
|
||||
br
|
||||
a.btn.btn-lg.btn-block.btn-social.btn-facebook(href='/auth/facebook')
|
||||
i.fa.fa-facebook
|
||||
| Sign in with Facebook
|
||||
a.btn.btn-lg.btn-block.btn-social.btn-google(href='/auth/google')
|
||||
i.fa.fa-google
|
||||
| Sign in with Google
|
||||
a.btn.btn-lg.btn-block.btn-social.btn-linkedin(href='/auth/linkedin')
|
||||
i.fa.fa-linkedin
|
||||
| Sign in with LinkedIn
|
||||
a.btn.btn-lg.btn-block.btn-social.btn-twitter(href='/auth/twitter')
|
||||
i.fa.fa-twitter
|
||||
| Sign in with Twitter
|
||||
br
|
||||
p
|
||||
strong IMPORTANT NOTICE
|
||||
br
|
||||
em These options are under deprecation and will be removed soon.
|
||||
br
|
||||
em After you are signed in, go to the settings page and add GitHub and/or Email as your sign in option
|
||||
|
||||
script.
|
||||
$(document).ready(function() {
|
||||
var method = localStorage.getItem('lastSigninMethod'),
|
||||
btnSelector = 'a.btn.btn-lg.btn-block.btn-social';
|
||||
if (method) {
|
||||
try {
|
||||
var obj = JSON.parse(method);
|
||||
} catch(e) {
|
||||
console.error('Invalid sign in object stored', method);
|
||||
return;
|
||||
}
|
||||
$.each($(btnSelector), function(i, item) {
|
||||
if (
|
||||
$(item).attr('href') === obj.methodLink &&
|
||||
$(item).hasClass(obj.methodClass)
|
||||
) {
|
||||
$(item).addClass('active');
|
||||
$(item).attr('title', 'This is your last signin method');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
$(btnSelector).click(function() {
|
||||
var obj = {};
|
||||
$(this).removeClass('active');
|
||||
obj.methodClass = $(this).attr('class').split(' ').pop();
|
||||
obj.methodLink = $(this).attr('href');
|
||||
localStorage.setItem('lastSigninMethod', JSON.stringify(obj));
|
||||
});
|
||||
});
|
58
server/views/account/email-update.jade
Normal file
58
server/views/account/email-update.jade
Normal file
@ -0,0 +1,58 @@
|
||||
extends ../layout
|
||||
block content
|
||||
.container
|
||||
.row.flashMessage.negative-30
|
||||
.col-xs-12
|
||||
#flash-board.alert.fade.in(style='display: none;')
|
||||
button.close(type='button', data-dismiss='alert')
|
||||
span.ion-close-circled#flash-close
|
||||
#flash-content
|
||||
h2.text-center Update your email address here:
|
||||
form.form-horizontal.email-update(method='POST', action='/api/users/#{user.id}/update-email', name="updateEmailForm")
|
||||
.row
|
||||
.col-sm-6.col-sm-offset-3
|
||||
input(type='hidden', name='_csrf', value=_csrf)
|
||||
.form-group
|
||||
input.input-lg.form-control(type='email', name='email', id='email', value=user.email || '', placeholder=user.email || 'Enter your new email', autofocus, required, autocomplete="off")
|
||||
.form-group
|
||||
button.btn.btn-lg.btn-primary.btn-block(type='submit')
|
||||
| Update my Email
|
||||
a.btn.btn-lg.btn-block.btn-primary.btn-link-social(href='/settings')
|
||||
| Go back to Settings
|
||||
|
||||
script.
|
||||
$(document).ready(function() {
|
||||
$('form').submit(function(event){
|
||||
event.preventDefault();
|
||||
$('#flash-board').hide();
|
||||
var $form = $(event.target);
|
||||
$.ajax({
|
||||
type : 'POST',
|
||||
url : $form.attr('action'),
|
||||
data : $form.serialize(),
|
||||
dataType : 'json',
|
||||
encode : true,
|
||||
xhrFields : { withCredentials: true }
|
||||
})
|
||||
.fail(error => {
|
||||
if (error.responseText){
|
||||
var data = JSON.parse(error.responseText);
|
||||
if(data.error && data.error.message)
|
||||
$('#flash-content').html(data.error.message);
|
||||
$('#flash-board')
|
||||
.removeClass('alert-success')
|
||||
.addClass('alert-info')
|
||||
.fadeIn();
|
||||
}
|
||||
})
|
||||
.done(data =>{
|
||||
if(data.status && data.status.count){
|
||||
$('#flash-content').html("Your email has been updated successfully!");
|
||||
$('#flash-board')
|
||||
.removeClass('alert-danger')
|
||||
.addClass('alert-success')
|
||||
.fadeIn();
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
@ -48,6 +48,15 @@ block content
|
||||
|
||||
.spacer
|
||||
h2.text-center Email settings
|
||||
if(user.email)
|
||||
.row
|
||||
.col-xs-12
|
||||
p.large-p.text-center
|
||||
em #{user.email}
|
||||
.col-xs-12
|
||||
a.btn.btn-lg.btn-block.btn-primary.btn-link-social(href='/email-update')
|
||||
i.fa.fa-envelope
|
||||
| Update my Email
|
||||
.row
|
||||
.col-xs-12.col-sm-8.col-sm-offset-2.col-md-6.col-md-offset-3
|
||||
.row
|
||||
@ -85,6 +94,15 @@ block content
|
||||
else
|
||||
.col-xs-3
|
||||
a.btn.btn-lg.btn-primary.btn-block.positive-20(href='/toggle-quincy-email-mode') Off
|
||||
else
|
||||
.row
|
||||
.col-xs-12
|
||||
p.large-p.text-center
|
||||
| You don't have an email id associated to this account.
|
||||
.col-xs-12
|
||||
a.btn.btn-lg.btn-block.btn-primary.btn-link-social(href='/email-update')
|
||||
i.fa.fa-envelope
|
||||
| Update my Email
|
||||
|
||||
.spacer
|
||||
h2.text-center Danger Zone
|
||||
|
@ -14,7 +14,7 @@ block content
|
||||
a.btn.btn-lg.btn-block.btn-primary.btn-link-social(href='/settings')
|
||||
| Update your settings
|
||||
.col-xs-12
|
||||
a.btn.btn-lg.btn-block.btn-primary.btn-link-social(href='/logout')
|
||||
a.btn.btn-lg.btn-block.btn-primary.btn-link-social(href='/signout')
|
||||
| Sign me out of Free Code Camp
|
||||
.col-xs-12
|
||||
a.btn.btn-lg.btn-block.btn-primary.btn-link-social(href='mailto:team@freecodecamp.com')
|
||||
|
@ -1,27 +1,32 @@
|
||||
extends ../layout
|
||||
block content
|
||||
.text-center
|
||||
h2 Sign in with one of these options:
|
||||
h2 New to Free Code Camp?
|
||||
br
|
||||
.button-spacer
|
||||
| Sign up now:
|
||||
a.btn.btn-lg.btn-block.btn-social.btn-primary(href='/email-signup')
|
||||
i.fa.fa-envelope
|
||||
| Sign up with Email
|
||||
a.btn.btn-lg.btn-block.btn-social.btn-github(href='/auth/github')
|
||||
i.fa.fa-github
|
||||
| Sign up with GitHub
|
||||
.spacer
|
||||
hr
|
||||
.spacer
|
||||
h2 Are you a returning camper?
|
||||
br
|
||||
.button-spacer
|
||||
| Sign in with one of these options:
|
||||
a.btn.btn-lg.btn-block.btn-social.btn-primary(href='/email-signin')
|
||||
i.fa.fa-envelope
|
||||
| Sign in with Email
|
||||
a.btn.btn-lg.btn-block.btn-social.btn-github(href='/auth/github')
|
||||
i.fa.fa-github
|
||||
| Sign in with GitHub
|
||||
a.btn.btn-lg.btn-block.btn-social.btn-facebook(href='/auth/facebook')
|
||||
i.fa.fa-facebook
|
||||
| Sign in with Facebook
|
||||
a.btn.btn-lg.btn-block.btn-social.btn-google(href='/auth/google')
|
||||
i.fa.fa-google
|
||||
| Sign in with Google
|
||||
a.btn.btn-lg.btn-block.btn-social.btn-linkedin(href='/auth/linkedin')
|
||||
i.fa.fa-linkedin
|
||||
| Sign in with LinkedIn
|
||||
a.btn.btn-lg.btn-block.btn-social.btn-twitter(href='/auth/twitter')
|
||||
i.fa.fa-twitter
|
||||
| Sign in with Twitter
|
||||
br
|
||||
p
|
||||
a(href="/email-signup") Or sign up using your email address here.
|
||||
p
|
||||
a(href="/email-signin") If you originally signed up using your email address, you can sign in here.
|
||||
a(href="/deprecated-signin") Click here if you previously signed in using a different method.
|
||||
|
||||
script.
|
||||
$(document).ready(function() {
|
||||
|
@ -38,6 +38,10 @@ block content
|
||||
span.tag Back End:	
|
||||
span.text-primary #{backEndCount}
|
||||
| earned
|
||||
li.nowrap
|
||||
span.tag All three:	
|
||||
span.text-primary #{allThreeCount}
|
||||
| earned
|
||||
.spacer
|
||||
.row
|
||||
.col-xs-12.col-sm-10.col-sm-offset-1.col-md-6.col-md-offset-3
|
||||
|
Reference in New Issue
Block a user