Add some new documentation

README.md

@@ -1,6 +1,6 @@
 <img width="500" alt="strudel-logo-cropped" src="https://github.com/lbl-ux/strudel/assets/420923/87cb4bd1-8c8d-4dfb-924f-f96f84017f2d">
 
-[Website (under construction!)](https://lbl-ux.github.io/strudel/)
+[Website (under construction!)](https://strudel.science/strudel-web)
 
 # Scientific sofTware Research for User experience, Design, Engagement, and Learning (STRUDEL)
 

gatsby-browser.tsx

@@ -1,11 +1,12 @@
 import './src/styles/global.css';
 import React from "react";
 import { NavigationProvider } from "./src/context/NavigationProvider";
+import { GatsbyBrowser } from 'gatsby';
 
 /**
  * Wrap the gatsby app in a NavigationProvider so that any component
  * in the app can consume this context state.
  */
-export const wrapRootElement = ({ element }) => (
+export const wrapRootElement: GatsbyBrowser['wrapRootElement'] = ({ element }) => (
   <NavigationProvider>{element}</NavigationProvider>
-)
+);

src/components/Navbar.tsx

@@ -1,7 +1,6 @@
 import * as React from 'react';
 import { StaticImage } from 'gatsby-plugin-image';
-import { AppBar, Box, Container, Grid, Stack, Toolbar, Typography } from '@mui/material';
-import { PropsWithChildren } from 'react';
+import { AppBar, Box, Toolbar } from '@mui/material';
 import { Link, graphql, useStaticQuery } from 'gatsby';
 import { StrudelPage } from '../types/strudel-config';
 import { useLocation } from '@gatsbyjs/reach-router';

src/gatsby-theme-material-ui-top-layout/theme.ts

@@ -1,5 +1,10 @@
 import { Theme, createTheme } from "@mui/material";
 
+/**
+ * Material UI custom theme object.
+ * This is where the color palette and default 
+ * component styles and props can be defined.
+ */
 const theme: Theme = createTheme({
     palette: {
       primary: {