From 5b4b04e05b96a0b2aff886f5ef49ee80e7c0e103 Mon Sep 17 00:00:00 2001
From: Chris Cuellar <58723+ChrisC@users.noreply.github.com>
Date: Fri, 16 Dec 2022 11:26:15 -0800
Subject: [PATCH] Updates aqua and gray colors

---
 src/_colors.scss               | 5 +++--
 src/views/explore/explore.scss | 6 +++---
 2 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/src/_colors.scss b/src/_colors.scss
index 867d0da79..988da1fc8 100644
--- a/src/_colors.scss
+++ b/src/_colors.scss
@@ -27,8 +27,8 @@ $motion-blue-3: hsla(215, 60%, 50%, 1);//#3373CC
 /* UI Secondary Colors */
 /* 3.0 colors */
 /* Using www naming convention for now, should be consistent with gui */
-$ui-aqua: hsla(163, 85%, 40%, 1); // #0FBD8C Extension Primary
-$ui-aqua-dark: hsla(163, 85%, 30%, 1); // #0B8E69 Extension Aqua 3
+$ui-aqua: #338554; 
+$ui-aqua-dark: darken($ui-aqua, 10%);
 $ui-purple: hsla(260, 100%, 70%, 1); // #9966FF Looks Primary
 $ui-purple-dark: hsla(260, 60%, 60%, 1); // #774DCB Looks Secondary
 $ui-magenta: hsla(300, 53%, 60%, 1); /* #CF63CF Sounds Primary */
@@ -59,6 +59,7 @@ $transparent-light-blue: rgba(229, 240, 254, 0);
 /* Typography Colors */
 $header-gray: hsla(225, 15%, 40%, 1); //#575E75
 $type-gray: hsla(225, 15%, 40%, 1); //#575E75
+$type-dark-gray: #3B3B3B;
 $type-gray-75percent: hsla(225, 15%, 40%, .75);
 $type-gray-60percent: hsla(225, 15%, 40%, .6);
 $type-white: hsla(0, 100%, 100%, 1); //#FFF
diff --git a/src/views/explore/explore.scss b/src/views/explore/explore.scss
index 0b6242bcc..1a151c4bc 100644
--- a/src/views/explore/explore.scss
+++ b/src/views/explore/explore.scss
@@ -84,15 +84,14 @@ $base-bg: $ui-white;
         justify-content: flex-start;
 
         li {
-            border: 0;
+            border: 1px solid $type-dark-gray;
             background-color: $active-gray;
-            color: $ui-white;
+            color: $header-gray;
 
             &.active {
                 opacity: 1;
                 background-color: $ui-aqua;
                 color: $ui-white;
-
             }
 
             &:active {
@@ -101,6 +100,7 @@ $base-bg: $ui-white;
 
             &:hover {
                 background-color: $active-dark-gray;
+                color: $type-dark-gray;
             }
         }
     }