Add images to make the homepage more visual and create an image credits page to properly attribute images
Reference: https://apaskulin.github.io/wmf-dev-portal-draft/
## Homepage images
| Section | Image | Image link
| Use content and data | Graph | https://commons.wikimedia.org/wiki/File:Adapted_Wikipedia20symbol_data.svg
| Build tools and bots | Chemistry | https://commons.wikimedia.org/wiki/File:Adapted_Wikipedia20symbol_chemistry.svg
| Contribute | Computer | https://commons.wikimedia.org/wiki/File:Adapted_Wikipedia20symbol_computer.svg
| Connect and learn | Globe | https://commons.wikimedia.org/wiki/File:Adapted_Wikipedia20symbol_world.svg
## Notes from design jam on 2022/03/16
Image files can be stored in /src/assets.
Add image directly to a Markdown file, such as index.md:
```
```
Add image at the document level via template:
```
# In .jinja file
{% if doc.icon %}
{% endif %}
# In .yaml file
icon: /assets/computer-illustration.svg
alttext: A computer browsing Wikipedia
```
#### Styles
Initial styles for homepage images in the style of the [draft site](https://apaskulin.github.io/wmf-dev-portal-draft/):
```
width: 170px;
float: left;
padding-right: 40px;
padding-top: 30px;
```
Styles can be applied in Markdown using the `{ class="classname" }` syntax:
```
{ class="section-icon" }
```
Or, perhaps problematically, prevent `{ class="classname" }` appearing in the translation file by using generalized styles:
```
p > img {
...
}
```
To do:
- [x] Research usage guidelines for Wikipedia 20 images
- Per this [office wiki page](https://office.wikimedia.org/wiki/Communications/Wikipedia20Symbols) (restricted access), we can only use black and white versions of the Wikipedia 20 graphics, not the color ones.
- [ ] Experiment with the [light mode/dark mode image feature](https://squidfunk.github.io/mkdocs-material/reference/images/#light-and-dark-mode)