Themes can be used to change the default styles for all the ReactiveSearch components. Currently it supports changing the colors for components.

Concepts

ReactiveBase acts as the theme provider for all the child ReactiveSearch components. It supports a theming prop which accepts an object with the following defaults:

Copy
{
    primaryColor: '#0b6aff',
    primaryTextColor: '#fff',
    textColor: '#424242'
}

Examples

You can overwrite the aforementioned default styles by providing the respective key/values as theming prop, for example:

Copy
<ReactiveBase
    app="appname"
    credentials="abcdef123:abcdef12-ab12-ab12-ab12-abcdef123456"
    theming={{        primaryColor: '#bada55'    }}>
    <Component1 .. />
    <Component2 .. />
</ReactiveBase>