Example #1
0
 /**
  * Cycle through the font options for the given element and collect an array
  * of option values that are non-default.
  *
  * @since  1.3.0.
  *
  * @param  string    $element    The element to parse the options for.
  * @param  bool      $force      True to include properties that have default values.
  * @return array                 An array of non-default CSS declarations.
  */
 function ttfmake_parse_font_properties($element, $force = false)
 {
     /**
      * Filter the array of customizable font properties and their sanitization callbacks.
      *
      * css_property => sanitize_callback
      *
      * @since 1.3.0.
      *
      * @param array    $properties    The array of font properties and callbacks.
      */
     $properties = apply_filters('make_css_font_properties', array('font-family' => 'ttfmake_sanitize_font_choice', 'font-size' => 'absint', 'font-weight' => 'ttfmake_sanitize_choice', 'font-style' => 'ttfmake_sanitize_choice', 'text-transform' => 'ttfmake_sanitize_choice', 'line-height' => 'ttfmake_sanitize_float', 'letter-spacing' => 'ttfmake_sanitize_float', 'word-spacing' => 'absint'), $element);
     $declarations = array();
     foreach ($properties as $property => $callback) {
         $setting_id = $property . '-' . $element;
         $value = get_theme_mod($setting_id, ttfmake_get_default($setting_id));
         $sanitized_value = call_user_func_array($callback, array($value, $setting_id));
         if (true === $force || false !== $value && $value !== ttfmake_get_default($setting_id)) {
             if ('font-family' === $property) {
                 $declarations[$property] = ttfmake_get_font_stack($sanitized_value);
             } else {
                 if ('font-size' === $property) {
                     $declarations[$property . '-px'] = $sanitized_value . 'px';
                     $declarations[$property . '-rem'] = ttfmake_convert_px_to_rem($sanitized_value) . 'rem';
                 } else {
                     if (in_array($property, array('letter-spacing', 'word-spacing'))) {
                         $declarations[$property] = $sanitized_value . 'px';
                     } else {
                         $declarations[$property] = $sanitized_value;
                     }
                 }
             }
         }
     }
     return $declarations;
 }
