From d805f93c1426b4e6b1a78c41541ddc15c42c20c2 Mon Sep 17 00:00:00 2001
From: Zimo <peter.zimon@gmail.com>
Date: Thu, 25 Apr 2019 15:54:30 +0200
Subject: [PATCH] Updated members payment failed copy and style

no-issue
---
 .../members-auth-pages/pages/StripeSubscribePaymentPage.js | 7 +++++--
 ghost/members-auth-pages/styles/components.css             | 5 +++--
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/ghost/members-auth-pages/pages/StripeSubscribePaymentPage.js b/ghost/members-auth-pages/pages/StripeSubscribePaymentPage.js
index a602aa1dd8..205261313a 100644
--- a/ghost/members-auth-pages/pages/StripeSubscribePaymentPage.js
+++ b/ghost/members-auth-pages/pages/StripeSubscribePaymentPage.js
@@ -5,6 +5,7 @@ import FormSubmit from '../components/FormSubmit';
 import CouponInput from '../components/CouponInput';
 import CheckoutForm from '../components/CheckoutForm';
 import Form from '../components/Form';
+import { IconError } from '../components/icons';
 
 const getCouponData = frameLocation => {
     const params = new URLSearchParams(frameLocation.query);
@@ -102,8 +103,10 @@ export default class StripeSubscriptionPage extends Component {
         return (
             <div class="gm-upgrade-page">
                 <div className="gm-modal-form gm-subscribe-form">
-                    <FormHeader title="Complete payment" error={error} errorText="Unable to confirm payment" />
-                    <div> We were unable to process your payment, please try again or use different card details.</div>
+                    <FormHeader title="Card declined" error={error} errorText="Unable to confirm payment" />
+                    <div class="gm-form-errortext"><i>{ IconError }</i>
+                        <span>We were unable to process your payment, please try again or use different card details.</span>
+                    </div>
                     <div className="flex flex-column justfiy-stretch mt7">
                         { this.renderPlansSection() }
                         <div className="mt4 nb3">
diff --git a/ghost/members-auth-pages/styles/components.css b/ghost/members-auth-pages/styles/components.css
index 71a444989d..eef4b79eb0 100644
--- a/ghost/members-auth-pages/styles/components.css
+++ b/ghost/members-auth-pages/styles/components.css
@@ -415,7 +415,8 @@ select:-webkit-autofill:active {
     display: flex;
     justify-content: center;
     align-items: start;
-    border-radius: 4px;
+    border-radius: 7px;
+    line-height: 1.4em;
 }
 
 .gm-form-errortext span {
@@ -423,7 +424,7 @@ select:-webkit-autofill:active {
 }
 
 .gm-form-errortext i {
-    margin: 1px 8px 0 0;
+    margin: 3px 8px 0 0;
 }
 
 .gm-form-errortext i svg path {