@phila/phila-ui-core 2.1.1 → 2.2.0-beta.2

package/dist/styles/generated/primitives.css

@@ -0,0 +1,293 @@
+:root {
+  /* primitives */
+  /* Generated from Figma CSS export - references preserved */
+
+  --bell-yellow-100-bell-yellow: rgb(97, 79, 8);
+  --bell-yellow-150-bell-yellow: rgb(120, 99, 10);
+  --bell-yellow-200-bell-yellow: rgb(145, 120, 10);
+  --bell-yellow-250-bell-yellow: rgb(168, 140, 13);
+  --bell-yellow-300-bell-yellow: rgb(194, 158, 13);
+  --bell-yellow-350-bell-yellow: rgb(217, 179, 15);
+  --bell-yellow-400-bell-yellow: var(--colors-Bell-Yellow);
+  --bell-yellow-450-bell-yellow: rgb(242, 217, 89);
+  --bell-yellow-50-bell-yellow: rgb(71, 59, 5);
+  --bell-yellow-500-bell-yellow: rgb(245, 224, 112);
+  --bell-yellow-550-bell-yellow: rgb(245, 227, 138);
+  --bell-yellow-600-bell-yellow: rgb(247, 232, 161);
+  --bell-yellow-650-bell-yellow: rgb(250, 240, 184);
+  --bell-yellow-700-bell-yellow: rgb(250, 245, 209);
+  --bell-yellow-750-bell-yellow: rgb(252, 250, 232);
+  --black-100-black: rgb(0, 0, 0);
+  --black-150-black: rgb(0, 0, 0);
+  --black-200-black: rgb(0, 0, 0);
+  --black-250-black: rgb(0, 0, 0);
+  --black-300-black: rgb(0, 0, 0);
+  --black-350-black: rgb(0, 0, 0);
+  --black-400-black: var(--colors-Black);
+  --black-450-black: rgb(77, 77, 77);
+  --black-50-black: rgb(0, 0, 0);
+  --black-500-black: rgb(102, 102, 102);
+  --black-550-black: rgb(128, 128, 128);
+  --black-600-black: rgb(153, 153, 153);
+  --black-650-black: rgb(179, 179, 179);
+  --black-700-black: rgb(204, 204, 204);
+  --black-750-black: rgb(230, 230, 230);
+  --blue-100-blue: rgb(3, 15, 97);
+  --blue-150-blue: rgb(5, 20, 122);
+  --blue-200-blue: rgb(8, 26, 148);
+  --blue-250-blue: rgb(10, 31, 173);
+  --blue-300-blue: rgb(10, 38, 196);
+  --blue-350-blue: rgb(13, 46, 222);
+  --blue-400-blue: var(--colors-Blue);
+  --blue-450-blue: rgb(87, 112, 250);
+  --blue-50-blue: rgb(0, 10, 74);
+  --blue-500-blue: rgb(112, 133, 250);
+  --blue-550-blue: rgb(135, 153, 252);
+  --blue-600-blue: rgb(158, 173, 252);
+  --blue-650-blue: rgb(184, 194, 252);
+  --blue-700-blue: rgb(207, 214, 255);
+  --blue-750-blue: rgb(232, 235, 255);
+  --colors-Bell-Yellow: rgb(242, 199, 18);
+  --colors-Black: rgb(0, 0, 0);
+  --colors-Blue: rgb(15, 51, 245);
+  --colors-Dark-Ben-Franklin-Blue: rgb(15, 77, 143);
+  --colors-Dark-Blue: rgb(38, 0, 140);
+  --colors-Dark-Green: rgb(23, 107, 0);
+  --colors-Dark-Grey: rgb(69, 69, 69);
+  --colors-Green: rgb(28, 184, 41);
+  --colors-Grey: rgb(217, 217, 217);
+  --colors-Light-Blue: rgb(18, 140, 255);
+  --colors-Light-Green: rgb(201, 242, 207);
+  --colors-Light-Grey: rgb(242, 242, 242);
+  --colors-Medium-Grey: rgb(207, 207, 207);
+  --colors-Orange: rgb(237, 102, 56);
+  --colors-Pink: rgb(219, 31, 128);
+  --colors-Purple: rgb(99, 0, 222);
+  --colors-Red: rgb(255, 5, 8);
+  --colors-White: rgb(255, 255, 255);
+  --dark-ben-franklin-blue-100-dark-ben-franklin-blue: rgb(3, 23, 56);
+  --dark-ben-franklin-blue-150-dark-ben-franklin-blue: rgb(5, 31, 71);
+  --dark-ben-franklin-blue-200-dark-ben-franklin-blue: rgb(8, 38, 84);
+  --dark-ben-franklin-blue-250-dark-ben-franklin-blue: rgb(10, 46, 99);
+  --dark-ben-franklin-blue-300-dark-ben-franklin-blue: rgb(10, 56, 115);
+  --dark-ben-franklin-blue-350-dark-ben-franklin-blue: rgb(13, 69, 128);
+  --dark-ben-franklin-blue-400-dark-ben-franklin-blue: var(--colors-Dark-Ben-Franklin-Blue);
+  --dark-ben-franklin-blue-450-dark-ben-franklin-blue: rgb(87, 130, 176);
+  --dark-ben-franklin-blue-50-dark-ben-franklin-blue: rgb(0, 15, 43);
+  --dark-ben-franklin-blue-500-dark-ben-franklin-blue: rgb(112, 148, 189);
+  --dark-ben-franklin-blue-550-dark-ben-franklin-blue: rgb(135, 166, 199);
+  --dark-ben-franklin-blue-600-dark-ben-franklin-blue: rgb(158, 184, 209);
+  --dark-ben-franklin-blue-650-dark-ben-franklin-blue: rgb(184, 201, 222);
+  --dark-ben-franklin-blue-700-dark-ben-franklin-blue: rgb(207, 219, 232);
+  --dark-ben-franklin-blue-750-dark-ben-franklin-blue: rgb(232, 237, 245);
+  --dark-blue-100-dark-blue: rgb(10, 0, 56);
+  --dark-blue-150-dark-blue: rgb(13, 0, 71);
+  --dark-blue-200-dark-blue: rgb(20, 0, 84);
+  --dark-blue-250-dark-blue: rgb(23, 0, 97);
+  --dark-blue-300-dark-blue: rgb(28, 0, 112);
+  --dark-blue-350-dark-blue: rgb(33, 0, 125);
+  --dark-blue-400-dark-blue: var(--colors-Dark-Blue);
+  --dark-blue-450-dark-blue: rgb(105, 77, 173);
+  --dark-blue-50-dark-blue: rgb(5, 0, 43);
+  --dark-blue-500-dark-blue: rgb(125, 102, 186);
+  --dark-blue-550-dark-blue: rgb(148, 128, 196);
+  --dark-blue-600-dark-blue: rgb(168, 153, 209);
+  --dark-blue-650-dark-blue: rgb(191, 179, 219);
+  --dark-blue-700-dark-blue: rgb(212, 204, 232);
+  --dark-blue-750-dark-blue: rgb(232, 230, 242);
+  --dark-green-100-dark-green: rgb(10, 43, 0);
+  --dark-green-150-dark-green: rgb(10, 54, 0);
+  --dark-green-200-dark-green: rgb(13, 64, 0);
+  --dark-green-250-dark-green: rgb(15, 74, 0);
+  --dark-green-300-dark-green: rgb(18, 84, 0);
+  --dark-green-350-dark-green: rgb(20, 97, 0);
+  --dark-green-400-dark-green: var(--colors-Dark-Green);
+  --dark-green-450-dark-green: rgb(94, 150, 77);
+  --dark-green-50-dark-green: rgb(5, 33, 0);
+  --dark-green-500-dark-green: rgb(117, 166, 102);
+  --dark-green-550-dark-green: rgb(140, 181, 128);
+  --dark-green-600-dark-green: rgb(161, 196, 153);
+  --dark-green-650-dark-green: rgb(186, 212, 179);
+  --dark-green-700-dark-green: rgb(209, 224, 204);
+  --dark-green-750-dark-green: rgb(232, 240, 230);
+  --dark-grey-100-dark-grey: rgb(28, 28, 28);
+  --dark-grey-150-dark-grey: rgb(33, 33, 33);
+  --dark-grey-200-dark-grey: rgb(41, 41, 41);
+  --dark-grey-250-dark-grey: rgb(48, 48, 48);
+  --dark-grey-300-dark-grey: rgb(56, 56, 56);
+  --dark-grey-350-dark-grey: rgb(61, 61, 61);
+  --dark-grey-400-dark-grey: var(--colors-Dark-Grey);
+  --dark-grey-450-dark-grey: rgb(125, 125, 125);
+  --dark-grey-50-dark-grey: rgb(20, 20, 20);
+  --dark-grey-500-dark-grey: rgb(143, 143, 143);
+  --dark-grey-550-dark-grey: rgb(163, 163, 163);
+  --dark-grey-600-dark-grey: rgb(181, 181, 181);
+  --dark-grey-650-dark-grey: rgb(199, 199, 199);
+  --dark-grey-700-dark-grey: rgb(217, 217, 217);
+  --dark-grey-750-dark-grey: rgb(237, 237, 237);
+  --green-100-green: rgb(10, 74, 15);
+  --green-150-green: rgb(13, 92, 20);
+  --green-200-green: rgb(15, 110, 23);
+  --green-250-green: rgb(20, 128, 28);
+  --green-300-green: rgb(23, 148, 33);
+  --green-350-green: rgb(26, 166, 36);
+  --green-400-green: var(--colors-Green);
+  --green-450-green: rgb(97, 204, 105);
+  --green-50-green: rgb(8, 56, 13);
+  --green-500-green: rgb(117, 212, 128);
+  --green-550-green: rgb(140, 219, 148);
+  --green-600-green: rgb(163, 227, 171);
+  --green-650-green: rgb(186, 232, 191);
+  --green-700-green: rgb(209, 240, 212);
+  --green-750-green: rgb(232, 247, 232);
+  --grey-100-grey: rgb(87, 87, 87);
+  --grey-150-grey: rgb(107, 107, 107);
+  --grey-200-grey: rgb(130, 130, 130);
+  --grey-250-grey: rgb(150, 150, 150);
+  --grey-300-grey: rgb(173, 173, 173);
+  --grey-350-grey: rgb(194, 194, 194);
+  --grey-400-grey: var(--colors-Grey);
+  --grey-450-grey: rgb(227, 227, 227);
+  --grey-50-grey: rgb(64, 64, 64);
+  --grey-500-grey: rgb(232, 232, 232);
+  --grey-550-grey: rgb(235, 235, 235);
+  --grey-600-grey: rgb(240, 240, 240);
+  --grey-650-grey: rgb(242, 242, 242);
+  --grey-700-grey: rgb(247, 247, 247);
+  --grey-750-grey: rgb(250, 250, 250);
+  --light-blue-100-light-blue: rgb(5, 56, 102);
+  --light-blue-150-light-blue: rgb(8, 71, 128);
+  --light-blue-200-light-blue: rgb(10, 84, 153);
+  --light-blue-250-light-blue: rgb(13, 97, 179);
+  --light-blue-300-light-blue: rgb(13, 112, 204);
+  --light-blue-350-light-blue: rgb(15, 125, 230);
+  --light-blue-400-light-blue: rgb(18, 140, 255);
+  --light-blue-450-light-blue: var(--colors-Light-Blue);
+  --light-blue-50-light-blue: rgb(5, 43, 77);
+  --light-blue-500-light-blue: rgb(112, 186, 255);
+  --light-blue-550-light-blue: rgb(138, 196, 255);
+  --light-blue-600-light-blue: rgb(161, 209, 255);
+  --light-blue-650-light-blue: rgb(184, 219, 255);
+  --light-blue-700-light-blue: rgb(209, 232, 255);
+  --light-blue-750-light-blue: rgb(232, 242, 255);
+  --light-green-100-light-green: rgb(79, 97, 82);
+  --light-green-150-light-green: rgb(99, 120, 102);
+  --light-green-200-light-green: rgb(120, 145, 125);
+  --light-green-250-light-green: rgb(140, 168, 145);
+  --light-green-300-light-green: rgb(161, 194, 166);
+  --light-green-350-light-green: rgb(181, 217, 186);
+  --light-green-400-light-green: var(--colors-Light-Green);
+  --light-green-450-light-green: rgb(217, 245, 224);
+  --light-green-50-light-green: rgb(59, 71, 61);
+  --light-green-500-light-green: rgb(222, 245, 230);
+  --light-green-550-light-green: rgb(227, 247, 235);
+  --light-green-600-light-green: rgb(232, 250, 237);
+  --light-green-650-light-green: rgb(237, 250, 242);
+  --light-green-700-light-green: rgb(245, 252, 245);
+  --light-green-750-light-green: rgb(250, 255, 250);
+  --light-grey-100-light-grey: rgb(97, 97, 97);
+  --light-grey-150-light-grey: rgb(120, 120, 120);
+  --light-grey-200-light-grey: rgb(145, 145, 145);
+  --light-grey-250-light-grey: rgb(168, 168, 168);
+  --light-grey-300-light-grey: rgb(194, 194, 194);
+  --light-grey-350-light-grey: rgb(219, 219, 219);
+  --light-grey-400-light-grey: var(--colors-Light-Grey);
+  --light-grey-450-light-grey: rgb(247, 247, 247);
+  --light-grey-50-light-grey: rgb(71, 71, 71);
+  --light-grey-500-light-grey: rgb(250, 250, 250);
+  --light-grey-550-light-grey: rgb(250, 250, 250);
+  --light-grey-600-light-grey: rgb(250, 250, 250);
+  --light-grey-650-light-grey: rgb(252, 252, 252);
+  --light-grey-700-light-grey: rgb(252, 252, 252);
+  --light-grey-750-light-grey: rgb(255, 255, 255);
+  --medium-grey-100-medium-grey: rgb(82, 82, 82);
+  --medium-grey-150-medium-grey: rgb(102, 102, 102);
+  --medium-grey-200-medium-grey: rgb(125, 125, 125);
+  --medium-grey-250-medium-grey: rgb(143, 143, 143);
+  --medium-grey-300-medium-grey: rgb(166, 166, 166);
+  --medium-grey-350-medium-grey: rgb(186, 186, 186);
+  --medium-grey-400-medium-grey: var(--colors-Medium-Grey);
+  --medium-grey-450-medium-grey: rgb(219, 219, 219);
+  --medium-grey-50-medium-grey: rgb(61, 61, 61);
+  --medium-grey-500-medium-grey: rgb(224, 224, 224);
+  --medium-grey-550-medium-grey: rgb(230, 230, 230);
+  --medium-grey-600-medium-grey: rgb(235, 235, 235);
+  --medium-grey-650-medium-grey: rgb(240, 240, 240);
+  --medium-grey-700-medium-grey: rgb(245, 245, 245);
+  --medium-grey-750-medium-grey: rgb(250, 250, 250);
+  --orange-100-orange: rgb(94, 41, 23);
+  --orange-150-orange: rgb(117, 51, 28);
+  --orange-200-orange: rgb(143, 61, 33);
+  --orange-250-orange: rgb(166, 71, 38);
+  --orange-300-orange: rgb(189, 82, 43);
+  --orange-350-orange: rgb(212, 92, 51);
+  --orange-400-orange: var(--colors-Orange);
+  --orange-450-orange: rgb(242, 148, 117);
+  --orange-50-orange: rgb(71, 31, 15);
+  --orange-500-orange: rgb(245, 163, 135);
+  --orange-550-orange: rgb(245, 179, 156);
+  --orange-600-orange: rgb(247, 194, 176);
+  --orange-650-orange: rgb(250, 209, 194);
+  --orange-700-orange: rgb(250, 224, 214);
+  --orange-750-orange: rgb(252, 240, 232);
+  --pink-100-pink: rgb(87, 13, 51);
+  --pink-150-pink: rgb(110, 15, 64);
+  --pink-200-pink: rgb(130, 18, 77);
+  --pink-250-pink: rgb(153, 20, 89);
+  --pink-300-pink: rgb(176, 23, 102);
+  --pink-350-pink: rgb(196, 28, 115);
+  --pink-400-pink: var(--colors-Pink);
+  --pink-450-pink: rgb(230, 97, 166);
+  --pink-50-pink: rgb(64, 10, 38);
+  --pink-500-pink: rgb(232, 120, 179);
+  --pink-550-pink: rgb(237, 143, 191);
+  --pink-600-pink: rgb(240, 166, 204);
+  --pink-650-pink: rgb(245, 189, 217);
+  --pink-700-pink: rgb(247, 209, 230);
+  --pink-750-pink: rgb(250, 232, 242);
+  --purple-100-purple: rgb(38, 0, 87);
+  --purple-150-purple: rgb(48, 0, 112);
+  --purple-200-purple: rgb(59, 0, 133);
+  --purple-250-purple: rgb(69, 0, 156);
+  --purple-300-purple: rgb(79, 0, 176);
+  --purple-350-purple: rgb(89, 0, 199);
+  --purple-400-purple: var(--colors-Purple);
+  --purple-450-purple: rgb(143, 77, 232);
+  --purple-50-purple: rgb(28, 0, 66);
+  --purple-500-purple: rgb(161, 102, 235);
+  --purple-550-purple: rgb(176, 128, 237);
+  --purple-600-purple: rgb(191, 153, 242);
+  --purple-650-purple: rgb(207, 179, 245);
+  --purple-700-purple: rgb(224, 204, 247);
+  --purple-750-purple: rgb(240, 230, 252);
+  --red-100-red: rgb(102, 3, 3);
+  --red-150-red: rgb(128, 3, 5);
+  --red-200-red: rgb(153, 3, 5);
+  --red-250-red: rgb(179, 3, 5);
+  --red-300-red: rgb(204, 5, 5);
+  --red-350-red: rgb(230, 5, 8);
+  --red-400-red: var(--colors-Red);
+  --red-450-red: rgb(255, 79, 82);
+  --red-50-red: rgb(77, 0, 3);
+  --red-500-red: rgb(255, 105, 107);
+  --red-550-red: rgb(255, 130, 130);
+  --red-600-red: rgb(255, 153, 156);
+  --red-650-red: rgb(255, 179, 181);
+  --red-700-red: rgb(255, 204, 204);
+  --red-750-red: rgb(255, 230, 230);
+  --white-100-white: rgb(102, 102, 102);
+  --white-150-white: rgb(128, 128, 128);
+  --white-200-white: rgb(153, 153, 153);
+  --white-250-white: rgb(179, 179, 179);
+  --white-300-white: rgb(204, 204, 204);
+  --white-350-white: rgb(230, 230, 230);
+  --white-400-white: var(--colors-White);
+  --white-450-white: rgb(255, 255, 255);
+  --white-50-white: rgb(77, 77, 77);
+  --white-500-white: rgb(255, 255, 255);
+  --white-550-white: rgb(255, 255, 255);
+  --white-600-white: rgb(255, 255, 255);
+  --white-650-white: rgb(255, 255, 255);
+  --white-700-white: rgb(255, 255, 255);
+  --white-750-white: rgb(255, 255, 255);
+}

