Files
chess-scribe-website/src/pages/index.tsx
T

97 lines
3.0 KiB
TypeScript

import { Link } from "@tanstack/react-router";
import { Image } from "@unpic/react";
import AccordionItem from "#/components/AccordionItem.tsx";
import Feature from "#/components/Feature.tsx";
import Section from "#/components/Section.tsx";
import examplePdf1 from "@/assets/images/examplepdf1.webp?url";
import examplePdf2 from "@/assets/images/examplepdf2.webp?url";
const Home = () => (
<main className="px-4 pb-8 pt-14 place-self-center">
<section
id="hero"
className="grid max-w-screen-2xl items-center gap-8 p-8 text-center md:grid-cols-2 md:text-left"
>
<div>
<h1 className="text-3xl font-bold text-base-content md:text-4xl">
Convert your Chess PGN
</h1>
<h1 className="text-3xl font-bold text-base-content md:text-4xl">
into a <span className="text-(--accent)">Publishable PDF.</span>
</h1>
<h2 className="mb-8 mt-4 text-(--base-content)">
Upload and convert your games into a book format, along with variation
and annotations.
</h2>
<Link
to="/chessboard"
className="rounded-3xl text-xl font-bold btn btn-primary"
>
Get Started
</Link>
</div>
<div className="example-pdfs">
<Image src={examplePdf2} alt="Example PDF 2" width={500} height={500} />
<Image
src={examplePdf1}
alt="Example PDF 1"
width={500}
height={500}
priority
/>
</div>
</section>
<Section
title="A Unique Chess Publication Service"
smallTitle="FEATURES"
description="Convert your chess PGN files into a publishable PDF, complete with diagrams of chosen positions."
>
<Feature title="Fast">
Quick PDF generation using a custom TeX Live server.
</Feature>
<Feature title="Easy">
Upload a PGN of your game, and choose the diagrams you want in your PDF.
Annotations are added automatically.
</Feature>
<Feature title="Reliable">
Dedicated servers ensure that downtime is kept to a minimum.
</Feature>
</Section>
<Section
title="Your Questions Answered"
smallTitle="FAQs"
description="Below we answer some of the most common questions we get regarding this service."
>
<div className="hero__accordion-container">
<AccordionItem title="Is this service free?" id="accordion-1">
Yes. There are no current plans to charge for this service. If in the
future there is a payment plan, it will come with a generous free
tier.
</AccordionItem>
<AccordionItem
title="Will you be adding more features?"
id="accordion-2"
>
We have a lot more features to implement in the near future. If you
have a feature that you would like to see implemented, please feel
free to send us a message via our contact form.
</AccordionItem>
<AccordionItem
title="Do you hold any copyright on the produced materials?"
id="accordion-3"
>
No. We will never implement any terms whereby we have any interest in
the materials created with this service.
</AccordionItem>
</div>
</Section>
</main>
);
export default Home;