diff --git a/.gitignore b/.gitignore index 2971a0b..7fe5ca7 100644 --- a/.gitignore +++ b/.gitignore @@ -1,4 +1,5 @@ # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. +.idea # dependencies /node_modules diff --git a/package.json b/package.json index fb0b3f9..46a5403 100644 --- a/package.json +++ b/package.json @@ -15,10 +15,12 @@ "@trpc/react-query": "^10.0.0", "@trpc/server": "^10.0.0", "@types/chance": "^1.1.3", + "@types/react-no-ssr": "^1.1.3", "chance": "^1.1.9", "next": "13.0.2", "react": "18.2.0", "react-dom": "18.2.0", + "react-no-ssr": "^1.1.0", "sass": "^1.57.0", "superjson": "1.9.1", "zod": "^3.18.0" diff --git a/src/components/BoxGraphic.tsx b/src/components/BoxGraphic.tsx index 7117821..81fb2dc 100644 --- a/src/components/BoxGraphic.tsx +++ b/src/components/BoxGraphic.tsx @@ -25,7 +25,7 @@ const {A, B, C, D, E, F, Z} = points; const BoxGraphic = ({children, className}: BoxGraphicProps) => { return - + diff --git a/src/components/BoxTable.tsx b/src/components/BoxTable.tsx new file mode 100644 index 0000000..3eb2f5b --- /dev/null +++ b/src/components/BoxTable.tsx @@ -0,0 +1,28 @@ +import {range} from "../utils/helpers"; +import BoxGraphic from "./BoxGraphic"; + +import Chance from "chance"; + +const chance = new Chance(); +const sources = range(0, 100 - 1); +const destinations = chance.shuffle(sources); +const boxes: [number, number][] = sources.map((e, i) => [e, destinations[i] as number]) + +const BoxTable = () => { + return ( +
+ {boxes.map(([source, destination]) => +
+
+ {destination} + + {source + 1} + +
+
+ )} +
+ ); +} + +export default BoxTable; \ No newline at end of file diff --git a/src/pages/index.tsx b/src/pages/index.tsx index a7ac244..09990c4 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -1,16 +1,9 @@ import {type NextPage} from "next"; import Head from "next/head"; -import BoxGraphic from "../components/BoxGraphic"; -import Chance from "chance"; -import {range} from "../utils/helpers"; - -const chance = new Chance(); +import BoxTable from "../components/BoxTable"; +import NoSSR from "react-no-ssr"; const Home: NextPage = () => { - const sources = range(0, 100); - const destinations = chance.shuffle(sources); - const boxes = sources.map((e, i) => [e, destinations[i]]) - return ( <> @@ -18,7 +11,7 @@ const Home: NextPage = () => {
-
+

100Prisoners.com

This website is dedicated to exploring the intriguing 100 prisoners problem, a mathematical @@ -32,18 +25,9 @@ const Home: NextPage = () => { attempt to find their own number, and all of the prisoners must be successful in order to be set free. This problem raises questions about strategy and probability in search of a solution.
-
- {boxes.map(([source, destination]) => -
-
- {destination} - - {source + 1} - -
-
- )} -
+ + +
diff --git a/src/styles/globals.scss b/src/styles/globals.scss new file mode 100644 index 0000000..17b0555 --- /dev/null +++ b/src/styles/globals.scss @@ -0,0 +1,26 @@ +@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;1,400&display=swap'); +@import url('https://fonts.googleapis.com/css2?family=Merriweather&display=swap'); + +@tailwind base; +@tailwind components; +@tailwind utilities; + + +body { + font-family: "Merriweather", serif; +} + +svg { + @apply max-w-full max-h-full; +} + +.box { + @apply transition-all; + > span { @apply transition-opacity opacity-30; } + &:hover { + > span { @apply opacity-100; } + > svg { + @apply -translate-y-7; + } + } +} \ No newline at end of file diff --git a/yarn.lock b/yarn.lock index 339d8b2..10e5a3f 100644 --- a/yarn.lock +++ b/yarn.lock @@ -228,6 +228,13 @@ dependencies: "@types/react" "*" +"@types/react-no-ssr@^1.1.3": + version "1.1.3" + resolved "https://registry.yarnpkg.com/@types/react-no-ssr/-/react-no-ssr-1.1.3.tgz#895baced8f49e270289c8ad11be1a4a50328d243" + integrity sha512-uMR17qGISe0qTTiVFuRfatP+9plEe/Q0beQ47xy0OXatwb3Z2bEj3OW7FC+9PVqCYEsfR4b01LU9tXw2urzBzw== + dependencies: + "@types/react" "*" + "@types/react@*", "@types/react@^18.0.14": version "18.0.26" resolved "https://registry.yarnpkg.com/@types/react/-/react-18.0.26.tgz#8ad59fc01fef8eaf5c74f4ea392621749f0b7917" @@ -481,6 +488,14 @@ axobject-query@^2.2.0: resolved "https://registry.yarnpkg.com/axobject-query/-/axobject-query-2.2.0.tgz#943d47e10c0b704aa42275e20edf3722648989be" integrity sha512-Td525n+iPOOyUQIeBfcASuG6uJsDOITl7Mds5gFyerkWiX7qhUTdYUBlSgNMyVqtSJqwpt1kXGLdUt6SykLMRA== +babel-runtime@6.x.x: + version "6.26.0" + resolved "https://registry.yarnpkg.com/babel-runtime/-/babel-runtime-6.26.0.tgz#965c7058668e82b55d7bfe04ff2337bc8b5647fe" + integrity sha512-ITKNuq2wKlW1fJg9sSW52eepoYgZBggvOAHC0u/CYu/qxQ9EVzThCgR69BnSXLHjy2f7SY5zaQ4yt7H9ZVxY2g== + dependencies: + core-js "^2.4.0" + regenerator-runtime "^0.11.0" + balanced-match@^1.0.0: version "1.0.2" resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.2.tgz#e83e3a7e3f300b34cb9d87f615fa0cbf357690ee" @@ -601,6 +616,11 @@ core-js-pure@^3.25.1: resolved "https://registry.yarnpkg.com/core-js-pure/-/core-js-pure-3.26.1.tgz#653f4d7130c427820dcecd3168b594e8bb095a33" integrity sha512-VVXcDpp/xJ21KdULRq/lXdLzQAtX7+37LzpyfFM973il0tWSsDEoyzG38G14AjTpK9VTfiNM9jnFauq/CpaWGQ== +core-js@^2.4.0: + version "2.6.12" + resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.6.12.tgz#d9333dfa7b065e347cc5682219d6f690859cc2ec" + integrity sha512-Kb2wC0fvsWfQrgk8HU5lW6U/Lcs8+9aaYcy4ZFc6DDlo4nZ7n70dEgE5rtR0oG6ufKDUnrwfWL1mXR5ljDatrQ== + cross-spawn@^7.0.2: version "7.0.3" resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-7.0.3.tgz#f73a85b9d5d41d045551c177e2882d4ac85728a6" @@ -1831,6 +1851,13 @@ react-is@^16.13.1: resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4" integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ== +react-no-ssr@^1.1.0: + version "1.1.0" + resolved "https://registry.yarnpkg.com/react-no-ssr/-/react-no-ssr-1.1.0.tgz#313b48d2e26020f969ed98e472f10481604e3cc8" + integrity sha512-3td8iPIEFKWXOJ3Ar5xURvZAsv/aIlngJLBH6fP5QC3WhsfuO2pn7WQR0ZlkTE0puWCL0RDEvXtOfAg4qMp+xA== + dependencies: + babel-runtime "6.x.x" + react-ssr-prepass@^1.5.0: version "1.5.0" resolved "https://registry.yarnpkg.com/react-ssr-prepass/-/react-ssr-prepass-1.5.0.tgz#bc4ca7fcb52365e6aea11cc254a3d1bdcbd030c5" @@ -1857,6 +1884,11 @@ readdirp@~3.6.0: dependencies: picomatch "^2.2.1" +regenerator-runtime@^0.11.0: + version "0.11.1" + resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz#be05ad7f9bf7d22e056f9726cee5017fbf19e2e9" + integrity sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg== + regenerator-runtime@^0.13.11: version "0.13.11" resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz#f6dca3e7ceec20590d07ada785636a90cdca17f9"