@drivy/cobalt 1.5.0 → 2.0.0-beta.2

package/styles/core/palette.css

@@ -3,122 +3,245 @@
 /*** DO NOT MODIFY IT DIRECTLY ****/
 /**********************************/
 :root {
-  --c-white: #ffffff;
-  --c-purple-100: #f8f2f8;
+  --c-grey-100: #ffffff;
+  --c-grey-200: #f1f1f1;
+  --c-grey-300: #e3e3e3;
+  --c-grey-400: #d5d5d5;
+  --c-grey-500: #c7c6c7;
+  --c-grey-600: #bab8ba;
+  --c-grey-700: #acaaac;
+  --c-grey-800: #9f9b9f;
+  --c-grey-900: #918d91;
+  --c-grey-1000: #858185;
+  --c-grey-1100: #797579;
+  --c-grey-1200: #6d6a6d;
+  --c-grey-1300: #615e61;
+  --c-grey-1400: #555355;
+  --c-grey-1500: #494749;
+  --c-grey-1600: #3d3c3d;
+  --c-black-100: #4d4c4c;
+  --c-black-200: #4a4949;
+  --c-black-300: #464545;
+  --c-black-400: #434242;
+  --c-black-500: #403e3f;
+  --c-black-600: #3c3b3b;
+  --c-black-700: #393738;
+  --c-black-800: #353435;
+  --c-black-900: #323131;
+  --c-black-1000: #2f2d2e;
+  --c-black-1100: #2b2a2b;
+  --c-black-1200: #282627;
+  --c-black-1300: #242324;
+  --c-black-1400: #212021;
+  --c-black-1500: #1d1c1d;
+  --c-black-1600: #1a191a;
+  --c-navy-100: #f1f1f4;
+  --c-navy-200: #dadae3;
+  --c-navy-300: #c4c3d3;
+  --c-navy-400: #acabc4;
+  --c-navy-500: #9592b5;
+  --c-navy-600: #7e78a7;
+  --c-navy-700: #675f98;
+  --c-navy-800: #574e82;
+  --c-navy-900: #463e6b;
+  --c-navy-1000: #362e53;
+  --c-navy-1100: #302652;
+  --c-navy-1200: #2b1f51;
+  --c-navy-1300: #25194f;
+  --c-navy-1400: #21134d;
+  --c-navy-1500: #1c0e49;
+  --c-navy-1600: #180a46;
+  --c-purple-100: #f4f1f4;
   --c-purple-200: #f0e1ee;
-  --c-purple-300: #db97d5;
-  --c-purple-400: #d54ac8;
-  --c-purple-500: #b01aa7;
-  --c-purple-600: #a6199d;
-  --c-purple-700: #901588;
-  --c-purple-800: #75116f;
-  --c-purple-900: #530c4f;
-  --c-purple-1000: #3e093b;
-  --c-purple-1100: #280626;
-  --c-purple-1200: #160315;
-  --c-navy-50: #f1f1f4;
-  --c-navy-100: #e3e2e8;
-  --c-navy-120: #cac7d2;
-  --c-navy-200: #bbb8c7;
-  --c-navy-300: #7b728e;
-  --c-navy-400: #554b70;
-  --c-navy-500: #362e53;
-  --c-navy-700: #261a48;
-  --c-navy-900: #0f0429;
-  --c-yellow-100: #ffeed1;
-  --c-yellow-300: #ffdda3;
-  --c-yellow-400: #ffd387;
-  --c-yellow-500: #ffc766;
-  --c-yellow-700: #c59548;
-  --c-yellow-900: #75592d;
-  --c-yellow-1000: #3b2e17;
-  --c-green-100: #f4f9f3;
-  --c-green-200: #e5f2e4;
-  --c-green-300: #c8e5c6;
-  --c-green-400: #93d790;
-  --c-green-500: #5cbf54;
-  --c-green-700: #479d3e;
-  --c-green-900: #2f6d1c;
-  --c-green-1000: #1b500a;
-  --c-green-1100: #143b05;
-  --c-green-1200: #102e03;
-  --c-red-100: #fdeded;
-  --c-red-120: #f7e9e9;
-  --c-red-150: #eed0d0;
-  --c-red-200: #e5b5b5;
-  --c-red-300: #db9494;
-  --c-red-400: #d16969;
-  --c-red-500: #c71414;
-  --c-red-600: #b61212;
-  --c-red-700: #a21010;
-  --c-red-800: #8d0e0e;
-  --c-red-900: #730c0c;
-  --c-red-1000: #510808;
-  --c-red-1200: #4a0707;
-  --c-red-1300: #420707;
-  --c-red-1400: #390606;
-  --c-red-1500: #2f0505;
-  --c-red-1600: #210303;
-  --c-orange-100: #f1d5b1;
-  --c-orange-300: #eec186;
-  --c-orange-500: #e39735;
-  --c-orange-900: #462e0c;
-  --c-black-50: #544f53;
-  --c-black-75: #443f44;
-  --c-black-100: #363036;
-  --c-black-200: #2e292e;
-  --c-black-300: #282127;
-  --c-black-400: #251d24;
-  --c-black-500: #191218;
-  --c-black-600: #0f0a0e;
-  --c-black-700: #090609;
-  --c-black-800: #030203;
-  --c-black-1000: #000000;
-  --c-grey-50: #f8f9fa;
-  --c-grey-100: #e3e2e3;
-  --c-grey-200: #c3c1c3;
-  --c-grey-300: #a9a6a9;
-  --c-grey-400: #9d9a9d;
-  --c-grey-500: #918d91;
-  --c-grey-600: #7d787d;
-  --c-grey-700: #6a676a;
+  --c-purple-300: #e1b4e2;
+  --c-purple-400: #dd9ce0;
+  --c-purple-500: #db82df;
+  --c-purple-600: #db66e0;
+  --c-purple-700: #db48e3;
+  --c-purple-800: #dd28e9;
+  --c-purple-900: #d90ee8;
+  --c-purple-1000: #c705d7;
+  --c-purple-1100: #bc00cc;
+  --c-purple-1200: #920e9d;
+  --c-purple-1300: #77157f;
+  --c-purple-1400: #5e1964;
+  --c-purple-1500: #481a4c;
+  --c-purple-1600: #341936;
+  --c-violet-100: #efe9fb;
+  --c-violet-200: #dcccf7;
+  --c-violet-300: #cbaef4;
+  --c-violet-400: #bc8ff3;
+  --c-violet-500: #ae6ff3;
+  --c-violet-600: #a34df4;
+  --c-violet-700: #9b2bf6;
+  --c-violet-800: #9606f9;
+  --c-violet-900: #8c01de;
+  --c-violet-1000: #7c01c5;
+  --c-violet-1100: #6b01ab;
+  --c-violet-1200: #5b0092;
+  --c-violet-1300: #4b0078;
+  --c-violet-1400: #3b005f;
+  --c-violet-1500: #2b0045;
+  --c-violet-1600: #1b002c;
   --c-blue-100: #f5f8ff;
-  --c-blue-200: #e5edff;
-  --c-blue-300: #b7d3ff;
-  --c-blue-400: #74b0ff;
-  --c-blue-500: #1f81f3;
-  --c-blue-600: #185bd1;
-  --c-blue-700: #1b3b8b;
-  --c-blue-800: #19255c;
-  --c-blue-900: #151c38;
-  --c-blue-1000: #101423;
-  --c-blue-1100: #0d1016;
-  --c-blue-1200: #0a0b0f;
-  --c-turquoise-50: #ecf9fb;
-  --c-turquoise-100: #cfeff5;
-  --c-turquoise-200: #afe5ee;
-  --c-turquoise-300: #8edbe7;
-  --c-turquoise-400: #76d3e2;
-  --c-turquoise-500: #5ecbdd;
-  --c-turquoise-600: #56c6d9;
-  --c-turquoise-700: #4cbed4;
-  --c-turquoise-800: #42b8cf;
-  --c-turquoise-900: #31acc7;
-  --c-turquoise-1200: #11505e;
-  --c-season-100: #a9d4a8;
-  --c-season-200: #9fd09e;
-  --c-season-300: #7cc27b;
-  --c-season-400: #56b654;
-  --c-season-500: #24aa1f;
-  --c-season-600: #229f1c;
-  --c-season-700: #1f931a;
-  --c-season-800: #1d8618;
-  --c-season-900: #1a7816;
-  --c-season-1000: #166612;
-  --c-season-1100: #11510f;
-  --c-season-1200: #0a3109;
-  --c-newPurple-200: #e46fee;
-  --c-newPurple-500: #bc00cc;
-  --c-newViolet-200: #b86fff;
-  --c-newViolet-500: #6c06b5;
+  --c-blue-200: #d9e5ff;
+  --c-blue-300: #bdd3fe;
+  --c-blue-400: #a2c3fd;
+  --c-blue-500: #87b4fc;
+  --c-blue-600: #6da5fa;
+  --c-blue-700: #5298f8;
+  --c-blue-800: #388cf6;
+  --c-blue-900: #1f81f3;
+  --c-blue-1000: #176cdc;
+  --c-blue-1100: #1d5ab6;
+  --c-blue-1200: #214b94;
+  --c-blue-1300: #223d74;
+  --c-blue-1400: #203057;
+  --c-blue-1500: #1b243c;
+  --c-blue-1600: #141824;
+  --c-lime-100: #f8fec5;
+  --c-lime-200: #f4fca1;
+  --c-lime-300: #f0fa85;
+  --c-lime-400: #ebf669;
+  --c-lime-500: #e6f24f;
+  --c-lime-600: #e1ed35;
+  --c-lime-700: #dbe71b;
+  --c-lime-800: #c2cb18;
+  --c-lime-900: #a6ad18;
+  --c-lime-1000: #8c9219;
+  --c-lime-1100: #75791d;
+  --c-lime-1200: #60631e;
+  --c-lime-1300: #4c4e1e;
+  --c-lime-1400: #3a3b1c;
+  --c-lime-1500: #292a18;
+  --c-lime-1600: #1a1b12;
+  --c-orange-100: #f1beb1;
+  --c-orange-200: #eeaf9b;
+  --c-orange-300: #eca185;
+  --c-orange-400: #eb956e;
+  --c-orange-500: #e98957;
+  --c-orange-600: #e97f3f;
+  --c-orange-700: #e87727;
+  --c-orange-800: #d76a14;
+  --c-orange-900: #cc6212;
+  --c-orange-1000: #b65410;
+  --c-orange-1100: #9f470d;
+  --c-orange-1200: #893b0b;
+  --c-orange-1300: #722f09;
+  --c-orange-1400: #5b2407;
+  --c-orange-1500: #441905;
+  --c-orange-1600: #2d1003;
+  --c-red-100: #fef0f0;
+  --c-red-200: #fcd3d3;
+  --c-red-300: #fab7b7;
+  --c-red-400: #f79b9b;
+  --c-red-500: #f57f7f;
+  --c-red-600: #f26363;
+  --c-red-700: #ef4848;
+  --c-red-800: #eb2d2d;
+  --c-red-900: #e41616;
+  --c-red-1000: #c71414;
+  --c-red-1100: #ab1616;
+  --c-red-1200: #901717;
+  --c-red-1300: #771616;
+  --c-red-1400: #5e1515;
+  --c-red-1500: #471212;
+  --c-red-1600: #310e0e;
+  --c-green-100: #f3fbef;
+  --c-green-200: #e0f4d7;
+  --c-green-300: #cbedc0;
+  --c-green-400: #b6e5a9;
+  --c-green-500: #a0dd93;
+  --c-green-600: #8ad37d;
+  --c-green-700: #73c968;
+  --c-green-800: #5cbf54;
+  --c-green-900: #49b142;
+  --c-green-1000: #3e9939;
+  --c-green-1100: #348230;
+  --c-green-1200: #2a6a27;
+  --c-green-1300: #20521e;
+  --c-green-1400: #163b15;
+  --c-green-1500: #0d230d;
+  --c-green-1600: #040b04;
+  --c-yellow-100: #fffcf7;
+  --c-yellow-200: #fff4e2;
+  --c-yellow-300: #ffedce;
+  --c-yellow-400: #ffe5b9;
+  --c-yellow-500: #ffdda4;
+  --c-yellow-600: #ffd68f;
+  --c-yellow-700: #ffce7b;
+  --c-yellow-800: #ffc766;
+  --c-yellow-900: #f9ba4c;
+  --c-yellow-1000: #f0ad35;
+  --c-yellow-1100: #e59e20;
+  --c-yellow-1200: #c68b1f;
+  --c-yellow-1300: #a47622;
+  --c-yellow-1400: #846122;
+  --c-yellow-1500: #664d20;
+  --c-yellow-1600: #4a3a1c;
+  --c-white: #ffffff;
+  --c-white_alpha-5: #ffffff0d;
+  --c-white_alpha-10: #ffffff1a;
+  --c-white_alpha-15: #ffffff26;
+  --c-white_alpha-20: #ffffff33;
+  --c-white_alpha-25: #ffffff40;
+  --c-white_alpha-30: #ffffff4d;
+  --c-white_alpha-35: #ffffff59;
+  --c-white_alpha-40: #ffffff66;
+  --c-white_alpha-45: #ffffff73;
+  --c-white_alpha-50: #ffffff80;
+  --c-white_alpha-55: #ffffff8c;
+  --c-white_alpha-60: #ffffff99;
+  --c-white_alpha-65: #ffffffa6;
+  --c-white_alpha-70: #ffffffb3;
+  --c-black_alpha-2: #00000005;
+  --c-black_alpha-4: #0000000a;
+  --c-black_alpha-6: #0000000f;
+  --c-black_alpha-8: #00000014;
+  --c-black_alpha-10: #0000001a;
+  --c-black_alpha-12: #0000001f;
+  --c-black_alpha-14: #00000024;
+  --c-black_alpha-16: #00000029;
+  --c-black_alpha-18: #0000002e;
+  --c-black_alpha-20: #00000033;
+  --c-black_alpha-22: #00000038;
+  --c-black_alpha-24: #0000003d;
+  --c-black_alpha-26: #00000042;
+  --c-black_alpha-28: #00000047;
+  --c-black_alpha-30: #0000004d;
+  --c-black_alpha-32: #00000052;
+  --c-black_alpha-34: #00000057;
+  --c-navy_alpha-1: #30265203;
+  --c-navy_alpha-2: #30265205;
+  --c-navy_alpha-3: #30265208;
+  --c-navy_alpha-4: #3026520a;
+  --c-navy_alpha-5: #3026520d;
+  --c-navy_alpha-6: #3026520f;
+  --c-navy_alpha-7: #30265212;
+  --c-navy_alpha-8: #30265214;
+  --c-navy_alpha-9: #30265217;
+  --c-navy_alpha-10: #3026521a;
+  --c-navy_alpha-12: #3026521f;
+  --c-navy_alpha-14: #30265224;
+  --c-navy_alpha-16: #30265229;
+  --c-navy_alpha-18: #3026522e;
+  --c-navy_alpha-20: #30265233;
+  --c-navy_alpha-22: #30265238;
+  --c-navy_alpha-24: #3026523d;
+  --c-navy_alpha-26: #30265242;
+  --c-navy_alpha-28: #30265247;
+  --c-navy_alpha-30: #3026524d;
+  --c-grey_alpha-1: #e3e3e303;
+  --c-grey_alpha-2: #e3e3e305;
+  --c-grey_alpha-3: #e3e3e308;
+  --c-grey_alpha-4: #e3e3e30a;
+  --c-grey_alpha-5: #e3e3e30d;
+  --c-grey_alpha-6: #e3e3e30f;
+  --c-grey_alpha-7: #e3e3e312;
+  --c-grey_alpha-8: #e3e3e314;
+  --c-grey_alpha-9: #e3e3e317;
+  --c-grey_alpha-10: #e3e3e31a;
+  --c-grey_alpha-15: #e3e3e326;
+  --c-grey_alpha-20: #e3e3e333;
+  --c-grey_alpha-25: #e3e3e340;
 }

package/styles/core/text.scss

@@ -106,12 +106,12 @@
   font-weight: 700;
   line-height: 175%;
   text-transform: uppercase;
-  color: var(--c-text-subdued);
+  color: var(--c-onSurfaceVariant);
   letter-spacing: -0.2px;
 }
 
 @mixin c-text-link {
-  @apply c-text-base;
+  @apply c-text-onSurface;
   text-decoration: underline;
   font-weight: 500;
   text-underline-offset: 2px;