generated from nhcarrigan/template
47 lines
1.1 KiB
TypeScript
47 lines
1.1 KiB
TypeScript
/**
|
|
* @copyright nhcarrigan
|
|
* @license Naomi's Public License
|
|
* @author Naomi Carrigan
|
|
*/
|
|
import { ArtComponent } from "../../components/art";
|
|
import { Rule } from "../../components/rule";
|
|
import { Art } from "../../config/Art";
|
|
import type { JSX } from "react";
|
|
|
|
/**
|
|
* Renders the /art page.
|
|
* @returns A React Component.
|
|
*/
|
|
const Arts = (): JSX.Element => {
|
|
return (
|
|
<main
|
|
className="w-[95%] text-center
|
|
max-w-4xl mx-auto mt-16 rounded-lg"
|
|
>
|
|
<h1 className="text-5xl">{`Art`}</h1>
|
|
<section>
|
|
<p className="mb-2">{`See various art depicting Naomi.`}</p>
|
|
<Rule />
|
|
<div className="grid sm:grid-cols-2 lg:grid-cols-3 grid-cols-1 gap-y-5">
|
|
{Art.toSorted((a, b) => {
|
|
return a.name.localeCompare(b.name);
|
|
}).map((art) => {
|
|
return (
|
|
<ArtComponent
|
|
alt={art.alt}
|
|
artist={art.artist}
|
|
img={art.img}
|
|
key={art.name}
|
|
name={art.name}
|
|
url={art.url}
|
|
/>
|
|
);
|
|
})}
|
|
</div>
|
|
</section>
|
|
</main>
|
|
);
|
|
};
|
|
|
|
export default Arts;
|