From 6ede68153e392fe976cb1bbaa3c0058884c0611d Mon Sep 17 00:00:00 2001
From: Josh Perez <60019601+josh-signal@users.noreply.github.com>
Date: Thu, 4 May 2023 19:46:34 -0400
Subject: [PATCH] Improves contrast within chips

---
 stylesheets/components/ContactPill.scss | 28 +++++++++++++++++--------
 1 file changed, 19 insertions(+), 9 deletions(-)

diff --git a/stylesheets/components/ContactPill.scss b/stylesheets/components/ContactPill.scss
index 3b43d6b466b..413511303d1 100644
--- a/stylesheets/components/ContactPill.scss
+++ b/stylesheets/components/ContactPill.scss
@@ -11,12 +11,26 @@
   border-radius: 6px;
 
   @include light-theme {
+    background: $color-black-alpha-08;
     color: $color-gray-90;
-    background: $color-gray-05;
   }
   @include dark-theme {
-    color: $color-gray-02;
-    background: $color-gray-75;
+    background: $color-white-alpha-12;
+    color: $color-gray-05;
+  }
+
+  @include keyboard-mode {
+    &:focus-within {
+      @include light-theme {
+        background: $color-gray-45;
+        color: $color-white;
+      }
+
+      @include dark-theme {
+        background: $color-gray-25;
+        color: $color-gray-90;
+      }
+    }
   }
 
   &__contact-name {
@@ -56,19 +70,15 @@
 
     @include keyboard-mode {
       &:focus {
-        background: $color-gray-15;
-
         &::before {
-          @include color-svg($icon, $color-ultramarine);
+          @include color-svg($icon, $color-white);
         }
       }
     }
     @include dark-keyboard-mode {
       &:focus {
-        background: $color-gray-65;
-
         &::before {
-          @include color-svg($icon, $color-ultramarine-light);
+          @include color-svg($icon, $color-gray-90);
         }
       }
     }