summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorsanine <sanine.not@pm.me>2024-07-07 12:28:13 -0500
committersanine <sanine.not@pm.me>2024-07-07 12:28:13 -0500
commit17d13e36a33d16e5242ae3b185e10928f41dd69d (patch)
tree40e4a9e4e772abc1339833e1b5ce31d5debafcbc
parentf549c7e2fc520fff17ddfe868267c28ef91bf822 (diff)
add help.html
-rw-r--r--help.html40
-rw-r--r--style.css22
2 files changed, 61 insertions, 1 deletions
diff --git a/help.html b/help.html
new file mode 100644
index 0000000..a977a2c
--- /dev/null
+++ b/help.html
@@ -0,0 +1,40 @@
+<!doctype html>
+<html>
+ <head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <title>Hyperspace Navigator - Help</title>
+ <link rel="preconnect" href="https://fonts.googleapis.com">
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+ <link href="https://fonts.googleapis.com/css2?family=VT323&display=swap" rel="stylesheet">
+ <link href="style.css" rel="stylesheet">
+ </head>
+ <body style="font-family: Jura;">
+ <script>0</script>
+ <div id="root">
+ <h1>hyperspace navigator help</h1>
+ <p class="normal">
+ HYPERSPACE NAVIGATOR is a game about designing trajectories using <a href="https://tutorial.math.lamar.edu/Classes/CalcII/ParametricEqn.aspx">parametric curves</a>. These are curves where <strong>y</strong> is not determined by some function of <strong>x</strong> (e.g. <strong>y = f[x]</strong>), but where both <strong>x</strong> and <strong>y</strong> are determined by a third quantity <strong>t</strong>, which we might think of as time.
+ Parametric curves are capable of producing complex and beautiful shapes from relatively simple definitions, and I encourage you to play with the system to see what you can create!
+ </p>
+ <p class="normal">
+ While defining your parametric curves, you have access to the following operations:
+ </p>
+ <ul class="normal">
+ <li>Addition (t+2)</li>
+ <li>Subtraction (2-t)</li>
+ <li>Multiplication (2t or 2*t)</li>
+ <li>Division (t/2)</li>
+ <li>Exponents (t^2)</li>
+ <li>Modular arithmetic (t mod 2 or t % 2)</li>
+ <li>Trigonometric functions (tan, sin, cos, acos, asin, atan, atan2)</li>
+ <li>Miscellaneous extra functions (abs, exp, log, sqrt, ceil, floor, random, round)</li>
+ <li>Mathematical constants (pi, e)</li>
+ </ul>
+ </div>
+ <div id="footer">
+ <a target="_blank" rel="noopener noreferrer"
+ href="https://sanine.net/git/hyperspace-navigator/tree/?h=main">⌘ source code</a>
+ </div>
+ </body>
+</html>
diff --git a/style.css b/style.css
index 2b3b86e..6555b37 100644
--- a/style.css
+++ b/style.css
@@ -54,7 +54,7 @@ body {
padding-top: 8px;
}
-#footer a {
+a {
color: orange;
}
@@ -127,6 +127,26 @@ input[type=button]:active {
}
+input[type=range] {
+ accent-color: orange;
+ margin-bottom: 0;
+}
+
+.alert-box label {
+ padding-bottom: 16px;
+}
+
+
label {
text-transform: lowercase;
}
+
+
+.normal {
+ text-transform: none;
+}
+
+
+.normal li {
+ font-size: 24px;
+}