Header link, move Boxtable, add instructions

This commit is contained in:
Xevion
2022-12-18 00:33:08 -06:00
parent 33d0098562
commit 3021aac384
2 changed files with 15 additions and 6 deletions

View File

@@ -11,7 +11,9 @@ const Page: FunctionComponent<PageProps> = ({children}: PageProps) => {
<> <>
<main className="flex w-full flex-col items-center bg-white"> <main className="flex w-full flex-col items-center bg-white">
<div className="mt-8 px-3 max-w-screen-md w-[90%]"> <div className="mt-8 px-3 max-w-screen-md w-[90%]">
<h1 className="text-3xl font-rokkitt text-zinc-800 sm:text-5xl mb-2">100Prisoners.com</h1> <h1 className="text-3xl font-rokkitt text-zinc-800 sm:text-5xl mb-2">
<Link href={"/"}>100Prisoners.com</Link>
</h1>
{children} {children}
<div className="flex flex-col items-center"> <div className="flex flex-col items-center">
<div className="grid py-1 grid-cols-1 gap-x-1 whitespace-nowrap divide-x-2"> <div className="grid py-1 grid-cols-1 gap-x-1 whitespace-nowrap divide-x-2">

View File

@@ -18,6 +18,17 @@ const Home: NextPage = () => {
challenge that seems astronomically impossible at first, yet can leverage mathematics to challenge that seems astronomically impossible at first, yet can leverage mathematics to
raise the chances one hundred octillion. raise the chances one hundred octillion.
</p> </p>
<div className="flex flex-col items-center">
<div className="text-zinc-400 mb-4 text-base text-center">
<p className="!mt-0">
Hover to see part of the loop. <br/>
Click to hide boxes outside the loop and see more of the loop.
</p>
</div>
<NoSSR>
<BoxTable/>
</NoSSR>
</div>
<p> <p>
This thought experiment presents a scenario in which a group of 100 prisoners are tasked This thought experiment presents a scenario in which a group of 100 prisoners are tasked
with finding their own numbered slip among a collection of 100 boxes, each containing a with finding their own numbered slip among a collection of 100 boxes, each containing a
@@ -43,11 +54,7 @@ const Home: NextPage = () => {
<b> 31%</b> chance of success! <b> 31%</b> chance of success!
</p> </p>
</div> </div>
<div className="pt-7 pb-8">
<NoSSR>
<BoxTable/>
</NoSSR>
</div>
</Page> </Page>
</> </>
); );