Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Mysql:Trim all fields in database

Tags:

react-native

In the Card Component for react native elements

I'm trying to get rid of the border by setting the border to 0 and borderColor to transparent but there's still a gray outline

      <Card
        containerStyle={{borderWidth: 0, borderColor: 'transparent', elevation: 0}}
        title='HELLO WORLD'
        image={require('../images/pic2.jpg')}>
        <Text style={{marginBottom: 10}}>
          The idea with React Native Elements is more about component structure than actual design.
        </Text>  
      </Card>  

Thought it might have been box shadow, but that's not it either

like image 357
testinggnitset ser Avatar asked Sep 06 '25 03:09

testinggnitset ser


1 Answers

I've got the same issue, and I've found that border appears because the Card element has an elevation default setted to 1

You can override this (for android) :

<Card containerStyle={{elevation:0, backgroundColor:#123}}/>

and in IOS:

const styles = {
  container: {
    shadowColor: 'rgba(0,0,0, .2)',
    shadowOffset: { height: 0, width: 0 },
    shadowOpacity: 0, //default is 1
    shadowRadius: 0//default is 1
  }
}
<Card containerStyle={styles.container} />
like image 145
guiwme5 Avatar answered Sep 07 '25 23:09

guiwme5