diff --git a/app/astroneer/page.tsx b/app/astroneer/page.tsx new file mode 100644 index 0000000..6cfa130 --- /dev/null +++ b/app/astroneer/page.tsx @@ -0,0 +1,155 @@ +import type { Metadata } from "next"; +import Link from "next/link"; +import CopyAddressButton from "../components/CopyAddressButton"; +import { astroneerServer } from "../lib/server-config"; + +const joinSteps = [ + { + number: "1", + title: "Lance Astroneer", + text: "Ouvre le jeu avec ton compte habituel et une version à jour.", + }, + { + number: "2", + title: "Ouvre le multijoueur", + text: "Va dans les serveurs dédiés depuis le menu de coopération.", + }, + { + number: "3", + title: "Ajoute l'adresse", + text: `Renseigne ${astroneerServer.address} dans la connexion serveur.`, + }, + { + number: "4", + title: "Rejoins la partie", + text: "Connecte-toi au serveur et retrouve la base partagée.", + }, +]; + +export const metadata: Metadata = { + title: "Astroneer | Le serveur de Leon", +}; + +export default function AstroneerPage() { + return ( +
+ + +
+ + +
+

Astroneer

+

Serveur dédié privé pour explorer, automatiser et construire entre amis.

+ +
+ + {astroneerServer.address} +
+ +
+ +
+
+
+ +
+
+
+

Infos serveur

+

Les informations utiles pour te connecter.

+
+ +
+ + + + +
+
+ +
+
+

Comment rejoindre

+

Quatre étapes pour entrer sur le serveur.

+
+ +
+ {joinSteps.map((step) => ( +
+ {step.number} +

{step.title}

+

{step.text}

+
+ ))} +
+
+ +
+ + + Retour accueil + +
+
+
+ ); +} + +type InfoItemProps = { + label: string; + value: string; +}; + +function InfoItem({ label, value }: InfoItemProps) { + return ( +
+ {label} + {value} +
+ ); +} + +function HomeIcon() { + return ( + + ); +} + +function PlanetIcon() { + return ( + + ); +} + +function ArrowLeftIcon() { + return ( + + ); +} diff --git a/app/components/HomeElement.tsx b/app/components/HomeElement.tsx index 03285d7..d0085b8 100644 --- a/app/components/HomeElement.tsx +++ b/app/components/HomeElement.tsx @@ -4,9 +4,9 @@ import type { ReactNode } from "react"; type HomeElementProps = { title: string; description: string; - href: string; + href?: string; actionLabel: string; - variant: "jellyfin" | "minecraft"; + variant: "jellyfin" | "minecraft" | "astroneer"; external?: boolean; children: ReactNode; }; @@ -29,14 +29,18 @@ export default function HomeElement({ {description} - {actionLabel} - + {actionLabel} + {href ? : } ); const className = `service-card service-card--${variant}`; + if (!href) { + return
{content}
; + } + if (external) { return ( @@ -94,6 +98,31 @@ export function MinecraftIcon() { ); } +export function AstroneerIcon() { + return ( + + ); +} + function ArrowIcon() { return ( ); } + +function SignalIcon() { + return ( + + ); +} diff --git a/app/components/MinecraftStatus.tsx b/app/components/MinecraftStatus.tsx index 3ee2a71..73b33d2 100644 --- a/app/components/MinecraftStatus.tsx +++ b/app/components/MinecraftStatus.tsx @@ -99,7 +99,7 @@ type StatusItemProps = { function StatusItem({ label, value, tone }: StatusItemProps) { return ( -
+
{label} {tone ?