move from downloads.html to customize.html to better match purpose of page,...

move from downloads.html to customize.html to better match purpose of page, fix up customize page layout to match other docs, link style refinement to jumbotrons

docs/assets/css/docs.css

@@ -118,19 +118,41 @@ hr.soften {
   line-height: 30px;
   margin-bottom: 30px;
 }
-.jumbotron .btn-large {
-  font-size: 18px;
-  font-weight: normal;
-  padding: 13px 24px;
-  margin-right: 10px;
+
+/* Link styles (used on .masthead-links as well) */
+.jumbotron a {
+  color: #fff;
+  color: rgba(255,255,255,.5);
+  -webkit-transition: all .2s ease-in-out;
+     -moz-transition: all .2s ease-in-out;
+          transition: all .2s ease-in-out;
+}
+.jumbotron a:hover {
+  color: #fff;
+  text-shadow: 0 0 10px rgba(255,255,255,.25);
+}
+
+/* Download button */
+.masthead .btn {
+  padding: 14px 24px;
+  font-size: 24px;
+  font-weight: 200;
+  color: #fff; /* redeclare to override the `.jumbotron a` */
+  border: 0;
   -webkit-border-radius: 6px;
      -moz-border-radius: 6px;
           border-radius: 6px;
+  -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 5px rgba(0,0,0,.25);
+     -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 5px rgba(0,0,0,.25);
+          box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 5px rgba(0,0,0,.25);
 }
-.jumbotron .btn-large small {
-  font-size: 14px;
+.masthead .btn:active {
+  -webkit-box-shadow: inset 0 2px 4px rgba(0,0,0,.1), 0 1px 0 rgba(255,255,255,.1);
+     -moz-box-shadow: inset 0 2px 4px rgba(0,0,0,.1), 0 1px 0 rgba(255,255,255,.1);
+          box-shadow: inset 0 2px 4px rgba(0,0,0,.1), 0 1px 0 rgba(255,255,255,.1);
 }
 
+
 /* Pattern overlay
 ------------------------- */
 .jumbotron .container {
@@ -167,22 +189,6 @@ hr.soften {
   line-height: 1.25;
 }
 
-/* Drop borders on buttons, improve shadows */
-.masthead .btn {
-  font-size: 24px;
-  padding: 14px 24px;
-  font-weight: 200;
-  border: 0;
-  -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 5px rgba(0,0,0,.25);
-     -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 5px rgba(0,0,0,.25);
-          box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 5px rgba(0,0,0,.25);
-}
-.masthead .btn:active {
-  -webkit-box-shadow: inset 0 2px 4px rgba(0,0,0,.1), 0 1px 0 rgba(255,255,255,.1);
-     -moz-box-shadow: inset 0 2px 4px rgba(0,0,0,.1), 0 1px 0 rgba(255,255,255,.1);
-          box-shadow: inset 0 2px 4px rgba(0,0,0,.1), 0 1px 0 rgba(255,255,255,.1);
-}
-
 /* Textual links in masthead */
 .masthead-links {
   margin: 0;
@@ -193,17 +199,6 @@ hr.soften {
   padding: 0 10px;
   color: rgba(255,255,255,.25);
 }
-.masthead-links a {
-  color: #fff;
-  color: rgba(255,255,255,.5);
-  -webkit-transition: all .2s ease-in-out;
-     -moz-transition: all .2s ease-in-out;
-          transition: all .2s ease-in-out;
-}
-.masthead-links a:hover {
-  color: #fff;
-  text-shadow: 0 0 10px rgba(255,255,255,.25);
-}
 
 /* Social proof buttons from GitHub & Twitter */
 .bs-docs-social {

docs/base-css.html

@@ -61,7 +61,7 @@
                 <a href="./javascript.html">Javascript</a>
               </li>
               <li class="">
-                <a href="./extend.html">Extend</a>
+                <a href="./customize.html">Customize</a>
               </li>
             </ul>
           </div>

docs/components.html

@@ -61,7 +61,7 @@
                 <a href="./javascript.html">Javascript</a>
               </li>
               <li class="">
-                <a href="./extend.html">Extend</a>
+                <a href="./customize.html">Customize</a>
               </li>
             </ul>
           </div>
@@ -113,7 +113,7 @@
         </div>
 
         <h2>Example</h2>
-        <p>An isolated (without dropdown toggle) dropdown menu example, designed to be used with the <a href="./javascript.html#dropdowns">dropdown javascript plugin</a>.</p>
+        <p>Toggleable, contextual menu for displaying lists of links. Made interactive with the <a href="./javascript.html#dropdowns">dropdown javascript plugin</a>.</p>
         <div class="bs-docs-example">
           <div class="dropdown clearfix">
             <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu" style="display: block; position: static; margin-bottom: 5px;">
@@ -140,26 +140,20 @@
 
 
         <h2>Markup</h2>
-        <p>Dropdowns require...</p>
+        <p>Looking at just the dropdown menu, here's the required HTML. You need to wrap the dropdown's trigger and the dropdown menu within <code>.dropdown</code>, or another element that declares <code>position: relative;</code>. Then just create the menu.</p>
 
 <pre class="prettyprint linenums">
-&lt;ul class="nav nav-pills"&gt;
-  &lt;li class="active"&gt;&lt;a href="#"&gt;Regular link&lt;/a&gt;&lt;/li&gt;
-  &lt;li class="dropdown" id="menu1"&gt;
-    &lt;a id="dLabel" role="button" class="dropdown-toggle" data-toggle="dropdown" href="#menu1"&gt;
-      Dropdown
-      &lt;b class="caret"&gt;&lt;/b&gt;
-    &lt;/a&gt;
-    &lt;ul class="dropdown-menu" role="menu" aria-labelledby="dLabel"&gt;
-      &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;Action&lt;/a&gt;&lt;/li&gt;
-      &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;Another action&lt;/a&gt;&lt;/li&gt;
-      &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;Something else here&lt;/a&gt;&lt;/li&gt;
-      &lt;li class="divider"&gt;&lt;/li&gt;
-      &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;Separated link&lt;/a&gt;&lt;/li&gt;
-    &lt;/ul&gt;
-  &lt;/li&gt;
-  ...
-&lt;/ul&gt;</pre>
+&lt;div class="dropdown"&gt;
+  &lt;!-- Link or button to toggle dropdown --&gt;
+  &lt;ul class="dropdown-menu" role="menu" aria-labelledby="dLabel"&gt;
+    &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;Action&lt;/a&gt;&lt;/li&gt;
+    &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;Another action&lt;/a&gt;&lt;/li&gt;
+    &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;Something else here&lt;/a&gt;&lt;/li&gt;
+    &lt;li class="divider"&gt;&lt;/li&gt;
+    &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;Separated link&lt;/a&gt;&lt;/li&gt;
+  &lt;/ul&gt;
+&lt;/div&gt;
+</pre>
 
 
         <hr class="bs-docs-separator">

docs/extend.html

@@ -60,8 +60,8 @@
               <li class="">
                 <a href="./javascript.html">Javascript</a>
               </li>
-              <li class="active">
-                <a href="./extend.html">Extend</a>
+              <li class="">
+                <a href="./customize.html">Customize</a>
               </li>
             </ul>
           </div>

docs/getting-started.html

@@ -61,7 +61,7 @@
                 <a href="./javascript.html">Javascript</a>
               </li>
               <li class="">
-                <a href="./extend.html">Extend</a>
+                <a href="./customize.html">Customize</a>
               </li>
             </ul>
           </div>

docs/index.html

@@ -61,7 +61,7 @@
                 <a href="./javascript.html">Javascript</a>
               </li>
               <li class="">
-                <a href="./extend.html">Extend</a>
+                <a href="./customize.html">Customize</a>
               </li>
             </ul>
           </div>
@@ -75,7 +75,7 @@
     <p>Sleek, intuitive, and powerful front-end framework for faster and easier web development.</p>
     <p><a href="assets/bootstrap.zip" class="btn btn-primary btn-large" >Download Bootstrap</a></p>
     <ul class="masthead-links">
-      <li><a href="./download.html" >Customize</a></li>
+      <li><a href="./extend.html" >Extend</a></li>
       <li><a href="http://github.com/twitter/bootstrap" >GitHub project</a></li>
       <li>Version 2.1.0</li>
     </ul>

docs/javascript.html

@@ -61,7 +61,7 @@
                 <a href="./javascript.html">Javascript</a>
               </li>
               <li class="">
-                <a href="./extend.html">Extend</a>
+                <a href="./customize.html">Customize</a>
               </li>
             </ul>
           </div>

docs/scaffolding.html

@@ -61,7 +61,7 @@
                 <a href="./javascript.html">Javascript</a>
               </li>
               <li class="">
-                <a href="./extend.html">Extend</a>
+                <a href="./customize.html">Customize</a>
               </li>
             </ul>
           </div>

docs/templates/layout.mustache

@@ -72,8 +72,8 @@
               <li class="{{javascript}}">
                 <a href="./javascript.html">{{_i}}Javascript{{/i}}</a>
               </li>
-              <li class="{{extend}}">
-                <a href="./extend.html">{{_i}}Extend{{/i}}</a>
+              <li class="{{customize}}">
+                <a href="./customize.html">{{_i}}Customize{{/i}}</a>
               </li>
             </ul>
           </div>

docs/templates/pages/components.mustache

@@ -42,7 +42,7 @@
         </div>
 
         <h2>{{_i}}Example{{/i}}</h2>
-        <p>{{_i}}An isolated (without dropdown toggle) dropdown menu example, designed to be used with the <a href="./javascript.html#dropdowns">dropdown javascript plugin</a>.{{/i}}</p>
+        <p>{{_i}}Toggleable, contextual menu for displaying lists of links. Made interactive with the <a href="./javascript.html#dropdowns">dropdown javascript plugin</a>.{{/i}}</p>
         <div class="bs-docs-example">
           <div class="dropdown clearfix">
             <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu" style="display: block; position: static; margin-bottom: 5px;">
@@ -69,26 +69,20 @@
 
 
         <h2>{{_i}}Markup{{/i}}</h2>
-        <p>{{_i}}Dropdowns require...{{/i}}</p>
+        <p>{{_i}}Looking at just the dropdown menu, here's the required HTML. You need to wrap the dropdown's trigger and the dropdown menu within <code>.dropdown</code>, or another element that declares <code>position: relative;</code>. Then just create the menu.{{/i}}</p>
 
 <pre class="prettyprint linenums">
-&lt;ul class="nav nav-pills"&gt;
-  &lt;li class="active"&gt;&lt;a href="#"&gt;Regular link&lt;/a&gt;&lt;/li&gt;
-  &lt;li class="dropdown" id="menu1"&gt;
-    &lt;a id="dLabel" role="button" class="dropdown-toggle" data-toggle="dropdown" href="#menu1"&gt;
-      {{_i}}Dropdown{{/i}}
-      &lt;b class="caret"&gt;&lt;/b&gt;
-    &lt;/a&gt;
-    &lt;ul class="dropdown-menu" role="menu" aria-labelledby="dLabel"&gt;
-      &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;{{_i}}Action{{/i}}&lt;/a&gt;&lt;/li&gt;
-      &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;{{_i}}Another action{{/i}}&lt;/a&gt;&lt;/li&gt;
-      &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;{{_i}}Something else here{{/i}}&lt;/a&gt;&lt;/li&gt;
-      &lt;li class="divider"&gt;&lt;/li&gt;
-      &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;{{_i}}Separated link{{/i}}&lt;/a&gt;&lt;/li&gt;
-    &lt;/ul&gt;
-  &lt;/li&gt;
-  ...
-&lt;/ul&gt;</pre>
+&lt;div class="dropdown"&gt;
+  &lt;!-- Link or button to toggle dropdown --&gt;
+  &lt;ul class="dropdown-menu" role="menu" aria-labelledby="dLabel"&gt;
+    &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;{{_i}}Action{{/i}}&lt;/a&gt;&lt;/li&gt;
+    &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;{{_i}}Another action{{/i}}&lt;/a&gt;&lt;/li&gt;
+    &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;{{_i}}Something else here{{/i}}&lt;/a&gt;&lt;/li&gt;
+    &lt;li class="divider"&gt;&lt;/li&gt;
+    &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;{{_i}}Separated link{{/i}}&lt;/a&gt;&lt;/li&gt;
+  &lt;/ul&gt;
+&lt;/div&gt;
+</pre>
 
 
         <hr class="bs-docs-separator">

docs/templates/pages/index.mustache

@@ -4,7 +4,7 @@
     <p>Sleek, intuitive, and powerful front-end framework for faster and easier web development.</p>
     <p><a href="assets/bootstrap.zip" class="btn btn-primary btn-large" {{#production}}onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Download', 'Download 2.1.0']);"{{/production}}>{{_i}}Download Bootstrap{{/i}}</a></p>
     <ul class="masthead-links">
-      <li><a href="./download.html" {{#production}}onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Jumbotron links', 'Customize']);"{{/production}}>Customize</a></li>
+      <li><a href="./extend.html" {{#production}}onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Jumbotron links', 'Extend']);"{{/production}}>Extend</a></li>
       <li><a href="http://github.com/twitter/bootstrap" {{#production}}onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Jumbotron links', 'GitHub project']);"{{/production}}>GitHub project</a></li>
       <li>Version 2.1.0</li>
     </ul>

docs/upgrading.html

@@ -61,7 +61,7 @@
                 <a href="./javascript.html">Javascript</a>
               </li>
               <li class="">
-                <a href="./extend.html">Extend</a>
+                <a href="./customize.html">Customize</a>
               </li>
             </ul>
           </div>