tweaks to the responsive layout to improve type

bootstrap.css

@@ -6,11 +6,7 @@
  * http://www.apache.org/licenses/LICENSE-2.0
  *
  * Designed and built with all the love in the world @twitter by @mdo and @fat.
-<<<<<<< HEAD
- * Date: Sat Oct 22 15:49:12 PDT 2011
-=======
- * Date: Fri Oct 21 11:54:44 CDT 2011
->>>>>>> 2e09ffe3832106fab60dc01cc3159c13029bdf68
+ * Date: Sat Oct 22 22:49:01 PDT 2011
  */
 /* Reset.less
  * Props to Eric Meyer (meyerweb.com) for his CSS reset file. We're using an adapted version here that cuts out some of the reset HTML elements we will never need here (i.e., dfn, samp, etc).
@@ -520,7 +516,7 @@ pre {
   background-color: #f5f5f5;
   display: block;
   padding: 8.5px;
-  margin: 0 0 18px;
+  margin: 0 0 9px;
   line-height: 18px;
   font-size: 12px;
   border: 1px solid #ccc;
@@ -530,7 +526,7 @@ pre {
   border-radius: 3px;
   white-space: pre;
   white-space: pre-wrap;
-  word-wrap: break-word;
+  word-break: break-all;
 }
 /* Forms.less
  * Base styles for various input types, form layouts, and states
@@ -2270,7 +2266,7 @@ button.btn::-moz-focus-inner, input[type=submit].btn::-moz-focus-inner {
 @media (max-width: 480px) {
   .container {
     width: auto;
-    padding: 0 10px;
+    padding: 0 15px;
   }
   .row {
     margin-left: 0;

bootstrap.min.css

@@ -89,7 +89,7 @@ blockquote small{display:block;font-size:12px;font-weight:300;line-height:18px;c
 address{display:block;line-height:18px;margin-bottom:18px;}
 code,pre{padding:0 3px 2px;font-family:Menlo, Monaco, Andale Mono, Courier New, monospace;font-size:12px;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}
 code{background-color:#fee9cc;color:rgba(0, 0, 0, 0.75);padding:1px 3px;}
-pre{background-color:#f5f5f5;display:block;padding:8.5px;margin:0 0 18px;line-height:18px;font-size:12px;border:1px solid #ccc;border:1px solid rgba(0, 0, 0, 0.15);-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;white-space:pre;white-space:pre-wrap;word-wrap:break-word;}
+pre{background-color:#f5f5f5;display:block;padding:8.5px;margin:0 0 9px;line-height:18px;font-size:12px;border:1px solid #ccc;border:1px solid rgba(0, 0, 0, 0.15);-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;white-space:pre;white-space:pre-wrap;word-break:break-all;}
 form{margin-bottom:18px;}
 legend{display:block;width:100%;margin-bottom:27px;font-size:19.5px;line-height:36px;color:#404040;border-bottom:1px solid #eee;}
 label,input,select,textarea{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:13px;font-weight:normal;line-height:18px;}
@@ -321,4 +321,4 @@ button.btn::-moz-focus-inner,input[type=submit].btn::-moz-focus-inner{padding:0;
 .media-grid li{display:inline;}
 .media-grid a{float:left;padding:4px;margin:0 0 20px 20px;border:1px solid #ddd;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-webkit-box-shadow:0 1px 1px rgba(0, 0, 0, 0.075);-moz-box-shadow:0 1px 1px rgba(0, 0, 0, 0.075);box-shadow:0 1px 1px rgba(0, 0, 0, 0.075);}.media-grid a img{display:block;}
 .media-grid a:hover{border-color:#0069d6;-webkit-box-shadow:0 1px 4px rgba(0, 105, 214, 0.25);-moz-box-shadow:0 1px 4px rgba(0, 105, 214, 0.25);box-shadow:0 1px 4px rgba(0, 105, 214, 0.25);}
-@media (max-width: 480px){.container{width:auto;padding:0 10px;} .row{margin-left:0;} [class*="span"]{float:none;display:block;width:auto;margin:0;} .modal{width:auto;margin:0;} .form-horizontal .control-group>label{float:none;width:auto;padding-top:0;text-align:left;} .form-horizontal .controls{margin-left:0;} .form-horizontal .control-list{padding-top:0;} .form-horizontal .form-actions{padding-left:0;}}@media (min-width: 480px) and (max-width: 768px){.container{width:auto;padding:0 10px;} .row{margin-left:0;} [class*="span"]{float:none;display:block;width:auto;margin:0;}}@media (min-width: 768px) and (max-width: 940px){.container{width:748px;} .span1{width:44px;} .span2{width:108px;} .span3{width:172px;} .span4{width:236px;} .span5{width:300px;} .span6{width:364px;} .span7{width:428px;} .span8{width:492px;} .span9{width:556px;} .span10{width:620px;} .span11{width:684px;} .span12{width:748px;} .offset1{margin-left:64px;} .offset2{margin-left:128px;} .offset3{margin-left:192px;} .offset4{margin-left:256px;} .offset5{margin-left:320px;} .offset6{margin-left:384px;} .offset7{margin-left:448px;} .offset8{margin-left:512px;} .offset9{margin-left:576px;} .offset10{margin-left:640px;} .offset11{margin-left:704px;} .offset12{margin-left:768px;}}
+@media (max-width: 480px){.container{width:auto;padding:0 15px;} .row{margin-left:0;} [class*="span"]{float:none;display:block;width:auto;margin:0;} .modal{width:auto;margin:0;} .form-horizontal .control-group>label{float:none;width:auto;padding-top:0;text-align:left;} .form-horizontal .controls{margin-left:0;} .form-horizontal .control-list{padding-top:0;} .form-horizontal .form-actions{padding-left:0;}}@media (min-width: 480px) and (max-width: 768px){.container{width:auto;padding:0 10px;} .row{margin-left:0;} [class*="span"]{float:none;display:block;width:auto;margin:0;}}@media (min-width: 768px) and (max-width: 940px){.container{width:748px;} .span1{width:44px;} .span2{width:108px;} .span3{width:172px;} .span4{width:236px;} .span5{width:300px;} .span6{width:364px;} .span7{width:428px;} .span8{width:492px;} .span9{width:556px;} .span10{width:620px;} .span11{width:684px;} .span12{width:748px;} .offset1{margin-left:64px;} .offset2{margin-left:128px;} .offset3{margin-left:192px;} .offset4{margin-left:256px;} .offset5{margin-left:320px;} .offset6{margin-left:384px;} .offset7{margin-left:448px;} .offset8{margin-left:512px;} .offset9{margin-left:576px;} .offset10{margin-left:640px;} .offset11{margin-left:704px;} .offset12{margin-left:768px;}}

docs/assets/css/docs.css

@@ -21,6 +21,8 @@ section {
 /* Tweak topbar brand link to be super sleek
 -------------------------------------------------- */
 body > .navbar-fixed .brand {
+  padding-right: 0;
+  padding-left: 0;
   float: right;
   font-weight: bold;
   color: #000;
@@ -316,16 +318,24 @@ h2 + table {
 -------------------------------------------------- */
 @media (max-width: 480px) {
 
+  /* Hide the nav for now */
   body > .navbar-fixed .nav {
     display: none;
   }
 
-  .large-bird {
-    display: none;
+  /* Change up some type stuff */
+  h1 small {
+    display: block;
+    line-height: 20px;
   }
 
+  /* Adjust the jumbotron */
+  .jumbotron h1,
+  .jumbotron p {
+    margin-right: 0;
+  }
   .jumbotron h1 {
-    font-size: 36px;
+    font-size: 45px;
     margin-right: 0;
   }
   .jumbotron p {
@@ -338,6 +348,20 @@ h2 + table {
     width: auto;
     margin: 36px 0;
   }
+  .jumbotron .btn {
+    font-size: 18px;
+    padding: 10px 14px;
+  }
+
+  /* Popovers */
+  .large-bird {
+    display: none;
+  }
+  .popover-well .popover-wrapper {
+    margin-left: 0;
+  }
+
+
 }
 
 @media (min-width: 768px) and (max-width: 940px) {

docs/index.html

@@ -630,7 +630,7 @@
       <p>To include a blockquote, wrap <code>&lt;blockquote&gt;</code> around <code>&lt;p&gt;</code> and <code>&lt;small&gt;</code> tags. Use the <code>&lt;small&gt;</code> element to cite your source and you'll get an em dash <code>&amp;mdash;</code> before it.</p>
       <blockquote>
         <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante venenatis dapibus posuere velit aliquet.</p>
-        <small>Dr. Julius Hibbert</small>
+        <small>Someone famous</small>
       </blockquote>
     </div>
     <div class="span7">
@@ -2140,7 +2140,7 @@ Lorem ipsum dolar sit amet illo error <a href="#" title="below">ipsum</a> verita
           <td>Javascript</td>
           <td>
             <p><a href="http://lesscss.org/">Download the latest Less.js</a> and include the path to it (and Bootstrap) in the <code>head</code>.</p>
-<pre class="prettyprint linenums">
+<pre class="prettyprint">
 &lt;link rel="stylesheet/less" href="/path/to/bootstrap.less"&gt;
 &lt;script src="/path/to/less.js"&gt;&lt;/script&gt;
 </pre>
@@ -2156,7 +2156,7 @@ Lorem ipsum dolar sit amet illo error <a href="#" title="below">ipsum</a> verita
           </td>
         </tr>
         <tr>
-          <td>Less Mac app</td>
+          <td>Mac app</td>
           <td>
             <p><a href="http://incident57.com/less/">The unofficial Mac app</a> watches directories of .less files and compiles the code to local files after every save of a watched .less file.</p>
             <p>If you like, you can toggle preferences in the app for automatic minifying and which directory the compiled files end up in.</p>

lib/responsive.less

@@ -10,7 +10,7 @@
   // Remove width from containers
   .container {
     width: auto;
-    padding: 0 10px;
+    padding: 0 15px;
   }
   // Undo negative margin on rows
   .row {

lib/type.less

@@ -24,7 +24,7 @@ p {
 h1, h2, h3, h4, h5, h6 {
   font-weight: bold;
   color: @grayDark;
-  text-rendering: optimizelegibility;
+  text-rendering: optimizelegibility; // Fix the character spacing for headings
   small {
     color: @grayLight;
   }
@@ -185,7 +185,7 @@ pre {
   background-color: #f5f5f5;
   display: block;
   padding: (@baseLineHeight - 1) / 2;
-  margin: 0 0 @baseLineHeight;
+  margin: 0 0 @baseLineHeight / 2;
   line-height: @baseLineHeight;
   font-size: 12px;
   border: 1px solid #ccc;
@@ -193,6 +193,5 @@ pre {
   .border-radius(3px);
   white-space: pre;
   white-space: pre-wrap;
-  word-wrap: break-word;
-
+  word-break: break-all;
 }
\ No newline at end of file