rn-style

Utilities to create themes and apply them throughout your react native application.

Instructions

• npm install rn-style --save

Example

First create a stylesheet according to react-native-platform-stylesheet:

const theme = {
  container: {
    flex: 1,
    ios: {
      backgroundColor: 'salmon',
    },
    android: {
      backgroundColor: 'tomato',
    },
  },
};

Then add this theme and pass it down your app using StyleManager:

import { styles, StyleManager } from 'rn-style';
import App from './your/app/location';

styles.add(theme);

export default () => (
  <StyleManager styles={styles}>
    <App/>
  </StyleManager>
);

You can also name themes and update them by passing a name prop:

styles.add(theme, 'dark');

export default () => (
  <StyleManager styles={styles} name='dark'>
    <App/>
  </StyleManager>
);

Finally apply them to your components using the HOC applyStyle:

const MyComponent = ({ style }) => (
  <View style={style.container}>
    {/* ... Some other JSX ... */}
  </View>
);

export default applyStyle(MyComponent);

Documentation

TODO