Can't apply fontSize to headings

Hello!

I have simple React element with the following render method:

  render () {
    const bodyStyles = { fontSize: 12 }
    const titleStyles = { fontSize: 18 }

    return (
      <ScrollView style={styles.container}>
        <KeyboardAvoidingView behavior='position'>
          {
            this.props.items.map((item, index) => {
              return <View key={index} style={styles.item}>
                <Text style={styles.itemIndex}>{index + 1}</Text>
                <Markdown styles={{text: bodyStyles, heading: titleStyles, heading1: titleStyles}}>
                  # Heading
                  Ordinary text
                </Markdown>
              </View>
            })
          }
        </KeyboardAvoidingView>
      </ScrollView>
    )
  }

In this case, Heading has incorrect fontSize (12 instead of 18). I’ve tried without text style and with heading only, but no luck.

Used packages:

"react": "16.0.0-alpha.12",
"react-native": "0.47.1",
"react-native-simple-markdown": "^1.0.60-rc.3"

@CharlesMangwa , is it related to #37 ?

[vpelkonen]

Might be related: I’ve noticed text styles seem to override other styles, like those set for link. (In my case I can’t set a custom color to link if text also has one.) Hope this helps to narrow it down. I probably don’t have the time and energy to look into it myself, though. 😕

[dbelchev]

@CharlesMangwa, as @vpelkonen mentioned, the problem here is that “text” style overwrite the other styling.