Benjamin-Dobell / react-native-markdown-view

MarkdownView for React Native
MIT License
190 stars 77 forks source link

Unable to override styles #58

Open colinbes opened 2 years ago

colinbes commented 2 years ago

Using: Expo@44.0.6 on a Mac and running in IOS Simulator.

I am trying to override the font style for codeBlock and inlineCode, see below, but continue to get message that courier font is not found even though I am setting font to Courier New.

If I edit style.js file and substitute "Courier New" for "Courier" for codeBlock and inlineCode then it works.

It doesn't appear that my styles overrides styles.js

Additionally I am using Expo if this makes a difference

const RecipeDetailsView = (props: RecipeTableProps) => {
  return (
    <Modal      
    transparent={false}    
    visible={props.isVisible}                         
  >
    <View style={{paddingTop: 36,
                  justifyContent: 'center',
                  alignItems: 'center', 
                  height: 90}}>
      <Button title="Close" onPress={props.onClose} />
    </View>
    <View style={{marginHorizontal: 10}}>
      <ScrollView >
        <MarkdownView styles={markdownStyle} >
          {text}
        </MarkdownView>
      </ScrollView>
    </View>
  </Modal>
  )
}

const text = `
hello \`there\`

const markdownStyle = ({
  codeBlock: {
    fontFamily: "Arial",
    fontWeight: '500',
  },
  inlineCode: {
    backgroundColor: 'rgba(128, 128, 128, 0.25)',
    fontFamily: 'Arial',
    fontWeight: '500',
  },
})