jprdonnelly/freeCodeCamp
1
0
Fork 0
mirror of https://github.com/freeCodeCamp/freeCodeCamp.git synced 2026-06-03 01:01:13 -04:00
Code Issues Projects Releases Wiki Activity

chore(curriculum): update assets in workshop magazine step 76, 77, and 79 (#61386)

Browse Source
This commit is contained in:
Vivaan Teotia
2025-07-18 00:26:49 +05:30
committed by GitHub
parent a3c1cc15d3
commit ec3ff93556
3 changed files with 8 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
curriculum/challenges/english/25-front-end-development/workshop-magazine/6148f34ebedc2274bceeb99c.md
View File

@@ -18,19 +18,19 @@ This will collapse the three images into one column on smaller screens.
You should have a new `@media` rule for `only screen and (max-width: 720px)`.
```js
assert(new __helpers.CSSHelp(document).getCSSRules('media')?.[0]?.media?.mediaText === 'only screen and (max-width: 720px)');
assert.equal(new __helpers.CSSHelp(document).getCSSRules('media')?.[0]?.media?.mediaText, 'only screen and (max-width: 720px)');
```
Your new `@media` rule should have an `.image-wrapper` selector.
```js
assert(new __helpers.CSSHelp(document).getCSSRules('media')?.[0]?.cssRules?.[0]?.selectorText === '.image-wrapper');
assert.equal(new __helpers.CSSHelp(document).getCSSRules('media')?.[0]?.cssRules?.[0]?.selectorText, '.image-wrapper');
```
Your new `.image-wrapper` selector should have a `grid-template-columns` property of `1fr`.
```js
assert(new __helpers.CSSHelp(document).getCSSRules('media')?.[0]?.cssRules?.[0]?.style?.gridTemplateColumns === '1fr');
assert.equal(new __helpers.CSSHelp(document).getCSSRules('media')?.[0]?.cssRules?.[0]?.style?.gridTemplateColumns, '1fr');
```
# --seed--

6
curriculum/challenges/english/25-front-end-development/workshop-magazine/6148f600cde42b7670c2611f.md
View File

@@ -16,19 +16,19 @@ This will collapse your bottom text area into a single column on smaller screens
You should create a new `@media` query for `only screen and (max-width: 600px)`. This should be below your previous `@media` query.
```js
assert(new __helpers.CSSHelp(document).getCSSRules('media')?.[1]?.media?.mediaText === 'only screen and (max-width: 600px)');
assert.equal(new __helpers.CSSHelp(document).getCSSRules('media')?.[1]?.media?.mediaText, 'only screen and (max-width: 600px)');
```
Your new `@media` query should have a `.text-with-images` selector.
```js
assert(new __helpers.CSSHelp(document).getCSSRules('media')?.[1]?.cssRules?.[0]?.selectorText === '.text-with-images');
assert.equal(new __helpers.CSSHelp(document).getCSSRules('media')?.[1]?.cssRules?.[0]?.selectorText, '.text-with-images');
```
Your new `.text-with-images` selector should have a `grid-template-columns` property with a value of `1fr`.
```js
assert(new __helpers.CSSHelp(document).getCSSRules('media')?.[1]?.cssRules?.[0]?.style?.gridTemplateColumns === '1fr');
assert.equal(new __helpers.CSSHelp(document).getCSSRules('media')?.[1]?.cssRules?.[0]?.style?.gridTemplateColumns, '1fr');
```
# --seed--

4
curriculum/challenges/english/25-front-end-development/workshop-magazine/6148f6f7d8914c78e93136ca.md
View File

@@ -22,13 +22,13 @@ assert.equal(new __helpers.CSSHelp(document).getCSSRules('media')?.[3]?.media?.m
Your new `@media` query should have a `.hero-title` selector.
```js
assert(new __helpers.CSSHelp(document).getCSSRules('media')?.[3]?.cssRules?.[0]?.selectorText === '.hero-title');
assert.equal(new __helpers.CSSHelp(document).getCSSRules('media')?.[3]?.cssRules?.[0]?.selectorText, '.hero-title');
```
Your `.hero-title` selector should have a `font-size` property set to `4.5rem`.
```js
assert(new __helpers.CSSHelp(document).getCSSRules('media')?.[3]?.cssRules?.[0]?.style?.fontSize === '4.5rem');
assert.equal(new __helpers.CSSHelp(document).getCSSRules('media')?.[3]?.cssRules?.[0]?.style?.fontSize, '4.5rem');
```
# --seed--