* add(tests): parts 1-2 * refactor for multi-file editor, and add temp css tests * re-re-rebasing * add link to subsequent challenges * add test strings to 007-015 * add final tests 001-016 * fix 005-007, add 017-022 tests and test strings * add: tests 021-030, and formatting * add: 031-034 tests * tests: add 035-046 * fix: test in 021 * tests: add 047-050 * format: 009, 051-118 remove css whitespace * tests: add 051-078 * tests: add 079-105 * tests: add 104-118 * fix: empty -> isEmpty, and include -> match * fix: correct editable region * fix: formatting and spelling * fix: test logic, and add TODO for whitespace * fix: add final part solution 🤦♂️ * fix typo in part-006 * remove whitespace in prep * getStyleDeclaration -> getStyle * remove editable region from solution 🤦♂️ * fix: correct tests to fail on initial * fix: add missing regex Co-authored-by: gikf <60067306+gikf@users.noreply.github.com> * fix: correct tests * remove commas and stuff 🤷♂️ Co-authored-by: Nicholas Carrigan (he/him) <nhcarrigan@gmail.com> * uppercaserise doctype Co-authored-by: Nicholas Carrigan (he/him) <nhcarrigan@gmail.com> * add "the" Co-authored-by: Nicholas Carrigan (he/him) <nhcarrigan@gmail.com> * remove half-colon Co-authored-by: Nicholas Carrigan (he/him) <nhcarrigan@gmail.com> * use more boring form of the word "shoudl" Co-authored-by: Nicholas Carrigan (he/him) <nhcarrigan@gmail.com> * add suggestions to tests * Update curriculum/challenges/english/01-responsive-web-design/css-variables-skyline/part-015.md * Update curriculum/challenges/english/01-responsive-web-design/css-variables-skyline/part-016.md * Update curriculum/challenges/english/01-responsive-web-design/css-variables-skyline/part-016.md * Update curriculum/challenges/english/01-responsive-web-design/css-variables-skyline/part-016.md * Update curriculum/challenges/english/01-responsive-web-design/css-variables-skyline/part-022.md * Update curriculum/challenges/english/01-responsive-web-design/css-variables-skyline/part-093.md * Update curriculum/challenges/english/01-responsive-web-design/css-variables-skyline/part-098.md * Update curriculum/challenges/english/01-responsive-web-design/css-variables-skyline/part-101.md * Update curriculum/challenges/english/01-responsive-web-design/css-variables-skyline/part-023.md * Update curriculum/challenges/english/01-responsive-web-design/css-variables-skyline/part-024.md * Update curriculum/challenges/english/01-responsive-web-design/css-variables-skyline/part-026.md * Update curriculum/challenges/english/01-responsive-web-design/css-variables-skyline/part-035.md * Update curriculum/challenges/english/01-responsive-web-design/css-variables-skyline/part-058.md * Update curriculum/challenges/english/01-responsive-web-design/css-variables-skyline/part-090.md * Update curriculum/challenges/english/01-responsive-web-design/css-variables-skyline/part-058.md * Update curriculum/challenges/english/01-responsive-web-design/css-variables-skyline/part-064.md * Update curriculum/challenges/english/01-responsive-web-design/css-variables-skyline/part-064.md * Update curriculum/challenges/english/01-responsive-web-design/css-variables-skyline/part-064.md * Update curriculum/challenges/english/01-responsive-web-design/css-variables-skyline/part-076.md * Update curriculum/challenges/english/01-responsive-web-design/css-variables-skyline/part-070.md * Update curriculum/challenges/english/01-responsive-web-design/css-variables-skyline/part-079.md * Update curriculum/challenges/english/01-responsive-web-design/css-variables-skyline/part-085.md * Update curriculum/challenges/english/01-responsive-web-design/css-variables-skyline/part-086.md * Update curriculum/challenges/english/01-responsive-web-design/css-variables-skyline/part-087.md * Update curriculum/challenges/english/01-responsive-web-design/css-variables-skyline/part-090.md * Update curriculum/challenges/english/01-responsive-web-design/css-variables-skyline/part-019.md * Update curriculum/challenges/english/01-responsive-web-design/css-variables-skyline/part-019.md * Update curriculum/challenges/english/01-responsive-web-design/css-variables-skyline/part-019.md * Update curriculum/challenges/english/01-responsive-web-design/css-variables-skyline/part-074.md * Update curriculum/challenges/english/01-responsive-web-design/css-variables-skyline/part-078.md * fix: the few commits I couldn't add on github * fix: lesson 41 Co-authored-by: gikf <60067306+gikf@users.noreply.github.com> Co-authored-by: Nicholas Carrigan (he/him) <nhcarrigan@gmail.com> Co-authored-by: Tom <20648924+moT01@users.noreply.github.com>
1.9 KiB
1.9 KiB
id, title, challengeType, dashedName
id | title | challengeType | dashedName |
---|---|---|---|
5d822fd413a79914d39e98d7 | Part 15 | 0 | part-15 |
--description--
To use a variable, put the variable name in parentheses with var
in front of them like this: var(--variable-name)
. Add your variable as the value of the background-color
property of the .bb1a
class. Whatever value you gave the variable will be applied to whatever property you use it on. In this case, your variable has the value of #999
. So #999
will be used as the value for the background-color
property.
--hints--
The background-color
of the bb1a
element should be set.
assert.exists(new __helpers.CSSHelp(document).getStyle('.bb1a')?.backgroundColor)
You should use var(--building-color1)
to set the background-color
of the .bb1a
element.
assert.equal(new __helpers.CSSHelp(document).getStyle('.bb1a')?.backgroundColor.trim(), 'var(--building-color1)');
--seed--
--seed-contents--
<!DOCTYPE html>
<html>
<head>
<title>freeCodeCamp Skyline Project</title>
<link href="styles.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="background-buildings">
<div class="bb1">
<div class="bb1a"></div>
<div class="bb1b"></div>
<div class="bb1c"></div>
<div class="bb1d"></div>
</div>
</div>
</body>
</html>
* {
border: 1px solid black;
box-sizing: border-box;
}
body {
height: 100vh;
margin: 0;
overflow: hidden;
}
.background-buildings {
width: 100%;
height: 100%;
}
.bb1 {
width: 10%;
height: 70%;
display: flex;
flex-direction: column;
align-items: center;
--building-color1: #999;
}
--fcc-editable-region--
.bb1a {
width: 70%;
height: 10%;
}
--fcc-editable-region--
.bb1b {
width: 80%;
height: 10%;
}
.bb1c {
width: 90%;
height: 10%;
}
.bb1d {
width: 100%;
height: 70%;
}