Skip to content

Commit 9c5dcb1

Browse files
cxraminaandrewgolovanov
cxramina
authored and
andrewgolovanov
committed
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 5ef323e commit 9c5dcb1

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%;
@@ -529,7 +538,7 @@
529538

530539
/* Backgrounds */
531540
--canary-background-01: var(--canary-base-chrome-50);
532-
--canary-background-02: var(--canary-base-chrome-50);
541+
--canary-background-02: var(--canary-base-chrome-white);
533542
--canary-background-03: var(--canary-base-chrome-white);
534543
--canary-background-04: var(--canary-base-chrome-500) / 0.12;
535544
--canary-background-05: var(--canary-accent-500);
@@ -551,18 +560,18 @@
551560
/* Borders */
552561
--canary-border-01: var(--canary-base-chrome-150);
553562
--canary-border-02: var(--canary-base-chrome-150);
554-
--canary-border-03: var(--canary-base-chrome-300);
563+
--canary-border-03: var(--canary-base-chrome-500);
555564
--canary-border-04: var(--canary-base-chrome-150);
556565
--canary-border-05: var(--canary-base-chrome-150);
557566
--canary-border-06: var(--canary-base-chrome-600);
558567
--canary-border-07: var(--canary-base-chrome-white);
559568
--canary-border-08: var(--canary-base-chrome-150);
560569
--canary-border-09: var(--canary-accent-400);
561570
--canary-border-10: var(--canary-base-chrome-150);
562-
--canary-border-danger: var(--canary-red-300);
563-
--canary-border-success: var(--canary-green-300);
564-
--canary-border-accent: var(--canary-accent-300);
565-
--canary-border-alert: var(--canary-amber-400);
571+
--canary-border-danger: var(--canary-red-400);
572+
--canary-border-success: var(--canary-green-400);
573+
--canary-border-accent: var(--canary-accent-400);
574+
--canary-border-alert: var(--canary-amber-500);
566575

567576
/* Icons */
568577
--canary-icon-01: var(--canary-base-chrome-600);
@@ -586,35 +595,35 @@
586595
--canary-tag-foreground-gray-01: var(--canary-base-chrome-800);
587596
--canary-tag-border-gray-01: var(--canary-base-chrome-200);
588597
--canary-tag-background-gray-01: var(--canary-base-chrome-100);
589-
--canary-tag-background-gray-02: var(--canary-base-chrome-200);
598+
--canary-tag-background-gray-02: var(--canary-base-chrome-150);
590599
/* --purple */
591600
--canary-tag-foreground-purple-01: var(--canary-purple-700);
592-
--canary-tag-border-purple-01: var(--canary-purple-100);
601+
--canary-tag-border-purple-01: var(--canary-purple-150);
593602
--canary-tag-background-purple-01: var(--canary-purple-50);
594603
--canary-tag-background-purple-02: var(--canary-purple-100);
595604
/* --blue */
596605
--canary-tag-foreground-blue-01: var(--canary-accent-700);
597-
--canary-tag-border-blue-01: var(--canary-accent-100);
606+
--canary-tag-border-blue-01: var(--canary-accent-150);
598607
--canary-tag-background-blue-01: var(--canary-accent-50);
599608
--canary-tag-background-blue-02: var(--canary-accent-100);
600609
/* --mint */
601610
--canary-tag-foreground-mint-01: var(--canary-green-700);
602-
--canary-tag-border-mint-01: var(--canary-green-100);
611+
--canary-tag-border-mint-01: var(--canary-green-150);
603612
--canary-tag-background-mint-01: var(--canary-green-50);
604613
--canary-tag-background-mint-02: var(--canary-green-100);
605614
/* --amber */
606615
--canary-tag-foreground-amber-01: var(--canary-amber-700);
607-
--canary-tag-border-amber-01: var(--canary-amber-100);
616+
--canary-tag-border-amber-01: var(--canary-amber-150);
608617
--canary-tag-background-amber-01: var(--canary-amber-50);
609618
--canary-tag-background-amber-02: var(--canary-amber-100);
610619
/* --peach */
611620
--canary-tag-foreground-peach-01: var(--canary-peach-700);
612-
--canary-tag-border-peach-01: var(--canary-peach-100);
621+
--canary-tag-border-peach-01: var(--canary-peach-150);
613622
--canary-tag-background-peach-01: var(--canary-peach-50);
614623
--canary-tag-background-peach-02: var(--canary-peach-100);
615624
/* --red */
616625
--canary-tag-foreground-red-01: var(--canary-red-700);
617-
--canary-tag-border-red-01: var(--canary-red-100);
626+
--canary-tag-border-red-01: var(--canary-red-150);
618627
--canary-tag-background-red-01: var(--canary-red-50);
619628
--canary-tag-background-red-02: var(--canary-red-100);
620629

@@ -782,7 +791,7 @@
782791

783792
/* Backgrounds */
784793
--canary-background-01: var(--canary-base-chrome-50);
785-
--canary-background-02: var(--canary-base-chrome-50);
794+
--canary-background-02: var(--canary-base-chrome-white);
786795
--canary-background-03: var(--canary-base-chrome-white);
787796
--canary-background-04: var(--canary-base-chrome-500) / 0.12;
788797
--canary-background-05: var(--canary-accent-500);
@@ -804,18 +813,18 @@
804813
/* Borders */
805814
--canary-border-01: var(--canary-base-chrome-150);
806815
--canary-border-02: var(--canary-base-chrome-150);
807-
--canary-border-03: var(--canary-base-chrome-300);
816+
--canary-border-03: var(--canary-base-chrome-500);
808817
--canary-border-04: var(--canary-base-chrome-150);
809818
--canary-border-05: var(--canary-base-chrome-150);
810819
--canary-border-06: var(--canary-base-chrome-600);
811820
--canary-border-07: var(--canary-base-chrome-white);
812821
--canary-border-08: var(--canary-base-chrome-150);
813822
--canary-border-09: var(--canary-accent-400);
814823
--canary-border-10: var(--canary-base-chrome-150);
815-
--canary-border-danger: var(--canary-indigo-300);
816-
--canary-border-success: var(--canary-yellow-300);
817-
--canary-border-accent: var(--canary-accent-300);
818-
--canary-border-alert: var(--canary-amber-400);
824+
--canary-border-danger: var(--canary-indigo-400);
825+
--canary-border-success: var(--canary-yellow-500);
826+
--canary-border-accent: var(--canary-accent-400);
827+
--canary-border-alert: var(--canary-amber-500);
819828

820829
/* Icons */
821830
--canary-icon-01: var(--canary-base-chrome-600);
@@ -839,35 +848,35 @@
839848
--canary-tag-foreground-gray-01: var(--canary-base-chrome-800);
840849
--canary-tag-border-gray-01: var(--canary-base-chrome-200);
841850
--canary-tag-background-gray-01: var(--canary-base-chrome-100);
842-
--canary-tag-background-gray-02: var(--canary-base-chrome-200);
851+
--canary-tag-background-gray-02: var(--canary-base-chrome-150);
843852
/* --purple */
844853
--canary-tag-foreground-purple-01: var(--canary-purple-700);
845-
--canary-tag-border-purple-01: var(--canary-purple-100);
854+
--canary-tag-border-purple-01: var(--canary-purple-150);
846855
--canary-tag-background-purple-01: var(--canary-purple-50);
847856
--canary-tag-background-purple-02: var(--canary-purple-100);
848857
/* --blue */
849858
--canary-tag-foreground-blue-01: var(--canary-accent-700);
850-
--canary-tag-border-blue-01: var(--canary-accent-100);
859+
--canary-tag-border-blue-01: var(--canary-accent-150);
851860
--canary-tag-background-blue-01: var(--canary-accent-50);
852861
--canary-tag-background-blue-02: var(--canary-accent-100);
853862
/* --mint */
854863
--canary-tag-foreground-mint-01: var(--canary-yellow-700);
855-
--canary-tag-border-mint-01: var(--canary-yellow-100);
864+
--canary-tag-border-mint-01: var(--canary-yellow-150);
856865
--canary-tag-background-mint-01: var(--canary-yellow-50);
857866
--canary-tag-background-mint-02: var(--canary-yellow-100);
858867
/* --amber */
859868
--canary-tag-foreground-amber-01: var(--canary-amber-700);
860-
--canary-tag-border-amber-01: var(--canary-amber-100);
869+
--canary-tag-border-amber-01: var(--canary-amber-150);
861870
--canary-tag-background-amber-01: var(--canary-amber-50);
862871
--canary-tag-background-amber-02: var(--canary-amber-100);
863872
/* --peach */
864873
--canary-tag-foreground-peach-01: var(--canary-peach-700);
865-
--canary-tag-border-peach-01: var(--canary-peach-100);
874+
--canary-tag-border-peach-01: var(--canary-peach-150);
866875
--canary-tag-background-peach-01: var(--canary-peach-50);
867876
--canary-tag-background-peach-02: var(--canary-peach-100);
868877
/* --red */
869878
--canary-tag-foreground-red-01: var(--canary-indigo-700);
870-
--canary-tag-border-red-01: var(--canary-indigo-100);
879+
--canary-tag-border-red-01: var(--canary-indigo-150);
871880
--canary-tag-background-red-01: var(--canary-indigo-50);
872881
--canary-tag-background-red-02: var(--canary-indigo-100);
873882

@@ -1237,13 +1246,13 @@
12371246

12381247
/* Backgrounds */
12391248
--canary-background-01: var(--canary-base-chrome-black);
1240-
--canary-background-02: var(--canary-base-chrome-900);
1249+
--canary-background-02: var(--canary-base-chrome-950);
12411250
--canary-background-03: var(--canary-base-chrome-950);
12421251
--canary-background-04: var(--canary-base-chrome-850) / 0.5;
12431252
--canary-background-05: var(--canary-accent-600);
12441253
--canary-background-06: var(--canary-accent-600) / 0.2;
12451254
--canary-background-07: var(--canary-base-chrome-black);
1246-
--canary-background-08: var(--canary-base-chrome-850);
1255+
--canary-background-08: var(--canary-base-chrome-900);
12471256
--canary-background-09: var(--canary-base-chrome-850);
12481257
--canary-background-10: var(--canary-accent-500);
12491258
--canary-background-11: var(--canary-base-chrome-800);
@@ -1259,18 +1268,18 @@
12591268
/* Borders */
12601269
--canary-border-01: var(--canary-base-chrome-850);
12611270
--canary-border-02: var(--canary-base-chrome-850);
1262-
--canary-border-03: var(--canary-base-chrome-500);
1263-
--canary-border-04: var(--canary-base-chrome-900);
1271+
--canary-border-03: var(--canary-base-chrome-400);
1272+
--canary-border-04: var(--canary-base-chrome-850);
12641273
--canary-border-05: var(--canary-base-chrome-850);
12651274
--canary-border-06: var(--canary-base-chrome-400);
12661275
--canary-border-07: var(--canary-base-chrome-white);
12671276
--canary-border-08: var(--canary-base-chrome-850);
12681277
--canary-border-09: var(--canary-accent-300);
12691278
--canary-border-10: var(--canary-base-chrome-850);
1270-
--canary-border-danger: var(--canary-red-700);
1271-
--canary-border-success: var(--canary-green-600);
1279+
--canary-border-danger: var(--canary-red-300);
1280+
--canary-border-success: var(--canary-green-300);
12721281
--canary-border-accent: var(--canary-accent-500);
1273-
--canary-border-alert: var(--canary-amber-700);
1282+
--canary-border-alert: var(--canary-amber-400);
12741283

12751284
/* Icons */
12761285
--canary-icon-01: var(--canary-base-chrome-400);
@@ -1487,13 +1496,13 @@
14871496

14881497
/* Backgrounds */
14891498
--canary-background-01: var(--canary-base-chrome-black);
1490-
--canary-background-02: var(--canary-base-chrome-900);
1499+
--canary-background-02: var(--canary-base-chrome-950);
14911500
--canary-background-03: var(--canary-base-chrome-950);
14921501
--canary-background-04: var(--canary-base-chrome-850) / 0.5;
14931502
--canary-background-05: var(--canary-accent-600);
14941503
--canary-background-06: var(--canary-accent-600) / 0.2;
14951504
--canary-background-07: var(--canary-base-chrome-black);
1496-
--canary-background-08: var(--canary-base-chrome-850);
1505+
--canary-background-08: var(--canary-base-chrome-900);
14971506
--canary-background-09: var(--canary-base-chrome-850);
14981507
--canary-background-10: var(--canary-accent-600);
14991508
--canary-background-11: var(--canary-base-chrome-800);
@@ -1509,18 +1518,18 @@
15091518
/* Borders */
15101519
--canary-border-01: var(--canary-base-chrome-850);
15111520
--canary-border-02: var(--canary-base-chrome-850);
1512-
--canary-border-03: var(--canary-base-chrome-500);
1513-
--canary-border-04: var(--canary-base-chrome-900);
1521+
--canary-border-03: var(--canary-base-chrome-400);
1522+
--canary-border-04: var(--canary-base-chrome-850);
15141523
--canary-border-05: var(--canary-base-chrome-850);
15151524
--canary-border-06: var(--canary-base-chrome-400);
15161525
--canary-border-07: var(--canary-base-chrome-white);
15171526
--canary-border-08: var(--canary-base-chrome-850);
15181527
--canary-border-09: var(--canary-accent-300);
15191528
--canary-border-10: var(--canary-base-chrome-850);
1520-
--canary-border-danger: var(--canary-indigo-700);
1521-
--canary-border-success: var(--canary-yellow-600);
1529+
--canary-border-danger: var(--canary-indigo-300);
1530+
--canary-border-success: var(--canary-yellow-400);
15221531
--canary-border-accent: var(--canary-accent-500);
1523-
--canary-border-alert: var(--canary-amber-700);
1532+
--canary-border-alert: var(--canary-amber-400);
15241533

15251534
/* Icons */
15261535
--canary-icon-01: var(--canary-base-chrome-400);

0 commit comments

Comments
 (0)