[question] How to define tailwind style outside a component?

[radiorz]

the useTailwind must be in a component, but how could i define some styles outside the component function?

[frannale]

I dont know what you want to do, but maybe you can pass the variable with the asignated useTailwind() as a parameter

[radiorz]

Here is an example:

import React from 'react';
import {useTailwind} from 'tailwind-rn';
import {StyleSheet, TouchableOpacity, Text, Dimensions} from 'react-native';
export default function Card({title = '', cover = '?', isShow = false}) {
  const tailwind = useTailwind();
  return (
    <TouchableOpacity style={styles.button}>
      <Text style={[styles.buttonText, tailwind('text-2xl')]}>
        {isShow ? title : cover}
      </Text>
    </TouchableOpacity>
  );
}
const styles = StyleSheet.create({
  button: {
    backgroundColor: '#ccc',
    borderRadius: 8,
    width: 80,
    height: 80,
    justifyContent: 'center',
    alignItems: 'center',
    margin: (Dimensions.get('window').width - 100 * 4) / (4 * 2),
  },
  buttonText: {},
});

How could I write tailwind in stylesheet.create but not in component?

such as on web, we can use @apply to write tailwind in css styles

[alexisthual]

Did you find a solution to this? :)