diff options
Diffstat (limited to 'src/objects/_heading.vars.scss')
| -rw-r--r-- | src/objects/_heading.vars.scss | 123 |
1 files changed, 123 insertions, 0 deletions
diff --git a/src/objects/_heading.vars.scss b/src/objects/_heading.vars.scss new file mode 100644 index 0000000..90278c8 --- /dev/null +++ b/src/objects/_heading.vars.scss | |||
| @@ -0,0 +1,123 @@ | |||
| 1 | @use 'iro-sass/src/props'; | ||
| 2 | @use '../core.vars' as core; | ||
| 3 | |||
| 4 | $offset: props.def(--o-heading--offset, -.02em) !default; | ||
| 5 | $margin-bs: props.def(--o-heading--margin-bs, props.get(core.$size--700)) !default; | ||
| 6 | $margin-bs-sibling: props.def(--o-heading--margin-bs-sibling, props.get(core.$size--325)) !default; | ||
| 7 | |||
| 8 | $text-color: props.def(--o-heading--text-color, props.get(core.$theme, --heading), 'color') !default; | ||
| 9 | $bg-color: props.def(--o-heading--bg-color, props.get(core.$theme, --base, --50), 'color') !default; | ||
| 10 | |||
| 11 | $font-family: props.def(--o-heading--font-family, props.get(core.$font--standard--family)) !default; | ||
| 12 | $line-height: props.def(--o-heading--line-height, props.get(core.$font--standard--line-height)) !default; | ||
| 13 | $font-weight: props.def(--o-heading--font-weight, bold) !default; | ||
| 14 | $feature-settings: props.def(--o-heading--feature-settings, props.get(core.$font--standard--feature-settings)) !default; | ||
| 15 | |||
| 16 | $font-family--xxl: props.def(--o-heading--xxl--font-family, props.get(core.$font--headline--family)) !default; | ||
| 17 | $line-height--xxl: props.def(--o-heading--xxl--line-height, props.get(core.$font--headline--line-height)) !default; | ||
| 18 | $font-size--xxl: props.def(--o-heading--xxl--font-size, props.get(core.$font-size--300)) !default; | ||
| 19 | $font-weight--xxl: props.def(--o-heading--xxl--font-weight, props.get(core.$font--headline--weight)) !default; | ||
| 20 | $letter-spacing--xxl: props.def(--o-heading--xxl--letter-spacing, 0) !default; | ||
| 21 | $feature-settings--xxl: props.def(--o-heading--xxl--feature-settings, props.get(core.$font--headline--feature-settings)) !default; | ||
| 22 | |||
| 23 | $font-family--xl: props.def(--o-heading--xl--font-family, props.get(core.$font--headline--family)) !default; | ||
| 24 | $line-height--xl: props.def(--o-heading--xl--line-height, props.get(core.$font--headline--line-height)) !default; | ||
| 25 | $font-size--xl: props.def(--o-heading--xl--font-size, props.get(core.$font-size--200)) !default; | ||
| 26 | $font-weight--xl: props.def(--o-heading--xl--font-weight, props.get(core.$font--headline--weight)) !default; | ||
| 27 | $letter-spacing--xl: props.def(--o-heading--xl--letter-spacing, 0) !default; | ||
| 28 | $feature-settings--xl: props.def(--o-heading--xl--feature-settings, props.get(core.$font--headline--feature-settings)) !default; | ||
| 29 | |||
| 30 | $font-family--lg: props.def(--o-heading--lg--font-family, props.get(core.$font--standard--family)) !default; | ||
| 31 | $line-height--lg: props.def(--o-heading--lg--line-height, props.get(core.$font--standard--line-height)) !default; | ||
| 32 | $font-size--lg: props.def(--o-heading--lg--font-size, props.get(core.$font-size--150)) !default; | ||
| 33 | $font-weight--lg: props.def(--o-heading--lg--font-weight, bold) !default; | ||
| 34 | $letter-spacing--lg: props.def(--o-heading--lg--letter-spacing, 0) !default; | ||
| 35 | $feature-settings--lg: props.def(--o-heading--lg--feature-settings, props.get(core.$font--standard--feature-settings)) !default; | ||
| 36 | |||
| 37 | $font-family--md: props.def(--o-heading--md--font-family, props.get(core.$font--standard--family)) !default; | ||
| 38 | $line-height--md: props.def(--o-heading--md--line-height, props.get(core.$font--standard--line-height)) !default; | ||
| 39 | $font-size--md: props.def(--o-heading--md--font-size, props.get(core.$font-size--100)) !default; | ||
| 40 | $font-weight--md: props.def(--o-heading--md--font-weight, bold) !default; | ||
| 41 | $letter-spacing--md: props.def(--o-heading--md--letter-spacing, 0) !default; | ||
| 42 | $feature-settings--md: props.def(--o-heading--md--feature-settings, props.get(core.$font--standard--feature-settings)) !default; | ||
| 43 | |||
| 44 | $font-family--sm: props.def(--o-heading--sm--font-family, props.get(core.$font--standard--family)) !default; | ||
| 45 | $line-height--sm: props.def(--o-heading--sm--line-height, props.get(core.$font--standard--line-height)) !default; | ||
| 46 | $font-size--sm: props.def(--o-heading--sm--font-size, props.get(core.$font-size--75)) !default; | ||
| 47 | $font-weight--sm: props.def(--o-heading--sm--font-weight, 500) !default; | ||
| 48 | $letter-spacing--sm: props.def(--o-heading--sm--letter-spacing, 1px) !default; | ||
| 49 | $feature-settings--sm: props.def(--o-heading--sm--feature-settings, props.get(core.$font--standard--feature-settings)) !default; | ||
| 50 | |||
| 51 | $font-family--xs: props.def(--o-heading--xs--font-family, props.get(core.$font--standard--family)) !default; | ||
| 52 | $line-height--xs: props.def(--o-heading--xs--line-height, props.get(core.$font--standard--line-height)) !default; | ||
| 53 | $font-size--xs: props.def(--o-heading--xs--font-size, props.get(core.$font-size--50)) !default; | ||
| 54 | $font-weight--xs: props.def(--o-heading--xs--font-weight, 500) !default; | ||
| 55 | $letter-spacing--xs: props.def(--o-heading--xs--letter-spacing, 1px) !default; | ||
| 56 | $feature-settings--xs: props.def(--o-heading--xs--feature-settings, props.get(core.$font--standard--feature-settings)) !default; | ||
| 57 | |||
| 58 | $sizes: ( | ||
| 59 | 'xs' $font-family--xs $line-height--xs $font-size--xs $font-weight--xs $letter-spacing--xs $feature-settings--xs, | ||
| 60 | 'sm' $font-family--sm $line-height--sm $font-size--sm $font-weight--sm $letter-spacing--sm $feature-settings--sm, | ||
| 61 | 'md' $font-family--md $line-height--md $font-size--md $font-weight--md $letter-spacing--md $feature-settings--md, | ||
| 62 | 'lg' $font-family--lg $line-height--lg $font-size--lg $font-weight--lg $letter-spacing--lg $feature-settings--lg, | ||
| 63 | 'xl' $font-family--xl $line-height--xl $font-size--xl $font-weight--xl $letter-spacing--xl $feature-settings--xl, | ||
| 64 | 'xxl' $font-family--xxl $line-height--xxl $font-size--xxl $font-weight--xxl $letter-spacing--xxl $feature-settings--xxl, | ||
| 65 | ) !default; | ||
| 66 | |||
| 67 | $display--font-family--xxl: props.def(--o-heading--display--xxl--font-family, props.get(core.$font--headline--family)) !default; | ||
| 68 | $display--line-height--xxl: props.def(--o-heading--display--xxl--line-height, props.get(core.$font--headline--line-height)) !default; | ||
| 69 | $display--font-size--xxl: props.def(--o-heading--display--xxl--font-size, props.get(core.$font-size--1100)) !default; | ||
| 70 | $display--font-weight--xxl: props.def(--o-heading--display--xxl--font-weight, props.get(core.$font--headline--weight)) !default; | ||
| 71 | $display--letter-spacing--xxl: props.def(--o-heading--display--xxl--letter-spacing, 0) !default; | ||
| 72 | $display--feature-settings--xxl: props.def(--o-heading--display--xxl--feature-settings, props.get(core.$font--headline--feature-settings)) !default; | ||
| 73 | |||
| 74 | $display--font-family--xl: props.def(--o-heading--display--xl--font-family, props.get(core.$font--headline--family)) !default; | ||
| 75 | $display--line-height--xl: props.def(--o-heading--display--xl--line-height, props.get(core.$font--headline--line-height)) !default; | ||
| 76 | $display--font-size--xl: props.def(--o-heading--display--xl--font-size, props.get(core.$font-size--700)) !default; | ||
| 77 | $display--font-weight--xl: props.def(--o-heading--display--xl--font-weight, props.get(core.$font--headline--weight)) !default; | ||
| 78 | $display--letter-spacing--xl: props.def(--o-heading--display--xl--letter-spacing, 0) !default; | ||
| 79 | $display--feature-settings--xl: props.def(--o-heading--display--xl--feature-settings, props.get(core.$font--headline--feature-settings)) !default; | ||
| 80 | |||
| 81 | $display--font-family--lg: props.def(--o-heading--display--lg--font-family, props.get(core.$font--headline--family)) !default; | ||
| 82 | $display--line-height--lg: props.def(--o-heading--display--lg--line-height, props.get(core.$font--headline--line-height)) !default; | ||
| 83 | $display--font-size--lg: props.def(--o-heading--display--lg--font-size, props.get(core.$font-size--300)) !default; | ||
| 84 | $display--font-weight--lg: props.def(--o-heading--display--lg--font-weight, props.get(core.$font--headline--weight)) !default; | ||
| 85 | $display--letter-spacing--lg: props.def(--o-heading--display--lg--letter-spacing, 0) !default; | ||
| 86 | $display--feature-settings--lg: props.def(--o-heading--display--lg--feature-settings, props.get(core.$font--headline--feature-settings)) !default; | ||
| 87 | |||
| 88 | $display--font-family--md: props.def(--o-heading--display--md--font-family, props.get(core.$font--headline--family)) !default; | ||
| 89 | $display--line-height--md: props.def(--o-heading--display--md--line-height, props.get(core.$font--headline--line-height)) !default; | ||
| 90 | $display--font-size--md: props.def(--o-heading--display--md--font-size, props.get(core.$font-size--150)) !default; | ||
| 91 | $display--font-weight--md: props.def(--o-heading--display--md--font-weight, props.get(core.$font--headline--weight)) !default; | ||
| 92 | $display--letter-spacing--md: props.def(--o-heading--display--md--letter-spacing, 0) !default; | ||
| 93 | $display--feature-settings--md: props.def(--o-heading--display--md--feature-settings, props.get(core.$font--headline--feature-settings)) !default; | ||
| 94 | |||
| 95 | $display--font-family--sm: props.def(--o-heading--display--sm--font-family, props.get(core.$font--standard--family)) !default; | ||
| 96 | $display--line-height--sm: props.def(--o-heading--display--sm--line-height, props.get(core.$font--standard--line-height)) !default; | ||
| 97 | $display--font-size--sm: props.def(--o-heading--display--sm--font-size, props.get(core.$font-size--75)) !default; | ||
| 98 | $display--font-weight--sm: props.def(--o-heading--display--sm--font-weight, bold) !default; | ||
| 99 | $display--letter-spacing--sm: props.def(--o-heading--display--sm--letter-spacing, 0) !default; | ||
| 100 | $display--feature-settings--sm: props.def(--o-heading--display--sm--feature-settings, props.get(core.$font--standard--feature-settings)) !default; | ||
| 101 | |||
| 102 | $display--font-family--xs: props.def(--o-heading--display--xs--font-family, props.get(core.$font--standard--family)) !default; | ||
| 103 | $display--line-height--xs: props.def(--o-heading--display--xs--line-height, props.get(core.$font--standard--line-height)) !default; | ||
| 104 | $display--font-size--xs: props.def(--o-heading--display--xs--font-size, props.get(core.$font-size--50)) !default; | ||
| 105 | $display--font-weight--xs: props.def(--o-heading--display--xs--font-weight, 500) !default; | ||
| 106 | $display--letter-spacing--xs: props.def(--o-heading--display--xs--letter-spacing, 1px) !default; | ||
| 107 | $display--feature-settings--xs: props.def(--o-heading--display--xs--feature-settings, props.get(core.$font--standard--feature-settings)) !default; | ||
| 108 | |||
| 109 | $display--font-size--xxl--md: props.def(--o-heading--display--xxl--font-size, props.get(core.$font-size--900), 'md') !default; | ||
| 110 | $display--font-size--xl--md: props.def(--o-heading--display--xl--font-size, props.get(core.$font-size--600), 'md') !default; | ||
| 111 | $display--font-size--lg--md: props.def(--o-heading--display--lg--font-size, props.get(core.$font-size--200), 'md') !default; | ||
| 112 | $display--font-size--md--md: props.def(--o-heading--display--md--font-size, props.get(core.$font-size--100), 'md') !default; | ||
| 113 | $display--font-size--sm--md: props.def(--o-heading--display--sm--font-size, props.get(core.$font-size--75), 'md') !default; | ||
| 114 | $display--font-size--xs--md: props.def(--o-heading--display--xs--font-size, props.get(core.$font-size--50), 'md') !default; | ||
| 115 | |||
| 116 | $display--sizes: ( | ||
| 117 | '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, | ||
| 118 | '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, | ||
| 119 | '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, | ||
| 120 | '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, | ||
| 121 | '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, | ||
| 122 | '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, | ||
| 123 | ) !default; | ||