Skip to content

Adjusting the styling

Sarah Dayan edited this page Jul 28, 2020 · 4 revisions

Unified InstantSearch E-Commerce comes with a default theme that you can customize to your branding and the style of your website.

Styling options

The configuration file file lets you adjust the styling. See Styles.

Styling the search button

Unified InstantSearch E-Commerce generates the search button for you in the inputContainer that you specify. It comes with default styles, which you may want to customize, or remove entirely.

To do so, you can edit the CSS in the src/components/SearchButton.scss file. To delete the default styling, you can delete the file.

Style conflicts

Unified InstantSearch E-Commerce is designed not to conflict with your website's style, by scoping our own CSS rules. However, if you have CSS that applies too globally, they might interfere with ours.

If this happens, we recommend to either scope your own CSS (e.g., styling .myApp h1 instead of h1), or leveraging the all CSS shorthand property.