JavaScriptCollection
diff --git a/‎demo/custom-app.html‎
Lines changed: 11 additions & 8 deletions b/‎demo/custom-app.html‎
Lines changed: 11 additions & 8 deletions
diff --git a/‎dist/css/demo.css‎
Lines changed: 6 additions & 0 deletions b/‎dist/css/demo.css‎
Lines changed: 6 additions & 0 deletions
diff --git a/‎index.html‎
Lines changed: 1 addition & 1 deletion b/‎index.html‎
Lines changed: 1 addition & 1 deletion
diff --git a/‎less/demo.less‎
Lines changed: 6 additions & 1 deletion b/‎less/demo.less‎
Lines changed: 6 additions & 1 deletion
@@ -45,11 +45,12 @@
 <div class="evo-content"> 
 
     <h4 class="mt20">See how the different views adapt to changes to the ui-model.</h4>
- 
-<div>
-<p>
-Make changes to the UI-model below, choose the view to display and click the "Refresh" button.
-</p>
+     
+    <p>
+    Make changes to the UI-model below, choose the view to display and click the "Refresh" button.
+    </p>
+
+<div class="demo-controls">
     <div class="pull-left" style="width:62%;">
         <label>UI-model</label>
         <textarea id="uimodel2" rows="12" class="evol-json evo-field form-control"></textarea>
@@ -78,13 +79,15 @@ <h4 class="mt20">See how the different views adapt to changes to the ui-model.</
             <button class="btn btn-warning pull-left" id="btnRefresh">Refresh</button>
         </div>
 
-        <p class="clearfix"></p>
+        <div class="clearfix"></div>
 
         <div id="viewInfo"></div>
 
-        <p class="clearfix"></p>
-     
+         
+    </div>
+    <div class="clearfix"></div>
 </div>
+
         <p class="clearfix"></p>
 <div id="evol1"></div>
 
 
@@ -372,6 +372,12 @@ a {
     display: none;
   }
 }
+.demo-controls {
+  padding: 10px;
+  border: 2px solid #FFECB3;
+  border-radius: 4px;
+  background-color: #FFF8E1;
+}
 #viewInfo {
   margin: 10px 0;
   min-height: 50px;
 
@@ -56,7 +56,7 @@ <h1 style="color:#BBDEFB;">Views which change form, volume and structure to adap
     <p>&nbsp;</p>
     <h3 class="mt20">Sample views</h3>
 
-    <div id="evol-views-params" >
+    <div id="evol-views-params" class="demo-controls">
 
         <div><span class="hideIfSmall">See the </span>
             <select id="evolView" class="form-control" style="width:auto">
 
@@ -41,7 +41,12 @@ a{
     display: none;
   }
 }
-
+.demo-controls{
+  padding: 10px;
+  border: 2px solid #FFECB3;
+  border-radius: 4px;
+  background-color: #FFF8E1;
+}
 #viewInfo{
   margin: 10px 0;
   min-height:50px;
Original file line number	Diff line number	Diff line change
`@@ -372,6 +372,12 @@ a {`
`372`	`372`	`display: none;`
`373`	`373`	`}`
`374`	`374`	`}`
	`375`	`+.demo-controls {`
	`376`	`+ padding: 10px;`
	`377`	`+ border: 2px solid #FFECB3;`
	`378`	`+ border-radius: 4px;`
	`379`	`+ background-color: #FFF8E1;`
	`380`	`+}`
`375`	`381`	`#viewInfo {`
`376`	`382`	`margin: 10px 0;`
`377`	`383`	`min-height: 50px;`
Original file line number	Diff line number	Diff line change
`@@ -41,7 +41,12 @@ a{`
`41`	`41`	`display: none;`
`42`	`42`	`}`
`43`	`43`	`}`
`44`		`-`
	`44`	`+.demo-controls{`
	`45`	`+ padding: 10px;`
	`46`	`+ border: 2px solid #FFECB3;`
	`47`	`+ border-radius: 4px;`
	`48`	`+ background-color: #FFF8E1;`
	`49`	`+}`
`45`	`50`	`#viewInfo{`
`46`	`51`	`margin: 10px 0;`
`47`	`52`	`min-height:50px;`