package/dist/styles/generated/schemes.css

@@ -0,0 +1,58 @@
+:root {
+  /* schemes */
+  /* Generated from Figma CSS export - references preserved */
+
+  --Schemes-Alert: var(--Palettes-Alert-Alert-400);
+  --Schemes-Alert-Container: var(--Palettes-Alert-Alert-550);
+  --Schemes-Background: var(--Palettes-Neutral-Neutral-650);
+  --Schemes-Error: var(--Palettes-Error-Error-450);
+  --Schemes-Error-Container: var(--Palettes-Error-Error-450);
+  --Schemes-Inverse-Primary: var(--Palettes-Primary-Primary-400);
+  --Schemes-On-Alert: var(--Palettes-Alert-Alert-750);
+  --Schemes-On-Alert-Container: var(--Schemes-On-Background);
+  --Schemes-On-Background: var(--Palettes-Neutral-Neutral-50);
+  --Schemes-On-Error: var(--Palettes-Error-Error-750);
+  --Schemes-On-Error-Container: var(--Palettes-Error-Error-750);
+  --Schemes-On-Inverse-Surface: var(--Palettes-Neutral-Neutral-750);
+  --Schemes-On-Inverse-Surface-Bright: var(--Palettes-Neutral-Neutral-750);
+  --Schemes-On-Primary: var(--Palettes-Primary-Primary-750);
+  --Schemes-On-Primary-Container: var(--Palettes-Primary-Primary-750);
+  --Schemes-On-Primary-Fixed: var(--Palettes-Primary-Primary-100);
+  --Schemes-On-Primary-Fixed-Variant: var(--Palettes-Primary-Primary-50);
+  --Schemes-On-Secondary: var(--Schemes-Surface-Bright);
+  --Schemes-On-Secondary-Container: var(--Palettes-Secondary-Secondary-750);
+  --Schemes-On-Secondary-Fixed: var(--Palettes-Secondary-Secondary-50);
+  --Schemes-On-Secondary-Fixed-Variant: var(--Palettes-Secondary-Secondary-250);
+  --Schemes-On-Surface: var(--black-400-black);
+  --Schemes-On-Surface-Variant: var(--Palettes-Neutral-Neutral-50);
+  --Schemes-On-Tertiary: var(--Palettes-Tertiary-Tertiary-750);
+  --Schemes-On-Tertiary-Container: var(--Palettes-Tertiary-Tertiary-750);
+  --Schemes-On-Tertiary-Fixed: var(--Palettes-Tertiary-Tertiary-150);
+  --Schemes-On-Tertiary-Fixed-Variant: var(--Palettes-Tertiary-Tertiary-50);
+  --Schemes-Outline: var(--Palettes-Neutral-Neutral-200);
+  --Schemes-Outline-Variant: var(--Palettes-Neutral-Variant-Neutral-Variant-250);
+  --Schemes-Primary: var(--Palettes-Primary-Primary-400);
+  --Schemes-Primary-Container: var(--Palettes-Primary-Primary-200);
+  --Schemes-Primary-Fixed: var(--Palettes-Primary-Primary-650);
+  --Schemes-Primary-Fixed-Dim: var(--Palettes-Primary-Primary-400);
+  --Schemes-Scrim: var(--Extended-Colors-Black);
+  --Schemes-Secondary: var(--Palettes-Secondary-Secondary-150);
+  --Schemes-Secondary-Container: var(--Palettes-Secondary-Secondary-400);
+  --Schemes-Secondary-Fixed: var(--Palettes-Secondary-Secondary-750);
+  --Schemes-Secondary-Fixed-Dim: var(--Palettes-Secondary-Secondary-550);
+  --Schemes-Shadow: var(--Extended-Colors-Black);
+  --Schemes-Surface: var(--Palettes-Neutral-Neutral-500);
+  --Schemes-Surface-Bright: var(--Palettes-Neutral-Neutral-750);
+  --Schemes-Surface-Container: var(--Palettes-Neutral-Neutral-500);
+  --Schemes-Surface-Container-High: var(--Palettes-Neutral-Neutral-450);
+  --Schemes-Surface-Container-Highest: var(--Palettes-Neutral-Neutral-400);
+  --Schemes-Surface-Container-Low: var(--Palettes-Neutral-Neutral-550);
+  --Schemes-Surface-Container-Lowest: var(--Palettes-Neutral-Neutral-600);
+  --Schemes-Surface-Dim: var(--Palettes-Neutral-Neutral-400);
+  --Schemes-Surface-Tint: var(--Palettes-Secondary-Secondary-350);
+  --Schemes-Surface-Variant: var(--Palettes-Neutral-Variant-Neutral-Variant-550);
+  --Schemes-Tertiary: var(--Palettes-Tertiary-Tertiary-150);
+  --Schemes-Tertiary-Container: var(--Palettes-Tertiary-Tertiary-250);
+  --Schemes-Tertiary-Fixed: var(--Palettes-Tertiary-Tertiary-600);
+  --Schemes-Tertiary-Fixed-Dim: var(--Palettes-Tertiary-Tertiary-550);
+}

