From 0fc5b59d5fb6e0e71e65171de42d97d0f1abb74b Mon Sep 17 00:00:00 2001
From: Oliver <oliver@odoo4projects.com>
Date: Fri, 27 Mar 2026 17:46:37 -0300
Subject: [PATCH] =?UTF-8?q?feat:=20footer=20feedback=20widget=20=E2=80=94?=
 =?UTF-8?q?=20textarea=20+=20send=20to=20webhook?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 index.html | 161 +++++++++++++++++++++++++++++++++++++++++++++++++++--
 1 file changed, 157 insertions(+), 4 deletions(-)

diff --git a/index.html b/index.html
index 6f37adf..f2c66d6 100644
--- a/index.html
+++ b/index.html
@@ -1027,11 +1027,10 @@
             .footer-inner {
                 max-width: 72rem;
                 margin: 0 auto;
-                display: flex;
-                flex-wrap: wrap;
+                display: grid;
+                grid-template-columns: 1fr auto 1fr;
                 align-items: center;
-                justify-content: space-between;
-                gap: 1.25rem;
+                gap: 2rem;
                 font-size: 0.875rem;
             }
             .footer-copy {
@@ -1040,6 +1039,7 @@
             .footer-links {
                 display: flex;
                 gap: 1.75rem;
+                justify-self: end;
             }
             .footer-links a {
                 color: rgba(255, 255, 255, 0.6);
@@ -1049,6 +1049,91 @@
                 color: var(--white);
             }
 
+            /* ── Footer Feedback ────────────────────────────── */
+            .footer-feedback {
+                justify-self: center;
+                width: 100%;
+                max-width: 380px;
+            }
+            .footer-feedback__form {
+                display: flex;
+                gap: 0.5rem;
+                align-items: flex-end;
+            }
+            .footer-feedback__area {
+                flex: 1;
+                resize: none;
+                border: 1.5px solid rgba(255, 255, 255, 0.18);
+                border-radius: 0.875rem;
+                padding: 0.6rem 0.875rem;
+                font-family: "Inter", sans-serif;
+                font-size: 0.8rem;
+                color: var(--white);
+                background-color: rgba(255, 255, 255, 0.07);
+                outline: none;
+                line-height: 1.5;
+                transition:
+                    border-color 0.2s,
+                    background-color 0.2s;
+                overflow: hidden;
+            }
+            .footer-feedback__area::placeholder {
+                color: rgba(255, 255, 255, 0.35);
+            }
+            .footer-feedback__area:focus {
+                border-color: rgba(255, 255, 255, 0.42);
+                background-color: rgba(255, 255, 255, 0.11);
+            }
+            .footer-feedback__btn {
+                flex-shrink: 0;
+                background-color: var(--terra);
+                color: var(--white);
+                border: none;
+                border-radius: 0.875rem;
+                padding: 0.6rem 1rem;
+                font-family: "Inter", sans-serif;
+                font-size: 0.8rem;
+                font-weight: 700;
+                cursor: pointer;
+                transition:
+                    background-color 0.2s,
+                    transform 0.15s;
+                white-space: nowrap;
+                line-height: 1.5;
+            }
+            .footer-feedback__btn:hover {
+                background-color: var(--terra-deep);
+                transform: translateY(-1px);
+            }
+            .footer-feedback__btn:disabled {
+                opacity: 0.5;
+                cursor: not-allowed;
+                transform: none;
+            }
+            .footer-feedback__msg {
+                font-size: 0.74rem;
+                color: rgba(255, 255, 255, 0.52);
+                margin-top: 0.4rem;
+                min-height: 1em;
+                text-align: center;
+                transition: opacity 0.3s;
+            }
+
+            @media (max-width: 900px) {
+                .footer-inner {
+                    grid-template-columns: 1fr;
+                    text-align: center;
+                    gap: 1.5rem;
+                }
+                .footer-links {
+                    justify-self: center;
+                }
+                .footer-feedback {
+                    justify-self: stretch;
+                    max-width: 100%;
+                }
+            }
+
             /* ── Blog Modal ─────────────────────────────────────────── */
             #blog-modal {
                 position: fixed;
@@ -1790,6 +1875,30 @@
                         >ODOO4projects — Hosting for the AI generation</span
                     >
                 </p>
+
+                <div class="footer-feedback">
+                    <form
+                        id="footer-feedback-form"
+                        class="footer-feedback__form"
+                        novalidate
+                    >
+                        <textarea
+                            id="footer-feedback-text"
+                            class="footer-feedback__area"
+                            rows="2"
+                            maxlength="1000"
+                            placeholder="Missing something, or have feedback? Drop us a note — we read every one."
+                        ></textarea>
+                        <button type="submit" class="footer-feedback__btn">
+                            Send&nbsp;→
+                        </button>
+                    </form>
+                    <p
+                        id="footer-feedback-msg"
+                        class="footer-feedback__msg"
+                    ></p>
+                </div>
+
                 <nav class="footer-links" aria-label="Footer links">
                     <a
                         href="https://odoo4projects.com/support"
@@ -2399,6 +2508,50 @@
                     }
                 });
             }
+
+            // Footer feedback
+            var footerFeedbackForm = document.getElementById(
+                "footer-feedback-form",
+            );
+            if (footerFeedbackForm) {
+                footerFeedbackForm.addEventListener(
+                    "submit",
+                    async function (e) {
+                        e.preventDefault();
+                        var textarea = document.getElementById(
+                            "footer-feedback-text",
+                        );
+                        var msgEl = document.getElementById(
+                            "footer-feedback-msg",
+                        );
+                        var btn = footerFeedbackForm.querySelector(
+                            'button[type="submit"]',
+                        );
+                        var text = textarea.value.trim();
+                        if (!text) return;
+                        btn.disabled = true;
+                        msgEl.textContent = "";
+                        try {
+                            var fd = new FormData();
+                            fd.append("message", text);
+                            fd.append("page", window.location.href);
+                            await fetch(
+                                "https://002-001-5dd6e535-4d1c-46bc-9bd9-42ad4bc5f082.odoo4projects.com/webhook/2fe3d1fe-eff9-45aa-8d0f-88738d443946",
+                                { method: "POST", body: fd },
+                            );
+                            textarea.value = "";
+                            msgEl.textContent = "✓ Thanks — we got it!";
+                            setTimeout(function () {
+                                msgEl.textContent = "";
+                            }, 5000);
+                        } catch (err) {
+                            msgEl.textContent =
+                                "Could not send right now. Please try again.";
+                        }
+                        btn.disabled = false;
+                    },
+                );
+            }
         </script>
     </body>
 </html>