From 28bc4befbef2f2e85caf48de5248e3065b28777c Mon Sep 17 00:00:00 2001
From: Jonathan Bobel <jonathan.bobel@gsa.gov>
Date: Thu, 8 Aug 2024 16:29:35 -0400
Subject: [PATCH] Small changes to the data viz colors and chart sizing

---
 app/assets/javascripts/activityChart.js        | 2 +-
 app/assets/javascripts/totalMessagesChart.js   | 4 ++--
 app/assets/sass/uswds/_data-visualization.scss | 2 +-
 3 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/app/assets/javascripts/activityChart.js b/app/assets/javascripts/activityChart.js
index 75913c145..b5139f157 100644
--- a/app/assets/javascripts/activityChart.js
+++ b/app/assets/javascripts/activityChart.js
@@ -4,7 +4,7 @@
 
         const COLORS = {
             delivered: '#0076d6',
-            failed: '#fa9441',
+            failed: '#c6cace',
             text: '#666'
         };
 
diff --git a/app/assets/javascripts/totalMessagesChart.js b/app/assets/javascripts/totalMessagesChart.js
index ff409c969..755d46f6e 100644
--- a/app/assets/javascripts/totalMessagesChart.js
+++ b/app/assets/javascripts/totalMessagesChart.js
@@ -21,7 +21,7 @@
 
         var svg = d3.select("#totalMessageChart");
         var width = chartContainer.clientWidth;
-        var height = 64;
+        var height = 50;
 
         // Ensure the width is set correctly
         if (width === 0) {
@@ -62,7 +62,7 @@
             .attr("x", 0) // Initially set to 0, will be updated during animation
             .attr("y", 0)
             .attr("height", height)
-            .attr("fill", '#fa9441')
+            .attr("fill", '#c6cace')
             .attr("width", 0) // Start with width 0 for animation
             .on('mouseover', function(event) {
                 tooltip.style('display', 'block')
diff --git a/app/assets/sass/uswds/_data-visualization.scss b/app/assets/sass/uswds/_data-visualization.scss
index 6139933be..7740aad3f 100644
--- a/app/assets/sass/uswds/_data-visualization.scss
+++ b/app/assets/sass/uswds/_data-visualization.scss
@@ -2,7 +2,7 @@
 
 $delivered: color('blue-50v');
 $pending: color('green-cool-40v');
-$failed: color('orange-30v');
+$failed: color('gray-cool-20');
 
 .chart-container {
   display: flex;