From 451c7869bb4a1f7cecf17de3aaf2dab5d616d120 Mon Sep 17 00:00:00 2001
From: ChitlangeSahas <chitlangesahas@gmail.com>
Date: Tue, 8 Nov 2022 12:19:58 -0700
Subject: [PATCH 1/3] feat(ProgressBar): clockface 4 updates

---
 src/Components/ProgressBar/ProgressBar.scss |  8 ++++++--
 src/Components/ProgressBar/ProgressBar.tsx  |  4 ++--
 src/Constants/colors.ts                     | 16 ++++++++++++++++
 src/Types/index.tsx                         |  3 +++
 4 files changed, 27 insertions(+), 4 deletions(-)

diff --git a/src/Components/ProgressBar/ProgressBar.scss b/src/Components/ProgressBar/ProgressBar.scss
index 70fbd3ad..3ed549c4 100644
--- a/src/Components/ProgressBar/ProgressBar.scss
+++ b/src/Components/ProgressBar/ProgressBar.scss
@@ -10,7 +10,7 @@
   height: 12px;
   box-sizing: border-box;
   padding: $cf-space-3xs 0;
-  background-color: $cf-grey-5;
+  background-color: $cf-grey-1;
   display: inline-flex;
   position: relative;
 }
@@ -25,8 +25,12 @@
 .cf-progress-bar--text {
   margin-top: $cf-space-2xs;
   width: 100%;
-  color: $cf-grey-55;
+  color: #88889b;
   display: inline-flex;
   justify-content: space-between;
   font-size: $cf-text-base-0;
 }
+
+.cf-progress-bar--value{
+  color: $cf-lavender;
+}
diff --git a/src/Components/ProgressBar/ProgressBar.tsx b/src/Components/ProgressBar/ProgressBar.tsx
index a49f0a85..ca83aaf2 100644
--- a/src/Components/ProgressBar/ProgressBar.tsx
+++ b/src/Components/ProgressBar/ProgressBar.tsx
@@ -45,7 +45,7 @@ export const ProgressBar = forwardRef<ProgressBarRef, ProgressBarProps>(
       max = 100,
       label,
       className,
-      color = InfluxColors.White,
+      color = InfluxColors.Lavender,
       barGradient,
       valueText,
       maxText,
@@ -76,7 +76,7 @@ export const ProgressBar = forwardRef<ProgressBarRef, ProgressBarProps>(
         <div className="cf-progress-bar--text">
           <div className="cf-progress-bar--label">{label}</div>
           <div>
-            <span className="cf-progress-bar--value" style={{color: color}}>
+            <span className="cf-progress-bar--value">
               {valueText ?? value}
             </span>
             <span className="cf-progress-bar--max">/{maxText ?? max}</span>
diff --git a/src/Constants/colors.ts b/src/Constants/colors.ts
index 01f0797c..428eff56 100644
--- a/src/Constants/colors.ts
+++ b/src/Constants/colors.ts
@@ -487,6 +487,22 @@ export const influxGradients = {
     start: InfluxColors.Pool,
     stop: InfluxColors.Pulsar,
   },
+
+  // New gradients
+  LightMode: {
+    start: '#D30971',
+    stop: '#9B2AFF'
+  },
+
+  DarkMode: {
+    start: '#F863B0',
+    stop: '#BC61E6'
+  },
+
+  TurquoiseChartreuse: {
+    start: '#5EE4E4',
+    stop: '#D6F622'
+  }
 }
 
 export const dropdownScrollColors = {
diff --git a/src/Types/index.tsx b/src/Types/index.tsx
index 8207c2fb..dfb77889 100644
--- a/src/Types/index.tsx
+++ b/src/Types/index.tsx
@@ -140,6 +140,9 @@ export enum Gradients {
   DangerLight = 'DangerLight',
   Danger = 'Danger',
   DangerDark = 'DangerDark',
+  DarkMode = 'DarkMode',
+  LightMode = 'LightMode',
+  TurquoiseChartreuse = 'TurquoiseChartreuse'
 }
 
 export enum DropdownMenuTheme {

From fe103c19ed4466c3731b3d5f2c095963acbc36ad Mon Sep 17 00:00:00 2001
From: ChitlangeSahas <chitlangesahas@gmail.com>
Date: Tue, 8 Nov 2022 12:23:40 -0700
Subject: [PATCH 2/3] fix: color

---
 src/Components/ProgressBar/ProgressBar.scss | 4 ----
 src/Components/ProgressBar/ProgressBar.tsx  | 2 +-
 2 files changed, 1 insertion(+), 5 deletions(-)

diff --git a/src/Components/ProgressBar/ProgressBar.scss b/src/Components/ProgressBar/ProgressBar.scss
index 3ed549c4..7f7d9715 100644
--- a/src/Components/ProgressBar/ProgressBar.scss
+++ b/src/Components/ProgressBar/ProgressBar.scss
@@ -30,7 +30,3 @@
   justify-content: space-between;
   font-size: $cf-text-base-0;
 }
-
-.cf-progress-bar--value{
-  color: $cf-lavender;
-}
diff --git a/src/Components/ProgressBar/ProgressBar.tsx b/src/Components/ProgressBar/ProgressBar.tsx
index ca83aaf2..3305abed 100644
--- a/src/Components/ProgressBar/ProgressBar.tsx
+++ b/src/Components/ProgressBar/ProgressBar.tsx
@@ -76,7 +76,7 @@ export const ProgressBar = forwardRef<ProgressBarRef, ProgressBarProps>(
         <div className="cf-progress-bar--text">
           <div className="cf-progress-bar--label">{label}</div>
           <div>
-            <span className="cf-progress-bar--value">
+            <span className="cf-progress-bar--value" style={{color: color}}>
               {valueText ?? value}
             </span>
             <span className="cf-progress-bar--max">/{maxText ?? max}</span>

From 76a62cd487dd7857f7cd92acd483c408ea1f647d Mon Sep 17 00:00:00 2001
From: ChitlangeSahas <chitlangesahas@gmail.com>
Date: Tue, 8 Nov 2022 12:25:27 -0700
Subject: [PATCH 3/3] prettier

---
 src/Constants/colors.ts | 8 ++++----
 src/Types/index.tsx     | 2 +-
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/Constants/colors.ts b/src/Constants/colors.ts
index 428eff56..71216bb6 100644
--- a/src/Constants/colors.ts
+++ b/src/Constants/colors.ts
@@ -491,18 +491,18 @@ export const influxGradients = {
   // New gradients
   LightMode: {
     start: '#D30971',
-    stop: '#9B2AFF'
+    stop: '#9B2AFF',
   },
 
   DarkMode: {
     start: '#F863B0',
-    stop: '#BC61E6'
+    stop: '#BC61E6',
   },
 
   TurquoiseChartreuse: {
     start: '#5EE4E4',
-    stop: '#D6F622'
-  }
+    stop: '#D6F622',
+  },
 }
 
 export const dropdownScrollColors = {
diff --git a/src/Types/index.tsx b/src/Types/index.tsx
index dfb77889..48715f2a 100644
--- a/src/Types/index.tsx
+++ b/src/Types/index.tsx
@@ -142,7 +142,7 @@ export enum Gradients {
   DangerDark = 'DangerDark',
   DarkMode = 'DarkMode',
   LightMode = 'LightMode',
-  TurquoiseChartreuse = 'TurquoiseChartreuse'
+  TurquoiseChartreuse = 'TurquoiseChartreuse',
 }
 
 export enum DropdownMenuTheme {