more style fixes
This commit is contained in:
parent
212d81b93c
commit
0b1abc9ab0
|
@ -19,14 +19,14 @@
|
|||
<div class="row">
|
||||
<div class="form-group col-4">
|
||||
<label for="stripe-card-number-element">{{'number' | i18n}}</label>
|
||||
<div id="stripe-card-number-element" class="form-control"></div>
|
||||
<div id="stripe-card-number-element" class="form-control stripe-form-control"></div>
|
||||
</div>
|
||||
<div class="form-group col-8 d-flex align-items-end">
|
||||
<img src="../../images/cards.png" alt="Visa, MasterCard, Discover, AmEx, JCB, Diners Club, UnionPay" width="323" height="32">
|
||||
</div>
|
||||
<div class="form-group col-4">
|
||||
<label for="stripe-card-expiry-element">{{'expiration' | i18n}}</label>
|
||||
<div id="stripe-card-expiry-element" class="form-control"></div>
|
||||
<div id="stripe-card-expiry-element" class="form-control stripe-form-control"></div>
|
||||
</div>
|
||||
<div class="form-group col-4">
|
||||
<label for="stripe-card-cvc-element" class="d-flex">
|
||||
|
@ -35,7 +35,7 @@
|
|||
<i class="fa fa-question-circle-o"></i>
|
||||
</a>
|
||||
</label>
|
||||
<div id="stripe-card-cvc-element" class="form-control"></div>
|
||||
<div id="stripe-card-cvc-element" class="form-control stripe-form-control"></div>
|
||||
</div>
|
||||
</div>
|
||||
</ng-container>
|
||||
|
|
|
@ -16,10 +16,9 @@ const Keys = {
|
|||
const StripeElementStyle = {
|
||||
base: {
|
||||
color: '#333333',
|
||||
lineHeight: '21px',
|
||||
fontFamily: '"Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif, ' +
|
||||
'"Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"',
|
||||
fontSize: '1rem',
|
||||
fontSize: '14px',
|
||||
fontSmoothing: 'antialiased',
|
||||
},
|
||||
invalid: {
|
||||
|
|
|
@ -704,16 +704,23 @@ app-user-billing {
|
|||
}
|
||||
}
|
||||
|
||||
.form-control.is-focused {
|
||||
color: $input-focus-color;
|
||||
background-color: $input-focus-bg;
|
||||
border-color: $input-focus-border-color;
|
||||
outline: 0;
|
||||
box-shadow: $input-focus-box-shadow;
|
||||
.form-control.stripe-form-control {
|
||||
padding-top: 0.55rem;
|
||||
|
||||
&.is-focused {
|
||||
color: $input-focus-color;
|
||||
background-color: $input-focus-bg;
|
||||
border-color: $input-focus-border-color;
|
||||
outline: 0;
|
||||
box-shadow: $input-focus-box-shadow;
|
||||
|
||||
&.is-invalid {
|
||||
box-shadow: 0 0 0 $input-focus-width rgba($form-feedback-invalid-color, .25);
|
||||
}
|
||||
}
|
||||
|
||||
&.is-invalid {
|
||||
border-color: $form-feedback-invalid-color;
|
||||
box-shadow: 0 0 0 $input-focus-width rgba($form-feedback-invalid-color, .25);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue