From c1b24fc8d1786ec8963c50d82320dcdc0367934e Mon Sep 17 00:00:00 2001 From: Volpeon Date: Fri, 7 Nov 2025 18:13:11 +0100 Subject: Add text-transform variable for headings --- src/objects/_heading.vars.scss | 37 +++++++++++++++++++++++++------------ 1 file changed, 25 insertions(+), 12 deletions(-) (limited to 'src/objects/_heading.vars.scss') diff --git a/src/objects/_heading.vars.scss b/src/objects/_heading.vars.scss index 1d6df26..371cab0 100644 --- a/src/objects/_heading.vars.scss +++ b/src/objects/_heading.vars.scss @@ -12,6 +12,7 @@ $font-family: props.def(--o-heading--font-family, props.get(core.$font--sta $line-height: props.def(--o-heading--line-height, props.get(core.$font--standard--line-height)) !default; $font-weight: props.def(--o-heading--font-weight, bold) !default; $feature-settings: props.def(--o-heading--feature-settings, props.get(core.$font--standard--feature-settings)) !default; +$text-transform: props.def(--o-heading--text-transform, none) !default; $font-family--xxl: props.def(--o-heading--xxl--font-family, props.get(core.$font--headline--family)) !default; $line-height--xxl: props.def(--o-heading--xxl--line-height, props.get(core.$font--headline--line-height)) !default; @@ -19,6 +20,7 @@ $font-size--xxl: props.def(--o-heading--xxl--font-size, props.get(core.$f $font-weight--xxl: props.def(--o-heading--xxl--font-weight, props.get(core.$font--headline--weight)) !default; $letter-spacing--xxl: props.def(--o-heading--xxl--letter-spacing, 0) !default; $feature-settings--xxl: props.def(--o-heading--xxl--feature-settings, props.get(core.$font--headline--feature-settings)) !default; +$text-transform--xxl: props.def(--o-heading--xxl--text-transform, none) !default; $font-family--xl: props.def(--o-heading--xl--font-family, props.get(core.$font--headline--family)) !default; $line-height--xl: props.def(--o-heading--xl--line-height, props.get(core.$font--headline--line-height)) !default; @@ -26,6 +28,7 @@ $font-size--xl: props.def(--o-heading--xl--font-size, props.get(core.$fon $font-weight--xl: props.def(--o-heading--xl--font-weight, props.get(core.$font--headline--weight)) !default; $letter-spacing--xl: props.def(--o-heading--xl--letter-spacing, 0) !default; $feature-settings--xl: props.def(--o-heading--xl--feature-settings, props.get(core.$font--headline--feature-settings)) !default; +$text-transform--xl: props.def(--o-heading--xl--text-transform, none) !default; $font-family--lg: props.def(--o-heading--lg--font-family, props.get(core.$font--standard--family)) !default; $line-height--lg: props.def(--o-heading--lg--line-height, props.get(core.$font--standard--line-height)) !default; @@ -33,6 +36,7 @@ $font-size--lg: props.def(--o-heading--lg--font-size, props.get(core.$fon $font-weight--lg: props.def(--o-heading--lg--font-weight, bold) !default; $letter-spacing--lg: props.def(--o-heading--lg--letter-spacing, 0) !default; $feature-settings--lg: props.def(--o-heading--lg--feature-settings, props.get(core.$font--standard--feature-settings)) !default; +$text-transform--lg: props.def(--o-heading--lg--text-transform, none) !default; $font-family--md: props.def(--o-heading--md--font-family, props.get(core.$font--standard--family)) !default; $line-height--md: props.def(--o-heading--md--line-height, props.get(core.$font--standard--line-height)) !default; @@ -40,6 +44,7 @@ $font-size--md: props.def(--o-heading--md--font-size, props.get(core.$fon $font-weight--md: props.def(--o-heading--md--font-weight, bold) !default; $letter-spacing--md: props.def(--o-heading--md--letter-spacing, 0) !default; $feature-settings--md: props.def(--o-heading--md--feature-settings, props.get(core.$font--standard--feature-settings)) !default; +$text-transform--md: props.def(--o-heading--md--text-transform, none) !default; $font-family--sm: props.def(--o-heading--sm--font-family, props.get(core.$font--standard--family)) !default; $line-height--sm: props.def(--o-heading--sm--line-height, props.get(core.$font--standard--line-height)) !default; @@ -47,6 +52,7 @@ $font-size--sm: props.def(--o-heading--sm--font-size, props.get(core.$fon $font-weight--sm: props.def(--o-heading--sm--font-weight, 500) !default; $letter-spacing--sm: props.def(--o-heading--sm--letter-spacing, 1px) !default; $feature-settings--sm: props.def(--o-heading--sm--feature-settings, props.get(core.$font--standard--feature-settings)) !default; +$text-transform--sm: props.def(--o-heading--sm--text-transform, none) !default; $font-family--xs: props.def(--o-heading--xs--font-family, props.get(core.$font--standard--family)) !default; $line-height--xs: props.def(--o-heading--xs--line-height, props.get(core.$font--standard--line-height)) !default; @@ -54,14 +60,15 @@ $font-size--xs: props.def(--o-heading--xs--font-size, props.get(core.$fon $font-weight--xs: props.def(--o-heading--xs--font-weight, 500) !default; $letter-spacing--xs: props.def(--o-heading--xs--letter-spacing, 1px) !default; $feature-settings--xs: props.def(--o-heading--xs--feature-settings, props.get(core.$font--standard--feature-settings)) !default; +$text-transform--xs: props.def(--o-heading--xs--text-transform, none) !default; $sizes: ( - 'xs' $font-family--xs $line-height--xs $font-size--xs $font-weight--xs $letter-spacing--xs $feature-settings--xs, - 'sm' $font-family--sm $line-height--sm $font-size--sm $font-weight--sm $letter-spacing--sm $feature-settings--sm, - 'md' $font-family--md $line-height--md $font-size--md $font-weight--md $letter-spacing--md $feature-settings--md, - 'lg' $font-family--lg $line-height--lg $font-size--lg $font-weight--lg $letter-spacing--lg $feature-settings--lg, - 'xl' $font-family--xl $line-height--xl $font-size--xl $font-weight--xl $letter-spacing--xl $feature-settings--xl, - 'xxl' $font-family--xxl $line-height--xxl $font-size--xxl $font-weight--xxl $letter-spacing--xxl $feature-settings--xxl, + 'xs' $font-family--xs $line-height--xs $font-size--xs $font-weight--xs $letter-spacing--xs $feature-settings--xs $text-transform--xs, + 'sm' $font-family--sm $line-height--sm $font-size--sm $font-weight--sm $letter-spacing--sm $feature-settings--sm $text-transform--sm, + 'md' $font-family--md $line-height--md $font-size--md $font-weight--md $letter-spacing--md $feature-settings--md $text-transform--md, + 'lg' $font-family--lg $line-height--lg $font-size--lg $font-weight--lg $letter-spacing--lg $feature-settings--lg $text-transform--lg, + 'xl' $font-family--xl $line-height--xl $font-size--xl $font-weight--xl $letter-spacing--xl $feature-settings--xl $text-transform--xl, + 'xxl' $font-family--xxl $line-height--xxl $font-size--xxl $font-weight--xxl $letter-spacing--xxl $feature-settings--xxl $text-transform--xxl, ) !default; $display--font-family--xxl: props.def(--o-heading--display--xxl--font-family, props.get(core.$font--headline--family)) !default; @@ -70,6 +77,7 @@ $display--font-size--xxl: props.def(--o-heading--display--xxl--font-size, $display--font-weight--xxl: props.def(--o-heading--display--xxl--font-weight, props.get(core.$font--headline--weight)) !default; $display--letter-spacing--xxl: props.def(--o-heading--display--xxl--letter-spacing, 0) !default; $display--feature-settings--xxl: props.def(--o-heading--display--xxl--feature-settings, props.get(core.$font--headline--feature-settings)) !default; +$display--text-transform--xxl: props.def(--o-heading--display--xxl--text-transform, none) !default; $display--font-family--xl: props.def(--o-heading--display--xl--font-family, props.get(core.$font--headline--family)) !default; $display--line-height--xl: props.def(--o-heading--display--xl--line-height, props.get(core.$font--headline--line-height)) !default; @@ -77,6 +85,7 @@ $display--font-size--xl: props.def(--o-heading--display--xl--font-size, p $display--font-weight--xl: props.def(--o-heading--display--xl--font-weight, props.get(core.$font--headline--weight)) !default; $display--letter-spacing--xl: props.def(--o-heading--display--xl--letter-spacing, 0) !default; $display--feature-settings--xl: props.def(--o-heading--display--xl--feature-settings, props.get(core.$font--headline--feature-settings)) !default; +$display--text-transform--xl: props.def(--o-heading--display--xl--text-transform, none) !default; $display--font-family--lg: props.def(--o-heading--display--lg--font-family, props.get(core.$font--headline--family)) !default; $display--line-height--lg: props.def(--o-heading--display--lg--line-height, props.get(core.$font--headline--line-height)) !default; @@ -84,6 +93,7 @@ $display--font-size--lg: props.def(--o-heading--display--lg--font-size, p $display--font-weight--lg: props.def(--o-heading--display--lg--font-weight, props.get(core.$font--headline--weight)) !default; $display--letter-spacing--lg: props.def(--o-heading--display--lg--letter-spacing, 0) !default; $display--feature-settings--lg: props.def(--o-heading--display--lg--feature-settings, props.get(core.$font--headline--feature-settings)) !default; +$display--text-transform--lg: props.def(--o-heading--display--lg--text-transform, none) !default; $display--font-family--md: props.def(--o-heading--display--md--font-family, props.get(core.$font--headline--family)) !default; $display--line-height--md: props.def(--o-heading--display--md--line-height, props.get(core.$font--headline--line-height)) !default; @@ -91,6 +101,7 @@ $display--font-size--md: props.def(--o-heading--display--md--font-size, p $display--font-weight--md: props.def(--o-heading--display--md--font-weight, props.get(core.$font--headline--weight)) !default; $display--letter-spacing--md: props.def(--o-heading--display--md--letter-spacing, 0) !default; $display--feature-settings--md: props.def(--o-heading--display--md--feature-settings, props.get(core.$font--headline--feature-settings)) !default; +$display--text-transform--md: props.def(--o-heading--display--md--text-transform, none) !default; $display--font-family--sm: props.def(--o-heading--display--sm--font-family, props.get(core.$font--standard--family)) !default; $display--line-height--sm: props.def(--o-heading--display--sm--line-height, props.get(core.$font--standard--line-height)) !default; @@ -98,6 +109,7 @@ $display--font-size--sm: props.def(--o-heading--display--sm--font-size, p $display--font-weight--sm: props.def(--o-heading--display--sm--font-weight, bold) !default; $display--letter-spacing--sm: props.def(--o-heading--display--sm--letter-spacing, 0) !default; $display--feature-settings--sm: props.def(--o-heading--display--sm--feature-settings, props.get(core.$font--standard--feature-settings)) !default; +$display--text-transform--sm: props.def(--o-heading--display--sm--text-transform, none) !default; $display--font-family--xs: props.def(--o-heading--display--xs--font-family, props.get(core.$font--standard--family)) !default; $display--line-height--xs: props.def(--o-heading--display--xs--line-height, props.get(core.$font--standard--line-height)) !default; @@ -105,6 +117,7 @@ $display--font-size--xs: props.def(--o-heading--display--xs--font-size, p $display--font-weight--xs: props.def(--o-heading--display--xs--font-weight, 500) !default; $display--letter-spacing--xs: props.def(--o-heading--display--xs--letter-spacing, 1px) !default; $display--feature-settings--xs: props.def(--o-heading--display--xs--feature-settings, props.get(core.$font--standard--feature-settings)) !default; +$display--text-transform--xs: props.def(--o-heading--display--xs--text-transform, none) !default; $display--font-size--xxl--md: props.def(--o-heading--display--xxl--font-size, props.get(core.$font-size--900), 'md') !default; $display--font-size--xl--md: props.def(--o-heading--display--xl--font-size, props.get(core.$font-size--600), 'md') !default; @@ -114,10 +127,10 @@ $display--font-size--sm--md: props.def(--o-heading--display--sm--font-size, pro $display--font-size--xs--md: props.def(--o-heading--display--xs--font-size, props.get(core.$font-size--50), 'md') !default; $display--sizes: ( - 'xs' $display--font-family--xs $display--line-height--xs $display--font-size--xs $display--font-weight--xs $display--letter-spacing--xs $display--feature-settings--xs, - 'sm' $display--font-family--sm $display--line-height--sm $display--font-size--sm $display--font-weight--sm $display--letter-spacing--sm $display--feature-settings--sm, - 'md' $display--font-family--md $display--line-height--md $display--font-size--md $display--font-weight--md $display--letter-spacing--md $display--feature-settings--md, - 'lg' $display--font-family--lg $display--line-height--lg $display--font-size--lg $display--font-weight--lg $display--letter-spacing--lg $display--feature-settings--lg, - 'xl' $display--font-family--xl $display--line-height--xl $display--font-size--xl $display--font-weight--xl $display--letter-spacing--xl $display--feature-settings--xl, - 'xxl' $display--font-family--xxl $display--line-height--xxl $display--font-size--xxl $display--font-weight--xxl $display--letter-spacing--xxl $display--feature-settings--xxl, + 'xs' $display--font-family--xs $display--line-height--xs $display--font-size--xs $display--font-weight--xs $display--letter-spacing--xs $display--feature-settings--xs $display--text-transform--xs, + 'sm' $display--font-family--sm $display--line-height--sm $display--font-size--sm $display--font-weight--sm $display--letter-spacing--sm $display--feature-settings--sm $display--text-transform--sm, + 'md' $display--font-family--md $display--line-height--md $display--font-size--md $display--font-weight--md $display--letter-spacing--md $display--feature-settings--md $display--text-transform--md, + 'lg' $display--font-family--lg $display--line-height--lg $display--font-size--lg $display--font-weight--lg $display--letter-spacing--lg $display--feature-settings--lg $display--text-transform--lg, + 'xl' $display--font-family--xl $display--line-height--xl $display--font-size--xl $display--font-weight--xl $display--letter-spacing--xl $display--feature-settings--xl $display--text-transform--xl, + 'xxl' $display--font-family--xxl $display--line-height--xxl $display--font-size--xxl $display--font-weight--xxl $display--letter-spacing--xxl $display--feature-settings--xxl $display--text-transform--xxl, ) !default; -- cgit v1.2.3-70-g09d2