fix: add a second color blind friendly pallet to avoid clashing with …

…background color (#775)
influxdata · Jul 15, 2022 · a19da41 · a19da41
1 parent f1bffef
commit a19da41
Show file tree

Hide file tree

Showing 4 changed files with 16 additions and 4 deletions.
diff --git a/giraffe/package.json b/giraffe/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@influxdata/giraffe",
-  "version": "2.31.0",
+  "version": "2.31.1",
   "main": "dist/index.js",
   "module": "dist/index.js",
   "license": "MIT",

diff --git a/giraffe/src/constants/colorSchemes.ts b/giraffe/src/constants/colorSchemes.ts
@@ -211,7 +211,7 @@ export const RAINBOW_SIXTEEN = [
   '#4dc98e',
   '#007c41',
 ]
-export const COLOR_BLIND_FRIENDLY = [
+export const COLOR_BLIND_FRIENDLY_DARK = [
   '#000000',
   '#E69F00',
   '#56B4E9',
@@ -222,6 +222,17 @@ export const COLOR_BLIND_FRIENDLY = [
   '#CC79A7',
 ]
 
+export const COLOR_BLIND_FRIENDLY_LIGHT = [
+  '#FFFFFF',
+  '#E69F00',
+  '#56B4E9',
+  '#009E73',
+  '#F0E442',
+  '#0072B2',
+  '#D55E00',
+  '#CC79A7',
+]
+
 // Solid Colors
 export const SOLID_RED = ['#DC4E58', '#DC4E58', '#DC4E58']
 export const SOLID_YELLOW = ['#FFD255', '#FFD255', '#FFD255']

diff --git a/stories/package.json b/stories/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@influxdata/giraffe-stories",
-  "version": "2.31.0",
+  "version": "2.31.1",
   "license": "MIT",
   "repository": {
     "type": "git",

diff --git a/stories/src/helpers.tsx b/stories/src/helpers.tsx
@@ -54,7 +54,8 @@ export const colorSchemeKnob = (initial?: string[]) =>
     'Color Scheme',
     {
       'Nineteen Eighty Four': giraffe.NINETEEN_EIGHTY_FOUR,
-      'Color Blind Friendly': giraffe.COLOR_BLIND_FRIENDLY,
+      'Color Blind Friendly Light': giraffe.COLOR_BLIND_FRIENDLY_LIGHT,
+      'Color Blind Friendly Dark': giraffe.COLOR_BLIND_FRIENDLY_DARK,
       Atlantis: giraffe.ATLANTIS,
       'Do Androids Dream': giraffe.DO_ANDROIDS_DREAM,
       Delorean: giraffe.DELOREAN,