Revert edit, turns out code previews are already documented in the linked page 🤦🏽‍♀️

This commit is contained in:
Lea Verou
2024-12-04 17:17:26 -05:00
parent 471cb0287d
commit 8d93a44566

View File

@@ -3,21 +3,3 @@
Before contributing, please review the contributions guidelines at: Before contributing, please review the contributions guidelines at:
[webawesome.com/docs/resources/contributing](https://webawesome.com/docs/resources/contributing) [webawesome.com/docs/resources/contributing](https://webawesome.com/docs/resources/contributing)
## Website Architecture
### Code Examples
`/docs/_utils/code-examples.js` is a small 11ty plugin that turns the code examples into previews. It relies on a client-side script of the same name that lives in /docs/assets/scripts and gets loaded into the sites template.
That takes care of rendering standard code blocks. It supports certain modifier classes:
- `example`: opts a code snippet in to live demo rendering
- `no-edit`: removes the codepen button
- `open`: shows the code snippet by default
Modifier classes are used like this:
```
```html {.example .no-edit .open}
```
That will render an example without the CodePen button and with the code already shown.