Fix navbar link color

docs/_sass/highlight.sass

@@ -126,6 +126,10 @@
   margin-left: 0
   margin-right: 0
   text-align: left
+  &:not(:first-child)
+    margin-top: 1em
+  &:not(:last-child)
+    margin-bottom: 1em
 
 .content li .highlight
   margin-top: 0.5em

docs/_sass/override.sass

@@ -1,4 +1,7 @@
 .content
+  .bd-spaced
+    li + li
+      margin-top: 1em
   .highlighter-rouge
     &:not(:last-child)
       margin-bottom: 1.5rem

docs/css/bulma-docs.css

@@ -6556,10 +6556,10 @@ html.has-navbar-fixed-bottom {
 }
 
 a.navbar-item:hover, a.navbar-item.is-active,
-.navbar-link:hover,
-.navbar-link.is-active {
+a.navbar-link:hover,
+a.navbar-link.is-active {
   background-color: whitesmoke;
-  color: #0a0a0a;
+  color: #3273dc;
 }
 
 .navbar-item {
@@ -6675,8 +6675,8 @@ a.navbar-item:hover, a.navbar-item.is-active,
     min-height: 3.25rem;
   }
   .navbar.is-transparent a.navbar-item:hover, .navbar.is-transparent a.navbar-item.is-active,
-  .navbar.is-transparent .navbar-link:hover,
-  .navbar.is-transparent .navbar-link.is-active {
+  .navbar.is-transparent a.navbar-link:hover,
+  .navbar.is-transparent a.navbar-link.is-active {
     background-color: transparent !important;
   }
   .navbar.is-transparent .navbar-item.has-dropdown.is-active .navbar-link, .navbar.is-transparent .navbar-item.has-dropdown.is-hoverable:hover .navbar-link {
@@ -6826,11 +6826,11 @@ a.navbar-item:hover, a.navbar-item.is-active,
     padding-bottom: 3.25rem;
   }
   a.navbar-item.is-active,
-  .navbar-link.is-active {
+  a.navbar-link.is-active {
     color: #0a0a0a;
   }
   a.navbar-item.is-active:not(:hover),
-  .navbar-link.is-active:not(:hover) {
+  a.navbar-link.is-active:not(:hover) {
     background-color: transparent;
   }
   .navbar-item.has-dropdown:hover .navbar-link, .navbar-item.has-dropdown.is-active .navbar-link {
@@ -9800,10 +9800,22 @@ label.panel-block:hover {
   text-align: left;
 }
 
+.content .highlight:not(:first-child) {
+  margin-top: 1em;
+}
+
+.content .highlight:not(:last-child) {
+  margin-bottom: 1em;
+}
+
 .content li .highlight {
   margin-top: 0.5em;
 }
 
+.content .bd-spaced li + li {
+  margin-top: 1em;
+}
+
 .content .highlighter-rouge:not(:last-child) {
   margin-bottom: 1.5rem;
 }

docs/documentation/components/navbar.html

@@ -746,7 +746,7 @@ document.addEventListener('DOMContentLoaded', function () {
       <p>
         A <code>navbar-item</code> is a repeatable element that can be:
       </p>
-      <ul>
+      <ul class="bd-spaced">
         <li>
           a navigation <strong>link</strong>
           {% highlight html %}{{ navbar_item_link_example }}{% endhighlight %}
@@ -813,7 +813,7 @@ document.addEventListener('DOMContentLoaded', function () {
       <p>
         You can now <strong>fix</strong> the navbar to either the <strong>top</strong> or <strong>bottom</strong> of the page. This is a 2-step process:
       </p>
-      <ul>
+      <ul class="bd-spaced">
         <li>
           Add either <code>is-fixed-top</code> or <code>is-fixed-bottom</code> to the <code>navbar</code> component
           {% highlight html %}<nav class="navbar is-fixed-top">{% endhighlight %}
@@ -832,13 +832,13 @@ document.addEventListener('DOMContentLoaded', function () {
         <span class="icon">
           <i class="fa fa-square-o"></i>
         </span>
-        <span>Fix top navbar</span>
+        <span>Fix <strong>top</strong> navbar</span>
       </a>
       <a id="navbarFixBottom" class="button is-link">
         <span class="icon">
           <i class="fa fa-square-o"></i>
         </span>
-        <span>Show bottom navbar</span>
+        <span>Show <strong>bottom</strong> navbar</span>
       </a>
     </div>