Can't apply fontSize to headings

[xvonabur]

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 ?

[xvonabur]

@CharlesMangwa, are there any news about this issue?

[CharlesMangwa]

Hey @xvonabur! Sorry I didn't have too much time to work on this. Did you fix it? If so, could you send a PR please? Otherwise, I'll try to fix it for v1.2.

[xvonabur]

@CharlesMangwa , no. Unfortunately, I don't have enough time for this.

[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. :/

[serranoarevalo]

If anybody is having trouble styling the headings just set the text properties to null. For some reason this didn't change the color:

heading1: { fontSize: 36, color: "white" }

until I did this:

text: { color: null }, heading1: { fontSize: 36, color: "white" },

[dbelchev]

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