feat(website): integrate KoalaDeploy mascot, enlarge Juggler mascot by 15%, and add premium interactive hover effects to all main mascots

This commit is contained in:
Timo
2026-05-30 19:48:53 +02:00
parent 54ffbfa4bd
commit fb1451022b
3 changed files with 37 additions and 3 deletions
+7 -1
View File
@@ -750,11 +750,17 @@
<h2 style="font-size: 2.5rem; text-align: center; margin-bottom: 1rem;">
<span lang="en">For Self-Hosters</span><span lang="de">Für Self-Hoster</span>
</h2>
<p style="text-align: center; color: var(--text-muted); margin-bottom: 3rem; max-width: 600px; margin-left: auto; margin-right: auto;">
<p style="text-align: center; color: var(--text-muted); margin-bottom: 2rem; max-width: 600px; margin-left: auto; margin-right: auto;">
<span lang="en">Maintain full data sovereignty. Deploy your own private relay server in minutes.</span>
<span lang="de">Behalte die volle Datenhoheit. Richte deinen eigenen privaten Relay-Server in wenigen Minuten ein.</span>
</p>
<!-- Mascot Self-Hosting / Deploy Illustration -->
<div style="display: flex; justify-content: center; margin-bottom: 2.5rem;" data-reveal>
<img src="assets/KoalaDeploy.webp" alt="A cute koala sitting at a laptop deploying a Docker container for self-hosting" class="selfhost-mascot" lang="en" width="300" height="201" loading="lazy">
<img src="assets/KoalaDeploy.webp" alt="Ein niedlicher Koala sitzt am Laptop und deployt einen Docker-Container für das Self-Hosting" class="selfhost-mascot" lang="de" width="300" height="201" loading="lazy">
</div>
<div class="terminal-container" data-reveal>
<div class="terminal-header">
<div class="terminal-dots">