kazhnuz.space/kazhnuz.space
1
0
Fork 0
Code Issues 8 Pull requests Projects Releases Packages Wiki Activity

[about] ⚡️ | Converti les images des anciennes versions
All checks were successful
continuous-integration/drone Build is passing
Details

Browse source
This commit is contained in:
Kazhnuz 2024-12-06 18:24:42 +01:00
parent 84040512d0
commit 065abb3b40
3 changed files with 28 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
_includes/layouts/old.njk
View file

@ -7,8 +7,9 @@ layout: layouts/base.njk
<h1>{{oldVersion.key}} - {{oldVersion.yearStart}}</h1> <h1>{{oldVersion.key}} - {{oldVersion.yearStart}}</h1>
{{ content | safe }} {{ content | safe }}
<p><em>Propulsé à cette époque par {{ oldVersion.engine }}</em></p> <p><em>Propulsé à cette époque par {{ oldVersion.engine }}</em></p>
<img src="/img/articles/old/{{oldVersion.img}}" alt="{{oldVersion.alt}}"> {%- set thumb = "../../public/img/articles/old/" + oldVersion.img -%}
<p>( Vous pouvez affichez l'image en plus grand en l'ouvrant dans un nouvel onglet )</p> <a href="/img/articles/old/{{oldVersion.img}}" target="_blank">{%- image thumb, "", [800] -%}</a>
<p>( Vous pouvez affichez l'image en plus grand en cliquant dessus, l'image complète s'ouvrira dans un nouvel onglet )</p>
</article> </article>
{% renderFile "./_includes/footer.md" %} {% renderFile "./_includes/footer.md" %}
</main> </main>

5
content/about/index.md
View file

@ -62,7 +62,10 @@ J’ai pour but de faire pas mal d’autres petits sites suivant mes intérêts
<a href="{{ post.url }}" class="preview-link"> <a href="{{ post.url }}" class="preview-link">
<h1 class="card-header"> {{ post.data.oldVersion.key }} </h1> <h1 class="card-header"> {{ post.data.oldVersion.key }} </h1>
<div class="preview-content"> <div class="preview-content">
<div class="preview-exerpt" aria-hidden="true"><p class="p-img"><img class="preview-img" src="/img/articles/old/{{ post.data.oldVersion.img }}" /></p></div> <div class="preview-exerpt" aria-hidden="true"><p class="p-img">
{%- set thumb = "../../public/img/articles/old/" + post.data.oldVersion.img -%}
{%- thumbnail thumb, "" -%}
</p></div>
<div class="preview-overlay"> <div class="preview-overlay">
<div class="preview-metadata"> <div class="preview-metadata">
<div class="metadata-pills"> <div class="metadata-pills">

21
eleventy.config.images.js
View file

@ -31,4 +31,25 @@ module.exports = eleventyConfig => {
}; };
return eleventyImage.generateHTML(metadata, imageAttributes); return eleventyImage.generateHTML(metadata, imageAttributes);
}); });
eleventyConfig.addAsyncShortcode("thumbnail", async function imageShortcode(src, alt, widths, sizes) {
// Full list of formats here: https://www.11ty.dev/docs/plugins/image/#output-formats
// Warning: Avif can be resource-intensive so take care!
let formats = ["avif", "webp", "auto"];
let file = relativeToInputPath(this.page.inputPath, src);
let metadata = await eleventyImage(file, {
widths: [360],
formats,
outputDir: path.join(eleventyConfig.dir.output, "img"), // Advanced usage note: `eleventyConfig.dir` works here because we’re using addPlugin.
});
// TODO loading=eager and fetchpriority=high
let imageAttributes = {
alt,
sizes,
loading: "lazy",
decoding: "async",
};
return eleventyImage.generateHTML(metadata, imageAttributes);
});
}; };