Working on contact script.

components/groovy/com/jessebrault/site/StandardPage.groovy

@@ -4,7 +4,6 @@ import com.jessebrault.ssg.di.Global
 import groowt.view.component.web.BaseWebViewComponent
 import groowt.view.component.web.WebViewComponent
 import jakarta.inject.Inject
-import org.jetbrains.annotations.Nullable
 
 import java.time.LocalDate
 import java.time.format.DateTimeFormatter
@@ -15,6 +14,7 @@ class StandardPage extends BaseWebViewComponent {
     final String youtubeUrl
     final String title
     final Closure<WebViewComponent> banner
+    final List<String> pageScripts
 
     @Inject
     StandardPage(@Global('spotifyUrl') String spotifyUrl, @Global('youtubeUrl') String youtubeUrl, Map attr) {
@@ -22,6 +22,7 @@ class StandardPage extends BaseWebViewComponent {
         this.youtubeUrl = youtubeUrl
         this.title = attr.title
         this.banner = attr.banner ?: { '' }
+        this.pageScripts = attr.pageScripts ?: []
     }
 
     List getMainChildren() {

components/resources/com/jessebrault/site/StandardPageTemplate.wvc

@@ -21,5 +21,6 @@ import com.jessebrault.site.icon.YoutubeIcon
             </div>
             <p>Copyright $copyrightYear Jesse R. Brault. All rights reserved.</p>
         </footer>
+        <Each items={pageScripts} transform={<script src={it}></script>} />
     </body>
 </html>

pages/resources/com/jessebrault/site/contact/ContactPageTemplate.wvc

@@ -3,7 +3,7 @@ package com.jessebrault.site.contact
 
 import com.jessebrault.site.StandardPage
 ---
-<StandardPage title={title} banner={<ContactBanner />}>
+<StandardPage title={title} banner={<ContactBanner />} pageScripts={['/contact.js']}>
     <article class="contact">
         <h1>Contact</h1>
         <p>Please use the following form to contact Jesse Brault directly.</p>

static/contact.js

@@ -0,0 +1,23 @@
+window.addEventListener('load', function () {
+    const contactForm = document.querySelector('form.contact')
+    contactForm.addEventListener('submit', function (submitEvent) {
+        submitEvent.preventDefault()
+        const formData = new FormData(contactForm)
+
+        const message = `
+From: ${formData.get('name')}
+Email: ${formData.get('email')}
+Institution: ${formData.get('institution')}
+Message:
+${formData.get('message')}
+        `.trim()
+
+        const toSend = { message }
+        console.log(toSend)
+        // fetch('https://api.jessebrault.com/contact/jessebrault', {
+        //     body: JSON.stringify(toSend),
+        //     headers: 'Content-Type: Application/JSON',
+        //     method: 'POST' // TODO: signal
+        // })
+    })
+})

static/main.css

@@ -1,9 +1,6 @@
 :root {
     --black: #000000;
     --charcoal: #38383b;
-    --dark-blue: #00416b;
-    --medium-blue: #005e9b;
-    --light-blue: #0071bb;
     --light-gray: #dedede;
     --petrol: #476c77;
     --off-white: #fdfdfd;