Example #2
0
 /**
  * Build the CSS rules for the custom fonts
  *
  * @since  1.0.0.
  *
  * @return void
  */
 function ttfmake_css_legacy_fonts()
 {
     /**
      * Font Families
      */
     // Get and escape options
     $font_site_title = get_theme_mod('font-site-title', ttfmake_get_default('font-site-title'));
     $font_site_title_stack = ttfmake_get_font_stack($font_site_title);
     $font_header = get_theme_mod('font-header', ttfmake_get_default('font-header'));
     $font_header_stack = ttfmake_get_font_stack($font_header);
     $font_body = get_theme_mod('font-body', ttfmake_get_default('font-body'));
     $font_body_stack = ttfmake_get_font_stack($font_body);
     // Site Title Font
     if ($font_site_title !== ttfmake_get_default('font-site-title') && '' !== $font_site_title_stack) {
         ttfmake_get_css()->add(array('selectors' => array('.site-title', '.font-site-title'), 'declarations' => array('font-family' => $font_site_title_stack)));
     }
     // Header Font
     if ($font_header !== ttfmake_get_default('font-header') && '' !== $font_header_stack) {
         ttfmake_get_css()->add(array('selectors' => array('h1', 'h2', 'h3', 'h4', 'h5', 'h6', '.font-header'), 'declarations' => array('font-family' => $font_header_stack)));
     }
     // Body Font
     if ($font_body !== ttfmake_get_default('font-body') && '' !== $font_body_stack) {
         ttfmake_get_css()->add(array('selectors' => array('body', '.font-body'), 'declarations' => array('font-family' => $font_body_stack)));
     }
     /**
      * Font Sizes
      */
     // Get and escape options
     $font_site_title_size = absint(get_theme_mod('font-site-title-size', ttfmake_get_default('font-site-title-size')));
     $font_site_tagline_size = absint(get_theme_mod('font-site-tagline-size', ttfmake_get_default('font-site-tagline-size')));
     $font_nav_size = absint(get_theme_mod('font-nav-size', ttfmake_get_default('font-nav-size')));
     $font_header_size = absint(get_theme_mod('font-header-size', ttfmake_get_default('font-header-size')));
     $font_widget_size = absint(get_theme_mod('font-widget-size', ttfmake_get_default('font-widget-size')));
     $font_body_size = absint(get_theme_mod('font-body-size', ttfmake_get_default('font-body-size')));
     // Relative font sizes
     $percent = ttfmake_font_get_relative_sizes();
     // Site Title Font Size
     if ($font_site_title_size !== ttfmake_get_default('font-site-title-size')) {
         ttfmake_get_css()->add(array('selectors' => array('.site-title', '.font-site-title'), 'declarations' => array('font-size-px' => $font_site_title_size . 'px', 'font-size-rem' => ttfmake_convert_px_to_rem($font_site_title_size) . 'rem')));
     }
     // Site Tagline Font Size
     if ($font_site_tagline_size !== ttfmake_get_default('font-site-tagline-size')) {
         ttfmake_get_css()->add(array('selectors' => array('.site-description', '.font-site-tagline'), 'declarations' => array('font-size-px' => $font_site_tagline_size . 'px', 'font-size-rem' => ttfmake_convert_px_to_rem($font_site_tagline_size) . 'rem')));
     }
     // Navigation Font Size
     if ($font_nav_size !== ttfmake_get_default('font-nav-size')) {
         // Top level
         ttfmake_get_css()->add(array('selectors' => array('.site-navigation .menu li a', '.font-nav'), 'declarations' => array('font-size-px' => $font_nav_size . 'px', 'font-size-rem' => ttfmake_convert_px_to_rem($font_nav_size) . 'rem')));
         // Sub menu items
         ttfmake_get_css()->add(array('selectors' => array('.site-navigation .menu .sub-menu li a', '.site-navigation .menu .children li a'), 'declarations' => array('font-size-px' => ttfmake_get_relative_font_size($font_nav_size, $percent['sub-menu']) . 'px', 'font-size-rem' => ttfmake_convert_px_to_rem(ttfmake_get_relative_font_size($font_nav_size, $percent['sub-menu'])) . 'rem'), 'media' => 'screen and (min-width: 800px)'));
         // Grandchild arrow position
         ttfmake_get_css()->add(array('selectors' => array('.site-navigation .menu .sub-menu .menu-item-has-children a:after', '.site-navigation .menu .children .menu-item-has-children a:after'), 'declarations' => array('top' => $font_nav_size * 1.4 / 2 - 5 . 'px'), 'media' => 'screen and (min-width: 800px)'));
     }
     // Header Font Sizes
     if ($font_header_size !== ttfmake_get_default('font-header-size')) {
         // h1
         ttfmake_get_css()->add(array('selectors' => array('h1', '.font-header'), 'declarations' => array('font-size-px' => $font_header_size . 'px', 'font-size-rem' => ttfmake_convert_px_to_rem($font_header_size) . 'rem')));
         // h2
         ttfmake_get_css()->add(array('selectors' => array('h2'), 'declarations' => array('font-size-px' => ttfmake_get_relative_font_size($font_header_size, $percent['h2']) . 'px', 'font-size-rem' => ttfmake_convert_px_to_rem(ttfmake_get_relative_font_size($font_header_size, $percent['h2'])) . 'rem')));
         // h3
         ttfmake_get_css()->add(array('selectors' => array('h3', '.builder-text-content .widget-title'), 'declarations' => array('font-size-px' => ttfmake_get_relative_font_size($font_header_size, $percent['h3']) . 'px', 'font-size-rem' => ttfmake_convert_px_to_rem(ttfmake_get_relative_font_size($font_header_size, $percent['h3'])) . 'rem')));
         // h4
         ttfmake_get_css()->add(array('selectors' => array('h4'), 'declarations' => array('font-size-px' => ttfmake_get_relative_font_size($font_header_size, $percent['h4']) . 'px', 'font-size-rem' => ttfmake_convert_px_to_rem(ttfmake_get_relative_font_size($font_header_size, $percent['h4'])) . 'rem')));
         // h5
         ttfmake_get_css()->add(array('selectors' => array('h5'), 'declarations' => array('font-size-px' => ttfmake_get_relative_font_size($font_header_size, $percent['h5']) . 'px', 'font-size-rem' => ttfmake_convert_px_to_rem(ttfmake_get_relative_font_size($font_header_size, $percent['h5'])) . 'rem')));
         // h6
         ttfmake_get_css()->add(array('selectors' => array('h6'), 'declarations' => array('font-size-px' => ttfmake_get_relative_font_size($font_header_size, $percent['h6']) . 'px', 'font-size-rem' => ttfmake_convert_px_to_rem(ttfmake_get_relative_font_size($font_header_size, $percent['h6'])) . 'rem')));
         // Post title with two sidebars
         ttfmake_get_css()->add(array('selectors' => array('.has-left-sidebar.has-right-sidebar .entry-title'), 'declarations' => array('font-size-px' => ttfmake_get_relative_font_size($font_header_size, $percent['post-title']) . 'px', 'font-size-rem' => ttfmake_convert_px_to_rem(ttfmake_get_relative_font_size($font_header_size, $percent['post-title'])) . 'rem'), 'media' => 'screen and (min-width: 800px)'));
     }
     // Widget Font Size
     if ($font_widget_size !== ttfmake_get_default('font-widget-size')) {
         // Widget body
         ttfmake_get_css()->add(array('selectors' => array('.widget', '.font-widget'), 'declarations' => array('font-size-px' => $font_widget_size . 'px', 'font-size-rem' => ttfmake_convert_px_to_rem($font_widget_size) . 'rem')));
         // Widget title
         ttfmake_get_css()->add(array('selectors' => array('.widget-title'), 'declarations' => array('font-size-px' => ttfmake_get_relative_font_size($font_widget_size, $percent['widget-title']) . 'px', 'font-size-rem' => ttfmake_convert_px_to_rem(ttfmake_get_relative_font_size($font_widget_size, $percent['widget-title'])) . 'rem')));
     }
     // Body Font Size
     if ($font_body_size !== ttfmake_get_default('font-body-size')) {
         // body
         ttfmake_get_css()->add(array('selectors' => array('body', '.font-body', '.builder-text-content .widget'), 'declarations' => array('font-size-px' => $font_body_size . 'px', 'font-size-rem' => ttfmake_convert_px_to_rem($font_body_size) . 'rem')));
         // Comments
         ttfmake_get_css()->add(array('selectors' => array('#comments'), 'declarations' => array('font-size-px' => ttfmake_get_relative_font_size($font_body_size, $percent['comments']) . 'px', 'font-size-rem' => ttfmake_convert_px_to_rem(ttfmake_get_relative_font_size($font_body_size, $percent['comments'])) . 'rem')));
         // Comment date
         ttfmake_get_css()->add(array('selectors' => array('.comment-date'), 'declarations' => array('font-size-px' => ttfmake_get_relative_font_size($font_body_size, $percent['comment-date']) . 'px', 'font-size-rem' => ttfmake_convert_px_to_rem(ttfmake_get_relative_font_size($font_body_size, $percent['comment-date'])) . 'rem')));
     }
 }