TVke/react-native-tailwindcss

[Feature Request] Make values easily accessible

TVke opened this issue · 2 comments

TVke commented

Reminder to myself and up for discusion.

Just like colors, accessing the values directly.

This is useful when using components that use specific styling methods.
It could be useful like this:

<Component containerStyle={{
    ...shadow.md,
    ...font.custom,
    ...spacing.p4,
}} />

resulting in:

<Component containerStyle={{
     shadowColor: 'rgba(0, 0, 0, 0.1)',
     shadowOffset: {width: 0, height: 4},
     shadowOpacity: 1,
     shadowRadius: 6,
     elevation: 3,
    fontFamily: 'Custom-Font',
    padding: 16,
}} />
TVke commented

It's going to be shadow.shadowMd because otherwise the shadow['2xl'] problem would occur.

TVke commented

I made a general theme accessor so this is possible:

<Component containerStyle={{
    ...theme.shadowMd,
    ...theme.fontCustom,
    ...theme.p4,
}} />