root
/
bootstrap
mirror of https://github.com/twbs/bootstrap.git
1
0
Fork 0
Code Issues Actions 3 Packages Projects Releases Wiki Activity

Merge pull request #21205 from twbs/navbar-disabled 

v4 disabled navbar links
This commit is contained in:
Mark Otto 2016-11-26 02:03:46 -08:00 committed by GitHub
parent b9947152c6 25216349b3
commit 8ef1d93d0c
2 changed files with 11 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
docs/components/navbar.md
View File

@ -44,7 +44,7 @@ Here's an example of all the sub-components included in a default, non-responsiv
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
<a class="nav-link disabled" href="#">Disabled</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="http://example.com" id="supportedContentDropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Dropdown</a>
@ -118,7 +118,7 @@ Active states—with `.active`—to indicate the current page can be applied dir
<a class="nav-link" href="#">Pricing</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">About</a>
<a class="nav-link disabled" href="#">Disabled</a>
</li>
</ul>
</nav>
@ -132,7 +132,7 @@ And because we use classes for our navs, you can avoid the list-based approach e
<a class="nav-item nav-link active" href="#">Home <span class="sr-only">(current)</span></a>
<a class="nav-item nav-link" href="#">Features</a>
<a class="nav-item nav-link" href="#">Pricing</a>
<a class="nav-item nav-link" href="#">About</a>
<a class="nav-item nav-link disabled" href="#">Disabled</a>
</div>
</nav>
{% endexample %}

8
scss/_navbar.scss
View File

@ -206,6 +206,10 @@
@include hover-focus {
color: $navbar-light-hover-color;
}
&.disabled {
color: $navbar-light-disabled-color;
}
}
.open > .nav-link,
@ -250,6 +254,10 @@
@include hover-focus {
color: $navbar-dark-hover-color;
}
&.disabled {
color: $navbar-dark-disabled-color;
}
}
.open > .nav-link,