@dialpad/dialtone-tokens 1.0.1 → 1.1.0

package/dist/tokens.json

@@ -0,0 +1,318 @@
+{
+  "dtTokenSetOrder0": "base",
+  "dtTokenSetOrder1": "semantic",
+  "dtTokenSetOrder2": "components/button",
+  "dtTokenSetOrder3": "components/badge",
+  "dtButtonColorBackgroundDefault": "transparent",
+  "dtButtonColorBackgroundPrimary": "#7C52FF",
+  "dtButtonColorBackgroundDanger": "#FF2E2E",
+  "dtButtonColorTextDefault": "#7C52FF",
+  "dtButtonColorTextPrimary": "#fff",
+  "dtButtonColorTextDanger": "#fff",
+  "dtButtonBorderRadiusExtraSmall": "0.7rem",
+  "dtButtonBorderRadiusSmall": "0.75rem",
+  "dtButtonBorderRadiusMedium": "0.8rem",
+  "dtButtonBorderRadiusLarge": "0.9rem",
+  "dtButtonBorderRadiusExtraLarge": "1rem",
+  "dtButtonSpaceGap": "16px",
+  "dtButtonPaddingHorizontalExtraSmall": "15px",
+  "dtButtonPaddingHorizontalSmall": "15px",
+  "dtButtonPaddingHorizontalMedium": "15px",
+  "dtButtonPaddingHorizontalLarge": "63px",
+  "dtButtonPaddingHorizontalExtraLarge": "15px",
+  "dtButtonPaddingVerticalExtraSmall": "13px",
+  "dtButtonPaddingVerticalSmall": "13px",
+  "dtButtonPaddingVerticalMedium": "15px",
+  "dtButtonPaddingVerticalLarge": "31px",
+  "dtButtonPaddingVerticalExtraLarge": "31px",
+  "dtButtonFontSizeExtraSmall": "1.2rem",
+  "dtButtonFontSizeSmall": "1.2rem",
+  "dtButtonFontSizeMedium": "1.5rem",
+  "dtButtonFontSizeLarge": "1.9rem",
+  "dtButtonFontSizeExtraLarge": "2.7rem",
+  "dtButtonLineHeightSizeExtraSmall": "120%",
+  "dtButtonLineHeightSizeSmall": "140%",
+  "dtButtonLineHeightSizeMedium": "140%",
+  "dtButtonLineHeightSizeLarge": "160%",
+  "dtButtonLineHeightSizeExtraLarge": "160%",
+  "dtColorTextPrimary": "#000000",
+  "dtColorTextSecondary": "#3A3A3A",
+  "dtColorTextTertiary": "#555555",
+  "dtColorTextMuted": "#22222280",
+  "dtColorTextPlaceholder": "#808080",
+  "dtColorTextDisabled": "#808080",
+  "dtColorTextError": "#A41111",
+  "dtColorTextSuccess": "#00671D",
+  "dtColorTextWarning": "#815008",
+  "dtColorTextOnDarkPrimary": "#F9F9F9",
+  "dtColorTextOnDarkSecondary": "#D2D2D2",
+  "dtColorSurfacePrimary": "#fff",
+  "dtColorSurfaceSecondary": "#F9F9F9",
+  "dtColorSurfaceModerate": "#EDEDED",
+  "dtColorSurfaceBold": "#BBBBBB",
+  "dtColorSurfaceStrong": "#555555",
+  "dtColorSurfaceContrast": "#222222",
+  "dtColorBlack100": "#F9F9F9",
+  "dtColorBlack200": "#E9E9E9",
+  "dtColorBlack300": "#D2D2D2",
+  "dtColorBlack400": "#AAAAAA",
+  "dtColorBlack500": "#808080",
+  "dtColorBlack600": "#555555",
+  "dtColorBlack700": "#3A3A3A",
+  "dtColorBlack800": "#222222",
+  "dtColorBlack900": "#000000",
+  "dtColorPurple100": "#EEE5FF",
+  "dtColorPurple200": "#D3BCFF",
+  "dtColorPurple300": "#AB7EFF",
+  "dtColorPurple400": "#7C52FF",
+  "dtColorPurple500": "#3A1D95",
+  "dtColorPurple600": "#10022C",
+  "dtColorBlue100": "#E3EDF9",
+  "dtColorBlue200": "#84BDFF",
+  "dtColorBlue300": "#51A0FE",
+  "dtColorBlue400": "#1768C6",
+  "dtColorBlue500": "#01326D",
+  "dtColorMagenta100": "#FF97D2",
+  "dtColorMagenta200": "#F756B1",
+  "dtColorMagenta300": "#F9008E",
+  "dtColorMagenta400": "#8C0E56",
+  "dtColorMagenta500": "#541A3B",
+  "dtColorGold100": "#FFE793",
+  "dtColorGold200": "#FFD362",
+  "dtColorGold300": "#F6AB3C",
+  "dtColorGold400": "#D28F2B",
+  "dtColorGold500": "#815008",
+  "dtColorGreen100": "#DDF4D9",
+  "dtColorGreen200": "#9FFF90",
+  "dtColorGreen300": "#45F777",
+  "dtColorGreen400": "#1AA340",
+  "dtColorGreen500": "#124620",
+  "dtColorRed100": "#FFDCDC",
+  "dtColorRed200": "#FF7474",
+  "dtColorRed300": "#FF2E2E",
+  "dtColorRed400": "#A41111",
+  "dtColorRed500": "#540000",
+  "dtColorTan100": "#F2F0EE",
+  "dtColorTan200": "#CEC8C4",
+  "dtColorTan300": "#87807B",
+  "dtColorTan400": "#3F3D3C",
+  "dtColorTan500": "#121212",
+  "dtColorNeutralWhite": "#fff",
+  "dtColorNeutralBlack": "#000",
+  "dtOpacity0": 0,
+  "dtOpacity100": 0.05,
+  "dtOpacity200": 0.1,
+  "dtOpacity300": 0.2,
+  "dtOpacity400": 0.25,
+  "dtOpacity500": 0.3,
+  "dtOpacity600": 0.4,
+  "dtOpacity700": 0.5,
+  "dtOpacity800": 0.6,
+  "dtOpacity900": 0.7,
+  "dtOpacity1000": 0.75,
+  "dtOpacity1100": 0.8,
+  "dtOpacity1200": 0.9,
+  "dtOpacity1300": 1,
+  "dtFontFamilyBody": "SF Pro, -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'",
+  "dtFontFamilyExpressive": "Archivo, -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'",
+  "dtFontFamilyMono": "SF Mono, SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace",
+  "dtFontSize100": "1.2rem",
+  "dtFontSize200": "1.5rem",
+  "dtFontSize300": "1.9rem",
+  "dtFontSize400": "2.7rem",
+  "dtFontSize500": "3.8rem",
+  "dtFontSizeRoot": "1rem",
+  "dtFontLineHeight100": "100%",
+  "dtFontLineHeight200": "120%",
+  "dtFontLineHeight300": "140%",
+  "dtFontLineHeight400": "160%",
+  "dtFontLineHeight500": "180%",
+  "dtFontLineHeight600": "200%",
+  "dtFontWeightNormal": 400,
+  "dtFontWeightMedium": 500,
+  "dtFontWeightSemiBold": 600,
+  "dtFontWeightBold": 700,
+  "dtFontTextCaseUppercase": "uppercase",
+  "dtFontTextCaseLowercase": "lowercase",
+  "dtFontTextCaseCapitalize": "capitalize",
+  "dtFontTextCaseNone": "none",
+  "dtTypographyBodySmallFontFamily": "SF Pro",
+  "dtTypographyBodySmallFontWeight": 400,
+  "dtTypographyBodySmallLineHeight": "140%",
+  "dtTypographyBodySmallFontSize": "1.2rem",
+  "dtTypographyBodyBaseFontFamily": "SF Pro",
+  "dtTypographyBodyBaseFontWeight": 400,
+  "dtTypographyBodyBaseLineHeight": "160%",
+  "dtTypographyBodyBaseFontSize": "1.5rem",
+  "dtTypographyBodyCompactSmallFontFamily": "SF Pro",
+  "dtTypographyBodyCompactSmallFontWeight": 400,
+  "dtTypographyBodyCompactSmallLineHeight": "120%",
+  "dtTypographyBodyCompactSmallFontSize": "1.2rem",
+  "dtTypographyBodyCompactBaseFontFamily": "SF Pro",
+  "dtTypographyBodyCompactBaseFontWeight": 400,
+  "dtTypographyBodyCompactBaseLineHeight": "140%",
+  "dtTypographyBodyCompactBaseFontSize": "1.5rem",
+  "dtTypographyHeadlineEyebrowFontFamily": "SF Pro",
+  "dtTypographyHeadlineEyebrowFontWeight": 400,
+  "dtTypographyHeadlineEyebrowLineHeight": "140%",
+  "dtTypographyHeadlineEyebrowFontSize": "1.2rem",
+  "dtTypographyHeadlineEyebrowTextCase": "uppercase",
+  "dtTypographyHeadlineSmallFontFamily": "SF Pro",
+  "dtTypographyHeadlineSmallFontWeight": 700,
+  "dtTypographyHeadlineSmallLineHeight": "140%",
+  "dtTypographyHeadlineSmallFontSize": "1.2rem",
+  "dtTypographyHeadlineMediumFontFamily": "SF Pro",
+  "dtTypographyHeadlineMediumFontWeight": 700,
+  "dtTypographyHeadlineMediumLineHeight": "160%",
+  "dtTypographyHeadlineMediumFontSize": "1.5rem",
+  "dtTypographyHeadlineLargeFontFamily": "SF Pro",
+  "dtTypographyHeadlineLargeFontWeight": 700,
+  "dtTypographyHeadlineLargeLineHeight": "160%",
+  "dtTypographyHeadlineLargeFontSize": "1.9rem",
+  "dtTypographyHeadlineExtraLargeFontFamily": "SF Pro",
+  "dtTypographyHeadlineExtraLargeFontWeight": 500,
+  "dtTypographyHeadlineExtraLargeLineHeight": "120%",
+  "dtTypographyHeadlineExtraLargeFontSize": "2.7rem",
+  "dtTypographyHeadlineExtraExtraLargeFontFamily": "SF Pro",
+  "dtTypographyHeadlineExtraExtraLargeFontWeight": 500,
+  "dtTypographyHeadlineExtraExtraLargeLineHeight": "120%",
+  "dtTypographyHeadlineExtraExtraLargeFontSize": "3.8rem",
+  "dtTypographyHeadlineCompactSmallFontFamily": "SF Pro",
+  "dtTypographyHeadlineCompactSmallFontWeight": 700,
+  "dtTypographyHeadlineCompactSmallLineHeight": "120%",
+  "dtTypographyHeadlineCompactSmallFontSize": "1.2rem",
+  "dtTypographyHeadlineCompactBaseFontFamily": "SF Pro",
+  "dtTypographyHeadlineCompactBaseFontWeight": 700,
+  "dtTypographyHeadlineCompactBaseLineHeight": "140%",
+  "dtTypographyHeadlineCompactBaseFontSize": "1.5rem",
+  "dtTypographyLabelSmallFontFamily": "SF Pro",
+  "dtTypographyLabelSmallFontWeight": 600,
+  "dtTypographyLabelSmallLineHeight": "140%",
+  "dtTypographyLabelSmallFontSize": "1.2rem",
+  "dtTypographyLabelBaseFontFamily": "SF Pro",
+  "dtTypographyLabelBaseFontWeight": 600,
+  "dtTypographyLabelBaseLineHeight": "160%",
+  "dtTypographyLabelBaseFontSize": "1.5rem",
+  "dtTypographyLabelCompactSmallFontFamily": "SF Pro",
+  "dtTypographyLabelCompactSmallFontWeight": 600,
+  "dtTypographyLabelCompactSmallLineHeight": "120%",
+  "dtTypographyLabelCompactSmallFontSize": "1.2rem",
+  "dtTypographyLabelCompactBaseFontFamily": "SF Pro",
+  "dtTypographyLabelCompactBaseFontWeight": 600,
+  "dtTypographyLabelCompactBaseLineHeight": "140%",
+  "dtTypographyLabelCompactBaseFontSize": "1.5rem",
+  "dtTypographyLabelCompactPlainSmallFontFamily": "SF Pro",
+  "dtTypographyLabelCompactPlainSmallFontWeight": 400,
+  "dtTypographyLabelCompactPlainSmallLineHeight": "120%",
+  "dtTypographyLabelCompactPlainSmallFontSize": "1.2rem",
+  "dtTypographyLabelCompactPlainBaseFontFamily": "SF Pro",
+  "dtTypographyLabelCompactPlainBaseFontWeight": 400,
+  "dtTypographyLabelCompactPlainBaseLineHeight": "140%",
+  "dtTypographyLabelCompactPlainBaseFontSize": "1.5rem",
+  "dtTypographyLabelPlainSmallFontFamily": "SF Pro",
+  "dtTypographyLabelPlainSmallFontWeight": 400,
+  "dtTypographyLabelPlainSmallLineHeight": "140%",
+  "dtTypographyLabelPlainSmallFontSize": "1.2rem",
+  "dtTypographyLabelPlainBaseFontFamily": "SF Pro",
+  "dtTypographyLabelPlainBaseFontWeight": 400,
+  "dtTypographyLabelPlainBaseLineHeight": "160%",
+  "dtTypographyLabelPlainBaseFontSize": "1.5rem",
+  "dtTypographyHelperSmallFontFamily": "SF Pro",
+  "dtTypographyHelperSmallFontWeight": 400,
+  "dtTypographyHelperSmallLineHeight": "120%",
+  "dtTypographyHelperSmallFontSize": "1.2rem",
+  "dtTypographyHelperBaseFontFamily": "SF Pro",
+  "dtTypographyHelperBaseFontWeight": 400,
+  "dtTypographyHelperBaseLineHeight": "140%",
+  "dtTypographyHelperBaseFontSize": "1.5rem",
+  "dtTypographyCodeSmallFontFamily": "SF Mono",
+  "dtTypographyCodeSmallFontWeight": 400,
+  "dtTypographyCodeSmallLineHeight": "120%",
+  "dtTypographyCodeSmallFontSize": "1.2rem",
+  "dtTypographyCodeBaseFontFamily": "SF Mono",
+  "dtTypographyCodeBaseFontWeight": 400,
+  "dtTypographyCodeBaseLineHeight": "120%",
+  "dtTypographyCodeBaseFontSize": "1.5rem",
+  "dtSize0": "0",
+  "dtSize100": "0.1rem",
+  "dtSize200": "0.2rem",
+  "dtSize300": "0.4rem",
+  "dtSize400": "0.8rem",
+  "dtSize500": "1.6rem",
+  "dtSize600": "3.2rem",
+  "dtSize700": "6.4rem",
+  "dtSize800": "12.8rem",
+  "dtSizeBase": "0.8rem",
+  "dtSizeBorder0": "0",
+  "dtSizeBorder100": "0.1rem",
+  "dtSizeBorder200": "0.2rem",
+  "dtSizeBorder300": "0.4rem",
+  "dtSizeBorderIcon100": "0.1rem",
+  "dtSizeBorderIcon200": "0.125rem",
+  "dtSizeBorderIcon300": "0.15rem",
+  "dtSizeBorderIcon400": "0.175rem",
+  "dtSizeBorderIcon500": "0.175rem",
+  "dtSizeRadius0": "0",
+  "dtSizeRadius100": "0.1rem",
+  "dtSizeRadius200": "0.2rem",
+  "dtSizeRadius300": "0.4rem",
+  "dtSizeRadius400": "0.8rem",
+  "dtSizeRadius500": "3.2rem",
+  "dtSizeIcon100": "1.2rem",
+  "dtSizeIcon200": "1.4rem",
+  "dtSizeIcon300": "1.8rem",
+  "dtSizeIcon400": "2rem",
+  "dtSizeIcon500": "2.4rem",
+  "dtSpace0": "0px",
+  "dtSpace100": "1px",
+  "dtSpace200": "2px",
+  "dtSpace300": "4px",
+  "dtSpace400": "8px",
+  "dtSpace500": "16px",
+  "dtSpace600": "32px",
+  "dtSpace700": "64px",
+  "dtSpace800": "128px",
+  "dtSpaceBase": "8px",
+  "dtShadowSmall0X": "0",
+  "dtShadowSmall0Y": "0.2rem",
+  "dtShadowSmall0Blur": "0.4rem",
+  "dtShadowSmall0Spread": "0",
+  "dtShadowSmall0Color": "#00000026",
+  "dtShadowSmall0Type": "dropShadow",
+  "dtShadowMedium0X": "0",
+  "dtShadowMedium0Y": "0.2rem",
+  "dtShadowMedium0Blur": "0.8rem",
+  "dtShadowMedium0Spread": "0",
+  "dtShadowMedium0Color": "#00000040",
+  "dtShadowMedium0Type": "dropShadow",
+  "dtShadowLarge0X": "0",
+  "dtShadowLarge0Y": "0.2rem",
+  "dtShadowLarge0Blur": "1.6rem",
+  "dtShadowLarge0Spread": "0",
+  "dtShadowLarge0Color": "#0000004d",
+  "dtShadowLarge0Type": "dropShadow",
+  "dtShadowExtraLarge0X": "0",
+  "dtShadowExtraLarge0Y": "0.2rem",
+  "dtShadowExtraLarge0Blur": "3.2rem",
+  "dtShadowExtraLarge0Spread": "0",
+  "dtShadowExtraLarge0Color": "#0000004d",
+  "dtShadowExtraLarge0Type": "dropShadow",
+  "dtShadowCard0X": "0",
+  "dtShadowCard0Y": "0.1rem",
+  "dtShadowCard0Blur": "0.2rem",
+  "dtShadowCard0Spread": "0",
+  "dtShadowCard0Color": "#00000008",
+  "dtShadowCard0Type": "dropShadow",
+  "dtShadowCard1X": "0",
+  "dtShadowCard1Y": "0.2rem",
+  "dtShadowCard1Blur": "0.4rem",
+  "dtShadowCard1Spread": "0",
+  "dtShadowCard1Color": "#0000000a",
+  "dtShadowCard1Type": "dropShadow",
+  "dtShadowCard2X": "0",
+  "dtShadowCard2Y": "0.2rem",
+  "dtShadowCard2Blur": "1.6rem",
+  "dtShadowCard2Spread": "0",
+  "dtShadowCard2Color": "#00000014",
+  "dtShadowCard2Type": "dropShadow"
+}

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@dialpad/dialtone-tokens",
-  "version": "1.0.1",
+  "version": "1.1.0",
   "description": "Design tokens for Dialtone.",
   "main": "index.js",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
