2 files changed, 81 insertions, 18 deletions

diff --git a/front/src/routes/home.jsx b/front/src/routes/home.jsx
index 3495d20..d4ba22b 100644
--- a/front/src/routes/home.jsx
+++ b/front/src/routes/home.jsx
@@ -3,15 +3,20 @@ import { Link } from "react-router-dom";
 
 import { useAuthContext } from "../context/auth_context";
 
+const generateSSHConfig = (username) => `
+Host chessh
+  Hostname ${process.env.REACT_APP_SSH_SERVER}
+  Port ${process.env.REACT_APP_SSH_PORT}
+  User "${username}"
+  PubkeyAuthentication yes
+`;
+
 export const Home = () => {
   const { player, signedIn } = useAuthContext();
 
   if (signedIn) {
-    const sshConfig = `Host chessh
-  Hostname ${process.env.REACT_APP_SSH_SERVER}
-  Port ${process.env.REACT_APP_SSH_PORT}
-  User "${player?.username}"
-  PubkeyAuthentication yes`;
+    const sshConfig = generateSSHConfig(player?.username);
+
     return (
       <>
         <h2>Welcome, {player?.username}</h2>
@@ -51,7 +56,7 @@ export const Home = () => {
             <li>Then, connect with:</li>
             <CopyBlock
               theme={dracula}
-              text={"ssh -t chessh"}
+              text={"ssh chessh"}
               language={"shell"}
               showLineNumbers={false}
               codeBlock
@@ -59,19 +64,8 @@ export const Home = () => {
           </div>
           <div>
             <li>
-              Finally, play chess! Ideally, keeping the following contols in
-              mind:
+              Finally, check out the short <a href="/man-pages">man pages</a> .
             </li>
-
-            <ul>
-              <li>Ctrl + b / Escape to return to the main menu.</li>
-              <li>Ctrl + c / Ctrl + d to exit CheSSH at any point.</li>
-              <li>Arrow keys to move around the board.</li>
-              <li>
-                Select a piece with "enter", and move it to a square by pressing
-                "enter" again.
-              </li>
-            </ul>
           </div>
         </ol>
       </>
diff --git a/front/src/routes/man_pages.jsx b/front/src/routes/man_pages.jsx
new file mode 100644
index 0000000..30324c8
--- /dev/null
+++ b/front/src/routes/man_pages.jsx
@@ -0,0 +1,69 @@
+export const ManPages = () => {
+  return (
+    <div>
+      <div className="man-page-title">
+        <div>CHESSH(1)</div>
+        <div>User Help</div>
+        <div>CHESSH(1)</div>
+      </div>
+      <br />
+      <div>
+        <div>
+          <b>NAME</b>
+        </div>
+        <div>
+          <ul>
+            <li>chessh - multiplayer chess over ssh</li>
+          </ul>
+        </div>
+      </div>
+
+      <div>
+        <div>
+          <b>SYNOPSIS</b>
+        </div>
+        <div>
+          <ul>
+            <li>
+              ssh <b>chessh</b>
+            </li>
+          </ul>
+        </div>
+      </div>
+
+      <div>
+        <div>
+          <b>DESCRIPTION</b>
+        </div>
+        <div>
+          <div>
+            CheSSH uses the SSH protocol to send sequences of ANSI codes &
+            plaintext to render a chess board in your shell, and listen to I/O
+            by abusing the hell out of the{" "}
+            <a href="https://www.erlang.org/doc/man/ssh.html">
+              Erlang SSH Module
+            </a>
+            .
+          </div>
+        </div>
+      </div>
+      <br />
+      <div>
+        <div>
+          <b>INTERACTION</b>
+        </div>
+        <div>
+          <ul>
+            <li>Ctrl + b / Escape to return to the main menu.</li>
+            <li>Ctrl + c / Ctrl + d to exit CheSSH at any point.</li>
+            <li>Arrow keys / vim keybinds to move around the board.</li>
+            <li>
+              Select a piece with "enter", and move it to a square by pressing
+              "enter" again.
+            </li>
+          </ul>
+        </div>
+      </div>
+    </div>
+  );
+};