Lyndsay's User Guide Implementation

.eslintrc.js

@@ -11,6 +11,7 @@ module.exports = {
     parser: "@typescript-eslint/parser",
     parserOptions: {
         project: "./tsconfig.json",
+        tsconfigRootDir: __dirname,
     },
     plugins: ["@typescript-eslint", "react-hooks"],
     root: true,

packages/web/custom.d.ts

@@ -5,4 +5,12 @@ declare module "*.svg" {
     export default src;
 }
 
-declare module "*.png";
+declare module "*.png" {
+    const src: string;
+    export default src;
+}
+
+declare module "*.css" {
+    const classes: { [key: string]: string };
+    export default classes;
+}

packages/web/src/components/Footer/Footer.module.css

@@ -1,9 +1,14 @@
 .footer {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
   height: fit-content;
-  margin: 0 auto;
   padding: var(--margin) 0;
   border-top: 1px solid var(--border-color);
   text-align: center;
+  background-color: var(--secondary-dark);
+  z-index: 100;
 }
 
 .footer-link {

packages/web/src/components/Header/Menu.tsx

@@ -34,12 +34,12 @@ export default function Menu() {
                     Open-source datasets
                 </Link>
                 <Link
-                    to="learn"
+                    to="user-guide"
                     className={styles.routeLink}
                     target={isApp ? "_blank" : "_self"}
                     rel="noreferrer"
                 >
-                    Learn
+                    User guide
                 </Link>
                 <PrimaryFluent
                     ariaLabel="Help"
@@ -79,11 +79,11 @@ export default function Menu() {
                             href: "/datasets",
                         },
                         {
-                            key: "learn",
-                            text: "Learn",
+                            key: "user-guide",
+                            text: "User guide",
                             target: isApp ? "_blank" : "_self",
                             rel: "noreferrer",
-                            href: "/learn",
+                            href: "/user-guide",
                         },
                         {
                             key: "help",