Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Uneven spacing between headings #238

Open
JLucasGaldino opened this issue Oct 31, 2024 · 0 comments
Open

Uneven spacing between headings #238

JLucasGaldino opened this issue Oct 31, 2024 · 0 comments

Comments

@JLucasGaldino
Copy link

I am building a prayer app for Orthodox Christians, and for that I must include pages with many paragraphs of text. For some reason, the spacing between headings and text varies almost arbitrarily.

imageOfApp

This is the relevant code:

const rules = {
    heading1: (node, children, parent, styles) =>
        <Text key={node.key} style={{textAlign: 'center', marginTop: 30, marginBottom: 20,}}>
            {children}
        </Text>
}

export default function ConfessionGuide() {
    const { language } = useLanguage()
    i18n.defaultLocale = "en";
    i18n.locale = language;
    return(
        <View style={styles.container}>
            <ScrollView style={styles.scrollView} horizontal={false}>
                <Markdown style={styles.markdown} rules={rules}>{i18n.t("prayerContent.eveningPrayersV2")}</Markdown>
            </ScrollView>
        </View>
    );
}

const styles = StyleSheet.create({
    markdown: {
        body: {
            color: '#fff',
            fontSize: 18,
            textAlign: 'justify',
        },
        em: {
            color: '#999',
            fontSize: 18,
            fontStyle: 'normal',
            alignSelf: 'stretch',
            textAlign: 'justify',
        },
        strong: {
            fontWeight: '800',
        },
        textgroup: {
            textAlign: 'justify',
        },
        heading1: {
            fontSize: 25,
            fontWeight: '600',
            letterSpacing: 1.5,
        },
    },
    container: {
        flex: 1,
        backgroundColor: '#25292e',
        justifyContent: 'flex-start',
        alignItems: 'stretch',
    },
    scrollView: {
        flex: 1,
        paddingHorizontal: 40,
    },
});

And this is the relevant piece of the referred json file:

# Oração IV, de São Macário Egípcio

... poder da Tua preciosa Cruz, pelo amor de todos os Teus santos, guarda a minha pobre alma, ó Jesus Cristo, nosso Deus, pois Tu és santo e cheio de glória para sempre. Ámen.

# Oração V

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Senhor, nosso Deus, Tu que és bom e filantropo, perdoa os pecados que cometi hoje em palavras, atos e pensamentos. Concede-me um sono pacífico e imperturbável. Envia-me o Teu anjo da guarda para me proteger e me guardar de todo o mal. Pois Tu és o Guardião de nossas almas e dos nossos corpos, e a Ti damos glória, ao Pai ao Filho e ao Espírito Santo, agora e sempiternamente e pelos séculos dos séculos. Ámen.

# Oração VI

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Senhor nosso Deus, em quem cremos e cujo nome invocamos acima de qualquer outro, concede-nos, ...
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant