From e02fe249823460924e7712d8f37cb77154475820 Mon Sep 17 00:00:00 2001
From: Andrew Croce <andrew+dds@promptworks.com>
Date: Wed, 19 Sep 2018 12:02:02 -0400
Subject: [PATCH] text background filter styles

---
 styles/components/_budget_chart.scss | 29 +++++++++++++++++++++++++---
 1 file changed, 26 insertions(+), 3 deletions(-)

diff --git a/styles/components/_budget_chart.scss b/styles/components/_budget_chart.scss
index 0c37695e..0fed8d4a 100644
--- a/styles/components/_budget_chart.scss
+++ b/styles/components/_budget_chart.scss
@@ -60,11 +60,11 @@
   }
 
   .budget-chart__block {
-    fill: $color-white;
+    fill: transparent;
     cursor: pointer;
 
     &--highlighted {
-      fill: $color-aqua-lightest;
+      fill: rgba($color-aqua, .15);
     }
 
     &--is-expiration {
@@ -72,13 +72,27 @@
     }
 
     &:hover {
-      fill: $color-aqua-lightest;
+      fill: rgba($color-aqua, .15);
     }
   }
 
   svg {
     display: block;
 
+    .filter__text-background {
+      feFlood {
+        flood-color: $color-white;
+        flood-opacity: 1;
+      }
+
+      &--highlighted {
+        feFlood {
+          flood-color: $color-aqua-lightest;
+          flood-opacity: 1;
+        }
+      }
+    }
+
     a {
       text-decoration: none;
       &:focus {
@@ -86,6 +100,15 @@
         stroke: $color-gray-light;
         stroke-dasharray: 2px;
       }
+
+      &:hover {
+        .filter__text-background {
+          feFlood {
+            flood-color: $color-aqua-lightest;
+            flood-opacity: 1;
+          }
+        }
+      }
     }
   }