mikkel/astro-personal-website
1
0
Fork 0
mirror of https://github.com/mikkelsvartveit/astro-personal-website.git synced 2025-12-22 11:12:38 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Optimize image sizes

Browse source
This commit is contained in:
Mikkel Svartveit 2024-05-29 02:19:03 +02:00
parent d46d818e7c
commit 5153e9c6fb
3 changed files with 9 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
src/assets/images/macbook.jpg
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.9 MiB

After

Width:  |  Height:  |  Size: 271 KiB

2
src/pages/articles/index.astro
View file

@ -40,6 +40,8 @@ const articles = await getCollection("blog");
<Image <Image
src={image} src={image}
alt={title} alt={title}
width={320}
densities={[1, 2]}
class="col-span-1 h-48 object-cover sm:h-full" class="col-span-1 h-48 object-cover sm:h-full"
/> />

8
src/pages/index.astro
View file

@ -72,7 +72,13 @@ const latestArticleImage = latestArticle.data.image;
<div <div
class="flex items-center overflow-hidden rounded-lg bg-white underline-offset-4 shadow transition hover:underline hover:shadow-md" class="flex items-center overflow-hidden rounded-lg bg-white underline-offset-4 shadow transition hover:underline hover:shadow-md"
> >
<Image src={latestArticleImage} alt="" class="h-16 w-24 object-cover" /> <Image
src={latestArticleImage}
alt=""
class="h-16 w-24 object-cover"
width={100}
densities={[1, 2]}
/>
<h3 class="mx-3 line-clamp-2 font-serif text-lg leading-snug"> <h3 class="mx-3 line-clamp-2 font-serif text-lg leading-snug">
{latestArticleTitle} {latestArticleTitle}
</h3> </h3>