From 410fd187be2433cbcd8fd57d06fc4043c1277a8e Mon Sep 17 00:00:00 2001
From: Jeremy Thomas <bbxdesign@gmail.com>
Date: Sun, 2 Apr 2017 16:41:05 +0100
Subject: [PATCH] Fix #512

---
 CHANGELOG.md               |  1 +
 docs/_includes/header.html | 67 +++++++++++++++-----------------------
 docs/css/bulma-docs.css    |  4 ---
 sass/components/nav.sass   |  2 --
 4 files changed, 27 insertions(+), 47 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 8af405f5..06ec4e46 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -15,6 +15,7 @@
 * Fix #484 icon alignment
 * Fix #506 bold nav menu
 * Fix #581 nav container
+* Fix #512 nav grouped buttons
 
 ## 0.4.0
 
diff --git a/docs/_includes/header.html b/docs/_includes/header.html
index 90ecc04f..930be1a6 100644
--- a/docs/_includes/header.html
+++ b/docs/_includes/header.html
@@ -39,46 +39,31 @@
       Blog
     </a>
 
-    {% if page.route != 'nothing' %}
-      <span class="nav-item">
-        <a id="twitter"
-          class="button"
-          data-social-network="Twitter"
-          data-social-action="tweet"
-          data-social-target="{{ site.url }}"
-          target="_blank"
-          href="https://twitter.com/intent/tweet?text={{ site.title | urlencode }}&url={{ site.url }}&via=jgthms">
-          <span class="icon">
-            <i class="fa fa-twitter"></i>
-          </span>
-          <span>Tweet</span>
-        </a>
-        <a class="button is-primary" href="{{ site.download }}">
-          <span class="icon">
-            <i class="fa fa-download"></i>
-          </span>
-          <span>Download</span>
-        </a>
-      </span>
-    {% else %}
-      <span class="nav-item">
-        <a class="button is-primary is-inverted is-outlined"
-        data-social-network="Twitter"
-        data-social-action="tweet"
-        data-social-target="http://bulma.io/"
-        href="https://twitter.com/intent/tweet?text={{ 'Bulma: a modern CSS framework based on Flebox' | urlencode }}&url=http://bulma.io/&via=jgthms">
-          <span class="icon">
-            <i class="fa fa-twitter"></i>
-          </span>
-          <span>Tweet</span>
-        </a>
-        <a class="button is-primary is-inverted" href="{{ site.download }}">
-          <span class="icon">
-            <i class="fa fa-download"></i>
-          </span>
-          <span>Download</span>
-        </a>
-      </span>
-    {% endif %}
+    <div class="nav-item">
+      <div class="field is-grouped">
+        <p class="control">
+          <a id="twitter"
+            class="button"
+            data-social-network="Twitter"
+            data-social-action="tweet"
+            data-social-target="{{ site.url }}"
+            target="_blank"
+            href="https://twitter.com/intent/tweet?text={{ site.title | urlencode }}&url={{ site.url }}&via=jgthms">
+            <span class="icon">
+              <i class="fa fa-twitter"></i>
+            </span>
+            <span>Tweet</span>
+          </a>
+        </p>
+        <p class="control">
+          <a class="button is-primary" href="{{ site.download }}">
+            <span class="icon">
+              <i class="fa fa-download"></i>
+            </span>
+            <span>Download</span>
+          </a>
+        </p>
+      </div>
+    </div>
   </div>
 </nav>
diff --git a/docs/css/bulma-docs.css b/docs/css/bulma-docs.css
index 1b0eb6d5..d9c78c9a 100644
--- a/docs/css/bulma-docs.css
+++ b/docs/css/bulma-docs.css
@@ -4174,10 +4174,6 @@ input[type="submit"].button {
   max-height: 1.75rem;
 }
 
-.nav-item .button + .button {
-  margin-left: 0.75rem;
-}
-
 .nav-item .tag:first-child:not(:last-child) {
   margin-right: 0.5rem;
 }
diff --git a/sass/components/nav.sass b/sass/components/nav.sass
index f77cd886..52992fdf 100644
--- a/sass/components/nav.sass
+++ b/sass/components/nav.sass
@@ -22,8 +22,6 @@ $nav-height: 3.25rem !default
     flex-shrink: 0
   img
     max-height: 1.75rem
-  .button + .button
-    margin-left: 0.75rem
   .tag
     &:first-child:not(:last-child)
       margin-right: 0.5rem