Skip to content

Commit 369936a

Browse files
Fei ZFei Ztw15egan
authored
fix(color): add missing colors (#7232)
* fix(color): add missing colors * chore(tests): update snapshots Co-authored-by: Fei Z <fei-fei.zheng@ibm.com> Co-authored-by: TJ Egan <tw15egan@gmail.com>
1 parent cdbff93 commit 369936a

File tree

5 files changed

+72
-0
lines changed

5 files changed

+72
-0
lines changed

packages/colors/__tests__/__snapshots__/colors-test.js.snap

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -79,6 +79,8 @@ Object {
7979
},
8080
"orange": Object {
8181
"40": "#ff832b",
82+
"60": "#ba4e00",
83+
"70": "#8a3800",
8284
},
8385
"purple": Object {
8486
"10": "#f6f2ff",
@@ -134,6 +136,8 @@ Object {
134136
"yellow": Object {
135137
"20": "#fdd13a",
136138
"30": "#f1c21b",
139+
"40": "#d2a106",
140+
"50": "#b28600",
137141
},
138142
}
139143
`;

packages/colors/docs/sass.md

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -87,6 +87,8 @@ Define color variables
8787
$ibm-color__magenta-90: #510224 !default !global;
8888
$ibm-color__magenta-100: #2a0a18 !default !global;
8989
$ibm-color__orange-40: #ff832b !default !global;
90+
$ibm-color__orange-60: #ba4e00 !default !global;
91+
$ibm-color__orange-70: #8a3800 !default !global;
9092
$ibm-color__purple-10: #f6f2ff !default !global;
9193
$ibm-color__purple-20: #e8daff !default !global;
9294
$ibm-color__purple-30: #d4bbff !default !global;
@@ -130,6 +132,8 @@ Define color variables
130132
$ibm-color__white-0: #ffffff !default !global;
131133
$ibm-color__yellow-20: #fdd13a !default !global;
132134
$ibm-color__yellow-30: #f1c21b !default !global;
135+
$ibm-color__yellow-40: #d2a106 !default !global;
136+
$ibm-color__yellow-50: #b28600 !default !global;
133137
$ibm-color-map: (
134138
'black': (
135139
100: #000000,
@@ -220,6 +224,8 @@ Define color variables
220224
),
221225
'orange': (
222226
40: #ff832b,
227+
60: #ba4e00,
228+
70: #8a3800,
223229
),
224230
'purple': (
225231
10: #f6f2ff,
@@ -287,6 +293,8 @@ Define color variables
287293
'yellow': (
288294
20: #fdd13a,
289295
30: #f1c21b,
296+
40: #d2a106,
297+
50: #b28600,
290298
),
291299
) !default !global;
292300
}
@@ -368,6 +376,8 @@ Define color variables
368376
$carbon--magenta-90: #510224 !default !global;
369377
$carbon--magenta-100: #2a0a18 !default !global;
370378
$carbon--orange-40: #ff832b !default !global;
379+
$carbon--orange-60: #ba4e00 !default !global;
380+
$carbon--orange-70: #8a3800 !default !global;
371381
$carbon--purple-10: #f6f2ff !default !global;
372382
$carbon--purple-20: #e8daff !default !global;
373383
$carbon--purple-30: #d4bbff !default !global;
@@ -411,6 +421,8 @@ Define color variables
411421
$carbon--white-0: #ffffff !default !global;
412422
$carbon--yellow-20: #fdd13a !default !global;
413423
$carbon--yellow-30: #f1c21b !default !global;
424+
$carbon--yellow-40: #d2a106 !default !global;
425+
$carbon--yellow-50: #b28600 !default !global;
414426
$black-100: #000000 !default !global;
415427
$blue-10: #edf5ff !default !global;
416428
$blue-20: #d0e2ff !default !global;
@@ -473,6 +485,8 @@ Define color variables
473485
$magenta-90: #510224 !default !global;
474486
$magenta-100: #2a0a18 !default !global;
475487
$orange-40: #ff832b !default !global;
488+
$orange-60: #ba4e00 !default !global;
489+
$orange-70: #8a3800 !default !global;
476490
$purple-10: #f6f2ff !default !global;
477491
$purple-20: #e8daff !default !global;
478492
$purple-30: #d4bbff !default !global;
@@ -516,6 +530,8 @@ Define color variables
516530
$white-0: #ffffff !default !global;
517531
$yellow-20: #fdd13a !default !global;
518532
$yellow-30: #f1c21b !default !global;
533+
$yellow-40: #d2a106 !default !global;
534+
$yellow-50: #b28600 !default !global;
519535
$carbon--colors: (
520536
'black': (
521537
100: #000000,
@@ -606,6 +622,8 @@ Define color variables
606622
),
607623
'orange': (
608624
40: #ff832b,
625+
60: #ba4e00,
626+
70: #8a3800,
609627
),
610628
'purple': (
611629
10: #f6f2ff,
@@ -673,6 +691,8 @@ Define color variables
673691
'yellow': (
674692
20: #fdd13a,
675693
30: #f1c21b,
694+
40: #d2a106,
695+
50: #b28600,
676696
),
677697
) !default !global;
678698
}

packages/colors/src/colors.js

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,9 +13,13 @@ export const white0 = white;
1313

1414
export const yellow = '#f1c21b';
1515
export const yellow30 = yellow;
16+
export const yellow40 = '#d2a106';
17+
export const yellow50 = '#b28600';
1618

1719
export const orange = '#ff832b';
1820
export const orange40 = orange;
21+
export const orange60 = '#ba4e00';
22+
export const orange70 = '#8a3800';
1923

2024
export const red10 = '#fff1f1';
2125
export const red20 = '#ffd7d9';
@@ -262,6 +266,8 @@ export const colors = {
262266
magenta,
263267
orange: {
264268
40: orange40,
269+
60: orange60,
270+
70: orange70,
265271
},
266272
purple,
267273
red,
@@ -273,5 +279,7 @@ export const colors = {
273279
yellow: {
274280
20: yellow20,
275281
30: yellow30,
282+
40: yellow40,
283+
50: yellow50,
276284
},
277285
};

packages/components/docs/sass.md

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -562,6 +562,8 @@ Define color variables
562562
$ibm-color__magenta-90: #510224 !default !global;
563563
$ibm-color__magenta-100: #2a0a18 !default !global;
564564
$ibm-color__orange-40: #ff832b !default !global;
565+
$ibm-color__orange-60: #ba4e00 !default !global;
566+
$ibm-color__orange-70: #8a3800 !default !global;
565567
$ibm-color__purple-10: #f6f2ff !default !global;
566568
$ibm-color__purple-20: #e8daff !default !global;
567569
$ibm-color__purple-30: #d4bbff !default !global;
@@ -605,6 +607,8 @@ Define color variables
605607
$ibm-color__white-0: #ffffff !default !global;
606608
$ibm-color__yellow-20: #fdd13a !default !global;
607609
$ibm-color__yellow-30: #f1c21b !default !global;
610+
$ibm-color__yellow-40: #d2a106 !default !global;
611+
$ibm-color__yellow-50: #b28600 !default !global;
608612
$ibm-color-map: (
609613
'black': (
610614
100: #000000,
@@ -695,6 +699,8 @@ Define color variables
695699
),
696700
'orange': (
697701
40: #ff832b,
702+
60: #ba4e00,
703+
70: #8a3800,
698704
),
699705
'purple': (
700706
10: #f6f2ff,
@@ -762,6 +768,8 @@ Define color variables
762768
'yellow': (
763769
20: #fdd13a,
764770
30: #f1c21b,
771+
40: #d2a106,
772+
50: #b28600,
765773
),
766774
) !default !global;
767775
}
@@ -843,6 +851,8 @@ Define color variables
843851
$carbon--magenta-90: #510224 !default !global;
844852
$carbon--magenta-100: #2a0a18 !default !global;
845853
$carbon--orange-40: #ff832b !default !global;
854+
$carbon--orange-60: #ba4e00 !default !global;
855+
$carbon--orange-70: #8a3800 !default !global;
846856
$carbon--purple-10: #f6f2ff !default !global;
847857
$carbon--purple-20: #e8daff !default !global;
848858
$carbon--purple-30: #d4bbff !default !global;
@@ -886,6 +896,8 @@ Define color variables
886896
$carbon--white-0: #ffffff !default !global;
887897
$carbon--yellow-20: #fdd13a !default !global;
888898
$carbon--yellow-30: #f1c21b !default !global;
899+
$carbon--yellow-40: #d2a106 !default !global;
900+
$carbon--yellow-50: #b28600 !default !global;
889901
$black-100: #000000 !default !global;
890902
$blue-10: #edf5ff !default !global;
891903
$blue-20: #d0e2ff !default !global;
@@ -948,6 +960,8 @@ Define color variables
948960
$magenta-90: #510224 !default !global;
949961
$magenta-100: #2a0a18 !default !global;
950962
$orange-40: #ff832b !default !global;
963+
$orange-60: #ba4e00 !default !global;
964+
$orange-70: #8a3800 !default !global;
951965
$purple-10: #f6f2ff !default !global;
952966
$purple-20: #e8daff !default !global;
953967
$purple-30: #d4bbff !default !global;
@@ -991,6 +1005,8 @@ Define color variables
9911005
$white-0: #ffffff !default !global;
9921006
$yellow-20: #fdd13a !default !global;
9931007
$yellow-30: #f1c21b !default !global;
1008+
$yellow-40: #d2a106 !default !global;
1009+
$yellow-50: #b28600 !default !global;
9941010
$carbon--colors: (
9951011
'black': (
9961012
100: #000000,
@@ -1081,6 +1097,8 @@ Define color variables
10811097
),
10821098
'orange': (
10831099
40: #ff832b,
1100+
60: #ba4e00,
1101+
70: #8a3800,
10841102
),
10851103
'purple': (
10861104
10: #f6f2ff,
@@ -1148,6 +1166,8 @@ Define color variables
11481166
'yellow': (
11491167
20: #fdd13a,
11501168
30: #f1c21b,
1169+
40: #d2a106,
1170+
50: #b28600,
11511171
),
11521172
) !default !global;
11531173
}

packages/elements/docs/sass.md

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -403,6 +403,8 @@ Define color variables
403403
$ibm-color__magenta-90: #510224 !default !global;
404404
$ibm-color__magenta-100: #2a0a18 !default !global;
405405
$ibm-color__orange-40: #ff832b !default !global;
406+
$ibm-color__orange-60: #ba4e00 !default !global;
407+
$ibm-color__orange-70: #8a3800 !default !global;
406408
$ibm-color__purple-10: #f6f2ff !default !global;
407409
$ibm-color__purple-20: #e8daff !default !global;
408410
$ibm-color__purple-30: #d4bbff !default !global;
@@ -446,6 +448,8 @@ Define color variables
446448
$ibm-color__white-0: #ffffff !default !global;
447449
$ibm-color__yellow-20: #fdd13a !default !global;
448450
$ibm-color__yellow-30: #f1c21b !default !global;
451+
$ibm-color__yellow-40: #d2a106 !default !global;
452+
$ibm-color__yellow-50: #b28600 !default !global;
449453
$ibm-color-map: (
450454
'black': (
451455
100: #000000,
@@ -536,6 +540,8 @@ Define color variables
536540
),
537541
'orange': (
538542
40: #ff832b,
543+
60: #ba4e00,
544+
70: #8a3800,
539545
),
540546
'purple': (
541547
10: #f6f2ff,
@@ -603,6 +609,8 @@ Define color variables
603609
'yellow': (
604610
20: #fdd13a,
605611
30: #f1c21b,
612+
40: #d2a106,
613+
50: #b28600,
606614
),
607615
) !default !global;
608616
}
@@ -684,6 +692,8 @@ Define color variables
684692
$carbon--magenta-90: #510224 !default !global;
685693
$carbon--magenta-100: #2a0a18 !default !global;
686694
$carbon--orange-40: #ff832b !default !global;
695+
$carbon--orange-60: #ba4e00 !default !global;
696+
$carbon--orange-70: #8a3800 !default !global;
687697
$carbon--purple-10: #f6f2ff !default !global;
688698
$carbon--purple-20: #e8daff !default !global;
689699
$carbon--purple-30: #d4bbff !default !global;
@@ -727,6 +737,8 @@ Define color variables
727737
$carbon--white-0: #ffffff !default !global;
728738
$carbon--yellow-20: #fdd13a !default !global;
729739
$carbon--yellow-30: #f1c21b !default !global;
740+
$carbon--yellow-40: #d2a106 !default !global;
741+
$carbon--yellow-50: #b28600 !default !global;
730742
$black-100: #000000 !default !global;
731743
$blue-10: #edf5ff !default !global;
732744
$blue-20: #d0e2ff !default !global;
@@ -789,6 +801,8 @@ Define color variables
789801
$magenta-90: #510224 !default !global;
790802
$magenta-100: #2a0a18 !default !global;
791803
$orange-40: #ff832b !default !global;
804+
$orange-60: #ba4e00 !default !global;
805+
$orange-70: #8a3800 !default !global;
792806
$purple-10: #f6f2ff !default !global;
793807
$purple-20: #e8daff !default !global;
794808
$purple-30: #d4bbff !default !global;
@@ -832,6 +846,8 @@ Define color variables
832846
$white-0: #ffffff !default !global;
833847
$yellow-20: #fdd13a !default !global;
834848
$yellow-30: #f1c21b !default !global;
849+
$yellow-40: #d2a106 !default !global;
850+
$yellow-50: #b28600 !default !global;
835851
$carbon--colors: (
836852
'black': (
837853
100: #000000,
@@ -922,6 +938,8 @@ Define color variables
922938
),
923939
'orange': (
924940
40: #ff832b,
941+
60: #ba4e00,
942+
70: #8a3800,
925943
),
926944
'purple': (
927945
10: #f6f2ff,
@@ -989,6 +1007,8 @@ Define color variables
9891007
'yellow': (
9901008
20: #fdd13a,
9911009
30: #f1c21b,
1010+
40: #d2a106,
1011+
50: #b28600,
9921012
),
9931013
) !default !global;
9941014
}

0 commit comments

Comments
 (0)