wires/hypnagaga_old
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

new built with, image size corrections in blog

Browse source
This commit is contained in:
madrilene 2023-04-11 14:22:35 +02:00
parent 2e7ebcb112
commit fee74d78ad
3 changed files with 7 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "eleventy-excellent", "name": "eleventy-excellent",
"version": "1.4.8", "version": "1.5.0",
"description": "Eleventy starter based on the workflow suggested by Andy Bell's buildexcellentwebsit.es.", "description": "Eleventy starter based on the workflow suggested by Andy Bell's buildexcellentwebsit.es.",
"author": "Lene Saile", "author": "Lene Saile",
"license": "ISC", "license": "ISC",

1
readme.md
View file

@ -98,6 +98,7 @@ npm run build
A list of sites based on eleventy-excellent, some only slightly modified, others completely transformed. A list of sites based on eleventy-excellent, some only slightly modified, others completely transformed.
- [misremembe.red](https://misremembe.red/)
- [joewrites.io](https://joewrites.io/) - [joewrites.io](https://joewrites.io/)
- [flamedfury.com](https://flamedfury.com/) - [flamedfury.com](https://flamedfury.com/)
- [deimidis.me](https://deimidis.me/) - [deimidis.me](https://deimidis.me/)

10
src/posts/2022-10-12-post-with-image.md
View file

@ -6,7 +6,7 @@ date: 2022-10-12
This starter uses Eleventy's build-time image transformations. Find more info on https://www.11ty.dev/docs/plugins/image/ and edit settings in `config/shortcodes/imagePlaceholder`. This starter uses Eleventy's build-time image transformations. Find more info on https://www.11ty.dev/docs/plugins/image/ and edit settings in `config/shortcodes/imagePlaceholder`.
For now there are three image sizes: 320px, 550px and 820px. For now there are three image sizes: 320px, 570px and 820px.
820px is the maximum size, equivalent to the width set for our content wrapper in `prose.css`: `--wrapper-max-width: 55rem;`. 820px is the maximum size, equivalent to the width set for our content wrapper in `prose.css`: `--wrapper-max-width: 55rem;`.
The `sizes` attribute is set to `sizes = '(min-width: 55rem) 820px, 100vw'`. The `sizes` attribute is set to `sizes = '(min-width: 55rem) 820px, 100vw'`.
@ -43,12 +43,12 @@ You can change the CSS for the page and blog post images in `./src/assets/css/bl
```css ```css
.page img { .page img {
width: 100%; max-inline-size: 100%;
height: auto; block-size: auto;
} }
.blog img { .blog img {
width: 100%; max-inline-size: 100%;
height: auto; block-size: auto;
} }
``` ```