0
0
mirror of https://github.com/twbs/bootstrap.git synced 2024-12-02 14:24:19 +01:00

redo custom docs navbar

This commit is contained in:
Mark Otto 2016-12-22 09:12:43 -08:00 committed by Mark Otto
parent bb97ae18f7
commit d86a1dbfd4
2 changed files with 34 additions and 48 deletions

View File

@ -1,5 +1,5 @@
<header class="navbar navbar-light navbar-static-top bd-navbar"> <header class="navbar navbar-light navbar-toggleable-md bd-navbar">
<div class="container"> <nav class="container">
{% comment %} {% comment %}
<nav class="nav navbar-nav float-right"> <nav class="nav navbar-nav float-right">
<div class="nav-item dropdown"> <div class="nav-item dropdown">
@ -25,37 +25,36 @@
</nav> </nav>
{% endcomment %} {% endcomment %}
<nav> <div class="d-flex flex-items-between hidden-lg-up">
<div class="clearfix"> <a class="navbar-brand" href="{{ site.baseurl }}/">
<button class="navbar-toggler float-right hidden-sm-up" type="button" data-toggle="collapse" data-target="#bd-main-nav" aria-controls="bd-main-nav" aria-expanded="false" aria-label="Toggle navigation"> Bootstrap
<span class="navbar-toggler-icon"></span> </a>
</button> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#bd-main-nav" aria-controls="bd-main-nav" aria-expanded="false" aria-label="Toggle navigation">
<a class="navbar-brand hidden-sm-up" href="{{ site.baseurl }}/"> <span class="navbar-toggler-icon"></span>
Bootstrap </button>
</a> </div>
</div>
<div class="collapse navbar-toggleable" id="bd-main-nav"> <div class="collapse navbar-collapse" id="bd-main-nav">
<ul class="nav navbar-nav"> <ul class="nav navbar-nav">
<li class="nav-item active"> <li class="nav-item active">
<a class="nav-item nav-link {% if page.layout == "home" %}active{% endif %}" href="{{ site.baseurl }}/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Bootstrap</a> <a class="nav-item nav-link {% if page.layout == "home" %}active{% endif %}" href="{{ site.baseurl }}/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Bootstrap</a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-item nav-link {% if page.layout == "docs" %}active{% endif %}" href="{{ site.baseurl }}/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a> <a class="nav-item nav-link {% if page.layout == "docs" %}active{% endif %}" href="{{ site.baseurl }}/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-item nav-link {% if page.title == "Examples" %}active{% endif %}" href="{{ site.baseurl }}/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a> <a class="nav-item nav-link {% if page.title == "Examples" %}active{% endif %}" href="{{ site.baseurl }}/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-item nav-link" href="{{ site.themes }}" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Themes');">Themes</a> <a class="nav-item nav-link" href="{{ site.themes }}" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Themes');">Themes</a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-item nav-link" href="{{ site.expo }}" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Expo');">Expo</a> <a class="nav-item nav-link" href="{{ site.expo }}" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Expo');">Expo</a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-item nav-link" href="{{ site.blog }}" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Blog');">Blog</a> <a class="nav-item nav-link" href="{{ site.blog }}" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Blog');">Blog</a>
</li> </li>
</ul> </ul>
</div> </div>
</nav> </nav>
</div>
</header> </header>

View File

@ -3,9 +3,6 @@
// //
.bd-navbar { .bd-navbar {
padding-right: 0;
padding-left: 0;
.navbar-nav { .navbar-nav {
.nav-link { .nav-link {
color: $bd-graphite-light; color: $bd-graphite-light;
@ -27,14 +24,4 @@
.dropdown-menu { .dropdown-menu {
font-size: inherit; font-size: inherit;
} }
@include media-breakpoint-down(sm) {
.nav-link {
float: none;
+ .nav-link {
margin-left: 0;
}
}
}
} }