From d933eb5a2f4878853c3ad70ddd136582c75da470 Mon Sep 17 00:00:00 2001
From: Katja Bregenzer <katja.bregenzer@lime.tech>
Date: Wed, 14 Nov 2018 12:02:23 +0100
Subject: [PATCH] docs(limel-dialog and limel-collapsible-section): add
 limel-slider to hidden areas in examples

#192
---
 src/examples/collapsible-section/collapsible-section.tsx | 8 +++++++-
 src/examples/dialog/dialog.tsx                           | 6 ++++++
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/src/examples/collapsible-section/collapsible-section.tsx b/src/examples/collapsible-section/collapsible-section.tsx
index e2e38802c2..bb03e9042e 100644
--- a/src/examples/collapsible-section/collapsible-section.tsx
+++ b/src/examples/collapsible-section/collapsible-section.tsx
@@ -8,6 +8,9 @@ export class CollapsibleSectionExample {
     @State()
     private secondExampleIsOpen = false;
 
+    @State()
+    private percentage = 34;
+
     public render() {
         return [
             <section>
@@ -33,7 +36,10 @@ export class CollapsibleSectionExample {
                     onClose={this.secondExampleOnClose.bind(this)}
                 >
                     <h5 slot="header">Click me or click the button</h5>
-                    <p slot="body">Either way, the section will toggle!</p>
+                    <p slot="body">
+                        Either way, the section will toggle!
+                        <limel-slider unit="%" value={this.percentage} />
+                    </p>
                 </limel-collapsible-section>
             </section>,
         ];
diff --git a/src/examples/dialog/dialog.tsx b/src/examples/dialog/dialog.tsx
index 9feb6be5bb..9a71269c63 100644
--- a/src/examples/dialog/dialog.tsx
+++ b/src/examples/dialog/dialog.tsx
@@ -21,6 +21,9 @@ export class DialogExample {
     @State()
     private age: string;
 
+    @State()
+    private percentage = 45;
+
     public render() {
         return [
             <section>
@@ -88,6 +91,9 @@ export class DialogExample {
                                 }}
                             />
                         </p>
+                        <p>
+                            <limel-slider unit="%" value={this.percentage} />
+                        </p>
                     </form>
                     <limel-button-group class="reverse-order" slot="button">
                         <limel-button