docs: widget documentation update

Author: woothu

src/views/widgets/Widget04.md

@@ -1,5 +1,5 @@
 ### Widget04
-This widget style depends on type property which defines which social widget background color and icon will be used (i.e facebook, twitter, linkedin, google-plus). Inside component there is slot for placing data chart.
+This widget style depends on type property which defines which social widget background color and icon will be used (i.e facebook, twitter, linkedin, google-plus). Inside component there is default slot for placing data chart.
 
 prop | default
 --- | ---
@@ -11,7 +11,5 @@ leftFooter   | `'leftFooter:string'`
 
 
 #### Example:
->     <widget04 type="linkedin" rightHeader="500+" rightFooter="contracts" leftHeader="292" leftFooter="feeds">
->       <line-chart1 chartId="linkedIn" :data='[15, 22, 34, 46, 58, 70, 68, 58, 52, 60, 64, 71]'
->                    label='Contracts' style='height:100px'  backgroundColor='rgba(255,255,255,.1)'/>
->     </widget04>
+>             <widget04 type="linkedin" rightHeader="500+" rightFooter="contracts"
+>                       leftHeader="292" leftFooter="feeds"/>

src/views/widgets/Widget06.md

@@ -1,6 +1,6 @@
 ### Widget06
 
-This widget can style is defined by cardClasses.
+This widget can style is defined by cardClasses. Inside component there is additional slot for chart (name="chart").
 
 prop | default
 --- | ---

src/views/widgets/Widget07.md

@@ -0,0 +1,19 @@
+### Widget07
+
+This widget can style is defined by cardClasses. Inside component there is default slot for additional data (i.e. chart).
+
+prop | default
+--- | ---
+cardClasses | `'bg-primary'`
+rightHeader | `'rightHeader:string'`
+rightFooter | `'rightFooter:string'`
+leftHeader  | `'leftHeader:string'`
+leftFooter  | `'leftFooter:string'`
+
+>       <widget07 rightHeader='SALE' rightFooter='Today 6:43 AM'
+                leftHeader='$1.890,65' leftFooter='+432,50 (15,78%)'>
+        <line-chart1 style="height:40px" chartId="widget07_line1" label='Sales'
+                    :data='[10, 22, 34, 46, 58, 70, 46, 23, 45, 78, 34, 12]' />
+        <bar-chart1 style="height:40px" chartId="widget07_bar1" label='Sales'
+                    :data='[10, 22, 34, 46, 58, 70, 46, 23, 45, 78, 34, 12]'/>
+      </widget07>

src/views/widgets/Widget08.md

@@ -0,0 +1,19 @@
+### Widget08
+
+This widget can style is defined by cardClasses. Inside component there is default slot for additional data (i.e. chart).
+
+prop | default
+--- | ---
+cardClasses | `'bg-primary'`
+rightHeader | `'rightHeader:string'`
+rightFooter | `'rightFooter:string'`
+leftHeader  | `'leftHeader:string'`
+leftFooter  | `'leftFooter:string'`
+
+>       <widget07 rightHeader='SALE' rightFooter='Today 6:43 AM'
+                leftHeader='$1.890,65' leftFooter='+432,50 (15,78%)'>
+        <line-chart1 style="height:40px" chartId="widget07_line1" label='Sales'
+                    :data='[10, 22, 34, 46, 58, 70, 46, 23, 45, 78, 34, 12]' />
+        <bar-chart1 style="height:40px" chartId="widget07_bar1" label='Sales'
+                    :data='[10, 22, 34, 46, 58, 70, 46, 23, 45, 78, 34, 12]'/>
+      </widget07>