Commit 471e5969 authored by Mark Otto's avatar Mark Otto

convert jumbotron example to new navbar, fix container, and use rems in css

parent d0cffbb6
...@@ -23,28 +23,18 @@ ...@@ -23,28 +23,18 @@
<body> <body>
<nav class="navbar navbar-inverse navbar-fixed-top"> <nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container"> <a class="navbar-brand" href="#">Project name</a>
<div class="navbar-header"> <ul class="nav nav-pills">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> <li class="nav-item active">
<span class="sr-only">Toggle navigation</span> <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
<span class="icon-bar"></span> </li>
<span class="icon-bar"></span> <li class="nav-item">
<span class="icon-bar"></span> <a class="nav-link" href="#">About</a>
</button> </li>
<a class="navbar-brand" href="#">Project name</a> <li class="nav-item">
</div> <a class="nav-link" href="#">Contact</a>
<div id="navbar" class="navbar-collapse collapse"> </li>
<form class="navbar-form navbar-right"> </ul>
<div class="form-group">
<input type="text" placeholder="Email" class="form-control">
</div>
<div class="form-group">
<input type="password" placeholder="Password" class="form-control">
</div>
<button type="submit" class="btn btn-success">Sign in</button>
</form>
</div><!--/.navbar-collapse -->
</div>
</nav> </nav>
<!-- Main jumbotron for a primary marketing message or call to action --> <!-- Main jumbotron for a primary marketing message or call to action -->
......
/* Move down content because we have a fixed navbar that is 50px tall */ /* Move down content because we have a fixed navbar that is 50px tall */
body { body {
padding-top: 50px; padding-top: 5rem;
padding-bottom: 20px; padding-bottom: 2rem;
} }
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment