Lists bullets and numbers are always Black

Hi there,

Firstable, thanks for this library, its being awesome to render on react-native.

Nobody tried to change the baseFontColor and render lists? on a black background I changed font style with the prop:

baseFontStyle={{ fontSize: 14, lineHeight: 14 * 1.5, color: 'white' }}

But could not see bullets or list numbers.

As a solution I have extended the props of the baseFontStyle to this tags.

You can see the fixes here:

https://github.com/kikoseijo/react-native-render-html/commits/master

basically I did something like this for the <ol>

<Text style={[baseFontStyle, { marginRight: 5, fontSize: baseFontSize }]}>{index + 1})</Text>

and the following for the <ul>

...
backgroundColor: baseFontStyle.color ? baseFontStyle.color : 'black'

Solution its not the best I guess, but…

Bug, enhancement or my bad?

[donni106]

@ziyafenn sure, here a code snippet to replace ) in ol with .:

...
html={html}
listsPrefixesRenderers={{
  ol: (_htmlAttribs, _children, _convertedCSSStyles, passProps) => (
    <Text style={style}>{passProps.index + 1}.</Text>
  )
}}
...

[nbolender]

If anyone is looking for a way to fix this, here are the default renderers. You’ll have to drop in your own font size and color.

...
listsPrefixesRenderers={{
	ul: (_htmlAttribs, _children, _convertedCSSStyles, passProps) => {
		return <View style={{
			marginRight: 10,
			width: myFontSize / 2.8,
			height: myFontSize / 2.8,
			marginTop: myFontSize / 2,
			borderRadius: myFontSize / 2.8,
			backgroundColor: myBulletColor,
		}}/>
	},
	ol: (_htmlAttribs, _children, _convertedCSSStyles, passProps) => {
		return <Text style={{ marginRight: 5, fontSize: myFontSize }}>{ passProps.index + 1 })</Text>
	},
}}
...