diff --git a/.gitignore b/.gitignore
index a0dddc6..46d2d00 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,6 +1,7 @@
.DS_Store
node_modules
/dist
+/docs/.vuepress/dist
# local env files
.env.local
diff --git a/.travis.yml b/.travis.yml
index 65ecb96..0b8d46b 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -8,5 +8,6 @@ cache:
yarn: true
script:
- - yarn test:unit
- - yarn build
+ - yarn run test:unit
+ - yarn run build
+ - yarn run docs:build
diff --git a/README.md b/README.md
index a78746d..c00a18d 100644
--- a/README.md
+++ b/README.md
@@ -1,29 +1,43 @@
-# query-builder
+[](https://travis-ci.org/rtucek/vue-query-builder)
+
+
-## Project setup
-```
-yarn install
-```
+# Vue Query Builder
-### Compiles and hot-reloads for development
-```
-yarn run serve
-```
+A query-builder for Vue.
-### Compiles and minifies for production
-```
-yarn run build
-```
-### Run your tests
-```
-yarn run test
-```
+## Demos
-### Lints and fixes files
-```
-yarn run lint
+Plenty of samples and use cases are covered in the
+[documentation](https://rtucek.github.io/vue-query-builder/demos.html).
+
+
+## Features
+
+Key features:
+
+- Re-ordering of rules and groups with drag'n'drop.
+- Emphasizing groups with configurable colors.
+- Control maximum depth of nested groups.
+- Easy to customize with pure CSS and slots.
+- Layout can be serialized and restored.
+- Vuex compatible.
+- TypeScript support.
+
+
+## Installation
+
+```bash
+yarn add query-builder-vue
+npm install query-builder-vue
```
-### Customize configuration
-See [Configuration Reference](https://cli.vuejs.org/config/).
+Follow the docs for [minimum
+configuration](https://rtucek.github.io/vue-query-builder/getting-started.html#usage).
+
+
+## Contribution
+
+[Contribution guidelines](https://rtucek.github.io/vue-query-builder/contributing.html) are located
+in the documentation.
diff --git a/deploy-docs.sh b/deploy-docs.sh
new file mode 100755
index 0000000..6312a38
--- /dev/null
+++ b/deploy-docs.sh
@@ -0,0 +1,13 @@
+#!/usr/bin/env sh
+
+set -e
+
+yarn run docs:build
+
+(
+ cd docs/.vuepress/dist
+ git init
+ git add -A
+ git commit -m 'deploy docs'
+ git push -f git@github.com:rtucek/vue-query-builder.git master:gh-pages
+)
diff --git a/dev/App.vue b/dev/App.vue
index 527e072..6fe0511 100644
--- a/dev/App.vue
+++ b/dev/App.vue
@@ -158,9 +158,13 @@ export default class App extends Vue {
+```
diff --git a/docs/styling.md b/docs/styling.md
new file mode 100644
index 0000000..565cc5c
--- /dev/null
+++ b/docs/styling.md
@@ -0,0 +1,123 @@
+# Styling
+
+The Query Builder's default markup and styling has been consciously been kept simple for maximum
+customizability.
+
+Support for styling with slots is available. Below, the following slots may be used for seamless
+styling.
+
+A slot may be a simple inline template or a dedicated component. While inline templates allow for
+simplicity, dedicated components allow maintaining an internal state and you may use all of Vue's
+features, including methods, computed properties and watchers.
+
+:::tip
+By instinct, you may would like to us `v-model` on some of the slot props. However, this is not
+supported by Vue. The props contain a callback which shall be used instead for updating a value.
+
+Often, you'll have to use `v-bind:value` and `v-on:input` instead.
+:::
+
+
+## groupOperator Slot
+
+The `groupOperator` slot may be used for changing the markup of a group's operator.
+
+The slot receives an object with the shape of the [GroupOperatorSlotProps
+object](https://github.com/rtucek/vue-query-builder/blob/master/types/index.d.ts#L33).
+
+```vue
+
+
+
+
+ Custom #groupOperator slot
+
+
+
+
+
+
+
+```
+
+
+
+
+## groupControl slot
+
+The `groupControl` slot allows for creating a new group or adding a new rule.
+
+The slot receives an object with the shape of the [GroupCtrlSlotProps
+object](https://github.com/rtucek/vue-query-builder/blob/master/types/index.d.ts#L39).
+
+
+
+
+## rule slot
+
+The `rule` slot allows for customizing markup around each rule component.
+
+The slot receives an object with the shape of the [RuleSlotProps
+object](https://github.com/rtucek/vue-query-builder/blob/master/types/index.d.ts#L45).
+
+You'll have to use Vue's [Dynamic
+Component](https://vuejs.org/v2/guide/components.html#Dynamic-Components) feature for displaying the
+actual rule component.
+
+```vue{10-14}
+
+
+
+