Change .is-active menu class to .active, to avoid overlap with dropdown menu active...

diff --git a/docs/pages/menu.md b/docs/pages/menu.md
index 4265c9634687bf29c7644e55e880531851883ce0..8306eb2f35a5c578432be1254e246fed00a8051c 100644 (file)
--- a/docs/pages/menu.md
+++ b/docs/pages/menu.md
@@ -132,11 +132,11 @@ Add a new menu inside the `<li>` of a Menu and add the class `.nested` to create
 
 ## Active State
 
-Add the class `.is-active` to any `<li>` to create an active state. You could apply this server-side to mark the active page, or dynamically with JavaScript.
+Add the class `.active` to any `<li>` to create an active state. You could apply this server-side to mark the active page, or dynamically with JavaScript.
 
 ```html_example
 <ul class="menu">
-  <li class="is-active"><a>Home</a></li>
+  <li class="active"><a>Home</a></li>
   <li><a>About</a></li>
   <li><a>Nachos</a></li>
 </ul>

diff --git a/scss/components/_menu.scss b/scss/components/_menu.scss
index 4713634a74cb72a9efb758abfa668a87c1bdaf59..f64be441d5b1fd114ada995abf961fbc59840675 100644 (file)
--- a/scss/components/_menu.scss
+++ b/scss/components/_menu.scss
@@ -274,7 +274,7 @@ $menu-icon-spacing: 0.25rem !default;
     }
 
     // Active state
-    .is-active > a {
+    .active > a {
       color: $menu-item-color-active;
       background: $menu-item-background-active;
     }