diff --git a/frontend/src/app.css b/frontend/src/app.css index 023ba08..ab7b45c 100644 --- a/frontend/src/app.css +++ b/frontend/src/app.css @@ -29,3 +29,12 @@ a[role="button"] { textarea { margin-bottom: 12px; } + +nav ul { + display: flex; + justify-content: center; +} + +nav ul li { + margin: 0 6px; +} diff --git a/frontend/src/app.jsx b/frontend/src/app.jsx index f832244..67b885d 100644 --- a/frontend/src/app.jsx +++ b/frontend/src/app.jsx @@ -5,16 +5,16 @@ import "./app.css"; import TLP from "./pages/tlp"; import LHTLP from "./pages/lhtlp"; import Index from "./pages/index"; -import { LHTLP_PATH, TLP_PATH } from "./constants"; +import { LHTLP_PATH, ROOT_PATH, TLP_PATH } from "./constants"; export function App() { - const [path, setPath] = useState(); + const [path, setPath] = useState(ROOT_PATH); if (path === TLP_PATH) { - return <TLP setPath={setPath} />; + return <TLP path={path} setPath={setPath} />; } else if (path === LHTLP_PATH) { - return <LHTLP setPath={setPath} />; + return <LHTLP path={path} setPath={setPath} />; } - return <Index setPath={setPath} />; + return <Index path={path} setPath={setPath} />; } diff --git a/frontend/src/components/Nav.jsx b/frontend/src/components/Nav.jsx index 2664b47..3c77100 100644 --- a/frontend/src/components/Nav.jsx +++ b/frontend/src/components/Nav.jsx @@ -1,9 +1,22 @@ import { ROOT_PATH } from "../constants"; -export default function Nav({ setPath }) { +export default function Nav({ path, setPath }) { return ( - <a role="button" onClick={() => setPath(ROOT_PATH)}> - Go Back - </a> + <nav> + <ul> + {path !== ROOT_PATH && ( + <li> + <a role="button" onClick={() => setPath(ROOT_PATH)}> + 🏠 Home + </a> + </li> + )} + <li> + <a href="https://github.com/pmuens/time-lock-puzzle" target="_blank"> + 🧑💻 GitHub Repository + </a> + </li> + </ul> + </nav> ); } diff --git a/frontend/src/pages/index.jsx b/frontend/src/pages/index.jsx index 3a994ba..ad5e98e 100644 --- a/frontend/src/pages/index.jsx +++ b/frontend/src/pages/index.jsx @@ -1,8 +1,11 @@ +import Nav from "../components/Nav"; import { TLP_PATH, LHTLP_PATH } from "../constants"; -export default function Index({ setPath }) { +export default function Index({ path, setPath }) { return ( <div> + <Nav path={path} setPath={setPath} /> + <hr /> <h1>Time-Lock Puzzle Implementations</h1> <ul> <li> diff --git a/frontend/src/pages/lhtlp.jsx b/frontend/src/pages/lhtlp.jsx index f7831d1..8cd1a47 100644 --- a/frontend/src/pages/lhtlp.jsx +++ b/frontend/src/pages/lhtlp.jsx @@ -3,7 +3,7 @@ import { useEffect, useState } from "preact/hooks"; import Nav from "../components/Nav"; import { useWorker } from "../hooks"; -export default function LHTLP({ setPath }) { +export default function LHTLP({ path, setPath }) { const [result, setResult] = useState(); const [message1, setMessage1] = useState(42); const [message2, setMessage2] = useState(24); @@ -56,18 +56,15 @@ export default function LHTLP({ setPath }) { return ( <div> - <Nav setPath={setPath} /> + <Nav path={path} setPath={setPath} /> <hr /> <h1>Linearly Homomorphic Time-Lock Puzzle</h1> <p> - <a href="https://github.com/pmuens/time-lock-puzzle" target="_blank"> - Implementation - </a>{" "} - of{" "} + Implementation of{" "} <a href="https://eprint.iacr.org/2019/635.pdf" target="_blank"> Malavolta et al. - Homomorphic Time-Lock Puzzles and Applications - </a> - . + </a>{" "} + (Section 4.1) </p> <hr /> <form onSubmit={handleSubmitGenerate}> diff --git a/frontend/src/pages/tlp.jsx b/frontend/src/pages/tlp.jsx index 9daacff..10304f7 100644 --- a/frontend/src/pages/tlp.jsx +++ b/frontend/src/pages/tlp.jsx @@ -3,7 +3,7 @@ import { useEffect, useState } from "preact/hooks"; import Nav from "../components/Nav"; import { useWorker } from "../hooks"; -export default function TLP({ setPath }) { +export default function TLP({ path, setPath }) { const [result, setResult] = useState(); const [message, setMessage] = useState(42); const [puzzleJSON, setPuzzleJSON] = useState(); @@ -54,21 +54,18 @@ export default function TLP({ setPath }) { return ( <div> - <Nav setPath={setPath} /> + <Nav path={path} setPath={setPath} /> <hr /> <h1>Time-Lock Puzzle</h1> <p> - <a href="https://github.com/pmuens/time-lock-puzzle" target="_blank"> - Implementation - </a>{" "} - of{" "} + Implementation of{" "} <a href="https://people.eecs.berkeley.edu/~daw/papers/timelock.pdf" target="_blank" > Rivest et al. - Time-Lock Puzzles and Timed-Release Crypto - </a> - . + </a>{" "} + (Section 2.1 and 2.2) </p> <hr /> <form onSubmit={handleSubmitGenerate}>