add some labels and the user table

assets/javascripts/discourse/templates/components/stripe-card.hbs

@@ -1,7 +1,7 @@
 <form id="payment-form" class="form-horizontal">
 
-  <div class="control-group">
+  <div class="control-group" style="width: 550px;">
-    <label class="control-label" for="card-element">Credit or debit card</label>
+    <label class="control-label" for="card-element">{{i18n 'discourse_payments.card'}}</label>
     <div id="card-element" class="controls"></div>
   </div>
 
@@ -12,6 +12,8 @@
   </div>
 
   {{#if result}}
+    <div class="control-group">
       <span>{{i18n 'discourse_payments.success'}}</span>
+    </div>
   {{/if}}
 </form>

assets/javascripts/discourse/templates/user/payments.hbs

@@ -1,4 +1,14 @@
-{{#d-section pageClass="stripe-payments"}}
+{{#d-section pageClass="user-payments" class="user-content user-payments"}}
-  <h2>{{i18n 'discourse_payments.title'}}</h2>
+  <div class="user-table">
+    <div class="wrapper">
+      <section class="user-navigation">
+        <ul class="action-list nav-stacked">
+          <li class="no-glyph">{{i18n 'discourse_payments.title'}}</li>
+        </ul>
+      </section>
+      <section class="user-right">
         {{stripe-card}}
+      </section>
+    </div>
+  </div>
 {{/d-section}}

config/locales/client.en.yml

@@ -2,5 +2,6 @@ en:
   js:
     discourse_payments:
       title: Donate
+      card: Credit or debit card
       success: Payment Successful
       submit: Make Payment

plugin.rb

@@ -1,6 +1,6 @@
 # name: discourse-payments
 # about: Integrating Discourse with Stripe
-# version: 1.3.1
+# version: 1.4.0
 # url: https://github.com/choiceaustralia/discourse-payments
 # authors: Rimian Perkins