package/dist/styles/generated/sizes.css

@@ -0,0 +1,44 @@
+:root {
+  /* sizes */
+  /* Generated from Figma CSS export - references preserved */
+
+  --sizes-3xlarge: 2rem;
+  --sizes-3xsmall: 0.5rem;
+  --sizes-4xlarge: 2.5rem;
+  --sizes-4xsmall: 0.25rem;
+  --sizes-5xlarge: 3rem;
+  --sizes-5xsmall: 0.125rem;
+  --sizes-6xlarge: 3.5rem;
+  --sizes-6xsmall: 0.0625rem;
+  --sizes-7xlarge: 4rem;
+  --sizes-8xlarge: 4.5rem;
+  --sizes-9xlarge: 5rem;
+  --sizes-large: 1.125rem;
+  --sizes-medium: 1rem;
+  --sizes-scale-0: 0;
+  --sizes-scale-10: 0.0625rem;
+  --sizes-scale-100: 0.5rem;
+  --sizes-scale-1000: 5rem;
+  --sizes-scale-1100: 5.5rem;
+  --sizes-scale-150: 0.75rem;
+  --sizes-scale-175: 0.875rem;
+  --sizes-scale-200: 1rem;
+  --sizes-scale-225: 1.125rem;
+  --sizes-scale-25: 0.125rem;
+  --sizes-scale-250: 1.25rem;
+  --sizes-scale-300: 1.5rem;
+  --sizes-scale-350: 1.75rem;
+  --sizes-scale-400: 2rem;
+  --sizes-scale-450: 2.25rem;
+  --sizes-scale-50: 0.25rem;
+  --sizes-scale-500: 2.5rem;
+  --sizes-scale-600: 3rem;
+  --sizes-scale-700: 3.5rem;
+  --sizes-scale-75: 0.375rem;
+  --sizes-scale-800: 4rem;
+  --sizes-scale-900: 4.5rem;
+  --sizes-small: 0.875rem;
+  --sizes-xlarge: 1.25rem;
+  --sizes-xxlarge: 1.5rem;
+  --sizes-xxsmall: 0.75rem;
+}