fix: responsive img

This commit is contained in:
Kazhnuz 2024-10-05 17:41:09 +02:00
parent 9548c0dcdb
commit 78b9f5d65b
4 changed files with 13 additions and 1 deletions

BIN
data/cat.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 94 KiB

View file

@ -17,6 +17,12 @@ Contenu du `details`.
La balise `<mark>` permet d'afficher simplement des éléments en <mark>surbrillance</mark>. Cela utilise la couleur d'accent claire (et sombre en mode sombre). Le style est proche de celui de code, mais sans monospace et avec la couleur d'accent.
# Image
Une image dans un paragraphe seul sera automatiquement en bloc, centrée et responsive
![Une photo de chat, bien sûr](/cat.jpg)
## Classes utilitaires
Quelques classes CSS sont utilisées afin d'avoir quelques outils supplémentaires utiles, notamment dans le cadre des flexboxes.

View file

@ -10,7 +10,7 @@
"minify-no-source-map": "sass --watch --no-source-map scss/moineau.scss --style compressed dist/css/moineau.min.css",
"build": "sass scss/moineau.scss dist/css/moineau.css && sass scss/moineau.scss --style compressed dist/css/moineau.min.css",
"serve": "http-server ./dist & npm run site & npm run minify",
"site": "node generate.js"
"site": "cp data/cat.jpg dist/cat.jpg & node generate.js"
},
"repository": {
"type": "git",

View file

@ -140,6 +140,12 @@ pre, code {
font-family: var(--font-family-monospace);
}
p > img:only-child {
display: block;
max-width: 100%;
margin:auto;
}
/* ------------------ TITLES ------------------- */
hgroup > :is(h1, h2, h3, h4, h5, h6) {