tweak the tests page preparation for immutable

Author: simeydotme

test/public/testing.css

@@ -37,11 +37,12 @@ hr {
 }
 
 h2,h3,h4 {
-    margin: 30px 0 10px;
+    margin-top: 2em;
+    margin-bottom: 0.5em;
 }
 
 h2 + .rangeSlider.rangeSlider, h3 + .rangeSlider.rangeSlider, h4 + .rangeSlider.rangeSlider {
-    margin-top: 10px;
+    margin-top: 1em;
 }
 
 .pipVal-prefix {

test/rollup.config.js

@@ -21,7 +21,7 @@ export default {
 			// we'll extract any component CSS out into
 			// a separate file - better for performance
 			css: css => {
-				css.write('public/build/bundle.css');
+				css.write('bundle.css');
 			}
 		}),
 

test/src/App.svelte

@@ -108,6 +108,7 @@
 
   <div class="content" style="--range-handle-focus: {color}; --range-handle: {lightColor}">
 
+    <h2>Vertical Tests</h2>
 
     <section style="display: flex; justify-content: space-evenly;">
       <RangeSlider vertical pips all="label" {reversed} {hoverable} {disabled} />
@@ -125,10 +126,29 @@
     <br>
     <h2>Spring & Colors Test</h2>
     <br>
-    springValues = stiffness: .05, damping: 0.05 
-    <RangeSlider id="test-id" springValues={{ stiffness: .05, damping: 0.05 }} bind:values {reversed} {hoverable} {disabled} />
-    <RangeSlider id="test-id" springValues={{ stiffness: .1, damping: .857 }} bind:values {reversed} {hoverable} {disabled} />
-    springValues = stiffness: .1, damping: .85 
+
+    <table> 
+      <tr>
+        <th width="50">stiffness</th>
+        <th width="50">damping</th>
+        <th>result</th>
+      </tr>
+      <tr>
+        <td><code>0.75</code></td>
+        <td><code>0.1</code></td>
+        <td><RangeSlider id="test-id3" springValues={{ stiffness: .75, damping: 1 }} bind:values {reversed} {hoverable} {disabled} /></td>
+      </tr>
+      <tr>
+        <td><code>0.1</code></td>
+        <td><code>0.85</code></td>
+        <td><RangeSlider id="test-id2" springValues={{ stiffness: .1, damping: .857 }} bind:values {reversed} {hoverable} {disabled} /></td>
+      </tr>
+      <tr>
+        <td><code>0.05</code></td>
+        <td><code>0.05</code></td>
+        <td><RangeSlider id="test-id" springValues={{ stiffness: .05, damping: 0.05 }} bind:values {reversed} {hoverable} {disabled} /></td>
+      </tr>
+    </table>
 
     <br>