Varia: use font-family mixin for main-nav font family
This commit is contained in:
parent
2f63861611
commit
e73a05f972
7 changed files with 22 additions and 8 deletions
|
@ -322,8 +322,10 @@ $config-header: (
|
|||
),
|
||||
// Fonts
|
||||
"font": (
|
||||
"family": map-deep-get($config-global, "font", "family", "secondary"),
|
||||
"family-css-variable": '--font-base',
|
||||
"family": (
|
||||
"fallback": map-deep-get($config-global, "font", "family", "secondary"),
|
||||
"css-var": '--font-base',
|
||||
),
|
||||
"size": map-deep-get($config-global, "font", "size", "md"),
|
||||
"weight": normal,
|
||||
"line-height": 1,
|
||||
|
|
|
@ -39,8 +39,7 @@
|
|||
}
|
||||
|
||||
a {
|
||||
font-family: #{map-deep-get($config-header, "main-nav", "font", "family")}; // For browsers without support for CSS variables.
|
||||
font-family: var( #{map-deep-get($config-header, "main-nav", "font", "family-css-variable")}, #{map-deep-get($config-header, "main-nav", "font", "family")} );
|
||||
@include font-family( map-deep-get( $config-header, "main-nav", "font", "family" ) );
|
||||
font-weight: #{map-deep-get($config-header, "main-nav", "font", "weight")};
|
||||
padding: #{map-deep-get($config-header, "main-nav", "link-padding")};
|
||||
|
||||
|
|
|
@ -35,8 +35,10 @@ $config-header: (
|
|||
),
|
||||
// Fonts
|
||||
"font": (
|
||||
"family": map-deep-get($config-global, "font", "family", "primary"),
|
||||
"family-css-variable": '--font-headings',
|
||||
"family": (
|
||||
"fallback": map-deep-get($config-global, "font", "family", "primary"),
|
||||
"css-var": '--font-headings',
|
||||
),
|
||||
"size": map-deep-get($config-global, "font", "size", "md"),
|
||||
"weight": bold,
|
||||
"line-height": 1,
|
||||
|
|
|
@ -146,8 +146,7 @@
|
|||
a {
|
||||
color: #{map-deep-get($config-header, "main-nav", "color", "link")};
|
||||
display: block;
|
||||
font-family: #{map-deep-get($config-header, "main-nav", "font", "family")}; // For browsers without support for CSS variables.
|
||||
font-family: var( #{map-deep-get($config-header, "main-nav", "font", "family-css-variable")}, #{map-deep-get($config-header, "main-nav", "font", "family")} );
|
||||
@include font-family( map-deep-get($config-header, "main-nav", "font", "family" ) );
|
||||
font-weight: #{map-deep-get($config-header, "main-nav", "font", "weight")};
|
||||
padding: #{0.5 * map-deep-get($config-header, "main-nav", "link-padding")} 0;
|
||||
|
||||
|
|
|
@ -112,6 +112,10 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
|
|||
* Crop Text Boundry
|
||||
* - Sets a fixed-width on content within alignwide and alignfull blocks
|
||||
*/
|
||||
/**
|
||||
* Add font-family using CSS variables.
|
||||
* It also adds the proper fallback for browsers without support.
|
||||
*/
|
||||
/**
|
||||
* Base
|
||||
* - Reset the browser
|
||||
|
|
|
@ -135,6 +135,10 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
|
|||
* Crop Text Boundry
|
||||
* - Sets a fixed-width on content within alignwide and alignfull blocks
|
||||
*/
|
||||
/**
|
||||
* Add font-family using CSS variables.
|
||||
* It also adds the proper fallback for browsers without support.
|
||||
*/
|
||||
/**
|
||||
* Base
|
||||
* - Reset the browser
|
||||
|
|
|
@ -135,6 +135,10 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
|
|||
* Crop Text Boundry
|
||||
* - Sets a fixed-width on content within alignwide and alignfull blocks
|
||||
*/
|
||||
/**
|
||||
* Add font-family using CSS variables.
|
||||
* It also adds the proper fallback for browsers without support.
|
||||
*/
|
||||
/**
|
||||
* Base
|
||||
* - Reset the browser
|
||||
|
|
Loading…
Reference in a new issue