From 73be5ac80ec134602bccd6455eef03602f8409b5 Mon Sep 17 00:00:00 2001
From: Marcin Kulik <m@ku1ik.com>
Date: Tue, 10 Oct 2023 11:57:41 +0200
Subject: [PATCH] Add Liberapay link

---
 assets/css/_base.scss                         |  7 +++
 .../templates/layout/_donate_modal.html.heex  | 54 +++++++++++++++++++
 .../templates/layout/_footer.html.heex        |  2 +-
 .../templates/layout/app.html.heex            |  1 +
 4 files changed, 63 insertions(+), 1 deletion(-)
 create mode 100644 lib/asciinema_web/templates/layout/_donate_modal.html.heex

diff --git a/assets/css/_base.scss b/assets/css/_base.scss
index 2ac64c428..1e597ddee 100644
--- a/assets/css/_base.scss
+++ b/assets/css/_base.scss
@@ -190,3 +190,10 @@ body pre {
 .form-control::placeholder {
   color: #959fa7;
 }
+
+.btn-gh-sponsors {
+  font-weight: 600;
+  color: #333;
+  background-color: #eee;
+  border-color: #ccc;
+}
diff --git a/lib/asciinema_web/templates/layout/_donate_modal.html.heex b/lib/asciinema_web/templates/layout/_donate_modal.html.heex
new file mode 100644
index 000000000..135320f53
--- /dev/null
+++ b/lib/asciinema_web/templates/layout/_donate_modal.html.heex
@@ -0,0 +1,54 @@
+<div class="modal fade" id="donate-modal" tabindex="-1" role="dialog" aria-hidden="true">
+  <div class="modal-dialog modal-lg" role="document">
+    <div class="modal-content">
+      <div class="modal-header">
+        <h5 class="modal-title">Support asciinema</h5>
+        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+          <span aria-hidden="true">&times;</span>
+        </button>
+      </div>
+
+      <div class="modal-body">
+        <p>Hi, I'm <a href="https://github.com/ku1ik">Marcin</a>, the creator
+          and dedicated maintainer of the asciinema project.</p>
+
+        <p>Please consider becoming a patron if you ever thought, "Wow, that's
+          cool!" about asciinema. Your support would allow me to dedicate more
+          time to the project, ensuring continuous maintenance, development of new
+          features, timely bug fixes, and the smooth operation of asciinema.org.</p>
+
+        <hr />
+
+        <h3>
+          Sponsor via Github Sponsors
+        </h3>
+
+        <p>
+          <a href="https://github.com/sponsors/ku1ik" class="btn btn-sm btn-gh-sponsors">
+            🩷&nbsp;&nbsp;Sponsor
+          </a>
+        </p>
+
+        <hr />
+
+        <h3>
+          Donate via Liberapay
+        </h3>
+
+        <p>
+          <a href="https://liberapay.com/ku1ik/donate">
+            <img
+              alt="Donate using
+        Liberapay"
+              src="https://liberapay.com/assets/widgets/donate.svg"
+            />
+          </a>
+        </p>
+
+        <hr />
+
+        <p>Thank you! ❤️</p>
+      </div>
+    </div>
+  </div>
+</div>
diff --git a/lib/asciinema_web/templates/layout/_footer.html.heex b/lib/asciinema_web/templates/layout/_footer.html.heex
index d22d79c53..83fb61673 100644
--- a/lib/asciinema_web/templates/layout/_footer.html.heex
+++ b/lib/asciinema_web/templates/layout/_footer.html.heex
@@ -4,7 +4,7 @@
       <div class="col" style="text-align: center">
         This site is powered by
         <a href="https://github.com/asciinema/asciinema-server">asciinema-server</a>
-        <br /> ❤️ <a href="https://github.com/sponsors/ku1ik">Donate</a>
+        <br /> ❤️ <a href="#" data-toggle="modal" data-target="#donate-modal">Donate</a>
       </div>
     </div>
   </div>
diff --git a/lib/asciinema_web/templates/layout/app.html.heex b/lib/asciinema_web/templates/layout/app.html.heex
index c0ba49586..993bc75bb 100644
--- a/lib/asciinema_web/templates/layout/app.html.heex
+++ b/lib/asciinema_web/templates/layout/app.html.heex
@@ -23,6 +23,7 @@
     </main>
 
     <%= render("_footer.html", conn: @conn) %>
+    <%= render("_donate_modal.html") %>
     <script phx-track-static src={Routes.static_path(@conn, "/js/app.js")}>
     </script>
   </body>