Полоса оплаты выберите стиль - PullRequest
0 голосов
/ 10 июля 2020

Я пытаюсь стилизовать раскрывающийся список полос в соответствии с выбором bootstrap. вот мой html

<form id="payment-form">
  <div class="form-row">
    <div>
      <label for="bank-element">
        Bank
      </label>
      <div id="bank-element">
        <!-- A Stripe Element will be inserted here. -->
      </div>
    </div>
  </div>

  <button id="button" data-secret="<?= $intent->client_secret ?>">
    Submit Payment
  </button>

  <!-- Used to display form errors. -->
  <div id="error-message" role="alert"></div>
</form>

в моем js файле, у меня есть этот

var style = {
    base: {
        'padding': "10px 12px",
        'color': '#495057',
        'fontFamily': 'apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif',
        'border-color': '#80BDFF',
        'outline':'0',
        'box-shadow': '0 0 0 .2rem rgba(0,123,255,.25)',
        'transition': 'border-color .15s ease-in-out, box-shadow .15s ease-in-out'
      },
      invalid: {
        color: "#fa755a"
      }
};

var Bank = elements.create(
    'Bank',
    {style: style, accountHolderType: 'individual'}
  );
  

id="bank-element", есть ли раскрывающийся список. Кто-нибудь знает, как это сделать? или что я скучаю. Спасибо

1 Ответ

0 голосов
/ 10 июля 2020

Отличный вопрос, но, к сожалению, вы ограничены вариантами стиля, перечисленными здесь: https://stripe.com/docs/js/appendix/style

Это означает, что вы не сможете установить: border-color, transition, border-color или outline на самом элементе. Вы можете применить границу и анимацию к контейнеру div, но вы не сможете настроить переход анимации для чего-либо внутри элемента.

...