Convert all jpg pictures to webp

Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
Thomas Citharel
2022-08-12 16:40:04 +02:00
parent 57c3df43ff
commit 9d00aff619
106 changed files with 15 additions and 54 deletions

View File

@@ -15,17 +15,17 @@
class="brightness-50"
>
<source
:srcset="`/img/categories/${category.key.toLowerCase()}.jpg 2x, /img/categories/${category.key.toLowerCase()}.jpg`"
:srcset="`/img/categories/${category.key.toLowerCase()}.webp 2x, /img/categories/${category.key.toLowerCase()}.webp`"
media="(min-width: 1000px)"
/>
<source
:srcset="`/img/categories/${category.key.toLowerCase()}.jpg 2x, /img/categories/${category.key.toLowerCase()}-small.jpg`"
:srcset="`/img/categories/${category.key.toLowerCase()}.webp 2x, /img/categories/${category.key.toLowerCase()}-small.webp`"
media="(min-width: 300px)"
/>
<img
class="w-full h-36 w-36 md:h-52 md:w-52 object-cover"
:src="`/img/categories/${category.key.toLowerCase()}.jpg`"
:srcset="`/img/categories/${category.key.toLowerCase()}-small.jpg `"
:src="`/img/categories/${category.key.toLowerCase()}.webp`"
:srcset="`/img/categories/${category.key.toLowerCase()}-small.webp `"
width="384"
height="384"
alt=""

View File

@@ -8,13 +8,8 @@
:srcset="`/img/pics/error-480w.webp 1x, /img/pics/error-1024w.webp 2x`"
type="image/webp"
/>
<source
:srcset="`/img/pics/error-480w.jpg 1x, /img/pics/error-1024w.jpg 2x`"
type="image/jpeg"
/>
<img
:src="`/img/pics/error-480w.jpg`"
:src="`/img/pics/error-480w.webp`"
alt=""
width="480"
height="312"

View File

@@ -8,12 +8,8 @@
:srcset="`/img/pics/footer_${random}-1024w.webp 1x, /img/pics/footer_${random}-1920w.webp 2x`"
type="image/webp"
/>
<source
:srcset="`/img/pics/footer_${random}-1024w.jpg 1x, /img/pics/footer_${random}-1920w.jpg 2x`"
type="image/jpeg"
/>
<img
:src="`/img/pics/footer_${random}-1024w.jpg`"
:src="`/img/pics/footer_${random}-1024w.webp`"
alt=""
width="1024"
height="428"

View File

@@ -31,7 +31,7 @@
},
}"
:picture="{
url: '/img/online-event.jpg',
url: '/img/online-event.webp',
author: {
name: 'Chris Montgomery',
url: 'https://unsplash.com/@cwmonty',

View File

@@ -56,17 +56,17 @@
>
<picture class="brightness-50">
<source
:srcset="`/img/categories/${key.toLowerCase()}.jpg 2x, /img/categories/${key.toLowerCase()}.jpg`"
:srcset="`/img/categories/${key.toLowerCase()}.webp 2x, /img/categories/${key.toLowerCase()}.webp`"
media="(min-width: 1000px)"
/>
<source
:srcset="`/img/categories/${key.toLowerCase()}.jpg 2x, /img/categories/${key.toLowerCase()}-small.jpg`"
:srcset="`/img/categories/${key.toLowerCase()}.webp 2x, /img/categories/${key.toLowerCase()}-small.webp`"
media="(min-width: 300px)"
/>
<img
class="w-full h-12 w-12 object-cover"
:src="`/img/categories/${key.toLowerCase()}.jpg`"
:srcset="`/img/categories/${key.toLowerCase()}-small.jpg `"
:src="`/img/categories/${key.toLowerCase()}.webp`"
:srcset="`/img/categories/${key.toLowerCase()}-small.webp `"
alt=""
/>
</picture>

View File

@@ -205,11 +205,11 @@ section {
.not-found {
.img-container {
background-image: url("../../../public/img/pics/group-480w.jpg");
background-image: url("../../../public/img/pics/group-480w.webp");
@media (min-resolution: 2dppx) {
& {
background-image: url("../../../public/img/pics/group-1024w.jpg");
background-image: url("../../../public/img/pics/group-1024w.webp");
}
}
&.webp {

View File

@@ -102,7 +102,7 @@
/>
<img
:src="`/img/pics/homepage-1024w.jpg`"
:src="`/img/pics/homepage-1024w.webp`"
width="3840"
height="2719"
alt=""

View File

@@ -7,13 +7,9 @@
:srcset="`/img/pics/error-480w.webp 1x, /img/pics/error-1024w.webp 2x`"
type="image/webp"
/>
<source
:srcset="`/img/pics/error-480w.jpg 1x, /img/pics/error-1024w.jpg 2x`"
type="image/jpeg"
/>
<img
:src="`/img/pics/error-480w.jpg`"
:src="`/img/pics/error-480w.webp`"
alt=""
width="2616"
height="1698"