Apply our brand colors on source{d} dashboards

srcd/superset/assets/src/customization/colors.js

@@ -2,17 +2,36 @@
 
 const rgba = color => `rgba(${color.r}, ${color.g}, ${color.b}, ${color.a})`;
 
-// from current superset configuration
-const mainColorSpecs = { r: 0, g: 122, b: 135, a: 1 };
+// source{d} royal (#8719cb)
+const mainColorSpecs = { r: 135, g: 25, b: 203, a: 1 };
 
-// from current superset configuration
 const palette = {
-  rausch: '#ff5a5f',
-  hackb: '#7b0051',
-  kazan: rgba(mainColorSpecs),
-  babu: '#00d1c1',
-  lima: '#8ce071',
-  beach: '#ffb400',
+  royalDeep: '#591085',
+  royalMiddle: '#7015a8',
+  royal: rgba(mainColorSpecs),
+  royalLightDeep: '#a438e7',
+  royalLight: '#bc6ded',
+
+  coralDeep: '#d66600',
+  coralMiddle: '#e5770a',
+  coral: '#f68b0c',
+  coralLightDeep: '#f89c30',
+  coralLight: '#f9ae56',
+
+  limeDeep: '#006853',
+  limeMiddle: '#008168',
+  lime: '#009b7c',
+  limeLightDeep: '#00b491',
+  limeLight: '#00c8a1',
+
+  vanila: '#d024c6',
+  vanilaLight: '#e981e3',
+
+  navy: '#195dca',
+  navyLight: '#8fb5f1',
+
+  gray: '#6d6e71',
+  grayLight: '#c6c7c8',
 };
 
 const colors = {

srcd/superset/assets/src/customization/srcdColorsCategorical.js

@@ -2,26 +2,76 @@
 
 import { CategoricalScheme } from '@superset-ui/color';
 
-export const defaultPalette = 'bnbColors';
+import colors from './colors';
+
+const palette = colors.palette;
+
+export const defaultPalette = 'srcdMain';
 
 export const scheme = [
-  /* Example
   {
-    id: 'bnbColors',
-    label: 'main colors',
+    id: 'srcdMain',
+    label: 'source{d} main colors',
+    colors: [
+      palette.royalDeep,
+      palette.royal,
+      palette.royalLightDeep,
+      palette.royalLight,
+      palette.coralDeep,
+      palette.coral,
+      palette.coralLightDeep,
+      palette.coralLight,
+      palette.limeDeep,
+      palette.lime,
+      palette.limeLightDeep,
+      palette.limeLight,
+    ],
+  },
+  {
+    id: 'srcdAll',
+    label: 'source{d} all colors + middle gradient',
+    colors: [
+      palette.royalDeep,
+      palette.royalMiddle,
+      palette.royal,
+      palette.royalLightDeep,
+      palette.royalLight,
+      palette.coralDeep,
+      palette.coralMiddle,
+      palette.coral,
+      palette.coralLightDeep,
+      palette.coralLight,
+      palette.limeDeep,
+      palette.limeMiddle,
+      palette.lime,
+      palette.limeLightDeep,
+      palette.limeLight,
+      palette.vanila,
+      palette.vanilaLight,
+      palette.navy,
+      palette.navyLight,
+      palette.gray,
+      palette.grayLight,
+    ],
+  },
+  {
+    id: 'srcdSix',
+    label: 'source{d} six colors',
     colors: [
-      palette.rausch,
-      palette.hackb,
-      palette.kazan,
+      palette.royalDeep,
+      palette.coralMiddle,
+      palette.lime,
+      palette.vanila,
+      palette.navy,
+      palette.gray,
     ],
   },
   {
-    id: 'bnbDuo',
-    label: 'two colors palette',
+    id: 'srcdDuo',
+    label: 'source{d} two colors',
     colors: [
-      palette.rausch,
-      palette.hackb,
+      palette.royalMiddle,
+      palette.royalLight,
     ],
   },
-  */
 ].map(s => new CategoricalScheme(s));

srcd/superset/assets/src/customization/srcdColorsSequential.js

@@ -1,8 +1,13 @@
+
 /* eslint-disable sort-keys */
 
 import { SequentialScheme } from '@superset-ui/color';
 
-export const defaultPalette = 'blue_white_yellow';
+import colors from './colors';
+
+const palette = colors.palette;
+
+export const defaultPalette = 'lime_white_royal';
 
 // Sequential palettes use to be:
 // - diverging palettes: having three different colors (or more, but keeping the
@@ -11,18 +16,16 @@ export const defaultPalette = 'blue_white_yellow';
 // - not diverging palettes: having two colors (or more, but being a hue transition
 //   between the first and the last).
 export const scheme = [
-  /* Example
   {
-    id: 'blue_white_yellow',
-    label: 'blue/white/yellow',
+    id: 'lime_white_royal',
+    label: 'lime/white/royal',
     isDiverging: true,
-    colors: ['blue', 'white', 'yellow'],
+    colors: [palette.lime, 'white', palette.royal],
   },
   {
-    id: 'kazan_white',
-    label: 'kazan/white',
+    id: 'royal_white',
+    label: 'royal/white',
     isDiverging: false,
-    colors: ['white', palette.kazan],
+    colors: ['white', palette.royalDeep],
   },
-  */
 ].map(s => new SequentialScheme(s));