Recurly.js入力フィールドの書式設定

Question

私は、Recurly経由で支払いを処理するフォームを作成しています。 non-recurly.jsフィールドはレイアウトにBootstrapを使用します。

私は、ブートストラップのフィールドを一致させるために、境界と境界半径を得るために含むDIVのスタイルを設定することができますが、ブートストラップは、入力フィールドにパディングを設定します。

padding: 6px 12px; 

...私はあなたが実際のスタイルを渡すことを信じています私はこれを試してみました：

style: { 
     all: { 
      fontFamily: 'Verdana', 
      fontSize: '14px', 
      fontWeight: 'normal', 
      padding: '8px' 
     }, 
     number: { 
      placeholder: 'Credit card number' 
     }, 
     month: { 
      placeholder: 'Exp. Month (mm)' 
     }, 
     year: { 
      placeholder: 'Exp. Year (yy)' 
     } 
    } 

...しかし、それは単にパディングを無視しています。 Recurly.jsのどこかに「サポートされている」スタイルオプションのリストがありますか？誰もがiFramed /注入された入力フィールドでパディングを取得する方法を考え出した？

Answer 1

代わりにスタイリングできるCSSクラスがいくつか繰り返してあります。私は彼らのjsスタイルを使用しようとするよりはずっと簡単だとわかりました。

私はこれらのクラスをCSSでスタイル付けし、すべてのjsオプションを無視します。

.recurly-hosted-field  = Default styles for the div surrounding each field iframe. 
.recurly-hosted-field-focus = Applied when the user focuses on a field. 
.recurly-hosted-field-number = Default styles for the div surrounding the month field iframe. 
.recurly-hosted-field-month = Default styles for the div surrounding the month field iframe. 
.recurly-hosted-field-year = Default styles for the div surrounding the year field iframe 

ドキュメント：https://dev.recurly.com/docs/getting-started-1 彼らはドキュメントから、これらのクラス