gitadmin/freeCodeCamp
1
0
Fork 0
mirror of https://github.com/freeCodeCamp/freeCodeCamp.git synced 2026-05-28 18:26:54 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(curriculum): clarify selector-specific styling in Moon Orbit lab (#61413)

Browse Source 
Co-authored-by: Huyen Nguyen <25715018+huyenltnguyen@users.noreply.github.com>
Co-authored-by: Ilenia <26656284+ilenia-magoni@users.noreply.github.com>
This commit is contained in:
haiderr510
2025-07-30 15:33:11 -07:00
committed by GitHub
parent a963042e08
commit 97f2788dad
1 changed files with 8 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
curriculum/challenges/english/25-front-end-development/lab-moon-orbit/66a37f37ef5823a313de8c26.md
+8 -6
View File
@@ -40,9 +40,11 @@ Fulfill the user stories below and get all the tests to pass to complete the lab
13. You should further adjust the horizontal positioning of the `.moon` element by moving the element to the left by half of its width.
14. Your `.earth` and `.moon` elements should have a background color and a `border-radius` of `50%` to make them look like planets.
14. The `.earth` selector should have a background color and a `border-radius` of `50%`.
15. You should define a `@keyframes orbit` animation that rotates the `.orbit` element 360 degrees around its center. You should apply this animation to the `.orbit` element with a duration of `5` seconds, a linear timing function, and infinite iterations.
15. The `.moon` selector should have a background color and a `border-radius` of `50%`.
16. You should define a `@keyframes orbit` animation that rotates the `.orbit` element 360 degrees around its center. You should apply this animation to the `.orbit` element with a duration of `5` seconds, a linear timing function, and infinite iterations.
**Note:** Be sure to link your stylesheet in your HTML and apply your CSS.
@@ -186,25 +188,25 @@ The `.moon` element should be adjusted horizontally by translating it to `-50%`
assert.strictEqual(new __helpers.CSSHelp(document).getStyle('.moon')?.transform, 'translateX(-50%)');
```
Your `.earth` element should have a background color.
The `.earth` selector should have a background color.
```js
assert.isNotEmpty(new __helpers.CSSHelp(document).getStyle('.earth')?.backgroundColor);
```
Your `.earth` element should have `border-radius` of `50%` to make it look like a circle.
The `.earth` selector should have `border-radius` of `50%`.
```js
assert.strictEqual(new __helpers.CSSHelp(document).getStyle('.earth')?.borderRadius, '50%');
```
Your `.moon` element should have a background color.
The `.moon` selector should have a background color.
```js
assert.isNotEmpty(new __helpers.CSSHelp(document).getStyle('.moon')?.backgroundColor);
```
Your `.moon` element should have `border-radius` of `50%` to make it look like a circle.
The `.moon` selector should have `border-radius` of `50%`.
```js
assert.strictEqual(new __helpers.CSSHelp(document).getStyle('.moon')?.borderRadius, '50%');