diff --git a/projects/app/src/app/app.component.css b/projects/app/src/app/app.component.css
index 552afe9..b9a1c0d 100644
--- a/projects/app/src/app/app.component.css
+++ b/projects/app/src/app/app.component.css
@@ -9,7 +9,7 @@
 .box-container {
   box-sizing: border-box;
   width: 800px;
-  height: 500px;
+  height: 600px;
   max-width: 90%;
   max-height: 90%;
   padding: 24px;
diff --git a/projects/app/src/app/app.component.html b/projects/app/src/app/app.component.html
index ac02b1f..06de449 100644
--- a/projects/app/src/app/app.component.html
+++ b/projects/app/src/app/app.component.html
@@ -12,6 +12,8 @@
       <div class="action-container" fxLayout="column" fxLayoutAlign="stretch" fxFlex="auto">
         <div class="action-button" fxLayout="column" fxLayoutAlign="center" fxFlex="auto" (click)='toggleType()'>{{(type == "component") ? "Switch to directive" : "Switch to component"}}</div>
 
+        <div class="action-button" fxLayout="column" fxLayoutAlign="center" fxFlex="auto" (click)='toggleDisabled()'>{{disabled ? "Enable slider" : "Disable slider"}}</div>
+
         <div class="action-button" fxLayout="column" fxLayoutAlign="center" fxFlex="auto" (click)='toggleDirection()'>{{(config.direction == "horizontal") ? "Change to vertical" : "Change to horizontal"}}</div>
 
         <div class="action-button" fxLayout="column" fxLayoutAlign="center" fxFlex="auto" (click)='toggleSlidesPerView()'>Toggle slides per view</div>