fa84f6c449
* feat: generating steps - Steps 1-32 done. - Steps 33-80 done. - Instructions 1-26 done. - Instructions 27-61 done. - More steps. - Instructions 62-88 done. - Clarify instructions for new concepts. - build fixes - Audit instructions on live site. * fix: add helpCategory * feat: write tests * feat: add intro * chore: use the right selectors Co-authored-by: gikf <60067306+gikf@users.noreply.github.com> * chore: cannot read property Shaun of undefined :) Co-authored-by: Shaun Hamilton <shauhami020@gmail.com> * feat: Shau-ptional chaining * chore: apply shaun's review suggestions Co-authored-by: Shaun Hamilton <shauhami020@gmail.com> * fix: uncross my wires * chore: apply shaun's review suggestions Co-authored-by: Shaun Hamilton <shauhami020@gmail.com> Co-authored-by: gikf <60067306+gikf@users.noreply.github.com> Co-authored-by: Shaun Hamilton <shauhami020@gmail.com>
59 lines
1.3 KiB
Markdown
59 lines
1.3 KiB
Markdown
---
|
|
id: 60b69a66b6ddb80858c5157a
|
|
title: Part 4
|
|
challengeType: 0
|
|
dashedName: part-4
|
|
---
|
|
|
|
# --description--
|
|
|
|
FontAwesome is a library of SVG-powered icons, many of which are freely available to use. You will be using some of these icons in this project, so you will need to link the external stylesheet to your HTML.
|
|
|
|
Add a `link` element with a `rel` of `stylesheet` and an `href` of `https://use.fontawesome.com/releases/v5.8.2/css/all.css`.
|
|
|
|
# --hints--
|
|
|
|
You should add another `link` element.
|
|
|
|
```js
|
|
// We set this to 1 because the CSS link is stripped from the code by our parser.
|
|
assert(document.querySelectorAll('link').length === 2);
|
|
```
|
|
|
|
Your `link` element should have a `rel` of `stylesheet`.
|
|
|
|
```js
|
|
assert(document.querySelector('link')?.getAttribute('rel') === 'stylesheet');
|
|
```
|
|
|
|
Your `link` element should have an `href` of
|
|
`https://use.fontawesome.com/releases/v5.8.2/css/all.css`.
|
|
|
|
```js
|
|
assert(document.querySelectorAll('link')?.[1]?.getAttribute('href') === 'https://use.fontawesome.com/releases/v5.8.2/css/all.css')
|
|
```
|
|
|
|
# --seed--
|
|
|
|
## --seed-contents--
|
|
|
|
```html
|
|
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>freeCodeCamp Picasso Painting</title>
|
|
<link rel="stylesheet" type="text/css" href="./styles.css" />
|
|
--fcc-editable-region--
|
|
|
|
--fcc-editable-region--
|
|
</head>
|
|
<body>
|
|
</body>
|
|
</html>
|
|
```
|
|
|
|
```css
|
|
|
|
```
|