diff --git a/src/CreditCardInput.js b/src/CreditCardInput.js index 3f1a40c4..532d1a66 100644 --- a/src/CreditCardInput.js +++ b/src/CreditCardInput.js @@ -25,6 +25,9 @@ const s = StyleSheet.create({ inputContainer: { marginLeft: 20, }, + inputContainerForVerticalOrientation: { + marginTop: 5, + }, inputLabel: { fontWeight: "bold", }, @@ -170,21 +173,21 @@ export default class CreditCardInput extends Component { style={s.form}> + containerStyle={[formFieldsDirection=="vertical" ? s.inputContainerForVerticalOrientation : s.inputContainer, inputContainerStyle, { width: CARD_NUMBER_INPUT_WIDTH }]} /> + containerStyle={[formFieldsDirection=="vertical" ? s.inputContainerForVerticalOrientation : s.inputContainer, inputContainerStyle, { width: EXPIRY_INPUT_WIDTH }]} /> { requiresCVC && } + containerStyle={[formFieldsDirection=="vertical" ? s.inputContainerForVerticalOrientation : s.inputContainer, inputContainerStyle, { width: CVC_INPUT_WIDTH }]} /> } { requiresName && } + containerStyle={[formFieldsDirection=="vertical" ? s.inputContainerForVerticalOrientation : s.inputContainer, inputContainerStyle, { width: NAME_INPUT_WIDTH }]} /> } { requiresPostalCode && } + containerStyle={[formFieldsDirection=="vertical" ? s.inputContainerForVerticalOrientation : s.inputContainer, inputContainerStyle, { width: POSTAL_CODE_INPUT_WIDTH }]} /> } );