Contact page dogfooding

index.html

@@ -35,7 +35,7 @@ <h1>Welcome to Formonit</h1>
         <li class="nav-item"><a class="nav-link" href="#about" onClick="spaGoTo('about');">About</a></li>
         <li class="nav-item"><a class="nav-link" href="https://github.com/formonit/formonit.github.io">Source</a></li>
         <li class="nav-item"><a class="nav-link" href="https://buymeacoffee.com/SomajitDey">Donate</a></li>
-        <li class="nav-item"><a class="nav-link" href="https://github.com/formonit/formonit.github.io/discussions">Contact</a></li>
+        <li class="nav-item"><a class="nav-link" href="#contact" onClick="spaGoTo('contact');">Contact</a></li>
         <li class="nav-item"><a class="nav-link" href="ToS.txt">Terms</a></li>
         <li class="nav-item"><a class="nav-link" href="PRIVACY.txt">Privacy</a></li>
       </ul>
@@ -274,6 +274,18 @@ <h3>Inbox</h3>
                 <p class="alert alert-info"><strong>Protip:</strong> To export to <a href="https://www.microsoft.com/en/microsoft-365/excel">MS Excel</a>, copy the table below, followed by <code>Paste Special &gt; Text</code> in Excel. To export to <a href="https://docs.google.com/spreadsheets/create">Google Sheets</a>, use <code>Paste Special &gt; Values only (Ctrl+Shift+V)</code> instead.</p>
               </section>
             </div>
+            <div class="spa-page" id="contact">
+              <section>
+                <h3>Contact us</h3>
+                <p>We are dogfooding by using Formonit to host Formonit's own contact page!</p>
+                <p>Feel free to get in touch by submitting the following form.</p>
+                <p>Alternatively, if you have a GitHub account, you can also reach us <a href="https://github.com/formonit/formonit.github.io/discussions">here</a>.</p>
+                <div class="my-2 ratio ratio-21x9">
+                <iframe src="https://formonit.github.io/anon/Na8kpb_9he%40alz2h" style="border:2px solid black;" title="Formonit's own contact page">
+                </iframe>
+                </div>
+              </section>
+            </div>
             <p class="d-flex justify-content-start"><button type="button" class="btn btn-danger mt-4" id="login">Let's get started</button></p>
             <div class="badge bg-warning position-fixed bottom-0 end-0">
               Sync: <span id="serverStatus">Off</span>