survey component

src/App.vue

@@ -5,6 +5,8 @@
       <ReferenceSection />
       <hr class="my-5 w-full">
       <PublicationsSection class="md:max-w-[90%]" />
+      <hr class="my-5 w-full">
+      <SurveySection />
     </main>
     <footer class="shadow border-t border-gray-100 py-2 relative bottom-0">
       <p class="ml-2">
@@ -18,4 +20,5 @@
 import PublicationsSection from './components/PublicationsSection.vue';
 import ReferenceSection from './components/ReferenceSection.vue';
 import HeaderComponent from './components/HeaderComponent.vue';
+import SurveySection from './components/SurveySection.vue';
 </script>

src/components/ReferenceLinkComponent.vue

@@ -12,7 +12,6 @@
     />
     </div>
 
-
     <b>
       {{ referenceLink.title }}
     </b>

src/components/SurveySection.vue

@@ -0,0 +1,17 @@
+<template>
+  <section>
+    <h2 class="text-2xl pb-2">Have you used JPlag before?</h2>
+    <hr class="pb-2 md:mx-[-1rem]">
+    <p>
+      Then please consider taking the <a :href="link" class="text-link hover:text-link-hover visited:text-link-visited active:text-link-clicked underline">survey</a>. <br />
+      It takes less than 5 minutes. <br />
+      Your help is very appreciated and can help make JPlag a better tool. <br />
+      <a :href="link" class="text-link hover:text-link-hover visited:text-link-visited active:text-link-clicked underline">Click here to get to the survey.</a>
+    </p>
+  </section>
+
+</template>
+
+<script setup lang="ts">
+const link = "https://docs.google.com/forms/d/e/1FAIpQLSckqUlXhIlJ-H2jtu2VmGf_mJt4hcnHXaDlwhpUL3XG1I8UYw/viewform"
+</script>