diff --git a/scss/_navbar.scss b/scss/_navbar.scss
index 35d7c7b72eff0334bda0eedb7288f60bb95ed47e..01d827ff70567c1be93b534673347acde6c06bdc 100644
--- a/scss/_navbar.scss
+++ b/scss/_navbar.scss
@@ -216,8 +216,6 @@
}
.show > .nav-link,
- .active > .nav-link,
- .nav-link.show,
.nav-link.active {
color: $navbar-light-active-color;
}
@@ -269,8 +267,6 @@
}
.show > .nav-link,
- .active > .nav-link,
- .nav-link.show,
.nav-link.active {
color: $navbar-dark-active-color;
}
diff --git a/site/content/docs/5.0/components/navbar.md b/site/content/docs/5.0/components/navbar.md
index e47833e8bfdc8ff0388696a5d2482342716ebc8d..bf11527e07fd5be7f1532ea1b1a85e14121e08e6 100644
--- a/site/content/docs/5.0/components/navbar.md
+++ b/site/content/docs/5.0/components/navbar.md
@@ -45,8 +45,8 @@ Here's an example of all the sub-components included in a responsive light-theme
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto mb-2 mb-lg-0">
- <li class="nav-item active">
- <a class="nav-link" aria-current="page" href="#">Home</a>
+ <li class="nav-item">
+ <a class="nav-link active" aria-current="page" href="#">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
@@ -139,8 +139,8 @@ Please note that you should also add the `aria-current` attribute on the `.nav-l
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
- <li class="nav-item active">
- <a class="nav-link" aria-current="page" href="#">Home</a>
+ <li class="nav-item">
+ <a class="nav-link active" aria-current="page" href="#">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Features</a>
@@ -189,8 +189,8 @@ You may also utilize dropdowns in your navbar nav. Dropdown menus require a wrap
</button>
<div class="collapse navbar-collapse" id="navbarNavDropdown">
<ul class="navbar-nav">
- <li class="nav-item active">
- <a class="nav-link" aria-current="page" href="#">Home</a>
+ <li class="nav-item">
+ <a class="nav-link active" aria-current="page" href="#">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Features</a>
@@ -292,8 +292,8 @@ Mix and match with other components and utilities as needed.
</button>
<div class="collapse navbar-collapse" id="navbarText">
<ul class="navbar-nav mr-auto mb-2 mb-lg-0">
- <li class="nav-item active">
- <a class="nav-link" aria-current="page" href="#">Home</a>
+ <li class="nav-item">
+ <a class="nav-link active" aria-current="page" href="#">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Features</a>
@@ -323,8 +323,8 @@ Theming the navbar has never been easier thanks to the combination of theming cl
</button>
<div class="collapse navbar-collapse" id="navbarColor01">
<ul class="navbar-nav mr-auto mb-2 mb-lg-0">
- <li class="nav-item active">
- <a class="nav-link" aria-current="page" href="#">Home</a>
+ <li class="nav-item">
+ <a class="nav-link active" aria-current="page" href="#">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Features</a>
@@ -352,8 +352,8 @@ Theming the navbar has never been easier thanks to the combination of theming cl
</button>
<div class="collapse navbar-collapse" id="navbarColor02">
<ul class="navbar-nav mr-auto mb-2 mb-lg-0">
- <li class="nav-item active">
- <a class="nav-link" aria-current="page" href="#">Home</a>
+ <li class="nav-item">
+ <a class="nav-link active" aria-current="page" href="#">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Features</a>
@@ -381,8 +381,8 @@ Theming the navbar has never been easier thanks to the combination of theming cl
</button>
<div class="collapse navbar-collapse" id="navbarColor03">
<ul class="navbar-nav mr-auto mb-2 mb-lg-0">
- <li class="nav-item active">
- <a class="nav-link" aria-current="page" href="#">Home</a>
+ <li class="nav-item">
+ <a class="nav-link active" aria-current="page" href="#">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Features</a>
@@ -500,8 +500,8 @@ With no `.navbar-brand` shown in lowest breakpoint:
<div class="collapse navbar-collapse" id="navbarTogglerDemo01">
<a class="navbar-brand" href="#">Hidden brand</a>
<ul class="navbar-nav mr-auto mb-2 mb-lg-0">
- <li class="nav-item active">
- <a class="nav-link" aria-current="page" href="#">Home</a>
+ <li class="nav-item">
+ <a class="nav-link active" aria-current="page" href="#">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
@@ -530,8 +530,8 @@ With a brand name shown on the left and toggler on the right:
</button>
<div class="collapse navbar-collapse" id="navbarTogglerDemo02">
<ul class="navbar-nav mr-auto mb-2 mb-lg-0">
- <li class="nav-item active">
- <a class="nav-link" aria-current="page" href="#">Home</a>
+ <li class="nav-item">
+ <a class="nav-link active" aria-current="page" href="#">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
@@ -560,8 +560,8 @@ With a toggler on the left and brand name on the right:
<a class="navbar-brand" href="#">Navbar</a>
<div class="collapse navbar-collapse" id="navbarTogglerDemo03">
<ul class="navbar-nav mr-auto mb-2 mb-lg-0">
- <li class="nav-item active">
- <a class="nav-link" aria-current="page" href="#">Home</a>
+ <li class="nav-item">
+ <a class="nav-link active" aria-current="page" href="#">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>