Merge pull request #15 from andrewtobin/cleanup

Cleaned up the demo a tiny bit and added Progress Bars.

demos/fonts/index.html

@@ -14,32 +14,22 @@ <h1 class="accent">LARGE heading text</h1>
 		<h2 class="lime">sub heading text</h2>
 		<h3>sub-sub heading text</h3>
 		<h4>is this even a heading? woaw</h4>
-
 		<div class="metro-pivot">
 			<div class="pivot-item">
-				<h3>tab1</h3>
+				<h3>fonts</h3>
 				<p>
 				Topping bear claw lemon drops. Cake powder gingerbread. Powder halvah powder danish. Cookie gingerbread muffin wypas cake marzipan dessert. Pastry jelly beans tootsie roll dessert wypas gingerbread pastry candy toffee. Sweet roll cupcake halvah. Gingerbread cotton candy tiramisu muffin carrot cake chocolate sweet roll donut. Applicake toffee halvah toffee dragée toffee candy canes sesame snaps cheesecake. Sweet powder lollipop apple pie candy halvah chupa chups croissant. Jelly beans bear claw soufflé apple pie. Gummies ice cream marzipan tootsie roll wypas carrot cake. Bonbon lemon drops candy gummi bears lemon drops lollipop. Powder caramels jelly.
 				</p>
 				<p><strong>Strong</strong></p>
 				<p><em>Emphasis</em></p>
 				<p><b>Bold</b></p>
 				<p><i>Italic</i></p>
-				<p>
-				Topping bear claw lemon drops. Cake powder gingerbread. Powder halvah powder danish. Cookie gingerbread muffin wypas cake marzipan dessert. Pastry jelly beans tootsie roll dessert wypas gingerbread pastry candy toffee. Sweet roll cupcake halvah. Gingerbread cotton candy tiramisu muffin carrot cake chocolate sweet roll donut. Applicake toffee halvah toffee dragée toffee candy canes sesame snaps cheesecake. Sweet powder lollipop apple pie candy halvah chupa chups croissant. Jelly beans bear claw soufflé apple pie. Gummies ice cream marzipan tootsie roll wypas carrot cake. Bonbon lemon drops candy gummi bears lemon drops lollipop. Powder caramels jelly.
-				</p>
-			</div>			
+				<p>If you want to use the accent colour, set <code>class="accent"</code></p>
+			</div>
 			<div class="pivot-item">
-				<h3>tab3</h3>
+				<h3>pivots</h3>
 				<p>
-				Topping bear claw lemon drops. Cake powder gingerbread. Powder halvah powder danish. Cookie gingerbread muffin wypas cake marzipan dessert. Pastry jelly beans tootsie roll dessert wypas gingerbread pastry candy toffee. Sweet roll cupcake halvah. Gingerbread cotton candy tiramisu muffin carrot cake chocolate sweet roll donut. Applicake toffee halvah toffee dragée toffee candy canes sesame snaps cheesecake. Sweet powder lollipop apple pie candy halvah chupa chups croissant. Jelly beans bear claw soufflé apple pie. Gummies ice cream marzipan tootsie roll wypas carrot cake. Bonbon lemon drops candy gummi bears lemon drops lollipop. Powder caramels jelly.
-				</p>
-			</div>
-		</div>
-
-		If you want to use the accent colour, set <code>class="accent"</code>
-
-		<pre>
+					<pre>
 var defaults = {
 		animationDuration: 350,
 		headerOpacity: 0.25,
@@ -57,7 +47,10 @@ <h3>tab3</h3>
 $(function () {
 	$("div.metro-pivot").metroPivot(defaults);
 });
-		</pre>
+					</pre>
+				</p>
+			</div>
+		</div>
 		<script>
 			var defaults = {
 				animationDuration: 350,

index.html

@@ -35,26 +35,50 @@ <h3>demos</h3>
 					<li class="accent"><a href="/demos/slides/">Adding metro to impress.js (WIP)</a></li>
 				</ul>
 			</div>
-		</div>
 
-		<div class="row">
-		  <div class="span12">
-		    Level 1 of column
-		    <div class="row">
-		      <div class="span6">Level 2</div>
-		      <div class="span6">Level 2</div>
-		    </div>
-		    <div class="row">
-		      <div class="span4">Level 3</div>
-		      <div class="span4">Level 3</div>
-		      <div class="span4">Level 3</div>
-		    </div>
-		    <div class="row">
-		      <div class="span4">Level 3</div>
-		      <div class="span8">Level 3</div>
-		    </div>
-		  </div>
-		</div>
+			<div class="pivot-item">
+				<h3>columns</h3>
+				<div class="row">
+				  <div class="span12">
+				    Level 1 of column
+				    <div class="row">
+				      <div class="span6">Level 2</div>
+				      <div class="span6">Level 2</div>
+				    </div>
+				    <div class="row">
+				      <div class="span4">Level 3</div>
+				      <div class="span4">Level 3</div>
+				      <div class="span4">Level 3</div>
+				    </div>
+				    <div class="row">
+				      <div class="span4">Level 4</div>
+				      <div class="span8">Level 4</div>
+				    </div>
+				  </div>
+				</div>
+			</div>
+
+			<div class="pivot-item">
+				<h3>controls</h3>
+				<h4>progress bars</h4>
+				<div class="row">
+					<div class="span4">
+						<div class="progress">
+					        <div class="bar" style="width: 60%;"></div>
+					    </div>
+					</div>
+				</div>
+				<h4>active progress bars</h4>
+				<div class="row">
+					<div class="span4">
+						<div class="progress progress-striped active">
+					        <div class="bar" style="width: 40%;"></div>
+					    </div>
+					</div>
+				</div>
+			</div>
+		</div>	
+
 
 		<script>
 			var defaults = {

less/bootstrap.less

@@ -0,0 +1,9 @@
+@import "bootstrap/reset.less";
+
+@import "bootstrap/variables.less";
+@import "bootstrap/mixins.less";
+@import "bootstrap/layouts.less";
+
+@import "bootstrap/progress-bars.less";
+
+@import "bootstrap/utilities.less";