diff --git a/docs/_includes/docs-nav.html b/docs/_includes/docs-nav.html
index ebeb0d8280..2c001a3f4c 100644
--- a/docs/_includes/docs-nav.html
+++ b/docs/_includes/docs-nav.html
@@ -122,8 +122,9 @@
Nav links
Forms in navbars
Buttons in navbars
- Component alignment
Text in navbars
+ Links in navbars
+ Component alignment
Fixed top navbar
Fixed bottom navbar
Static top navbar
diff --git a/docs/docs.html b/docs/docs.html
index e4f7113818..3b092f8047 100644
--- a/docs/docs.html
+++ b/docs/docs.html
@@ -3488,9 +3488,9 @@ For example, <section>
should be wrapped as inline.
@@ -3508,7 +3508,7 @@ For example, <section>
should be wrapped as inline.
@@ -3526,16 +3526,43 @@ For example, <section>
should be wrapped as inline.
For buttons not residing in a <form>
, add this class to vertically center buttons within a navbar.
- Component alignment
- Align nav links, search form, or text, use the .pull-left
or .pull-right
utility classes. Both classes will add a CSS float in the specified direction.
-
Text
Wrap strings of text in an element with .navbar-text
, usually on a <p>
tag for proper leading and color.
+
+
+
Brand
+
Signed in as Mark Otto
+
+
+{% highlight html linenos %}
+
+
Brand
+
Signed in as Mark Otto
+
+{% endhighlight %}
+
+ Links
+ For folks using standard links that are not within the regular navbar navigation component, use the .navbar-link
class to add the proper colors for the default and inverse navbar options.
+
+{% highlight html linenos %}
+
+{% endhighlight %}
+
+ Component alignment
+ Align nav links, search form, or text, use the .pull-left
or .pull-right
utility classes. Both classes will add a CSS float in the specified direction.
Optional display variations
diff --git a/less/navbar.less b/less/navbar.less
index 9511670cd5..6cee4030c4 100644
--- a/less/navbar.less
+++ b/less/navbar.less
@@ -300,7 +300,8 @@
}
-// Buttons in navbar
+
+// Buttons in navbars
//
// Vertically center a button within a navbar (when *not* in a form).
@@ -308,10 +309,23 @@
margin-top: ((@navbar-height - @input-height-base) / 2);
}
-/*
-// Janky solution for now to account for links outside the .nav
-// -------------------------
+
+// Text in navbars
+//
+// Add a class to make any element properly align itself vertically within the navbars.
+
+.navbar-text {
+
+}
+
+
+
+// Links in navbars
+//
+// Add a class to ensure links outside the navbar nav are colored correctly.
+
+// Default navbar variables
.navbar-link {
color: @navbar-link-color;
&:hover {
@@ -319,4 +333,10 @@
}
}
-*/
+// Use the inverse navbar variables
+.navbar-inverse .navbar-link {
+ color: @navbar-inverse-link-color;
+ &:hover {
+ color: @navbar-inverse-link-hover-color;
+ }
+}