Added new donation buttons

These buttons replace the old two links and add Liberapay.

Author: MagicLike

public/static/custom.css

@@ -17,6 +17,32 @@ html {
 #user {
   display: block;
 }
+
+#donate-widgets {
+  margin: auto;
+  margin-top: 10px;
+}
+
+.opencollective,
+#gh-sponsors {
+  display: flex !important;
+  margin: auto !important;
+}
+
+.liberapay {
+  display: flex !important;
+  width: 50% !important;
+  margin-bottom: 10px;
+  margin-left: 46.05px !important;
+}
+
+.liberapay-nojs {
+  display: flex;
+  margin: auto;
+  margin-top: -20px;
+  margin-bottom: 10px;
+}
+
 /* Style the tab content */
 .tabcontent {
   display: none;

templates/index.html

@@ -356,12 +356,29 @@ <h3 class="title is-3 is-spaced">
                   </span>
                 </h3>
                 <h4 class="subtitle is-5">Donate to the project</h4>
-                <p>There are currently two ways to support the project financially</p>
-                <ul>
-                  <li><a href="https://opencollective.com/openandroidinstaller" target="_blank">OpenCollective</a></li>
-                  <li><a href="https://github.com/sponsors/openandroidinstaller-dev" target="_blank">GitHub Sponsors</a>
-                  </li>
-                </ul>
+                <p>There are currently three ways to support the project financially:</p>
+                <div id="donate-widgets" class="center">
+                  <script class="opencollective" src="https://opencollective.com/openandroidinstaller/donate/button.js"
+                    color="blue"></script>
+                  <noscript><a href="https://opencollective.com/openandroidinstaller/donate" rel="noopener"
+                      target="_blank">
+                      <img class="opencollective"
+                        src="https://opencollective.com/webpack/donate/[email protected]?color=blue" width=300 />
+                    </a></noscript>
+                  <br>
+                  <object id="gh-sponsors" title="GitHub Sponsors"
+                    data="https://img.shields.io/github/sponsors/openandroidinstaller-dev?style=for-the-badge&logo=github-sponsors&label=GitHub%20Sponsors&labelColor=white&color=pink&link=https%3A%2F%2Fgithub.com%2Fsponsors%2Fopenandroidinstaller-dev"></object>
+                  <br>
+                  <div class="liberapay">
+                    <script class="liberapay"
+                      src="https://liberapay.com/OpenAndroidInstaller/widgets/button.js"></script>
+                  </div>
+                  <noscript>
+                    <a href="https://liberapay.com/OpenAndroidInstaller/donate" rel="noopener" target="_blank"><img
+                        class="liberapay-nojs" alt="Donate using Liberapay"
+                        src="https://liberapay.com/assets/widgets/donate.svg"></a>
+                  </noscript>
+                </div>
                 <p>If you want to use a different method, please contact us.</p>
               </div>
             </div>