diff --git a/components/index/services.vue b/components/index/services.vue
index db13518..07609d4 100644
--- a/components/index/services.vue
+++ b/components/index/services.vue
@@ -12,7 +12,7 @@
-
+
Self-hosted GitHub
Wish simulator
Kobo Cloud
-
+
Ad-filled media server
FOSS media server
@@ -51,7 +51,7 @@
Whitelisted
diff --git a/content/blog/2021/3-reasons-to-switch-to-linux.md b/content/blog/2021/3-reasons-to-switch-to-linux.md
index 838fb5c..6a6dea8 100644
--- a/content/blog/2021/3-reasons-to-switch-to-linux.md
+++ b/content/blog/2021/3-reasons-to-switch-to-linux.md
@@ -17,7 +17,7 @@ However, this article will largely focus on **desktop Linux**, which competes wi
Perhaps the biggest feature of Linux is its ability to do whatever you want, however you want. After a *tiny* bit of tinkering, you'll be able to set up your computer exactly how you'd like it!
-::image{src=sway-desktop.png}
+::image{src=sway-desktop.webp}
A terminal, an emulated Switch game, a game launcher, and a browser all automagically arranged by a tiling window manager. The currently playing song is in the top bar.
::
diff --git a/content/blog/2021/dark-mode.md b/content/blog/2021/dark-mode.md
index 93ca2e3..f87f3b3 100644
--- a/content/blog/2021/dark-mode.md
+++ b/content/blog/2021/dark-mode.md
@@ -9,6 +9,6 @@ On the desktop, dark mode is an abomination that should be eradicated from appli
Browsers, IDEs, and other applications must be freed from their shadowy chains and returned to light — where they truly belong.
-::image{src=light-discord.png}
+::image{src=light-discord.webp}
Perfect.
::
diff --git a/content/blog/2021/primoprod-progress-report.md b/content/blog/2021/primoprod-progress-report.md
index 5fb6477..b9e3edd 100644
--- a/content/blog/2021/primoprod-progress-report.md
+++ b/content/blog/2021/primoprod-progress-report.md
@@ -34,12 +34,12 @@ At the time, coming from Python/Java, I opted in to the class components plugin
The [first few commits](https://github.com/potatoeggy/primoprod/commit/ed9d94b61bf91ea9b82ac4d832dfb2b9ff2efc59) had me playing around until I was comfortable enough to introduce my very [first component](https://github.com/potatoeggy/primoprod/commit/fcbb4068dd3b018db2809ccfcc5381d4ea3ae727): the WishButton.
-::image{src=wish-button-emulated.png}
+::image{src=wish-button-emulated.webp}
::
I'd say it turned out pretty well! Since I wanted to emulate Genshin's UI, I wanted to match it as closely as I could. These two buttons are made of an image inside of a div relatively positioned with text absolutely positioned inside. Original image for comparison:
-::image{src=wish-button-original.png}
+::image{src=wish-button-original.webp}
::
There are still some differences between the texts since Genshin uses antialiasing, and the alignment and shadow of the icon beside the wish quantity is slightly off too, but I would consider this result to be acceptable.
@@ -58,7 +58,7 @@ See [GemCounter](https://github.com/potatoeggy/primoprod/blob/master/src/compone
Although I had read up on [MDN's](https://developer.mozilla.org/en-US/) fantastic tutorials/documentation a fair bit and used flexboxes and `rem` everywhere, I apparently did not catch `box-sizing: border-box` and the margins and padding just did not arrange themselves how they should have.
-::image{src=mdn-box-sizing-tip.png}
+::image{src=mdn-box-sizing-tip.webp}
::
:/ thanks MDN for letting me know
@@ -69,12 +69,12 @@ Although I had read up on [MDN's](https://developer.mozilla.org/en-US/) fantasti
Designing the basic screen was pretty straightforward. For all its woes, pure CSS still works and is intuitive enough that my git history was only slightly too messy and I got my results.
-::image{src=primoprod-wishbanners.png}
+::image{src=primoprod-wishbanners.webp}
::
Pretty good, right? Now, the design still isn't adaptive enough *since things get cut off for who knows why I thought flexboxes were supposed to solve all this* but for the most part it looks good enough. It appears I'll have to make a lot of exceptions for mobile devices…
-::image{src=primoprod-wishbanners-scaled.png}
+::image{src=primoprod-wishbanners-scaled.webp}
::
With some help taken by examining the assets of https://genshin.thekima.com and https://gi-wish-simulator.uzairashraf.dev, I grabbed a static background image as well as the videos!
@@ -144,10 +144,10 @@ In fact, I consider those two to be 100% done unless I can find a way to apply a
But it looks great!
-::image{src=itemdescriptionoverlay.png}
+::image{src=itemdescriptionoverlay.webp}
::
-::image{src=itemobtainoverlay.png}
+::image{src=itemobtainoverlay.webp}
::
## Wrapping up
diff --git a/content/blog/2022/primoprod-progress-report-2.md b/content/blog/2022/primoprod-progress-report-2.md
index 85bcba9..43f2503 100644
--- a/content/blog/2022/primoprod-progress-report-2.md
+++ b/content/blog/2022/primoprod-progress-report-2.md
@@ -14,7 +14,7 @@ This report will cover from where the previous left off to the present day: 21 A
## No more
-::image{src="primoprod-itemrevealscreen.png"}
+::image{src="primoprod-itemrevealscreen.webp"}
::
It's done. The pull screen is done. The element/weapon icon was added to the pull. Audio syncs up (well enough). The only thing missing is all of the fancy effects like glow and particles.
@@ -23,7 +23,7 @@ Nah, this is good enough.
## Take this!
-::image{src="primoprod-questscreen.png"}
+::image{src="primoprod-questscreen.webp"}
::
Until now, you had to manually edit the browser's `localStorage` to gain any currency. The quest screen makes primoprod finally usable as now you can make your own long-term "quests" that give 900 Primogems each as well as set four daily "tasks" that give 30 Primogems each plus 60 when all are done — if only the base game was this generous. These are editable and can have whatever title or description you want. The logic here went through several rewrites as the structure was finalised and an interface developed to the rest of primoprod. Dailies will automatically refresh themselves on the next day.
@@ -56,7 +56,7 @@ Sounds incredible, right? As it turns out, as you gain more experience with tech
This is why [the shop](https://github.com/potatoeggy/primoprod/blob/master/src/components/ShopScreen.vue) and the [dialog to buy things from the shop](https://github.com/potatoeggy/primoprod/blob/master/src/components/ItemPurchaseOverlay.vue) are so nicely done! It reused most of my types and was admittedly much simpler than some of the other screens, but I only ran into one insurmountable problem: range styling.
-::image{src="primoprod-itempurchaseoverlay.png"}
+::image{src="primoprod-itempurchaseoverlay.webp"}
::
*I wish I was actually this rich in the base game.*
@@ -127,7 +127,7 @@ Back to laptop compilation we go!
Obviously, you aren't a *real* free and open source project if you don't have [pretty badges](https://github.com/potatoeggy/primoprod/blob/master/README.md) on your README. This was a major concern, so I copied Vue's style and now made primoprod a proper FOSS repo — build checkmark and badges and all!
-::image{src="primoprod-badges.png"}
+::image{src="primoprod-badges.webp"}
::
## Kids and their phones
@@ -140,7 +140,7 @@ ItemRevealScreen? What's that? Now [WishBanners](https://github.com/potatoeggy/p
At last, though, we have a [proper mobile UI](https://github.com/potatoeggy/primoprod/pull/33).
-::image{src="mobile-primoprod.png"}
+::image{src="mobile-primoprod.webp"}
::
Still some niggles to work out, but it looks "good enough"! With the completion of proper mobile orientation came the merging of the [Android branch](https://github.com/potatoeggy/primoprod/pull/32) made with [Capacitor.js](https://capacitorjs.com/), basically the mobile equivalent of Electron. It has even more niggles than the web version does.
diff --git a/public/images/posts/itemdescriptionoverlay.png b/public/images/posts/itemdescriptionoverlay.png
deleted file mode 100644
index af29136..0000000
Binary files a/public/images/posts/itemdescriptionoverlay.png and /dev/null differ
diff --git a/public/images/posts/itemdescriptionoverlay.webp b/public/images/posts/itemdescriptionoverlay.webp
new file mode 100644
index 0000000..deed249
Binary files /dev/null and b/public/images/posts/itemdescriptionoverlay.webp differ
diff --git a/public/images/posts/itemobtainoverlay.png b/public/images/posts/itemobtainoverlay.png
deleted file mode 100644
index a8bf18b..0000000
Binary files a/public/images/posts/itemobtainoverlay.png and /dev/null differ
diff --git a/public/images/posts/itemobtainoverlay.webp b/public/images/posts/itemobtainoverlay.webp
new file mode 100644
index 0000000..fb2d2ec
Binary files /dev/null and b/public/images/posts/itemobtainoverlay.webp differ
diff --git a/public/images/posts/light-discord.png b/public/images/posts/light-discord.png
deleted file mode 100644
index 9a44a62..0000000
Binary files a/public/images/posts/light-discord.png and /dev/null differ
diff --git a/public/images/posts/light-discord.webp b/public/images/posts/light-discord.webp
new file mode 100644
index 0000000..ac0fd42
Binary files /dev/null and b/public/images/posts/light-discord.webp differ
diff --git a/public/images/posts/mdn-box-sizing-tip.png b/public/images/posts/mdn-box-sizing-tip.png
deleted file mode 100644
index d76cce8..0000000
Binary files a/public/images/posts/mdn-box-sizing-tip.png and /dev/null differ
diff --git a/public/images/posts/mdn-box-sizing-tip.webp b/public/images/posts/mdn-box-sizing-tip.webp
new file mode 100644
index 0000000..9dc15c5
Binary files /dev/null and b/public/images/posts/mdn-box-sizing-tip.webp differ
diff --git a/public/images/posts/mobile-primoprod.png b/public/images/posts/mobile-primoprod.png
deleted file mode 100644
index 79efe07..0000000
Binary files a/public/images/posts/mobile-primoprod.png and /dev/null differ
diff --git a/public/images/posts/mobile-primoprod.webp b/public/images/posts/mobile-primoprod.webp
new file mode 100644
index 0000000..6457bd2
Binary files /dev/null and b/public/images/posts/mobile-primoprod.webp differ
diff --git a/public/images/posts/primoprod-badges.png b/public/images/posts/primoprod-badges.png
deleted file mode 100644
index a98e3f4..0000000
Binary files a/public/images/posts/primoprod-badges.png and /dev/null differ
diff --git a/public/images/posts/primoprod-badges.webp b/public/images/posts/primoprod-badges.webp
new file mode 100644
index 0000000..e377dd1
Binary files /dev/null and b/public/images/posts/primoprod-badges.webp differ
diff --git a/public/images/posts/primoprod-itempurchaseoverlay.png b/public/images/posts/primoprod-itempurchaseoverlay.png
deleted file mode 100644
index f6f489a..0000000
Binary files a/public/images/posts/primoprod-itempurchaseoverlay.png and /dev/null differ
diff --git a/public/images/posts/primoprod-itempurchaseoverlay.webp b/public/images/posts/primoprod-itempurchaseoverlay.webp
new file mode 100644
index 0000000..cfa1f13
Binary files /dev/null and b/public/images/posts/primoprod-itempurchaseoverlay.webp differ
diff --git a/public/images/posts/primoprod-itemrevealscreen.png b/public/images/posts/primoprod-itemrevealscreen.png
deleted file mode 100644
index da2febd..0000000
Binary files a/public/images/posts/primoprod-itemrevealscreen.png and /dev/null differ
diff --git a/public/images/posts/primoprod-itemrevealscreen.webp b/public/images/posts/primoprod-itemrevealscreen.webp
new file mode 100644
index 0000000..742abbb
Binary files /dev/null and b/public/images/posts/primoprod-itemrevealscreen.webp differ
diff --git a/public/images/posts/primoprod-questscreen.png b/public/images/posts/primoprod-questscreen.png
deleted file mode 100644
index a0103e8..0000000
Binary files a/public/images/posts/primoprod-questscreen.png and /dev/null differ
diff --git a/public/images/posts/primoprod-questscreen.webp b/public/images/posts/primoprod-questscreen.webp
new file mode 100644
index 0000000..c4e9da3
Binary files /dev/null and b/public/images/posts/primoprod-questscreen.webp differ
diff --git a/public/images/posts/primoprod-wishbanners-scaled.png b/public/images/posts/primoprod-wishbanners-scaled.png
deleted file mode 100644
index 9de3645..0000000
Binary files a/public/images/posts/primoprod-wishbanners-scaled.png and /dev/null differ
diff --git a/public/images/posts/primoprod-wishbanners-scaled.webp b/public/images/posts/primoprod-wishbanners-scaled.webp
new file mode 100644
index 0000000..2cd3723
Binary files /dev/null and b/public/images/posts/primoprod-wishbanners-scaled.webp differ
diff --git a/public/images/posts/primoprod-wishbanners.png b/public/images/posts/primoprod-wishbanners.png
deleted file mode 100644
index 3d9691f..0000000
Binary files a/public/images/posts/primoprod-wishbanners.png and /dev/null differ
diff --git a/public/images/posts/primoprod-wishbanners.webp b/public/images/posts/primoprod-wishbanners.webp
new file mode 100644
index 0000000..ab15b17
Binary files /dev/null and b/public/images/posts/primoprod-wishbanners.webp differ
diff --git a/public/images/posts/sway-desktop.png b/public/images/posts/sway-desktop.png
deleted file mode 100644
index 05e9159..0000000
Binary files a/public/images/posts/sway-desktop.png and /dev/null differ
diff --git a/public/images/posts/sway-desktop.webp b/public/images/posts/sway-desktop.webp
new file mode 100644
index 0000000..bab5ebf
Binary files /dev/null and b/public/images/posts/sway-desktop.webp differ
diff --git a/public/images/posts/wish-button-emulated.png b/public/images/posts/wish-button-emulated.png
deleted file mode 100644
index 005bec3..0000000
Binary files a/public/images/posts/wish-button-emulated.png and /dev/null differ
diff --git a/public/images/posts/wish-button-emulated.webp b/public/images/posts/wish-button-emulated.webp
new file mode 100644
index 0000000..b835250
Binary files /dev/null and b/public/images/posts/wish-button-emulated.webp differ
diff --git a/public/images/posts/wish-button-original.png b/public/images/posts/wish-button-original.png
deleted file mode 100644
index 3584be1..0000000
Binary files a/public/images/posts/wish-button-original.png and /dev/null differ
diff --git a/public/images/posts/wish-button-original.webp b/public/images/posts/wish-button-original.webp
new file mode 100644
index 0000000..88a9128
Binary files /dev/null and b/public/images/posts/wish-button-original.webp differ
diff --git a/public/images/services/calibre-web.png b/public/images/services/calibre-web.png
deleted file mode 100644
index 24b2ad1..0000000
Binary files a/public/images/services/calibre-web.png and /dev/null differ
diff --git a/public/images/services/calibre-web.webp b/public/images/services/calibre-web.webp
new file mode 100644
index 0000000..9b97a9e
Binary files /dev/null and b/public/images/services/calibre-web.webp differ
diff --git a/public/images/services/gitea.png b/public/images/services/gitea.png
deleted file mode 100644
index 5dacd77..0000000
Binary files a/public/images/services/gitea.png and /dev/null differ
diff --git a/public/images/services/gitea.webp b/public/images/services/gitea.webp
new file mode 100644
index 0000000..9f7ef99
Binary files /dev/null and b/public/images/services/gitea.webp differ
diff --git a/public/images/services/jellyfin.png b/public/images/services/jellyfin.png
deleted file mode 100644
index 16e6c2f..0000000
Binary files a/public/images/services/jellyfin.png and /dev/null differ
diff --git a/public/images/services/jellyfin.webp b/public/images/services/jellyfin.webp
new file mode 100644
index 0000000..771d697
Binary files /dev/null and b/public/images/services/jellyfin.webp differ
diff --git a/public/images/services/minecraft.png b/public/images/services/minecraft.png
deleted file mode 100644
index 8ab1445..0000000
Binary files a/public/images/services/minecraft.png and /dev/null differ
diff --git a/public/images/services/minecraft.webp b/public/images/services/minecraft.webp
new file mode 100644
index 0000000..481eb59
Binary files /dev/null and b/public/images/services/minecraft.webp differ
diff --git a/public/images/services/plex.png b/public/images/services/plex.png
deleted file mode 100644
index e486ebf..0000000
Binary files a/public/images/services/plex.png and /dev/null differ
diff --git a/public/images/services/plex.webp b/public/images/services/plex.webp
new file mode 100644
index 0000000..f2643b2
Binary files /dev/null and b/public/images/services/plex.webp differ
diff --git a/public/images/services/primogem.png b/public/images/services/primogem.png
deleted file mode 100644
index 51c2918..0000000
Binary files a/public/images/services/primogem.png and /dev/null differ
diff --git a/public/images/services/primogem.webp b/public/images/services/primogem.webp
new file mode 100644
index 0000000..2eda572
Binary files /dev/null and b/public/images/services/primogem.webp differ