diff --git a/.storybook/data/tokens.json b/.storybook/data/tokens.json index e3d1d5ff6..b17c491aa 100644 --- a/.storybook/data/tokens.json +++ b/.storybook/data/tokens.json @@ -127,6 +127,7 @@ "eds-theme-typography-caption-sm": "var(--eds-typography-preset-010-light)", "eds-theme-typography-caption-sm-bold": "var(--eds-typography-preset-010)", "eds-theme-typography-overline": "var(--eds-typography-preset-011)", + "eds-theme-typography-overline-lg": "var(--eds-typography-preset-005)", "eds-theme-typography-overline-md": "var(--eds-typography-preset-011)", "eds-theme-typography-overline-sm": "var(--eds-typography-preset-012)", "eds-theme-typography-callout": "var(--eds-typography-preset-002-light)", diff --git a/src/components/Text/Text.module.css b/src/components/Text/Text.module.css index 16a142fdd..d878332c2 100644 --- a/src/components/Text/Text.module.css +++ b/src/components/Text/Text.module.css @@ -132,9 +132,14 @@ font: var(--eds-theme-typography-caption-sm-bold); } .text--overline { + /* @deprecated This should not be used in code or design. It will be removed in a future version of EDS." */ font: var(--eds-theme-typography-overline); text-transform: uppercase; } +.text--overline-lg { + font: var(--eds-theme-typography-overline-lg); + text-transform: uppercase; +} .text--overline-md { font: var(--eds-theme-typography-overline-md); text-transform: uppercase; diff --git a/src/design-tokens/tier-2-usage/typography.json b/src/design-tokens/tier-2-usage/typography.json index 5b9a9ccc6..01c4c68db 100644 --- a/src/design-tokens/tier-2-usage/typography.json +++ b/src/design-tokens/tier-2-usage/typography.json @@ -202,6 +202,9 @@ "value": "var(--eds-typography-preset-011)", "comment": "@deprecated This should not be used in code or design. It will be removed in a future version of EDS." }, + "lg": { + "value": "var(--eds-typography-preset-005)" + }, "md": { "value": "var(--eds-typography-preset-011)" }, diff --git a/src/tokens-dist/css/variables.css b/src/tokens-dist/css/variables.css index d3df35522..8b43c7009 100644 --- a/src/tokens-dist/css/variables.css +++ b/src/tokens-dist/css/variables.css @@ -290,6 +290,7 @@ --eds-theme-typography-callout: var(--eds-typography-preset-002-light); --eds-theme-typography-overline-sm: var(--eds-typography-preset-012); --eds-theme-typography-overline-md: var(--eds-typography-preset-011); + --eds-theme-typography-overline-lg: var(--eds-typography-preset-005); --eds-theme-typography-overline: var(--eds-typography-preset-011); /* @deprecated This should not be used in code or design. It will be removed in a future version of EDS. */ --eds-theme-typography-caption-sm-bold: var(--eds-typography-preset-010); --eds-theme-typography-caption-sm: var(--eds-typography-preset-010-light); diff --git a/src/tokens-dist/json/variables-nested.json b/src/tokens-dist/json/variables-nested.json index 58a354081..be7bcac2e 100644 --- a/src/tokens-dist/json/variables-nested.json +++ b/src/tokens-dist/json/variables-nested.json @@ -255,6 +255,7 @@ }, "overline": { "@": "var(--eds-typography-preset-011)", + "lg": "var(--eds-typography-preset-005)", "md": "var(--eds-typography-preset-011)", "sm": "var(--eds-typography-preset-012)" }, diff --git a/src/util/variant-types.ts b/src/util/variant-types.ts index fe540f09e..1ffd404ca 100644 --- a/src/util/variant-types.ts +++ b/src/util/variant-types.ts @@ -80,7 +80,8 @@ export const presets = [ 'caption-md-bold', 'caption-sm', 'caption-sm-bold', - 'overline', + 'overline', // @deprecated This should not be used in code or design. It will be removed in a future version of EDS." + 'overline-lg', 'overline-md', 'overline-sm', 'callout',