garganurag893 / react-native-phone-number-input

React Native component for phone number.
MIT License
377 stars 219 forks source link

Is there some way to customize the styles of the list of countries like changing the font of the search field or changing the font of the list items(countries) #147

Open Akshmit11 opened 1 year ago

Akshmit11 commented 1 year ago
<PhoneInput
                        defaultValue={phoneNumber}
                        defaultCode="IN"
                        layout="first"
                        withShadow

                        containerStyle={{
                            width: "100%",
                            backgroundColor: "black",
                            columnGap: 4,
                            height: 50
                        }}
                        countryPickerButtonStyle={{
                            height: "100%",
                            backgroundColor: "white",
                            borderRadius: 8,
                            alignSelf: "center",
                            shadowColor: "white",
                            shadowOffset: {
                                width: 0,
                                height: 8,
                            },
                            shadowOpacity: 0.46,
                            shadowRadius: 11.14,
                            elevation: 14,
                        }}
                        textContainerStyle={{
                            borderRadius: 8,
                            shadowColor: "white",
                            shadowOffset: {
                                width: 0,
                                height: 8,
                            },
                            shadowOpacity: 0.46,
                            shadowRadius: 11.14,
                            elevation: 14,
                        }}
                        codeTextStyle={{
                            fontFamily: "MontserratExtraBold",
                            fontSize: 16,
                        }}
                        textInputStyle={{
                            fontFamily: "MontserratMedium",
                            fontSize: 16,
                            height: "100%",

                        }}
                        textInputProps={{
                            maxLength: 10,

                        }}
                        onChangeFormattedText={(text) => setPhoneNumber(text)}
                    />

Is there some way to customize the styles of the list of countries like changing the font of the search field or changing the font of the list items(countries)