import React, {Component} from 'react';
import {View, Text, TextInput, TouchableOpacity, Platform} from 'react-native';
import {colors} from '../assets/styles/colors-theme';
import {width, height} from '../services/screen';

class CustomSignupInput extends Component {
  render() {
    return (
      <View
        style={{
          backgroundColor: colors.signupInputBgc,
          height: 50,
          borderRadius: 30,
          width: width - 100,
          justifyContent: 'center',
          marginTop: 20,
        }}>
        <TextInput
          underlineColorAndroid="rgba(0,0,0,0)"
          keyboardType={this.props.keyboardType}
          onChangeText={this.props.onChangeText}
          secureTextEntry={this.props.secureTextEntry}
          placeholderStyle={{fontWeight: 'bold'}}
          placeholderTextColor={colors.inputText}
          ref={input => this.props.inputRef && this.props.inputRef(input)}
          returnKeyType={this.props.returnKeyType}
          onSubmitEditing={
            this.props.onSubmitEditing && this.props.onSubmitEditing
          }
          onFocus={this.props.onFocus}
          placeholder={this.props.title}
          value={this.props.content}
          style={{
            color: colors.inputText,
            fontSize: 14,

            marginBottom: Platform.OS === 'ios' ? 3 : 0,
            paddingVertical: 0,
            marginLeft: 15,
          }}
        />
      </View>
    );
  }
}
export default CustomSignupInput;
