diff options
author | Julien Déramond <julien.deramond@orange.com> | 2022-07-12 00:16:33 +0300 |
---|---|---|
committer | GitHub <noreply@github.com> | 2022-07-12 00:16:33 +0300 |
commit | a1224482f209762024b1fc2080b24cded8242f3d (patch) | |
tree | f250da30ad44250bdde7ca9b106c74fb405cbe5b | |
parent | ac654a0f66e10dbe0db530d9058a6ba0d67d673a (diff) |
Add `$display-font-family` and `$display-font-style` (#36711)
-rw-r--r-- | scss/_type.scss | 2 | ||||
-rw-r--r-- | scss/_variables.scss | 2 | ||||
-rw-r--r-- | site/content/docs/5.2/content/typography.md | 2 |
3 files changed, 6 insertions, 0 deletions
diff --git a/scss/_type.scss b/scss/_type.scss index b2d524ca14..37d64bf89c 100644 --- a/scss/_type.scss +++ b/scss/_type.scss @@ -35,6 +35,8 @@ @each $display, $font-size in $display-font-sizes { .display-#{$display} { @include font-size($font-size); + font-family: $display-font-family; + font-style: $display-font-style; font-weight: $display-font-weight; line-height: $display-line-height; } diff --git a/scss/_variables.scss b/scss/_variables.scss index 761bb455dc..75205c39a7 100644 --- a/scss/_variables.scss +++ b/scss/_variables.scss @@ -604,6 +604,8 @@ $display-font-sizes: ( 6: 2.5rem ) !default; +$display-font-family: null !default; +$display-font-style: null !default; $display-font-weight: 300 !default; $display-line-height: $headings-line-height !default; // scss-docs-end display-headings diff --git a/site/content/docs/5.2/content/typography.md b/site/content/docs/5.2/content/typography.md index 3c71df7d11..7330132810 100644 --- a/site/content/docs/5.2/content/typography.md +++ b/site/content/docs/5.2/content/typography.md @@ -88,6 +88,8 @@ Traditional heading elements are designed to work best in the meat of your page Display headings are configured via the `$display-font-sizes` Sass map and two variables, `$display-font-weight` and `$display-line-height`. +Display headings are customizable via two variables, `$display-font-family` and `$display-font-style`. + {{< scss-docs name="display-headings" file="scss/_variables.scss" >}} ## Lead |