Merge remote-tracking branch 'origin/master'

README.md

@@ -1,16 +1,12 @@
 # WIP vue-tab-wizard
 A dynamic tab wizard to split your forms easier
 
-Forms are hard to handle especially if you have a lot of fields. A page often looks very ugly when it has a ton of form fields.
+Vue-tab-wizard is a vue based component which simplifies tab wizard management and allows you to focus on the functional part of your app rather than
-There are many tab wizards out there in the wild, but most of them are jQuery based and once you have a lot of tabs, they are hard to manage/modify 
-or customize in an easy declarative way.
-Vue-tab-wizard is a simple component which simplifies your tab wizard and lets you focus on the functional part of your app rather than
 wasting time on details. Just forget about id's, external scripts and jQuery dependencies
 
 # Demo
-Refer to this [fiddle](https://jsfiddle.net/CristiJ/bt5dhqtf/8/)
+Refer to this [fiddle](https://jsfiddle.net/CristiJ/bt5dhqtf/40/)
-
+Vue-tab-wizard is **bootstrap dependent** for now and won't work without the css from bootstrap (working on making it bootstrap free). Also vue-tab-wizard works with themify-icons only (WIP)
-Note: For now vue-tab-wizard requires bootstrap to look as it should. Also vue-tab-wizard works with themify-icons (WIP)
 
 # Usage
 ```html
@@ -26,3 +22,84 @@ Note: For now vue-tab-wizard requires bootstrap to look as it should. Also vue-t
    </tab-content>
 </tab-wizard>
 ```
+
+# Props
+## Tab Wizard props
+```js
+props: {
+  title: {
+    type: String,
+    default: 'Awesome Wizard'
+  },
+  subtitle: {
+    type: String,
+    default: 'Split a complicated flow in multiple steps'
+  },
+  nextButtonText: {
+    type: String,
+    default: 'Next'
+  },
+  backButtonText: {
+    type: String,
+    default: 'Back'
+  },
+  finishButtonText: {
+    type: String,
+    default: 'Finish'
+  },
+  /***
+  * Applies to text, border and circle
+  */
+  color: {
+    type: String,
+    default: '#e74c3c' //circle, border and text color
+  },
+  /**
+  * name of the transition when transition between steps
+  */
+  transition: {
+    type: String,
+    default: '' //name of the transition when transition between steps 
+  },
+  /***
+  * Index of the initial tab to display
+  */
+  startIndex: {
+    type: Number,
+    default: 0
+  }
+}
+```
+
+## Tab content props
+```js
+props: {
+  title: {
+    type: String,
+    default: ''
+  },
+  /***
+   * Icon name for the upper circle corresponding to the tab
+   * Supports themify icons only for now.
+   */
+  icon: {
+    type: String,
+    default: ''
+  },
+  /***
+   * Function to execute before tab switch. Return value must be boolean
+   * If the return result is false, tab switch is restricted
+   */
+  beforeChange: {
+    type: Function
+  }
+}
+```
+
+# Slots
+* **Default** - Used for tab-contents
+* **title** - Upper title section including sub-title
+* **prev** - Previous button content (no need to worry about handling the button functionality)
+* **next** - Next button content
+* **finish** - Finish button content
+