diff --git a/src/app/legacy/page.tsx b/src/app/legacy/page.tsx index c4e5d62..fe0eb12 100644 --- a/src/app/legacy/page.tsx +++ b/src/app/legacy/page.tsx @@ -5,6 +5,7 @@ */ /* eslint-disable react/no-multi-comp */ "use client"; +import Image from "next/image"; import { useState, type JSX } from "react"; import { CharacterComponent } from "../../components/character"; import { Characters } from "../../config/Legacy"; @@ -123,6 +124,7 @@ const Legacy = (): JSX.Element => {

{`The Carrigan Legacy`}

+ Nine anime-style female characters with diverse colorful outfits including dresses, crop tops, skirts, and pants, posing together against a light background, some making peace signs or pointing at the viewer

{`This page serves to show off all of our characters, who are all part of the same family (and thus, the same legacy).`}

@@ -182,8 +184,9 @@ const Legacy = (): JSX.Element => {

{Characters[focused]?.name}

-

{Characters[focused]?.class}

-

{`${Characters[focused]?.age.toString() ?? "unknown"} years old`}

+ {Characters[focused]?.alt +

{Characters[focused]?.class}{" - "}{`${Characters[focused]?.age.toString() ?? "unknown"} years old`}

+ {Characters[focused]?.bio.map((paragraph) => { return

{paragraph}

; })} diff --git a/src/components/character.tsx b/src/components/character.tsx index a3a6abf..bab3752 100644 --- a/src/components/character.tsx +++ b/src/components/character.tsx @@ -22,17 +22,27 @@ export const CharacterComponent = ( ): JSX.Element => { const { id, onClick, focused } = properties; - return ( - + {id} +
+ + : {id} - ); + />; }; diff --git a/src/config/Legacy.ts b/src/config/Legacy.ts index 65d9e50..eb7000a 100644 --- a/src/config/Legacy.ts +++ b/src/config/Legacy.ts @@ -4,9 +4,10 @@ * @author Naomi Carrigan */ -const Characters: Record }> = { +const Characters: Record }> = { "aria-iuvo": { age: 103, + alt: "A digital art illustration depicts a young anime-style girl with long dark red hair, pale skin, and a blank white mask-like face standing against a dark night sky, holding a glowing knife and gazing pensively at a full moon.", bio: [ "Aria Iuvo is far more chaotic and mischievous than her sister Melody.", "As an elf, Aria Iuvo is actually quite older than her sister, but she is far more spry and youthful in appearance.", @@ -16,6 +17,7 @@ const Characters: Record