center example sites in docs on mobile

2 files changed, 30 insertions, 1 deletions

diff --git a/docs/assets/css/docs.css b/docs/assets/css/docs.css
index 73e619d29..9324f9990 100644
--- a/docs/assets/css/docs.css
+++ b/docs/assets/css/docs.css
@@ -323,6 +323,11 @@ h2 + table {
 -------------------------------------------------- */
 @media (max-width: 480px) {
 
+  /* Reduce padding above jumbotron */
+  body {
+    padding-top: 70px;
+  }
+
   /* Change up some type stuff */
   h1 small {
     display: block;
@@ -362,6 +367,21 @@ h2 + table {
   .quick-links {
     margin: 40px 0 0;
   }
+  /* hide the bullets on mobile since our horizontal space is limited */
+  .quick-links .divider {
+    display: none;
+  }
+
+  /* center example sites */
+  .example-sites {
+    margin-left: 0;
+  }
+  .example-sites a {
+    float: none;
+    display: block;
+    max-width: 300px;
+    margin: 0 auto 18px;
+  }
 
 }
 
diff --git a/docs/index.html b/docs/index.html
index 0a63c1910..55a75b1bf 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -54,7 +54,7 @@
         <header class="jumbotron masthead">
           <div class="inner">
             <h1>Bootstrap,<br> from Twitter</h1>
-            <p class="lead">Bootstrap is a responsive frontend toolkit from Twitter designed to kickstart web development, complete with core HTML, CSS, and JS for grids, type, forms, navigation, and many more components.</p>
+            <p class="lead">Bootstrap is a responsive frontend toolkit from Twitter designed to kickstart web development, featuring HTML, CSS, and JS for dozens of base elements and common design components.</p>
             <p class="download-info">
               <a href="https://github.com/twitter/bootstrap/" class="btn primary btn-large">Download on GitHub</a>
               <a href="./scaffolding.html" class="btn btn-large">Get started &rarr;</a>
@@ -236,6 +236,15 @@
     <script src="http://code.jquery.com/jquery-1.6.2.min.js"></script>
 
     <script type="text/javascript">
+      // When ready...
+      window.addEventListener("load",function() {
+        // Set a timeout...
+        setTimeout(function(){
+          // Hide the address bar!
+          window.scrollTo(0, 1);
+        }, 0);
+      });
+
       // NOT FINAL BY ANY MEANS, JUST MAH JANK CODE BRO
       $(document).ready(function() {
         $('.nav .active').click(function(e) {