Add a feedback form (#799)

aaronshekey · web-flow · commit 670567c845c4 · 2021-12-03T15:23:07.000-06:00
diff --git a/docs/_includes/layouts/page.html b/docs/_includes/layouts/page.html
@@ -40,12 +40,26 @@ <h1 class="stacks-h1">{{ title }}</h1>
                     </p>
                 {% endif %}
                 {{ content }}
-                <div class="d-flex jc-end mt48 mb32">
-                    <a href="https://github.com/StackExchange/Stacks/edit/develop/docs/{{ page.inputPath }}" class="flex--item s-btn s-btn__icon s-btn__muted">
-                        {% icon "Pencil" %}
-                        Edit on GitHub
-                    </a>
-                </div>
+
+                <form class="my48 name="feedback-{{ title | downcase | replace: ' ', '-' }}" method="POST" data-netlify="true" action="{{ "/success" | relative_url }}">
+                    <label class="d-inline-block c-pointer" for="feedback-form">
+                        <div class="fs-title fw-bold mb0">Got any feedback?</div>
+                        <div class="stacks-copy mb12">Did we mess something up? Is there a typo? Send us your feedback anonymously using this form.</div>
+                    </label>
+
+                    <textarea class="s-textarea s-textarea__md hmn1 mb12" id="feedback-form" name="additional-feedback" placeholder="Tell us how we can improve this page…"></textarea>
+
+                    <div class="d-flex gs8 ai-center">
+                        <button type="submit" class="flex--item s-btn s-btn__outlined s-btn__muted">Send feedback</button>
+                        <a href="https://github.com/StackExchange/Stacks/edit/develop/docs/{{ page.inputPath }}" class="ml-auto flex--item s-btn s-btn__icon s-btn__muted">
+                            {% icon "Pencil" %}
+                            Edit on GitHub
+                        </a>
+                        <a href="https://github.com/StackExchange/Stacks/issues/new/choose" class="flex--item s-btn s-btn__icon s-btn__muted">
+                            File an issue on GitHub
+                        </a>
+                    </div>
+                </form>
             </div>
         </main>
     </div>
diff --git a/docs/success.html b/docs/success.html
@@ -0,0 +1,16 @@
+---
+title: Thanks!
+permalink: success.html
+---
+<!DOCTYPE html>
+<html lang="en-us" class="h100">
+{% include head.html %}
+
+<body class="d-flex fd-column flex__center bg-green-025 fc-green-900">
+        <div class="flex--item mb24">
+            {% spot "ApproveXL" %}
+        </div>
+        <h1 class="flex--item fs-headline1 mb0">Got it!</h1>
+    </div>
+</body>
+</html>
