Browse Source

Level 5: Dropdowns.

Frederic G. MARAND 9 years ago
parent
commit
6a699571e9
1 changed files with 25 additions and 2 deletions
  1. 25 2
      index.html

+ 25 - 2
index.html

@@ -30,7 +30,18 @@
         <ul class="nav navbar-nav navbar-right collapse navbar-collapse">
           <li class="nav navbar-link"><a href="#tickets.html">Tickets</a></li>
           <li class="nav navbar-link"><a href="#stations.html">Stations</a></li>
-          <li class="nav navbar-link"><a href="#about.html">About</a></li>
+          <li class="nav navbar-link">
+            <a href="about.html" data-target="#" data-toggle="dropdown">About <span class="caret"></span></a>
+            <ul class="dropdown-menu">
+              <li><a href="story.html">Our Story</a></li>
+              <li><a href="contact.html">Contact Us</a></li>
+              <li class="divider"></li>
+              <li><a href="blog">Blog</a></li>
+              <li class="divider"></li>
+              <li><a href="http://twitter.com/osinet">Twitter</a></li>
+              <li><a href="https://www.facebook.com/OSInet-217871594891150">Facebook</a></li>
+            </ul>
+          </li>
         </ul>
       </div>
     </div>
@@ -41,7 +52,18 @@
           <h2>The fastest way to space</h2>images
           <p class="lead">Make your way to space in the comfort of your own rocket, elevator or transporter.</p>
 
-          <button type="button" class="btn btn-lg btn-default">Take the tour</button>
+          <div class='btn-group'>
+            <button type='button' class='btn btn-default btn-lg dropdown-toggle' data-toggle="dropdown">
+              Take the Tour <span class="caret"></span>
+            </button>
+            <ul class="dropdown-menu">
+              <li><a href='#'>Transporter</a></li>
+              <li><a href='#'>Orbital Elevator</a></li>
+              <li><a href='#'>RocketBus</a></li>
+              <li class="divider"></li>
+              <li><a href='#'>Learn More</a></li>
+            </ul>
+          </div>
           <button type="button" class="btn btn-lg btn-primary">Book Tickets now</button>
         </div>
 
@@ -154,6 +176,7 @@
             </div>
           </div>
         </div>
+
         <div class='col-md-3 col-md-offset-1'>
           <div class='panel-group'>
             <div class='panel panel-success'>