README

react-native-easy-themes

react-native-easy-themes is a library for create styling and reuse it as much as possible in react-native.

Installation

Install the dependencies and start the server.

$ yarn add react-native-easy-themes

How to use?

First you need to build the theme in the root file.

import { buildTheme, getStyle } from 'react-native-easy-themes';
buildTheme();

Then you can use it's like this

export default class App extends Component {
    constructor(props) {
        super(props);
        this.state = {
            active: false
        }
    }

    toggle = () => {
        this.setState({
            active: !this.state.active
        })
    }

    render() {
        const { active } = this.state;
        
        return (
            <TouchableOpacity 
                style={[
                    getStyle('circle-120 bg-red'), 
                    active && getStyle('bg-lightGreen')
                ]} 
                onPress={this.toggle} 
            />
        );
    }
}

Customize

For customization, run:

    $ node node_modules/react-native-easy-themes/eject.js

And you will see themes folder appear in the root of your project, insize it's will have the build and getStyle function, and themes variables.

    const yourCustomOptions = {
        color: {
            lightGreen: '#37C892',
            red: '#f44336',
            grey: '#666666'
        },
        other: {
            roboto: {
                fontFamili: 'Roboto'
            }
        },
        ...etc
    }
    buildTheme(yourCustomOptions);

Todos

Write MORE Tests

License

MIT

Usage no npm install needed!