Fixes...

src/pages/index.astro

@@ -6,7 +6,7 @@ import {astroI18n} from "astro-i18n";
 
 import {Image} from "astro:assets";
 import Card from "@components/Card.svelte";
-import {CaretRight, Pause, Rocket, Code, Crosshair1} from "@astropub/icons";
+import {CaretRight, Pause, Rocket, Crosshair1} from "@astropub/icons";
 import {t} from "astro-i18n";
 import {l} from "@utils/util";
 import PlayerCount from "@components/PlayerCount.svelte";
@@ -63,7 +63,7 @@ const prefixColorMap: {
             </text-carousel>
             <a href={l("join")} class="btn btn-ghost mt-32 px-8 flex"
                 style="animation: normal flyIn forwards 1.2s ease-out">{t("home.join")}
-                <CaretRight width="24" heigth="24"/>
+                <CaretRight width="24" height="24"/>
             </a>
             <style>
                 @keyframes flyIn {
@@ -141,18 +141,18 @@ const prefixColorMap: {
     <section class="w-full flex flex-col items-center justify-center shadow-2xl rounded-b-2xl pb-8">
         <div class="py-10 flex flex-col lg:flex-row">
             <Card client:idle>
-                <Crosshair1 heigth="64" width="64"/>
+                <Crosshair1 height="64" width="64"/>
                 <h1>{t("home.benefits.fights.title")}</h1>
                 <p class="mt-4">{t("home.benefits.fights.description.1")}</p>
                 <p class="mt-4">{t("home.benefits.fights.description.2")}</p>
             </Card>
             <Card client:idle>
-                <Rocket heigth="64" width="64"/>
+                <Rocket height="64" width="64"/>
                 <h1>{t("home.benefits.bau.title")}</h1>
                 <p class="mt-4">{t("home.benefits.bau.description")}</p>
             </Card>
             <Card client:idle>
-                <Pause heigth="64" width="64"/>
+                <Pause height="64" width="64"/>
                 <h1>{t("home.benefits.minigames.title")}</h1>
                 <p class="mt-4">{t("home.benefits.minigames.description.1")}</p>
                 <p class="mt-4">{t("home.benefits.minigames.description.2")}</p>
@@ -164,7 +164,7 @@ const prefixColorMap: {
             <Fragment>
                 {players.map((v, index) => (
                     <div class="inline-flex flex-col justify-end">
-                        {index == 0 ? <h2 class="dark:text-white text-4xl font-bold text-center">{t("home.prefix." + prefix.replace("PREFIX_", "").toLowerCase())}</h2> : null}
+                        {index == 0 ? <h2 class="dark:text-white text-4xl font-bold text-center md:text-left md:pl-4">{t("home.prefix." + prefix.replace("PREFIX_", "").toLowerCase())}</h2> : null}
                         <Card extraClasses={`pt-8 pb-10 px-8 w-fit shadow-md ${prefixColorMap[prefix]}`} client:idle>
                             <figure class="flex flex-col items-center" style="width: 150px">
                                 <figcaption class="text-center mb-4 text-2xl">{v.name}</figcaption>