Add 🍄 emoji favicon

index.html

@@ -4,6 +4,7 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Coming Soon - MycopunkXYZ</title>
+    <link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>🍄</text></svg>">
     <style>
         :root {
             --primary-color: #D27D2D;
@@ -327,9 +328,20 @@
             A network-based approach to technology and community. Drawing inspiration from mycelial structures to create resilient systems.
             Moving slowly and mending things.
         </p>
-        
+
-        <!-- Countdown and feature cards removed as requested -->
+        <!-- Newsletter signup -->
-        
+        <div class="newsletter-section" style="margin: 2rem 0;">
+            <h3 style="color: var(--primary-color); margin-bottom: 0.5rem;">Join the Mycelial Network</h3>
+            <p style="font-size: 0.9rem; margin-bottom: 1rem; opacity: 0.8;">Subscribe for updates on mycopunk principles and community.</p>
+            <form id="newsletter-form" style="display: flex; flex-direction: column; gap: 0.75rem; max-width: 400px; margin: 0 auto;">
+                <input type="email" id="newsletter-email" placeholder="your@email.com" required
+                    style="padding: 0.75rem 1rem; border-radius: 8px; border: 1px solid rgba(210, 125, 45, 0.3); background: rgba(26, 16, 6, 0.8); color: var(--text-color); font-size: 1rem;">
+                <button type="submit" class="cta" style="margin-bottom: 0; padding: 0.75rem 1.5rem;">Subscribe</button>
+            </form>
+            <p id="newsletter-message" style="margin-top: 0.75rem; font-size: 0.9rem; display: none;"></p>
+            <p style="font-size: 0.75rem; opacity: 0.6; margin-top: 0.5rem;">No spam, unsubscribe anytime.</p>
+        </div>
+
         <a href="https://mycofi.earth" class="cta" id="cta-button">Let's Get Anastomosing</a>
         
         <div class="footer">
@@ -468,6 +480,50 @@
         document.getElementById('cta-button').addEventListener('mouseenter', function() {
             createSpores();
         });
+
+        // Newsletter form handler
+        const LISTMONK_URL = 'https://newsletter.jeffemmett.com';
+        const LIST_UUID = '1f477b24-17ec-4ea1-8248-4f629d2365e4'; // Mycopunk list
+
+        document.getElementById('newsletter-form').addEventListener('submit', async function(e) {
+            e.preventDefault();
+            const email = document.getElementById('newsletter-email').value;
+            const messageEl = document.getElementById('newsletter-message');
+            const submitBtn = this.querySelector('button[type="submit"]');
+
+            submitBtn.textContent = 'Subscribing...';
+            submitBtn.disabled = true;
+
+            try {
+                const response = await fetch(LISTMONK_URL + '/subscription/form', {
+                    method: 'POST',
+                    headers: {
+                        'Content-Type': 'application/x-www-form-urlencoded',
+                    },
+                    body: new URLSearchParams({
+                        email: email,
+                        list: LIST_UUID,
+                        name: '',
+                    }),
+                });
+
+                if (response.ok) {
+                    messageEl.textContent = 'Check your email to confirm your subscription!';
+                    messageEl.style.color = 'var(--accent-color)';
+                    messageEl.style.display = 'block';
+                    document.getElementById('newsletter-email').value = '';
+                } else {
+                    throw new Error('Subscription failed');
+                }
+            } catch (error) {
+                messageEl.textContent = 'Something went wrong. Please try again.';
+                messageEl.style.color = '#ff6b6b';
+                messageEl.style.display = 'block';
+            }
+
+            submitBtn.textContent = 'Subscribe';
+            submitBtn.disabled = false;
+        });
     </script>
 </body>
 </html>