add first docussaurus site to git

www/src/pages/index.tsx

@@ -0,0 +1,124 @@
+import type {ReactNode} from 'react';
+import Layout from '@theme/Layout';
+import Heading from '@theme/Heading';
+
+const CONTACT_EMAIL = 'support@guardianproject.info';
+const MAILING_LIST = 'https://lists.mayfirst.org/mailman/listinfo/butter/';
+const BOOT_IMAGES = 'https://docs.likebutter.app/update-butter';
+const REPO = 'https://gitlab.com/likebutter/butterbox-rpi';
+const DOCS = 'https://docs.likebutter.app';
+
+function Hero() {
+  return (
+    <header className="butter-hero">
+      <div className="container">
+        <img
+          className="hero-logo"
+          src="/img/butter-logo-feature-large.svg"
+          alt="Butter App Feature Logo"
+        />
+        <Heading as="h1" className="hero-title">
+          Introducing Butter Box
+        </Heading>
+        <p className="hero-subtitle">
+          No Internet? No electricity? No problem. You can make the{' '}
+          <a href="/docs/intro">Butter app store</a> available anywhere with
+          Butter Box.
+        </p>
+      </div>
+    </header>
+  );
+}
+
+export default function Home(): ReactNode {
+  return (
+    <Layout
+      title="Introducing Butter Box"
+      description="Life without internet made smoother. Get access to tools that help.">
+      <Hero />
+      <main className="butter-content">
+        <div className="container">
+          <div className="device-image">
+            <img
+              src="/img/plugged-in-to-solar.jpg"
+              alt="A Butter Box: A Raspberry Pi Zero W 2 plugged into a battery and solar panel."
+            />
+            <p className="caption">
+              An app store, encrypted chat, and more, all available over WiFi
+              from an off-the-grid Raspberry Pi.
+            </p>
+          </div>
+
+          <section className="section">
+            <Heading as="h2">How does it work?</Heading>
+            <p className="content-text">
+              Butter Box broadcasts its own WiFi network. Once you join, you
+              can install Butter, get apps, join a public chatroom, or make
+              your own private one to share with friends. Butter Box works
+              even when there&apos;s no Internet. Just stop by the box to
+              download more apps or check in on your chatrooms. Everything is
+              stored right on the Butter Box.
+            </p>
+            <a className="btn-main" target="_blank" rel="noreferrer" href={DOCS}>
+              Learn More
+            </a>
+          </section>
+
+          <section className="section">
+            <Heading as="h2">Get your own Butter Box</Heading>
+            <p className="content-text">
+              We make &amp; ship Butter Boxes to partners around the world.
+              Reach out to us if you serve a community that could benefit.
+            </p>
+            <a className="btn-main" href={`mailto:${CONTACT_EMAIL}`}>
+              Email us
+            </a>
+          </section>
+
+          <section className="section">
+            <Heading as="h2">Join our community mailing list</Heading>
+            <p className="content-text">
+              Get support and share expertise with other &ldquo;Smooth
+              Operators&rdquo; (Butter Box stewards) around the world.
+            </p>
+            <a
+              className="btn-main"
+              target="_blank"
+              rel="noreferrer"
+              href={MAILING_LIST}>
+              Join the list here
+            </a>
+          </section>
+
+          <section className="section">
+            <Heading as="h2">Make your own Butter Box</Heading>
+            <p className="content-text">
+              You can make your own Butter Box by installing a pre-made image
+              on a Raspberry Pi. Just download the image and burn it onto a
+              MicroSD card using the same RPi Imager you&apos;d use to install
+              other distros.
+            </p>
+            <a
+              className="btn-main"
+              target="_blank"
+              rel="noreferrer"
+              href={BOOT_IMAGES}>
+              Download boot images
+            </a>
+            <p className="content-text" style={{marginTop: '1.5rem'}}>
+              Or, customize your Butter Box following the instructions in our
+              open source repository.
+            </p>
+            <a
+              className="btn-main"
+              target="_blank"
+              rel="noreferrer"
+              href={`${REPO}/-/blob/main/docs/en/README.md`}>
+              Source &amp; Documentation
+            </a>
+          </section>
+        </div>
+      </main>
+    </Layout>
+  );
+}