From 1a5dc72c1b67fc22c4247c5716e95da1ce446f96 Mon Sep 17 00:00:00 2001
From: mattrick <git@mattrick.me>
Date: Sat, 9 Sep 2017 03:17:19 -0700
Subject: [PATCH] Add navbar color modifiers (#849)

* Add navbar color modifiers

* Use border-color instead of +arrow for navbar dropdowns
---
 sass/components/navbar.sass | 26 ++++++++++++++++++++++++++
 1 file changed, 26 insertions(+)

diff --git a/sass/components/navbar.sass b/sass/components/navbar.sass
index d9693a5a..f7ca87a3 100644
--- a/sass/components/navbar.sass
+++ b/sass/components/navbar.sass
@@ -37,6 +37,32 @@ $navbar-divider-background-color: $border !default
   background-color: $navbar-background-color
   min-height: $navbar-height
   position: relative
+  @each $name, $pair in $colors
+    $color: nth($pair, 1)
+    $color-invert: nth($pair, 2)
+    &.is-#{$name}
+      background-color: $color
+      color: $color-invert
+      .navbar-item,
+      .navbar-link
+        color: $color-invert
+      a.navbar-item,
+      .navbar-link
+        &:hover,
+        &.is-active
+          background-color: darken($color, 2.5%)
+          color: $color-invert
+      +desktop
+        .navbar-link
+          &::after
+            border-color: $color-invert
+        .navbar-dropdown a.navbar-item:not(.is-active):not(:hover),
+        .navbar-dropdown .navbar-item:not(a)
+          color: $navbar-item
+        .navbar-item.has-dropdown:hover .navbar-link,
+        .navbar-item.has-dropdown.is-active .navbar-link
+          background-color: darken($color, 2.5%)
+          color: $color-invert
   & > .container
     align-items: stretch
     display: flex