Skip to content

Make test your skills boilerplate more consistent #40447

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Conversation

chrisdavidmills
Copy link
Contributor

Description

As per the following comments:

This PR attempts to make all the "test your skills" boilerplate a bit more consistent.

This is quite a lot to review, so apologies, but it should be a matter of looking at a few to make sure the boilerplate looks OK, and then skimming the live pages to make sure nothing looks broken.

Motivation

Additional details

Related issues and pull requests

@chrisdavidmills chrisdavidmills requested review from a team as code owners July 19, 2025 17:20
@chrisdavidmills chrisdavidmills requested review from wbamberg and removed request for a team July 19, 2025 17:20
@github-actions github-actions bot added Content:WebAPI Web API docs Content:Learn Learning area docs labels Jul 19, 2025
@chrisdavidmills chrisdavidmills requested review from bsmth and removed request for a team and wbamberg July 19, 2025 17:20
@github-actions github-actions bot added the size/l [PR only] 501-1000 LoC changed label Jul 19, 2025
Copy link
Contributor

github-actions bot commented Jul 19, 2025

Preview URLs (34 pages)
Flaws (3)

Note! 33 documents with no flaws that don't need to be listed. 🎉

URL: /en-US/docs/Learn_web_development
Title: Learn web development
Flaw count: 3

  • unknown:
    • No generic content config found
    • no blog root
    • no blog root
External URLs (3)

URL: /en-US/docs/Learn_web_development
Title: Learn web development


URL: /en-US/docs/Learn_web_development/Core/CSS_layout/Test_your_skills/Responsive_design
Title: Test your skills: Responsive web design and media queries

(comment last updated: 2025-07-23 11:15:45)

@github-actions github-actions bot removed the Content:WebAPI Web API docs label Jul 21, 2025
@github-actions github-actions bot added the merge conflicts 🚧 [PR only] label Jul 22, 2025
Copy link
Contributor

This pull request has merge conflicts that must be resolved before it can be merged.

@github-actions github-actions bot added size/xl [PR only] >1000 LoC changed and removed size/l [PR only] 501-1000 LoC changed labels Jul 22, 2025
@github-actions github-actions bot removed the merge conflicts 🚧 [PR only] label Jul 22, 2025
@chrisdavidmills chrisdavidmills requested a review from bsmth July 22, 2025 12:53
@@ -329,3 +303,5 @@ item.addEventListener("keyup", (e) => {
```

</details>

&nbsp;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is this to create some padding between the feedback box and the end of the article? I think this is fixed in the new frontend, so better to avoid it

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, that is exactly right ;-)

I'll remove them, in that case.

If you make a mistake, you can clear your work using the Reset button in the MDN Playground. If you get really stuck, you can (usually) view the solution at the bottom of each question section, or [reach out for help](#contact_us).

> [!NOTE]
> If you'd prefer to work in your own editor or in an online editor (such as [CodePen](https://codepen.io/) or [JSFiddle](https://jsfiddle.net/)), you can feel free to copy the code from the MDN Playground into your chosen environment.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Lovely

Suggested change
> If you'd prefer to work in your own editor or in an online editor (such as [CodePen](https://codepen.io/) or [JSFiddle](https://jsfiddle.net/)), you can feel free to copy the code from the MDN Playground into your chosen environment.
> If you'd prefer to work in your own editor or in an online editor (such as [CodePen](https://codepen.io/) or [JSFiddle](https://jsfiddle.net/)), you can copy the code from the MDN Playground into your chosen environment.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

updated

> [!NOTE]
> If you'd prefer to work in your own editor or in an online editor (such as [CodePen](https://codepen.io/) or [JSFiddle](https://jsfiddle.net/)), you can feel free to copy the code from the MDN Playground into your chosen environment.

Some questions don't feature in-page starting code, and instead ask you to download starter files to work on your local machine with. Sometimes this is due to the complex nature of the question, and sometimes we just wanted to change things up a bit.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
Some questions don't feature in-page starting code, and instead ask you to download starter files to work on your local machine with. Sometimes this is due to the complex nature of the question, and sometimes we just wanted to change things up a bit.
Some questions don't include code blocks to start from, and instead ask you to download starter files to work on your local machine with. Sometimes this is due to the complex nature of the question, and sometimes we just wanted to change things up a bit.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

updated

Copy link
Member

@bsmth bsmth left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looking really good, tnx. Let's remove the &nbsp; for now and we can get these improvements in! Well done 🎉

@chrisdavidmills
Copy link
Contributor Author

Looking really good, tnx. Let's remove the &nbsp; for now and we can get these improvements in! Well done 🎉

Woo hoo! Cheers @bsmth!

@chrisdavidmills chrisdavidmills merged commit 2f16610 into mdn:main Jul 23, 2025
8 checks passed
@chrisdavidmills chrisdavidmills deleted the test-your-skills-note-boilerplate-wording branch July 23, 2025 11:19
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Content:Learn Learning area docs size/xl [PR only] >1000 LoC changed
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants