Skip to content

Commit bba9ef2

Browse files
cxraminacxramina
authored
Update shared-style-variables.css (#1021)
* Update shared-style-variables.css * Update shared-style-variables.css * Update shared-style-variables.css * Update shared-style-variables.css * Update shared-style-variables.css * Update shared-style-variables.css * Update shared-style-variables.css * Update shared-style-variables.css * Update shared-style-variables.css * Update shared-style-variables.css * Update shared-style-variables.css * Update shared-style-variables.css * Update shared-style-variables.css * Update shared-style-variables.css * Update shared-style-variables.css
1 parent 4d3bbf4 commit bba9ef2

File tree

1 file changed

+52
-43
lines changed

1 file changed

+52
-43
lines changed

‎packages/ui/src/shared-style-variables.css

+52-43
Original file line numberDiff line numberDiff line change
@@ -48,20 +48,21 @@
4848
--canary-base-chrome-white: 0 0% 100%;
4949
--canary-base-chrome-50: 240 20% 99%;
5050
--canary-base-chrome-100: 240 28% 95.1%;
51-
--canary-base-chrome-150: 240 29.4% 90%;
51+
--canary-base-chrome-150: 240 29.4% 88%;
5252
--canary-base-chrome-200: 240 13% 82%;
5353
--canary-base-chrome-400: 240 8.9% 66.9%;
5454
--canary-base-chrome-300: 240 12.9% 80.2%;
5555
--canary-base-chrome-500: 240 7.8% 59.6%;
5656
--canary-base-chrome-600: 244.3 6.4% 43.1%;
5757
--canary-base-chrome-700: 240 8.2% 38%;
5858
--canary-base-chrome-800: 240 7.8% 27.6%;
59-
--canary-base-chrome-850: 240 7% 13.9%;
59+
--canary-base-chrome-850: 240 8% 18%;
6060
--canary-base-chrome-900: 240 6.4% 9.2%;
6161
--canary-base-chrome-950: 240 8.1% 7.3%;
6262
--canary-base-chrome-black: 240 10.3% 5.7%;
6363
--canary-accent-50: 210 100% 96.5%;
6464
--canary-accent-100: 210.7 100% 92%;
65+
--canary-accent-150: 215.3 89.5% 88.8%;
6566
--canary-accent-200: 212.6 100% 77.6%;
6667
--canary-accent-300: 213.2 100% 67.1%;
6768
--canary-accent-400: 211 99.2% 50.2%;
@@ -76,16 +77,18 @@
7677
--canary-green-150: 132.9 68.4% 81.4%;
7778
--canary-green-200: 137.7 62.8% 64.1%;
7879
--canary-green-300: 139.8 56.5% 54.9%;
80+
--canary-green-400: 145.5 75.5% 38.4%;
7981
--canary-green-600: 146.7 87.5% 28.2%;
8082
--canary-green-700: 142.7 64.3% 27.5%;
8183
--canary-green-850: 136.2 39.8% 18.2%;
8284
--canary-green-900: 135.8 35.8% 10.4%;
8385
--canary-green-950: 135 23.5% 6.7%;
8486
--canary-red-50: 11.2 80% 96.1%;
8587
--canary-red-100: 9.4 100% 93.7%;
86-
--canary-red-150: 9.2 100% 89.8%;
88+
--canary-red-150: 9.3 93.5% 87.8%;
8789
--canary-red-200: 7.8 100% 74.3%;
8890
--canary-red-300: 6.4 100% 68.8%;
91+
--canary-red-400: 4.7 69.7% 53.3%;
8992
--canary-red-500: 4.5 66.5% 46.9%;
9093
--canary-red-600: 4.3 67.5% 41%;
9194
--canary-red-700: 4.5 65.7% 35.5%;
@@ -95,9 +98,11 @@
9598
--canary-red-950: 8 33.3% 8.8%;
9699
--canary-amber-50: 52.7 100% 93.5%;
97100
--canary-amber-100: 49 95.3% 83.1%;
101+
--canary-amber-150: 45.9 83.5% 81%;
98102
--canary-amber-200: 44.2 70.5% 69.4%;
99103
--canary-amber-300: 42.1 63.3% 61.6%;
100104
--canary-amber-400: 40.2 56.5% 54.9%;
105+
--canary-amber-500: 37.3 50.2% 50.4%;
101106
--canary-amber-700: 30.6 48.5% 38%;
102107
--canary-amber-800: 25.7 40.2% 34.1%;
103108
--canary-amber-850: 19.5 33.9% 24.9%;
@@ -111,6 +116,7 @@
111116
--canary-pink-900: 330 32.4% 13.3%;
112117
--canary-purple-50: 260 100% 98.8%;
113118
--canary-purple-100: 262.8 100% 94.3%;
119+
--canary-purple-150: 265.1 100% 89.2%;
114120
--canary-purple-200: 267.8 100% 81%;
115121
--canary-purple-300: 266.7 98.3% 76.3%;
116122
--canary-purple-400: 267.9 73.4% 66.1%;
@@ -123,6 +129,7 @@
123129
--canary-yellow-150: 34.2 100% 83.1%;
124130
--canary-yellow-200: 37.4 98.8% 68.4%;
125131
--canary-yellow-300: 38.3 80.9% 59%;
132+
--canary-yellow-500: 39.9 67.5% 45.9%;
126133
--canary-yellow-600: 39.7 59.6% 42.7%;
127134
--canary-yellow-700: 40 62.9% 32.7%;
128135
--canary-yellow-850: 38.7 44.4% 21.2%;
@@ -143,6 +150,7 @@
143150
--canary-indigo-200: 232.1 100% 82.2%;
144151
--canary-indigo-300: 229.2 100% 76.1%;
145152
--canary-indigo-500: 231.1 75% 57.6%;
153+
--canary-indigo-400: 229.2 100% 76.1%;
146154
--canary-indigo-600: 231.9 59.2% 51%;
147155
--canary-indigo-700: 230.2 54.5% 43.9%;
148156
--canary-indigo-800: 229 52.1% 32.7%;
@@ -167,6 +175,7 @@
167175
--canary-violet-900: 270 52.6% 14.9%;
168176
--canary-peach-50: 0 100% 98%;
169177
--canary-peach-100: 1.9 100% 93.9%;
178+
--canary-peach-150: 0.9 100% 86.7%;
170179
--canary-peach-200: 358.9 100% 78.2%;
171180
--canary-peach-700: 355.5 48.7% 37.5%;
172181
--canary-peach-850: 355.6 50.5% 21.4%;
@@ -528,7 +537,7 @@
528537

529538
/* Backgrounds */
530539
--canary-background-01: var(--canary-base-chrome-50);
531-
--canary-background-02: var(--canary-base-chrome-50);
540+
--canary-background-02: var(--canary-base-chrome-white);
532541
--canary-background-03: var(--canary-base-chrome-white);
533542
--canary-background-04: var(--canary-base-chrome-500) / 0.12;
534543
--canary-background-05: var(--canary-accent-500);
@@ -550,18 +559,18 @@
550559
/* Borders */
551560
--canary-border-01: var(--canary-base-chrome-150);
552561
--canary-border-02: var(--canary-base-chrome-150);
553-
--canary-border-03: var(--canary-base-chrome-300);
562+
--canary-border-03: var(--canary-base-chrome-500);
554563
--canary-border-04: var(--canary-base-chrome-150);
555564
--canary-border-05: var(--canary-base-chrome-150);
556565
--canary-border-06: var(--canary-base-chrome-600);
557566
--canary-border-07: var(--canary-base-chrome-white);
558567
--canary-border-08: var(--canary-base-chrome-150);
559568
--canary-border-09: var(--canary-accent-400);
560569
--canary-border-10: var(--canary-base-chrome-150);
561-
--canary-border-danger: var(--canary-red-300);
562-
--canary-border-success: var(--canary-green-300);
563-
--canary-border-accent: var(--canary-accent-300);
564-
--canary-border-alert: var(--canary-amber-400);
570+
--canary-border-danger: var(--canary-red-400);
571+
--canary-border-success: var(--canary-green-400);
572+
--canary-border-accent: var(--canary-accent-400);
573+
--canary-border-alert: var(--canary-amber-500);
565574

566575
/* Icons */
567576
--canary-icon-01: var(--canary-base-chrome-600);
@@ -585,35 +594,35 @@
585594
--canary-tag-foreground-gray-01: var(--canary-base-chrome-800);
586595
--canary-tag-border-gray-01: var(--canary-base-chrome-200);
587596
--canary-tag-background-gray-01: var(--canary-base-chrome-100);
588-
--canary-tag-background-gray-02: var(--canary-base-chrome-200);
597+
--canary-tag-background-gray-02: var(--canary-base-chrome-150);
589598
/* --purple */
590599
--canary-tag-foreground-purple-01: var(--canary-purple-700);
591-
--canary-tag-border-purple-01: var(--canary-purple-100);
600+
--canary-tag-border-purple-01: var(--canary-purple-150);
592601
--canary-tag-background-purple-01: var(--canary-purple-50);
593602
--canary-tag-background-purple-02: var(--canary-purple-100);
594603
/* --blue */
595604
--canary-tag-foreground-blue-01: var(--canary-accent-700);
596-
--canary-tag-border-blue-01: var(--canary-accent-100);
605+
--canary-tag-border-blue-01: var(--canary-accent-150);
597606
--canary-tag-background-blue-01: var(--canary-accent-50);
598607
--canary-tag-background-blue-02: var(--canary-accent-100);
599608
/* --mint */
600609
--canary-tag-foreground-mint-01: var(--canary-green-700);
601-
--canary-tag-border-mint-01: var(--canary-green-100);
610+
--canary-tag-border-mint-01: var(--canary-green-150);
602611
--canary-tag-background-mint-01: var(--canary-green-50);
603612
--canary-tag-background-mint-02: var(--canary-green-100);
604613
/* --amber */
605614
--canary-tag-foreground-amber-01: var(--canary-amber-700);
606-
--canary-tag-border-amber-01: var(--canary-amber-100);
615+
--canary-tag-border-amber-01: var(--canary-amber-150);
607616
--canary-tag-background-amber-01: var(--canary-amber-50);
608617
--canary-tag-background-amber-02: var(--canary-amber-100);
609618
/* --peach */
610619
--canary-tag-foreground-peach-01: var(--canary-peach-700);
611-
--canary-tag-border-peach-01: var(--canary-peach-100);
620+
--canary-tag-border-peach-01: var(--canary-peach-150);
612621
--canary-tag-background-peach-01: var(--canary-peach-50);
613622
--canary-tag-background-peach-02: var(--canary-peach-100);
614623
/* --red */
615624
--canary-tag-foreground-red-01: var(--canary-red-700);
616-
--canary-tag-border-red-01: var(--canary-red-100);
625+
--canary-tag-border-red-01: var(--canary-red-150);
617626
--canary-tag-background-red-01: var(--canary-red-50);
618627
--canary-tag-background-red-02: var(--canary-red-100);
619628

@@ -780,7 +789,7 @@
780789

781790
/* Backgrounds */
782791
--canary-background-01: var(--canary-base-chrome-50);
783-
--canary-background-02: var(--canary-base-chrome-50);
792+
--canary-background-02: var(--canary-base-chrome-white);
784793
--canary-background-03: var(--canary-base-chrome-white);
785794
--canary-background-04: var(--canary-base-chrome-500) / 0.12;
786795
--canary-background-05: var(--canary-accent-500);
@@ -802,18 +811,18 @@
802811
/* Borders */
803812
--canary-border-01: var(--canary-base-chrome-150);
804813
--canary-border-02: var(--canary-base-chrome-150);
805-
--canary-border-03: var(--canary-base-chrome-300);
814+
--canary-border-03: var(--canary-base-chrome-500);
806815
--canary-border-04: var(--canary-base-chrome-150);
807816
--canary-border-05: var(--canary-base-chrome-150);
808817
--canary-border-06: var(--canary-base-chrome-600);
809818
--canary-border-07: var(--canary-base-chrome-white);
810819
--canary-border-08: var(--canary-base-chrome-150);
811820
--canary-border-09: var(--canary-accent-400);
812821
--canary-border-10: var(--canary-base-chrome-150);
813-
--canary-border-danger: var(--canary-indigo-300);
814-
--canary-border-success: var(--canary-yellow-300);
815-
--canary-border-accent: var(--canary-accent-300);
816-
--canary-border-alert: var(--canary-amber-400);
822+
--canary-border-danger: var(--canary-indigo-400);
823+
--canary-border-success: var(--canary-yellow-500);
824+
--canary-border-accent: var(--canary-accent-400);
825+
--canary-border-alert: var(--canary-amber-500);
817826

818827
/* Icons */
819828
--canary-icon-01: var(--canary-base-chrome-600);
@@ -837,35 +846,35 @@
837846
--canary-tag-foreground-gray-01: var(--canary-base-chrome-800);
838847
--canary-tag-border-gray-01: var(--canary-base-chrome-200);
839848
--canary-tag-background-gray-01: var(--canary-base-chrome-100);
840-
--canary-tag-background-gray-02: var(--canary-base-chrome-200);
849+
--canary-tag-background-gray-02: var(--canary-base-chrome-150);
841850
/* --purple */
842851
--canary-tag-foreground-purple-01: var(--canary-purple-700);
843-
--canary-tag-border-purple-01: var(--canary-purple-100);
852+
--canary-tag-border-purple-01: var(--canary-purple-150);
844853
--canary-tag-background-purple-01: var(--canary-purple-50);
845854
--canary-tag-background-purple-02: var(--canary-purple-100);
846855
/* --blue */
847856
--canary-tag-foreground-blue-01: var(--canary-accent-700);
848-
--canary-tag-border-blue-01: var(--canary-accent-100);
857+
--canary-tag-border-blue-01: var(--canary-accent-150);
849858
--canary-tag-background-blue-01: var(--canary-accent-50);
850859
--canary-tag-background-blue-02: var(--canary-accent-100);
851860
/* --mint */
852861
--canary-tag-foreground-mint-01: var(--canary-yellow-700);
853-
--canary-tag-border-mint-01: var(--canary-yellow-100);
862+
--canary-tag-border-mint-01: var(--canary-yellow-150);
854863
--canary-tag-background-mint-01: var(--canary-yellow-50);
855864
--canary-tag-background-mint-02: var(--canary-yellow-100);
856865
/* --amber */
857866
--canary-tag-foreground-amber-01: var(--canary-amber-700);
858-
--canary-tag-border-amber-01: var(--canary-amber-100);
867+
--canary-tag-border-amber-01: var(--canary-amber-150);
859868
--canary-tag-background-amber-01: var(--canary-amber-50);
860869
--canary-tag-background-amber-02: var(--canary-amber-100);
861870
/* --peach */
862871
--canary-tag-foreground-peach-01: var(--canary-peach-700);
863-
--canary-tag-border-peach-01: var(--canary-peach-100);
872+
--canary-tag-border-peach-01: var(--canary-peach-150);
864873
--canary-tag-background-peach-01: var(--canary-peach-50);
865874
--canary-tag-background-peach-02: var(--canary-peach-100);
866875
/* --red */
867876
--canary-tag-foreground-red-01: var(--canary-indigo-700);
868-
--canary-tag-border-red-01: var(--canary-indigo-100);
877+
--canary-tag-border-red-01: var(--canary-indigo-150);
869878
--canary-tag-background-red-01: var(--canary-indigo-50);
870879
--canary-tag-background-red-02: var(--canary-indigo-100);
871880

@@ -1229,13 +1238,13 @@
12291238

12301239
/* Backgrounds */
12311240
--canary-background-01: var(--canary-base-chrome-black);
1232-
--canary-background-02: var(--canary-base-chrome-900);
1241+
--canary-background-02: var(--canary-base-chrome-950);
12331242
--canary-background-03: var(--canary-base-chrome-950);
12341243
--canary-background-04: var(--canary-base-chrome-850) / 0.5;
12351244
--canary-background-05: var(--canary-accent-600);
12361245
--canary-background-06: var(--canary-accent-600) / 0.2;
12371246
--canary-background-07: var(--canary-base-chrome-black);
1238-
--canary-background-08: var(--canary-base-chrome-850);
1247+
--canary-background-08: var(--canary-base-chrome-900);
12391248
--canary-background-09: var(--canary-base-chrome-850);
12401249
--canary-background-10: var(--canary-accent-500);
12411250
--canary-background-11: var(--canary-base-chrome-800);
@@ -1251,18 +1260,18 @@
12511260
/* Borders */
12521261
--canary-border-01: var(--canary-base-chrome-850);
12531262
--canary-border-02: var(--canary-base-chrome-850);
1254-
--canary-border-03: var(--canary-base-chrome-500);
1255-
--canary-border-04: var(--canary-base-chrome-900);
1263+
--canary-border-03: var(--canary-base-chrome-400);
1264+
--canary-border-04: var(--canary-base-chrome-850);
12561265
--canary-border-05: var(--canary-base-chrome-850);
12571266
--canary-border-06: var(--canary-base-chrome-400);
12581267
--canary-border-07: var(--canary-base-chrome-white);
12591268
--canary-border-08: var(--canary-base-chrome-850);
12601269
--canary-border-09: var(--canary-accent-300);
12611270
--canary-border-10: var(--canary-base-chrome-850);
1262-
--canary-border-danger: var(--canary-red-700);
1263-
--canary-border-success: var(--canary-green-600);
1271+
--canary-border-danger: var(--canary-red-300);
1272+
--canary-border-success: var(--canary-green-300);
12641273
--canary-border-accent: var(--canary-accent-500);
1265-
--canary-border-alert: var(--canary-amber-700);
1274+
--canary-border-alert: var(--canary-amber-400);
12661275

12671276
/* Icons */
12681277
--canary-icon-01: var(--canary-base-chrome-400);
@@ -1476,13 +1485,13 @@
14761485

14771486
/* Backgrounds */
14781487
--canary-background-01: var(--canary-base-chrome-black);
1479-
--canary-background-02: var(--canary-base-chrome-900);
1488+
--canary-background-02: var(--canary-base-chrome-950);
14801489
--canary-background-03: var(--canary-base-chrome-950);
14811490
--canary-background-04: var(--canary-base-chrome-850) / 0.5;
14821491
--canary-background-05: var(--canary-accent-600);
14831492
--canary-background-06: var(--canary-accent-600) / 0.2;
14841493
--canary-background-07: var(--canary-base-chrome-black);
1485-
--canary-background-08: var(--canary-base-chrome-850);
1494+
--canary-background-08: var(--canary-base-chrome-900);
14861495
--canary-background-09: var(--canary-base-chrome-850);
14871496
--canary-background-10: var(--canary-accent-600);
14881497
--canary-background-11: var(--canary-base-chrome-800);
@@ -1498,18 +1507,18 @@
14981507
/* Borders */
14991508
--canary-border-01: var(--canary-base-chrome-850);
15001509
--canary-border-02: var(--canary-base-chrome-850);
1501-
--canary-border-03: var(--canary-base-chrome-500);
1502-
--canary-border-04: var(--canary-base-chrome-900);
1510+
--canary-border-03: var(--canary-base-chrome-400);
1511+
--canary-border-04: var(--canary-base-chrome-850);
15031512
--canary-border-05: var(--canary-base-chrome-850);
15041513
--canary-border-06: var(--canary-base-chrome-400);
15051514
--canary-border-07: var(--canary-base-chrome-white);
15061515
--canary-border-08: var(--canary-base-chrome-850);
15071516
--canary-border-09: var(--canary-accent-300);
15081517
--canary-border-10: var(--canary-base-chrome-850);
1509-
--canary-border-danger: var(--canary-indigo-700);
1510-
--canary-border-success: var(--canary-yellow-600);
1518+
--canary-border-danger: var(--canary-indigo-300);
1519+
--canary-border-success: var(--canary-yellow-400);
15111520
--canary-border-accent: var(--canary-accent-500);
1512-
--canary-border-alert: var(--canary-amber-700);
1521+
--canary-border-alert: var(--canary-amber-400);
15131522

15141523
/* Icons */
15151524
--canary-icon-01: var(--canary-base-chrome-400);

0 commit comments

Comments
 (0)