pull master

Author: Charlie Kassel

README.md

@@ -224,7 +224,19 @@ var state = {
 </script>
 <datepicker :highlighted="state.highlighted"></datepicker>
 ```
-
+## Slots
+ 
+Sometimes you need to show custom content before the header for the calendar. 
+For such cases you can use the named slot 'beforeCalendarHeader.
+An example would be to use bootstrap's `input-group-prepend` and `input-group-append` 
+to show some custom text:
+``` html
+<datepicker :bootstrap-styling="true">
+  <div slot="beforeCalendarHeader" class="calender-header">
+    Choose a Date
+  </div>
+</datepicker>
+```
 
 ## Translations
 

example/Demo.vue

@@ -15,7 +15,8 @@
         :bootstrapStyling="true"
         :calendarButton="true"
         :clearButton="true"
-      ></datepicker>
+      >
+      </datepicker>
       <code>
           &lt;datepicker placeholder="Select Date"&gt;&lt;/datepicker&gt;
       </code>

src/components/Datepicker.vue

@@ -22,6 +22,7 @@
       @showCalendar="showCalendar"
     />
 
+
     <!-- Day View -->
     <picker-day
       v-if="allowedToShowView('day')"