raggedstaff/openfoodnetwork
1
0
Fork 0
mirror of https://github.com/openfoodfoundation/openfoodnetwork synced 2026-02-27 01:43:22 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add border to Stripe Elements input, make text larger

Browse Source
This commit is contained in:
Rob Harrington
2017-09-08 11:32:11 +10:00
parent 0cd43987de
commit 3a0b47c451
2 changed files with 25 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
app/assets/javascripts/darkswarm/directives/stripe_elements.js.coffee
View File

@@ -9,7 +9,15 @@ Darkswarm.directive "stripeElements", ($injector, StripeElements) ->
if $injector.has('stripeObject')
stripe = $injector.get('stripeObject')
card = stripe.elements().create('card', {hidePostalCode: false})
card = stripe.elements().create 'card',
hidePostalCode: false
style:
base:
fontFamily: "Roboto, Arial, sans-serif"
fontSize: '16px'
color: '#4c4c4c'
'::placeholder':
color: '#6c6c6c'
card.mount('#card-element')
# Elements validates user input as it is typed. To help your customers

16
app/assets/stylesheets/darkswarm/stripe-elements.css.scss Normal file
View File

@@ -0,0 +1,16 @@
stripe-elements #card-element {
background: white;
box-sizing: border-box;
font-weight: 400;
padding: 0.8rem 0.5rem;
border: 1px solid #cccccc;
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
border-radius: 0px;
color: #32315E;
outline: none;
height: 48px;
line-height: 48px;
cursor: text;
width: 100%;
float: right;
}