add payment gateway and fix crypto banner

client/pages/subscription.js

@@ -45,9 +45,9 @@ async function showPage({ rootEl, peertubeHelpers }) {
     rootEl.innerHTML = `
         <div class="ncd-content text-center">
         <h1>${await peertubeHelpers.translate("Choose your Storage Plan")}</h1>
-        <h4><i>To subscribe to a storage plan with cryptocurrency (BTC, ETH, XMR) or cancel/update your subscription tier, <a href="/about/contact">contact us</a>.</i></h4>
+        <h5><i>To subscribe to a storage plan with cryptocurrency (BTC, ETH, XMR), <a href="/about/contact">contact us</a>.</i></h5>
             <!-- <p>${description.length ? description : await peertubeHelpers.translate("You want tu spport us ? Or need more space ? Your in the right place!")}</p> -->
-            <div class="mt-5">
+            <div class="mt-5" style="max-width: 90%; margin: 0 auto;">
                 <div class="row">
                     ${(await Promise.all(plans.map(async (plan) =>
         `<div class="col-sm-12 col-md-6 col-lg-4"  style="margin-bottom: 1rem;">
@@ -81,6 +81,10 @@ async function showPage({ rootEl, peertubeHelpers }) {
             ${sub_plan ? `
                 <p><i><b>${await translate("Your current plan")}</b>: ${sub_plan.name}, ${currency}${sub_plan.price} /${await peertubeHelpers.translate("month")}, ${sub_plan.storage} ${await peertubeHelpers.translate("GB Storage")}</i></p>
             ` : ""}
+            
+            <div>
+            <a href="https://billing.stripe.com/p/login/aEUg0YcdE3ff9j2cMM" target="_blank" style="font-size: 1.25rem; background-color: #0083f5; color: white; border-radius: 0.25rem; padding: 0.5rem 0.75rem; margin-top: 0.5rem;">Manage Subcription</a>
+            <div>
                     
         </div>
     `;