Skip to content

Commit

Permalink
feat(build): Add minified CSS theme version to build
Browse files Browse the repository at this point in the history
BREAKING CHANGE: You should now include the `default.css` file in your
page to get the default styling.

- Added `clean-css` as minifier
- Updated build script
- Updated documentation about loading it from jsdeliver
- `npm shrinkwrap` madness
  • Loading branch information
pixelastic committed Oct 21, 2015
1 parent 9846a70 commit 77f0640
Show file tree
Hide file tree
Showing 4 changed files with 2,100 additions and 2,067 deletions.
27 changes: 24 additions & 3 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -27,8 +27,13 @@ API is unstable. We welcome any idea and pull request.
- [Templates](#templates)
- [Examples](#examples)
- [Template configuration](#template-configuration)
- [Themes](#themes)
- [Development workflow](#development-workflow)
- [Test](#test)
- [Instant search configuration](#instant-search-configuration)
- [Number locale](#number-locale)
- [Initial search parameters](#initial-search-parameters)
- [URL synchronisation](#url-synchronisation)
- [Available widgets](#available-widgets)
- [searchBox](#searchbox)
- [stats](#stats)
Expand All @@ -39,7 +44,6 @@ API is unstable. We welcome any idea and pull request.
- [refinementList](#refinementlist)
- [menu](#menu)
- [rangeSlider](#rangeslider)
- [urlSync](#urlsync)
- [hierarchicalMenu](#hierarchicalmenu)
- [Browser support](#browser-support)

Expand Down Expand Up @@ -184,6 +188,23 @@ You can configure the options passed to `Hogan.compile` by using `search.templat

Theses options will be passed to the `Hogan.compile` calls when you pass a custom template.

## Themes

To help get you started, we provide a default theme for the widgets. This is
just a `css` file that you have to add to your page to add basic styling.

It is available from [jsDelivr](http://www.jsdelivr.com/):

```html
<link rel="stylesheet" href="//cdn.jsdelivr.net/instantsearch.js/0/themes/default.min.css">
<!-- or the unminified version -->
<link rel="stylesheet" href="//cdn.jsdelivr.net/instantsearch.js/0/themes/default.css">
```

It contains (empty) selectors for all the possible markup added by the widgets,
so you can use it as a base for creating your own custom theme. We will provide
more themes in the future.

## Development workflow

```sh
Expand Down Expand Up @@ -385,7 +406,7 @@ search.addWidget(
);
```

### Styling
#### Styling

```html
<div class="ais-stats">
Expand Down Expand Up @@ -573,7 +594,7 @@ search.addWidget(
);
```

### Styling
#### Styling

```html
<div class="ais-hits">
Expand Down
Loading

0 comments on commit 77f0640

Please sign in to comment.