From ae188d4c16ef10ab390847a222439bfe80e1cee1 Mon Sep 17 00:00:00 2001
From: Alvita Huang <alvita.huang@ringcentral.com>
Date: Mon, 3 Jul 2017 16:18:48 +0800
Subject: [PATCH] alter brand color

---
 src/components/ContactDropdownList/styles.scss |  4 ++--
 src/components/RecipientsInput/index.js        |  2 +-
 src/components/RecipientsInput/styles.scss     | 10 +++++++---
 src/lib/commonStyles/colors.scss               |  2 +-
 4 files changed, 11 insertions(+), 7 deletions(-)

diff --git a/src/components/ContactDropdownList/styles.scss b/src/components/ContactDropdownList/styles.scss
index 2cf140c5e5..56186188ff 100644
--- a/src/components/ContactDropdownList/styles.scss
+++ b/src/components/ContactDropdownList/styles.scss
@@ -41,10 +41,10 @@
   }
 
   li.active {
-    color: $rc-blue;
+    color: $primary-color;
 
     .name {
-      color: $rc-blue;
+      color: $primary-color;
     }
   }
 }
diff --git a/src/components/RecipientsInput/index.js b/src/components/RecipientsInput/index.js
index 0bf1d8745e..fd843486f0 100644
--- a/src/components/RecipientsInput/index.js
+++ b/src/components/RecipientsInput/index.js
@@ -8,7 +8,7 @@ function SelectedRecipientItem({
   name = phoneNumber,
   onRemove,
 }) {
-  const className = phoneNumber.length > 5 ? styles.blue : null;
+  const className = phoneNumber.length > 5 ? styles.phoneNumber : styles.extension;
   return (
     <li className={className}>
       <span>{name}</span>
diff --git a/src/components/RecipientsInput/styles.scss b/src/components/RecipientsInput/styles.scss
index d344919dc8..1c5722629e 100644
--- a/src/components/RecipientsInput/styles.scss
+++ b/src/components/RecipientsInput/styles.scss
@@ -73,7 +73,6 @@
   li {
     position: relative;
     color: #fff;
-    background-color: #66d17b;
     border-radius: 20px;
     font-size: 13px;
     line-height: 1;
@@ -90,12 +89,17 @@
     }
   }
 
-  .blue {
-    background-color: $rc-blue;
+  .phoneNumber {
+    background-color: $primary-color;
     opacity: 0.6;
   }
+  .extension {
+    background-color: $extension-background-color;
+  }
+
 }
 
+
 .removeReceiver {
   position: absolute;
   bottom: 4px;
diff --git a/src/lib/commonStyles/colors.scss b/src/lib/commonStyles/colors.scss
index c7b771f457..fc2ed6a66b 100644
--- a/src/lib/commonStyles/colors.scss
+++ b/src/lib/commonStyles/colors.scss
@@ -53,7 +53,7 @@ $dialer-btn-border-color: $primary-color-highlight !default;
 $call-btn-color: #4cd964  !default;
 $call-btn-press-color: rgba(76,217,100,0.4) !default;
 
-
+$extension-background-color: #66d17b !default;
 $sms-bubble-background-color: #d5f3fd !default;
 
 $brand-font-color: $rc-blue !default;