chore: converted png screenshots to webp

public/index.html

@@ -5,13 +5,13 @@
 <img class="h-10 w-auto" src=images/mchat_icon.svg alt>
 </a><button type=button class="-m-2.5 rounded-md p-2.5 text-gray-400" id=mobile-navbar-close-btn>
 <span class=sr-only>Close menu</span><svg class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentcolor" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" d="M6 18 18 6M6 6l12 12"/></svg></button></div><div class="mt-6 flow-root"><div class="-my-6 divide-y divide-gray-500/25"><div class="space-y-2 py-6"><a href=changelogs class="-mx-3 block rounded-lg px-3 py-2 text-base font-semibold leading-7 text-white hover:bg-gray-800">#Changelog (v0.10.2-alpha.1)</a></div></div></div></div></div></header><div class="main-wrapper flex flex-col pt-6"><div id=particles-js class="main grow"><div class="relative isolate"><div class="absolute inset-x-0 -top-40 -z-10 transform-gpu overflow-hidden blur-3xl sm:-top-80" aria-hidden=true><div class="relative left-[calc(50%-11rem)] aspect-[1155/678] w-[36.125rem] -translate-x-1/2 rotate-[30deg] bg-gradient-to-tr from-[#ff80b5] to-[#9089fc] opacity-20 sm:left-[calc(50%-30rem)] sm:w-[72.1875rem]" style="clip-path:polygon(74.1% 44.1%,100% 61.6%,97.5% 26.9%,85.5% .1%,80.7% 2%,72.5% 32.5%,60.2% 62.4%,52.4% 68.1%,47.5% 58.3%,45.2% 34.5%,27.5% 76.7%,.1% 64.9%,17.9% 100%,27.6% 76.8%,76.1% 97.7%,74.1% 44.1%)"></div></div><div class="py-8 sm:py-16 lg:pb-40"><div class="mx-auto max-w-7xl px-6 lg:px-8"><div class="mx-auto max-w-2xl text-center"><h1 class="text-4xl font-bold tracking-tight text-white sm:text-6xl">Mchat</h1><p class="mt-2 text-lg leading-8 text-gray-300"><span style=color:#851ae0;font-weight:400;font-size:1.5rem;min-width:150px id=objectives></span>
-chat app</p><div class=text-editor-wrap><div class=title-bar><span class=title>mchat &mdash; bash &mdash; 80x<span class=terminal-height>25</span></span></div><div class=text-body><div><span style=color:#d79921>root</span>@<span style=color:#98971a>mchat</span> $ <span id=firstSentence></span></div><div class=hidden><span style=color:#d79921>root</span>@<span style=color:#98971a>mchat</span> $ <span id=secondSentence></span></div><div class=hidden><span style=color:#d79921>root</span>@<span style=color:#98971a>mchat</span> $ <span id=thirdSentence></span></div><div class=hidden><span style=color:#d79921>root</span>@<span style=color:#98971a>mchat</span> $ <span id=fourthSentence></span></div><div class=hidden><span style=color:#d79921>root</span>@<span style=color:#98971a>mchat</span> $ <span id=fifthSentence></span></div><div class=hidden><span style=color:#d79921>root</span>@<span style=color:#98971a>mchat</span> $ <span id=lastSentence></span></div></div></div></div><div class=gallery><span style=--i:1><img src=screenshots/1.png alt="Screenshot #2" loading=lazy>
-</span><span style=--i:2><img src=screenshots/2.png alt="Screenshot #2" loading=lazy>
-</span><span style=--i:3><img class=contain src=screenshots/3.jpg alt="Screenshot #3" loading=lazy>
-</span><span style=--i:4><img src=screenshots/4.png alt="Screenshot #4" loading=lazy>
-</span><span style=--i:5><img src=screenshots/5.png alt="Screenshot #5" loading=lazy>
-</span><span style=--i:6><img src=screenshots/6.png alt="Screenshot #6" loading=lazy>
-</span><span style=--i:7><img src=screenshots/7.png alt="Screenshot #7" loading=lazy>
-</span><span style=--i:8><img src=screenshots/7.png alt="Screenshot #8" loading=lazy></span></div></div></div></div></div><div class="pb-5 flex flex-col justify-center items-center font-bold text-black-600 text-xl w-100 space-y-4 z-50"><div class="font-normal text-sm">Made with
+chat app</p><div class=text-editor-wrap><div class=title-bar><span class=title>mchat &mdash; bash &mdash; 80x<span class=terminal-height>25</span></span></div><div class=text-body><div><span style=color:#d79921>root</span>@<span style=color:#98971a>mchat</span> $ <span id=firstSentence></span></div><div class=hidden><span style=color:#d79921>root</span>@<span style=color:#98971a>mchat</span> $ <span id=secondSentence></span></div><div class=hidden><span style=color:#d79921>root</span>@<span style=color:#98971a>mchat</span> $ <span id=thirdSentence></span></div><div class=hidden><span style=color:#d79921>root</span>@<span style=color:#98971a>mchat</span> $ <span id=fourthSentence></span></div><div class=hidden><span style=color:#d79921>root</span>@<span style=color:#98971a>mchat</span> $ <span id=fifthSentence></span></div><div class=hidden><span style=color:#d79921>root</span>@<span style=color:#98971a>mchat</span> $ <span id=lastSentence></span></div></div></div></div><div class=gallery><span style=--i:1><img src=screenshots/1.webp alt="Screenshot #2" loading=lazy>
+</span><span style=--i:2><img src=screenshots/2.webp alt="Screenshot #2" loading=lazy>
+</span><span style=--i:3><img class=contain src=screenshots/3.webp alt="Screenshot #3" loading=lazy>
+</span><span style=--i:4><img src=screenshots/4.webp alt="Screenshot #4" loading=lazy>
+</span><span style=--i:5><img src=screenshots/5.webp alt="Screenshot #5" loading=lazy>
+</span><span style=--i:6><img src=screenshots/6.webp alt="Screenshot #6" loading=lazy>
+</span><span style=--i:7><img src=screenshots/7.webp alt="Screenshot #7" loading=lazy>
+</span><span style=--i:8><img src=screenshots/7.webp alt="Screenshot #8" loading=lazy></span></div></div></div></div></div><div class="pb-5 flex flex-col justify-center items-center font-bold text-black-600 text-xl w-100 space-y-4 z-50"><div class="font-normal text-sm">Made with
 <a href=https://gohugo.io/ target=_blank class="font-extrabold hover:underline hover:text-black-600">Hugo</a>
 based on <a href=https://themes.gohugo.io/themes/minimal_marketing/ target=_blank class="font-extrabold hover:underline hover:text-black-600">Minimal</a> theme</div></div><script src=/mchat-site/public/js/index.js defer></script></body></html>