verdnatura-mirror/Rocket.Chat.ReactNative
verdnatura-mirror
/
Rocket.Chat.ReactNative
mirror of https://github.com/RocketChat/Rocket.Chat.ReactNative
2
0
Fork 1
Code Issues Packages Projects Releases Wiki Activity

fix: Ordinals of ordered lists misaligned (#4994) 

* fix: ordered list misaligned

* fix the misaligned at android and format the ordered list to keep the same width
This commit is contained in:
Reinaldo Neto 2023-04-28 13:25:55 -03:00 committed by GitHub
parent 43917bd789
commit 7b02205d2f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 12 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
__tests__/containers/markdown/__snapshots__/Markdown.stories.storyshot
View File

File diff suppressed because one or more lines are too long

2
__tests__/containers/markdown/new/__snapshots__/NewMarkdown.stories.storyshot
View File

File diff suppressed because one or more lines are too long

2
__tests__/containers/message/__snapshots__/Message.stories.storyshot
View File

File diff suppressed because one or more lines are too long

3
app/containers/markdown/ListItem.tsx
View File

@ -3,6 +3,7 @@ import { StyleSheet, Text, View } from 'react-native';
import { TSupportedThemes } from '../../theme'; import { TSupportedThemes } from '../../theme';
import { themes } from '../../lib/constants'; import { themes } from '../../lib/constants';
import styles from './styles';
const style = StyleSheet.create({ const style = StyleSheet.create({
container: { container: {
@ -43,7 +44,7 @@ const ListItem = React.memo(({ children, level, bulletWidth, continue: _continue
return ( return (
<View style={style.container}> <View style={style.container}>
<View style={[{ width: bulletWidth }, style.bullet]}> <View style={[{ width: bulletWidth }, style.bullet]}>
<Text style={{ color: themes[theme].bodyText }}>{bullet}</Text> <Text style={[styles.text, styles.listPrefix, { color: themes[theme].bodyText }]}>{bullet}</Text>
</View> </View>
<View style={style.contents}>{children}</View> <View style={style.contents}>{children}</View>
</View> </View>

4
app/containers/markdown/new/OrderedList.tsx
View File

@ -16,8 +16,8 @@ const OrderedList = ({ value }: IOrderedListProps): React.ReactElement => {
<View> <View>
{value.map(item => ( {value.map(item => (
<View style={styles.row} key={item.number?.toString()}> <View style={styles.row} key={item.number?.toString()}>
<Text style={[styles.text, { color: colors.bodyText }]}>{item.number}. </Text> <Text style={[styles.text, styles.listPrefix, { color: colors.bodyText }]}>{item.number}. </Text>
<Text style={[styles.inline, { color: colors.bodyText }]}> <Text style={[styles.text, styles.inline, { color: colors.bodyText }]}>
<Inline value={item.value} /> <Inline value={item.value} />
</Text> </Text>
</View> </View>

4
app/containers/markdown/new/UnorderedList.tsx
View File

@ -17,8 +17,8 @@ const UnorderedList = ({ value }: IUnorderedListProps) => {
<View> <View>
{value.map(item => ( {value.map(item => (
<View style={styles.row}> <View style={styles.row}>
<Text style={[styles.text, { color: themes[theme].bodyText }]}>- </Text> <Text style={[styles.text, styles.listPrefix, { color: themes[theme].bodyText }]}>- </Text>
<Text style={[styles.inline, { color: themes[theme].bodyText }]}> <Text style={[styles.text, styles.inline, { color: themes[theme].bodyText }]}>
<Inline value={item.value} /> <Inline value={item.value} />
</Text> </Text>
</View> </View>

3
app/containers/markdown/styles.ts
View File

@ -162,5 +162,8 @@ export default StyleSheet.create({
}, },
inline: { inline: {
flexShrink: 1 flexShrink: 1
},
listPrefix: {
fontVariant: ['tabular-nums']
} }
}); });