Update to fix edge cases
[bootswatch] / amelia / index.html
index c033076..76b29ce 100644 (file)
@@ -7,6 +7,11 @@
     <link rel="stylesheet" href="./bootstrap.css" media="screen">
     <link rel="stylesheet" href="../bower_components/font-awesome/css/font-awesome.min.css">
     <link rel="stylesheet" href="../assets/css/bootswatch.min.css">
+    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
+    <!--[if lt IE 9]>
+      <script src="../bower_components/bootstrap/assets/js/html5shiv.js"></script>
+      <script src="../bower_components/bootstrap/assets/js/respond.min.js"></script>
+    <![endif]-->
     <script type="text/javascript">
 
      var _gaq = _gaq || [];
@@ -26,7 +31,7 @@
   <body>
     <script src="../assets/js/bsa.js"></script>
 
-    <div class="navbar navbar-fixed-top">
+    <div class="navbar navbar-default navbar-fixed-top">
       <div class="container">
         <div class="navbar-header">
           <a href="../" class="navbar-brand">Bootswatch</a>
                 <li><a tabindex="-1" href="../united/">United</a></li>
               </ul>
             </li>
+            <li>
+              <a href="../help/">Help</a>
+            </li>
+            <li>
+              <a href="http://news.bootswatch.com">Blog</a>
+            </li>
             <li class="dropdown">
               <a class="dropdown-toggle" data-toggle="dropdown" href="#" id="download">Download <span class="caret"></span></a>
               <ul class="dropdown-menu" aria-labelledby="download">
                 <li><a tabindex="-1" href="./bootswatch.less">bootswatch.less</a></li>
               </ul>
             </li>
-            <li>
-              <a href="../help/">Help</a>
-            </li>
-            <li>
-              <a href="http://news.bootswatch.com">Blog</a>
-            </li>
           </ul>
 
           <ul class="nav navbar-nav navbar-right">
             <h1>Amelia</h1>
             <p class="lead">Sweet and cheery</p>
           </div>
-          <div class="col-lg-6 well" style="padding: 15px 15px 0 15px;">
-            <a href="http://carboncostume.com/apple-store-genius/" target="_blank">
-              <span style="float: left; margin: 0 15px 15px 0;">
-                <img src="../assets/img/carboncostume.png" width="175" height="135" style="border-radius: 4px;">
-              </span>
-            </a>
-            <a href="http://carboncostume.com" target="_blank">
-              <h4 style="margin-bottom: 0.4em; color: #fff;">Carbon Costume</h4>
-              <span style="display: block; margin-bottom: 1em; color: #fff;">Guides for DIY costumes using everyday gear.</span>
-            </a>
+          <div class="col-lg-6" style="padding: 15px 15px 0 15px;">
+            <div class="well">
+              <a href="http://carboncostume.com/" target="_blank">
+                <span style="float: left; margin-right: 15px;">
+                  <img src="../assets/img/carboncostume.png" width="175" height="135" style="border-radius: 4px;">
+                </span>
+              </a>
+              <a href="http://carboncostume.com/" target="_blank">
+                <h4 style="margin-bottom: 0.4em; color: #fff;">Carbon Costume</h4>
+                <div style="color: #fff;" class="clearfix">Guides for DIY costumes using everyday gear.</div>
+              </a>
+            </div>
           </div>
         </div>
       </div>
             </div>
 
             <div class="bs-example">
-              <div class="navbar">
+              <div class="navbar navbar-default">
                 <div class="container">
                   <div class="navbar-header">
                     <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-responsive-collapse">
               <div class="navbar navbar-inverse">
                 <div class="container">
                   <div class="navbar-header">
-                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-responsive-collapse">
+                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-inverse-collapse">
                       <span class="icon-bar"></span>
                       <span class="icon-bar"></span>
                       <span class="icon-bar"></span>
               <h1 id="tables">Tables</h1>
             </div>
 
-            <div class="bs-example">
-              <table class="table table-striped table-bordered table-hover">
+            <div class="bs-example table-responsive">
+              <table class="table table-striped table-bordered table-hover ">
                 <thead>
                   <tr>
                     <th>#</th>
           <div class="col-lg-12">
             <h2>Alerts</h2>
             <div class="bs-example">
-              <div class="alert alert-dismissable">
+              <div class="alert alert-dismissable alert-warning">
                 <button type="button" class="close" data-dismiss="alert">&times;</button>
                 <h4>Warning!</h4>
                 <p>Best check yo self, you're not looking too good. Nulla vitae elit libero, a pharetra augue. Praesent commodo cursus magna, <a href="#" class="alert-link">vel scelerisque nisl consectetur et</a>.</p>
         </div>
         <div class="row">
           <div class="col-lg-4">        
-            <div class="panel">
+            <div class="panel panel-default">
               <div class="panel-body">
                 Basic panel
               </div>
             </div>
-            <div class="panel">
+            <div class="panel panel-default">
               <div class="panel-heading">Panel heading</div>
               <div class="panel-body">
                 Panel content
               </div>
             </div>
-            <div class="panel">
+            <div class="panel panel-default">
               <div class="panel-body">
                 Panel content
               </div>