change default fonts to montserrat, roboto

This commit is contained in:
Ray Elliott 2020-05-08 11:59:13 +00:00
parent ac2cea0d8a
commit f7ae24aa05
2 changed files with 82 additions and 1 deletions

View File

@ -8,6 +8,25 @@
// Exit if accessed directly. // Exit if accessed directly.
defined( 'ABSPATH' ) || exit; defined( 'ABSPATH' ) || exit;
function google_fonts() {
$google_fonts = apply_filters(
'storefront_google_font_families', array(
// 'source-sans-pro' => 'Source+Sans+Pro:400,300,300italic,400italic,600,700,900',
'montserrat' => 'Montserrat:400',
'roboto' => 'Roboto:300,400,600',
)
);
$query_args = array(
'family' => implode( '|', $google_fonts ),
'subset' => rawurlencode( 'latin,latin-ext' ),
);
$fonts_url = add_query_arg( $query_args, 'https://fonts.googleapis.com/css' );
return $fonts_url;
}
if ( ! function_exists( 'understrap_scripts' ) ) { if ( ! function_exists( 'understrap_scripts' ) ) {
/** /**
* Load theme's JavaScript and CSS sources. * Load theme's JavaScript and CSS sources.
@ -20,6 +39,8 @@ if ( ! function_exists( 'understrap_scripts' ) ) {
$css_version = $theme_version . '.' . filemtime( get_template_directory() . '/css/theme.min.css' ); $css_version = $theme_version . '.' . filemtime( get_template_directory() . '/css/theme.min.css' );
wp_enqueue_style( 'understrap-styles', get_template_directory_uri() . '/css/theme.min.css', array(), $css_version ); wp_enqueue_style( 'understrap-styles', get_template_directory_uri() . '/css/theme.min.css', array(), $css_version );
wp_enqueue_style( '_s-google-fonts', google_fonts(), array(), null );
wp_enqueue_script( 'jquery' ); wp_enqueue_script( 'jquery' );
$js_version = $theme_version . '.' . filemtime( get_template_directory() . '/js/theme.min.js' ); $js_version = $theme_version . '.' . filemtime( get_template_directory() . '/js/theme.min.js' );

View File

@ -3,4 +3,64 @@
// Just copy a variable from src/sass/bootstrap4/_variables.scss, paste it here and edit the value. // Just copy a variable from src/sass/bootstrap4/_variables.scss, paste it here and edit the value.
$primary: #5533ff; // Thats a sample how you could change a BootStrap variable. $primary: #3311cc; // Thats a sample how you could change a BootStrap variable.
// stylelint-disable value-keyword-case
$font-family-sans-serif: Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
$font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
$font-family-base: $font-family-sans-serif;
// stylelint-enable value-keyword-case
$font-size-base: 1rem; // Assumes the browser default, typically `16px`
$font-size-lg: $font-size-base * 1.25;
$font-size-sm: $font-size-base * .875;
$font-weight-lighter: lighter;
$font-weight-light: 300;
$font-weight-normal: 400;
$font-weight-bold: 600;
$font-weight-bolder: bolder;
$font-weight-base: $font-weight-normal;
$line-height-base: 1.5;
$h1-font-size: $font-size-base * 2.5;
$h2-font-size: $font-size-base * 2;
$h3-font-size: $font-size-base * 1.75;
$h4-font-size: $font-size-base * 1.5;
$h5-font-size: $font-size-base * 1.25;
$h6-font-size: $font-size-base;
$headings-font-family: Montserrat, -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
$headings-font-weight: 400;
$headings-line-height: 1.2;
$headings-color: null;
$display1-size: 6rem;
$display2-size: 5.5rem;
$display3-size: 4.5rem;
$display4-size: 3.5rem;
$display1-weight: 300;
$display2-weight: 300;
$display3-weight: 300;
$display4-weight: 300;
$display-line-height: $headings-line-height;
$lead-font-size: $font-size-base * 1.25;
$lead-font-weight: 300;
$small-font-size: 80%;
$blockquote-small-font-size: $small-font-size;
$blockquote-font-size: $font-size-base * 1.25;
$mark-padding: .2em;
$dt-font-weight: $font-weight-bold;
$nested-kbd-font-weight: $font-weight-bold;
$list-inline-padding: .5rem;
$mark-bg: #fcf8e3;