From 0ced6bbb4fa81f0c00bacdae6641bb03046364d5 Mon Sep 17 00:00:00 2001
From: Son NK <nguyenkims@hotmail.com>
Date: Sat, 15 Feb 2020 21:22:46 +0700
Subject: [PATCH] Prettify billing page

---
 .../templates/dashboard/billing.html          | 43 +++++++++----------
 1 file changed, 20 insertions(+), 23 deletions(-)

diff --git a/app/dashboard/templates/dashboard/billing.html b/app/dashboard/templates/dashboard/billing.html
index e33aec37..1e9a25ad 100644
--- a/app/dashboard/templates/dashboard/billing.html
+++ b/app/dashboard/templates/dashboard/billing.html
@@ -8,35 +8,32 @@
 {% endblock %}
 
 {% block default_content %}
-  <div class="row">
-    <div class="col-md-8 offset-md-2">
-      <h1> Billing </h1>
+  <div class="bg-white p-6" style="max-width: 60em; margin: auto">
+    <h1 class="h3 mb-5"> Billing </h1>
 
+    <p>
+      You are on the <b>{{ current_user.get_subscription().plan_name() }}</b> plan. Thank you very much for supporting
+      SimpleLogin. 🙌
+    </p>
+
+    {% if sub.cancelled %}
       <p>
-        You are on the <b>{{ current_user.get_subscription().plan_name() }}</b> plan. Thank you very much for supporting SimpleLogin. 🙌
+        Sad to see you go 😢. Your subscription ends {{ current_user.get_subscription().next_bill_date | dt }}.
       </p>
 
-      {% if sub.cancelled %}
-        <p>
-          Sad to see you go 😢. Your subscription ends {{ current_user.get_subscription().next_bill_date | dt }}.
-        </p>
+    {% else %}
+      <div class="mt-3">
+        Click here to update billing information on Paddle, our payment partner: <br>
+        <a class="btn btn-success" href="{{ sub.update_url }}"> Update billing information </a>
+      </div>
 
-      {% else %}
-        <div class="mt-3">
-          Click here to update billing information on Paddle, our payment partner: <br>
-          <a class="btn btn-success" href="{{ sub.update_url }}"> Update billing information </a>
-        </div>
-
-        <hr>
-
-        <div>
-          Don't want to protect your inbox anymore? <br>
-          <a class="btn btn-warning" href="{{ sub.cancel_url }}"> Cancel subscription 😔 </a>
-        </div>
-      {% endif %}
-
-    </div>
+      <hr>
 
+      <div>
+        Don't want to protect your inbox anymore? <br>
+        <a class="btn btn-warning" href="{{ sub.cancel_url }}"> Cancel subscription 😔 </a>
+      </div>
+    {% endif %}
   </div>