* feat(tools): add seed/solution restore script * chore(curriculum): remove empty sections' markers * chore(curriculum): add seed + solution to Chinese * chore: remove old formatter * fix: update getChallenges parse translated challenges separately, without reference to the source * chore(curriculum): add dashedName to English * chore(curriculum): add dashedName to Chinese * refactor: remove unused challenge property 'name' * fix: relax dashedName requirement * fix: stray tag Remove stray `pre` tag from challenge file. Signed-off-by: nhcarrigan <nhcarrigan@gmail.com> Co-authored-by: nhcarrigan <nhcarrigan@gmail.com>
2.2 KiB
2.2 KiB
id, title, challengeType, dashedName
id | title | challengeType | dashedName |
---|---|---|---|
5d8a4cfbe6b6180ed9a1c9ea | Part 13 | 0 | part-13 |
--description--
Add another script
below the one you just added. Give it a src
attribute of ./data.js
.
This adds a data
variable to your project that contains your number of social media followers, it is an array of objects. Each object has the year and your followers for three different platforms. You will see what it looks like shortly.
--hints--
test-text
const script = code.match(/<script\s+[\s\S]+?[^>]>\s*<\/script\s*>/gi)[1];
assert(/src\s*=\s*('|")\s*(\.\/)?data.js\s*\1/gi.test(script));
--seed--
--before-user-code--
<style>
body {
background-color: #ccc;
padding: 100px 10px;
}
.dashboard {
width: 980px;
height: 500px;
background-color: white;
box-shadow: 5px 5px 5px 5px #888;
margin: auto;
display: flex;
align-items: center;
}
</style>
<script>
const data = [
{ year: 2012, followers: { twitter: 2594, tumblr: 401, instagram: 83 }},
{ year: 2013, followers: { twitter: 3049, tumblr: 440, instagram: 192 }},
{ year: 2014, followers: { twitter: 3511, tumblr: 415, instagram: 511 }},
{ year: 2015, followers: { twitter: 3619, tumblr: 492, instagram: 1014 }},
{ year: 2016, followers: { twitter: 4046, tumblr: 543, instagram: 2066 }},
{ year: 2017, followers: { twitter: 3991, tumblr: 701, instagram: 3032 }},
{ year: 2018, followers: { twitter: 3512, tumblr: 1522, instagram: 4512 }},
{ year: 2019, followers: { twitter: 3274, tumblr: 1989, instagram: 4715 }},
{ year: 2020, followers: { twitter: 2845, tumblr: 2040, instagram: 4801 }}
];
</script>
--seed-contents--
<!DOCTYPE html>
<html>
<head>
<title>D3 Dashboard</title>
<link rel="stylesheet" href="./dashboard.css">
<script src="./d3-5.9.2.min.js"></script>
</head>
<body>
<div class="dashboard"></div>
</body>
</html>
--solutions--
<!DOCTYPE html>
<html>
<head>
<title>D3 Dashboard</title>
<link rel="stylesheet" href="./dashboard.css">
<script src="./d3-5.9.2.min.js"></script>
<script src="./data.js"></script>
</head>
<body>
<div class="dashboard"></div>
</body>
</html>