From cddf8712b3f4b6e892cf7a58a3ee24a735949db6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Don=C3=A1t=20Nagy?= <doatech@hotmail.com>
Date: Thu, 26 Oct 2017 13:12:25 +0200
Subject: [PATCH] Add feature: is-expanded to navbar-item (#1320)

---
 CHANGELOG.md                              | 1 +
 docs/documentation/components/navbar.html | 3 +++
 sass/components/navbar.sass               | 3 +++
 3 files changed, 7 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 7a45eb97..cca236fb 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,6 +7,7 @@
 * 🎉 [List of buttons](https://bulma.io/documentation/elements/button/#list-of-buttons)
 * 🎉 #1235 Support for five column grid: `.is-one-fifth, .is-two-fifths, .is-three-fifths, .is-four-fifths`
 * 🎉 #1287 New `.is-invisible` helper
+* 🎉 #1255 New `.is-expanded` modifier for `navbar-item`
 
 ### Improvements
 
diff --git a/docs/documentation/components/navbar.html b/docs/documentation/components/navbar.html
index 4a9576a4..eb04bd24 100644
--- a/docs/documentation/components/navbar.html
+++ b/docs/documentation/components/navbar.html
@@ -736,6 +736,9 @@ document.addEventListener('DOMContentLoaded', function () {
           <code>navbar-dropdown</code>
         </li>
       </ul>
+      <p>
+        You can add the modifier class <code>is-expanded</code> to turn it into a full-width element.
+      </p>
     </div>
 
     {% include anchor.html name="Transparent navbar" %}
diff --git a/sass/components/navbar.sass b/sass/components/navbar.sass
index 2910772a..7f9c2af3 100644
--- a/sass/components/navbar.sass
+++ b/sass/components/navbar.sass
@@ -130,6 +130,9 @@ a.navbar-item,
     max-height: $navbar-item-img-max-height
   &.has-dropdown
     padding: 0
+  &.is-expanded
+    flex-grow: 1
+    flex-shrink: 1
   &.is-tab
     border-bottom: 1px solid transparent
     min-height: $navbar-height