Add modal

Based on https://getbootstrap.com/docs/4.0/components/modal

Author: keunes

_i18n/da.yml

@@ -106,8 +106,6 @@ contribute:
       wireframes? Hjælp med at løse disse problemer.
   introduction: AntennaPod er under aktiv udvikling af frivillige. Du kan også bidrage
     med kode eller andet!
-  donate: Hvis du ikke kan bidrage på nogen af de ovennævnte måder, kan du også give
-    et <a href="https://opencollective.com/antennapod" target="_blank"> bidrag</a>.
 documentation:
   general:
     search-placeholder: Søg i dokumentation

_i18n/en.yml

@@ -109,7 +109,12 @@ contribute:
   design:
     title: "Design"
     text: "You turn complex requests in understandable user stories or wireframes? Help tackle these issues."
-  donate: "Or, if you can't contribute in any of the ways listed above, you can also make a <a href=\"https://opencollective.com/antennapod\" target=\"_blank\">donation</a>."
+  donate:
+    link: "I want to make a <a href=\"https://opencollective.com/antennapod\" target=\"_blank\" data-toggle=\"modal\" data-target=\"#donationModal\">donation</a>."
+    modal-title: "Are you sure you want to donate?"
+    modal-button-donate: "Donate anyway"
+    modal-button-chat: "Discuss with us how you can help"
+    modal-button-contribute: "Check contribution options again"
 
 ## Documentation
 documentation:

_i18n/en/general/donation-modal.md

@@ -0,0 +1,3 @@
+AntennaPod doesn't need a lot of money. **Our (annual) costs are already covered** by our existing donation funds. Therefore, we'd much prefer it if you
+* donate to your favorite podcast(er), or
+* help us with a non-monetary contribution.

_i18n/es.yml

@@ -109,8 +109,6 @@ contribute:
       "wireframes"? Ayuda a solucionar estos problemas.
   introduction: AntennaPod está siendo desarrollado activamente por gente voluntaria.
     ¡Tú también puedes contribuir, mediante código o de otra manera!
-  donate: O, si no puedes contribuir de ninguna de las formas arriba listadas, también
-    puedes hacer una <a href="https://opencollective.com/antennapod" target="_blank">donación</a>.
 documentation:
   general:
     introduction: Bienvenido a la sección de documentación de AntennaPod. Esta sección

_i18n/fr.yml

@@ -110,9 +110,6 @@ contribute:
   test:
     text: Vous êtes doué pour casser des trucs ? Devenez bêta-testeur.
     title: Tester
-  donate: Ou, si vous ne pouvez pas contribuer de l'une des manières énumérées ci-dessus,
-    vous pouvez également faire un <a href="https://opencollective.com/antennapod"
-    target="_blank">don</a>.
 documentation:
   general:
     search-placeholder: Rechercher dans la documentation

_i18n/it.yml

@@ -26,8 +26,6 @@ contribute:
   translate:
     title: Traduzione
     text: Parli altre lingue oltre all'inglese? Aiutaci a tradurre AntennaPod.
-  donate: Oppure, se non puoi contribuire in nessuno dei modi elencati qui sopra,
-    puoi anche fare una <a href="https://opencollective.com/antennapod" target="_blank">donazione</a>.
   test:
     title: Test
     text: Rompere le cose ti riesce bene? Diventa beta tester.

_i18n/nl.yml

@@ -100,9 +100,6 @@ contribute:
     title: Promoten
     text: Schrijf je pakkende tweets en interessante blogs, of maak je prachtige graphics?
       Help ons AntennaPod wereldberoemd maken.
-  donate: Of, als je niet op een van bovenstaande manieren kunt bijdragen, kun je
-    ook een <a href="https://opencollective.com/antennapod" target="_blank">donatie</a>
-    doen.
 documentation:
   categories:
     podcasters-hosters:

contribute.html

@@ -16,4 +16,25 @@
   {% include contribute-card.html icon="fa-pencil-ruler" url="https://github.com/AntennaPod/AntennaPod/labels/needs:%20mock-up%20or%20user%20story" item="design" target="external" %}
 </div>
 
-<p id="donate">{% t contribute.donate %}</p>
+<p id="donate">{% t contribute.donate.link %}</p>
+
+<div class="modal fade" id="donationModal" tabindex="-1" role="dialog" aria-labelledby="donationModalLabel" aria-hidden="true">
+  <div class="modal-dialog modal-dialog-centered" role="document">
+    <div class="modal-content">
+      <div class="modal-header">
+        <h5 class="modal-title" id="donationModalLabel">{% t contribute.donate.modal-title %}</h5>
+        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+          <span aria-hidden="true">&times;</span>
+        </button>
+      </div>
+      <div class="modal-body">
+        {% tf general/donation-modal.md %}
+      </div>
+      <div class="modal-footer">
+        <a role="button" class="btn btn-secondary" href="https://opencollective.com/antennapod">{% t contribute.donate.modal-button-donate %}</a>
+        <a role="button" class="btn btn-primary" href="https://forum.antennapod.org/t/monthly-community-call/1869">{% t contribute.donate.modal-button-chat %}</a>
+	<button type="button" class="btn btn-light" data-dismiss="modal">{% t contribute.donate.modal-button-contribute %}</button>
+      </div>
+    </div>
+  </div>
+</div>