Update index.html

oleersoy · web-flow · commit 5ca69075f8d7 · 2017-02-11T13:06:10.000-06:00
diff --git a/src/test/html/index.html b/src/test/html/index.html
@@ -1,38 +1,25 @@
 <html>
-
 <head>
   <meta charset="utf-8">
   <title>Supefly CSS Grid Component Test</title>
   <meta name="viewport" content="initial-scale=1,width=device-width">
   <link rel="stylesheet" href="../css/index.css">
 </head>
-
 <body>
   <div class="Test">
-
-   {% for item in ['100', '300'] %}
-      <div class="u-color-background-gray-{{item}}">
-        <code>u-color-background-gray-{{item}}</code>
-      </div>
-   {% endfor %}
-
-    <h1 class="Test-suite">Superfly CSS <a href="https://github.com/superfly-css/superfly-css-components-grid">Grid Component</a> Tests</h1>
-    <h2 class="Test-context">.Grid, Grid-cell</h2>
-    <h3 class="Test-when">When the
-      <code>.Grid</code> container holds 2
-      <code>.Grid-cell</code> instances:</h3>
+    <h3 class="Test-when">When the <code>.Grid</code> container holds 2 <code>.Grid-cell</code> instances:</h3>
     <!--Markup contained by the code block is escaped and highlighted by gulp-highlight-->
     <pre class="Test-markup">
       <code class="html">
         <div class="Grid">
-          <div class="Grid-cell">1/2</div>
-          <div class="Grid-cell">2/2</div>
-        </div>
+            <!-- Use Nunjucks to keep markup DRY -->
+            {% for cell in ['1', '2'] %}
+                <div class="Grid-cell">{{cell}}/2</div>
+            {% endfor %}
+         </div>
       </code>
     </pre>
-
     <h3 id="then" class="Test-then">Each grid cell occupies the same amount of space witin the grid container row.</h3>
   </div>
 </body>
-
 </html>
