chore(landing): use WebP image format

ncarlier · Apr 29, 2024 · 1193975 · 1193975
1 parent 57e39ef
commit 1193975
Show file tree

Hide file tree

Showing 5 changed files with 8 additions and 2 deletions.
diff --git a/landing/components/Hero.jsx b/landing/components/Hero.jsx
@@ -12,7 +12,10 @@ const Hero = () => {
         <a href="https://readflow.app/login" className="primary btn">{t('get-started')}</a>
       </div>
       <div>
-        <img src="./img/relax.png" alt="Reading with peaceful mindset" />
+        <picture>
+          <source srcset="./img/relax.webp" type="image/webp" />
+          <img src="./img/relax.png" alt="Reading with peaceful mindset" />
+        </picture>
       </div>
     </section>
   )

diff --git a/landing/components/Screenshot.jsx b/landing/components/Screenshot.jsx
@@ -11,7 +11,10 @@ const Screenshot = () => {
         <hr />
       </header>
       <figure>
-        <img src="./img/screenshot.png" alt="screenshot" />
+        <picture>
+          <source srcset="./img/screenshot.webp" type="image/webp" />
+          <img src="./img/screenshot.png" alt="screenshot" />
+        </picture>
       </figure>
       <header className={styles.try}>
         <h1>{t('try')}</h1>

diff --git a/landing/public/img/relax.webp b/landing/public/img/relax.webp
diff --git a/landing/public/img/screenshot.png b/landing/public/img/screenshot.png
diff --git a/landing/public/img/screenshot.webp b/landing/public/img/screenshot.webp