-    "build": "npm run transform && style-dictionary build",
-    "transform": "token-transformer base.json tokens/tokens.json",
+    "build": "npm run transform && ./build.js",
+    "transform": "token-transformer base.json tokens/tokens.json --expandTypography=true --expandShadow=true",
     "prepublishOnly": "npm run build",
     "release": "semantic-release --no-ci --extends ./release-local.config.js"
   },
@@ -30,7 +30,9 @@
     "@commitlint/cli": "^17.0.3",
     "@commitlint/config-conventional": "^17.0.3",
     "@semantic-release/changelog": "^6.0.1",
+    "@semantic-release/exec": "^6.0.3",
     "@semantic-release/git": "^10.0.1",
+    "maven": "^5.0.0",
     "style-dictionary": "^3.7.1",
     "token-transformer": "^0.0.24"
   }

package/dist/less/_variables.less

@@ -1,239 +0,0 @@
-
-// Do not edit directly
-// Generated on Thu, 11 Aug 2022 23:17:34 GMT
-
-@dt-button-color-background-default: transparent;
-@dt-button-color-background-primary: #6C3DFF;
-@dt-button-color-background-danger: #D81616;
-@dt-button-color-text-default: #6C3DFF;
-@dt-button-color-text-primary: #fff;
-@dt-button-color-text-danger: #fff;
-@dt-button-border-radius-extra-small: 3px;
-@dt-button-border-radius-small: 3.5px;
-@dt-button-border-radius-medium: 4px;
-@dt-button-border-radius-large: 5px;
-@dt-button-border-radius-extra-large: 6px;
-@dt-button-space-gap: 8px;
-@dt-button-padding-horizontal-extra-small: 7px;
-@dt-button-padding-horizontal-small: 7px;
-@dt-button-padding-horizontal-medium: 7px;
-@dt-button-padding-horizontal-large: 15px;
-@dt-button-padding-horizontal-extra-large: 15px;
-@dt-button-padding-vertical-extra-small: 5px;
-@dt-button-padding-vertical-small: 5px;
-@dt-button-padding-vertical-medium: 7px;
-@dt-button-padding-vertical-large: 11px;
-@dt-button-padding-vertical-extra-large: 11px;
-@dt-button-font-size-extra-small: 12px;
-@dt-button-font-size-small: 14px;
-@dt-button-font-size-medium: 16px;
-@dt-button-font-size-large: 20px;
-@dt-button-font-size-extra-large: 24px;
-@dt-button-line-height-size-extra-small: 16px;
-@dt-button-line-height-size-small: 20px;
-@dt-button-line-height-size-medium: 20px;
-@dt-button-line-height-size-large: 24px;
-@dt-button-line-height-size-extra-large: 32px;
-@dt-color-surface-default: #ffffff;
-@dt-color-surface-foo: #f9f9f9;
-@dt-color-surface-bar: #ededed;
-@dt-color-surface-baz: #bbbbbb;
-@dt-color-surface-zar: #555555;
-@dt-color-text-dark: #0d0c0f;
-@dt-color-text-medium: #221f24;
-@dt-color-text-light: #322d37;
-@dt-color-text-lighter: #444150;
-@dt-color-text-primary: #6c3dff;
-@dt-color-text-success: #0a5b03;
-@dt-color-text-error: #930000;
-@dt-color-text-danger: #930000;
-@dt-color-text-muted: #0d0c0f;
-@dt-color-black-100: #cdcdd8;
-@dt-color-black-200: #b3b0c0;
-@dt-color-black-300: #9c99ac;
-@dt-color-black-400: #7b7789;
-@dt-color-black-500: #575564;
-@dt-color-black-600: #444150;
-@dt-color-black-700: #322d37;
-@dt-color-black-800: #221f24;
-@dt-color-black-900: #0d0c0f;
-@dt-color-black-025: #f2f2f6;
-@dt-color-black-050: #eae9ef;
-@dt-color-black-075: #dfdee5;
-@dt-color-purple-100: #ece1ff;
-@dt-color-purple-200: #d1c0ff;
-@dt-color-purple-300: #a687ff;
-@dt-color-purple-400: #8b65ff;
-@dt-color-purple-500: #6c3dff;
-@dt-color-purple-600: #3a1c95;
-@dt-color-purple-700: #2a1173;
-@dt-color-purple-800: #160645;
-@dt-color-orange-100: #fff0e5;
-@dt-color-orange-200: #ffcca7;
-@dt-color-orange-300: #ffa360;
-@dt-color-orange-400: #ff7f23;
-@dt-color-orange-500: #e05e00;
-@dt-color-orange-600: #43220a;
-@dt-color-pink-100: #ffebec;
-@dt-color-pink-200: #ffd8da;
-@dt-color-pink-300: #fda2a8;
-@dt-color-pink-400: #ff578a;
-@dt-color-pink-500: #e92a7a;
-@dt-color-pink-600: #a2114d;
-@dt-color-pink-700: #57102e;
-@dt-color-yellow-100: #fff9e3;
-@dt-color-yellow-200: #ffeeb0;
-@dt-color-yellow-300: #ffdb59;
-@dt-color-yellow-400: #ffce1c;
-@dt-color-yellow-500: #ffbc0f;
-@dt-color-yellow-600: #3f2d00;
-@dt-color-yellow-050: #fbf8f1;
-@dt-color-green-100: #ebffe2;
-@dt-color-green-200: #d1ffbc;
-@dt-color-green-300: #9cff6d;
-@dt-color-green-400: #6bee04;
-@dt-color-green-500: #0c9b02;
-@dt-color-green-600: #0a5b03;
-@dt-color-green-700: #052f01;
-@dt-color-red-100: #fff1f1;
-@dt-color-red-200: #ffd3d3;
-@dt-color-red-300: #ffa7a7;
-@dt-color-red-400: #fa4646;
-@dt-color-red-500: #d81616;
-@dt-color-red-600: #930000;
-@dt-color-red-700: #480000;
-@dt-color-neutral-white: #ffffff;
-@dt-color-neutral-black: #000000;
-@dt-opacity-0: 0;
-@dt-opacity-100: 0.05;
-@dt-opacity-200: 0.1;
-@dt-opacity-300: 0.2;
-@dt-opacity-400: 0.25;
-@dt-opacity-500: 0.3;
-@dt-opacity-600: 0.4;
-@dt-opacity-700: 0.5;
-@dt-opacity-800: 0.6;
-@dt-opacity-900: 0.7;
-@dt-opacity-1000: 0.75;
-@dt-opacity-1100: 0.8;
-@dt-opacity-1200: 0.9;
-@dt-opacity-1300: 1;
-@dt-font-family-default: Inter;
-@dt-font-family-marketing: Archivo;
-@dt-font-family-mono: Roboto Mono;
-@dt-font-size-100: 10px;
-@dt-font-size-200: 11px;
-@dt-font-size-300: 12px;
-@dt-font-size-400: 14px;
-@dt-font-size-500: 16px;
-@dt-font-size-600: 18px;
-@dt-font-size-700: 20px;
-@dt-font-size-800: 24px;
-@dt-font-size-900: 28px;
-@dt-font-size-1000: 32px;
-@dt-font-size-1100: 36px;
-@dt-font-size-1200: 42px;
-@dt-font-size-1300: 48px;
-@dt-font-size-1400: 54px;
-@dt-font-line-height-100: 12px;
-@dt-font-line-height-200: 16px;
-@dt-font-line-height-300: 20px;
-@dt-font-line-height-400: 24px;
-@dt-font-line-height-500: 28px;
-@dt-font-line-height-600: 32px;
-@dt-font-line-height-700: 36px;
-@dt-font-line-height-800: 40px;
-@dt-font-line-height-900: 48px;
-@dt-font-line-height-1000: 52px;
-@dt-font-line-height-1100: 58px;
-@dt-font-weight-normal: Regular;
-@dt-font-weight-medium: Medium;
-@dt-font-weight-semi-bold: Semi Bold;
-@dt-font-weight-bold: Bold;
-@dt-typography-body-100: [object Object];
-@dt-typography-body-200: [object Object];
-@dt-typography-body-300: [object Object];
-@dt-typography-body-400: [object Object];
-@dt-typography-body-500: [object Object];
-@dt-typography-body-600: [object Object];
-@dt-typography-body-700: [object Object];
-@dt-typography-body-800: [object Object];
-@dt-typography-body-900: [object Object];
-@dt-typography-body-1000: [object Object];
-@dt-typography-body-1100: [object Object];
-@dt-typography-body-1200: [object Object];
-@dt-typography-body-1300: [object Object];
-@dt-typography-body-1400: [object Object];
-@dt-typography-headline-100: [object Object];
-@dt-typography-headline-200: [object Object];
-@dt-typography-headline-300: [object Object];
-@dt-typography-headline-400: [object Object];
-@dt-typography-headline-500: [object Object];
-@dt-typography-headline-600: [object Object];
-@dt-typography-headline-700: [object Object];
-@dt-typography-headline-800: [object Object];
-@dt-size-0: 0rem;
-@dt-size-100: 1rem;
-@dt-size-200: 2rem;
-@dt-size-300: 4rem;
-@dt-size-400: 6rem;
-@dt-size-500: 8rem;
-@dt-size-600: 12rem;
-@dt-size-700: 16rem;
-@dt-size-800: 24rem;
-@dt-size-900: 32rem;
-@dt-size-1000: 48rem;
-@dt-size-1100: 64rem;
-@dt-size-1200: 72rem;
-@dt-size-1300: 84rem;
-@dt-size-1400: 96rem;
-@dt-size-1500: 102rem;
-@dt-size-1600: 114rem;
-@dt-size-1700: 128rem;
-@dt-size-base: 4rem;
-@dt-size-border-0: 0rem;
-@dt-size-border-100: 1rem;
-@dt-size-border-200: 2rem;
-@dt-size-border-300: 4rem;
-@dt-size-border-400: 8rem;
-@dt-size-border-500: 12rem;
-@dt-size-radius-0: 0rem;
-@dt-size-radius-100: 1rem;
-@dt-size-radius-200: 2rem;
-@dt-size-radius-300: 4rem;
-@dt-size-radius-400: 8rem;
-@dt-size-radius-500: 12rem;
-@dt-size-radius-600: 24rem;
-@dt-size-icon-100: 14rem;
-@dt-size-icon-200: 16rem;
-@dt-size-icon-300: 18rem;
-@dt-size-icon-400: 20rem;
-@dt-size-icon-500: 24rem;
-@dt-size-icon-600: 32rem;
-@dt-size-icon-700: 48rem;
-@dt-size-icon-800: 64rem;
-@dt-size-icon-000: 12rem;
-@dt-space-0: 0px;
-@dt-space-100: 1px;
-@dt-space-200: 2px;
-@dt-space-300: 4px;
-@dt-space-400: 6px;
-@dt-space-500: 8px;
-@dt-space-600: 12px;
-@dt-space-700: 16px;
-@dt-space-800: 24px;
-@dt-space-900: 32px;
-@dt-space-1000: 48px;
-@dt-space-1100: 64px;
-@dt-space-1200: 72px;
-@dt-space-1300: 84px;
-@dt-space-1400: 96px;
-@dt-space-1500: 102px;
-@dt-space-1600: 114px;
-@dt-space-1700: 128px;
-@dt-space-base: 4px;
-@dt-shadow-small: [object Object];
-@dt-shadow-medium: [object Object];
-@dt-shadow-large: [object Object];
-@dt-shadow-extra-large: [object Object];
-@dt-shadow-card: [object Object],[object Object],[object Object];