diff options
Diffstat (limited to 'inc/builder')
136 files changed, 14241 insertions, 0 deletions
diff --git a/inc/builder/class-astra-builder-loader.php b/inc/builder/class-astra-builder-loader.php new file mode 100644 index 0000000..191b1b4 --- /dev/null +++ b/inc/builder/class-astra-builder-loader.php @@ -0,0 +1,179 @@ +<?php +/** + * Astra Builder Loader. + * + * @package astra-builder + */ + +// No direct access, please. +if ( ! defined( 'ABSPATH' ) ) { + exit; +} + +if ( ! class_exists( 'Astra_Builder_Loader' ) ) { + + /** + * Class Astra_Builder_Loader. + */ + final class Astra_Builder_Loader { + + /** + * Member Variable + * + * @var instance + */ + private static $instance = null; + + /** + * Initiator + */ + public static function get_instance() { + + if ( is_null( self::$instance ) ) { + self::$instance = new self(); + do_action( 'astra_builder_loaded' ); + } + + return self::$instance; + } + + /** + * Constructor + */ + public function __construct() { + + // @codingStandardsIgnoreStart WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + /** + * Builder Core Files. + */ + require_once ASTRA_THEME_DIR . 'inc/core/builder/class-astra-builder-helper.php'; + require_once ASTRA_THEME_DIR . 'inc/core/builder/class-astra-builder-options.php'; + + if( ! is_customize_preview( ) ){ + require_once ASTRA_THEME_DIR . 'inc/core/builder/class-astra-builder-admin.php'; + } + /** + * Builder - Header & Footer Markup. + */ + require_once ASTRA_THEME_DIR . 'inc/builder/markup/class-astra-builder-header.php'; + require_once ASTRA_THEME_DIR . 'inc/builder/markup/class-astra-builder-footer.php'; + + /** + * Builder Controllers. + */ + require_once ASTRA_THEME_DIR . 'inc/builder/controllers/class-astra-builder-widget-controller.php'; + require_once ASTRA_THEME_DIR . 'inc/builder/controllers/class-astra-builder-ui-controller.php'; + /** + * Customizer - Configs. + */ + require_once ASTRA_THEME_DIR . 'inc/customizer/class-astra-builder-customizer.php'; + + /**DONE */ + + if ( true === Astra_Builder_Helper::$is_header_footer_builder_active ) { + add_filter( 'astra_existing_header_footer_configs', '__return_false' ); + add_filter( 'astra_addon_existing_header_footer_configs', '__return_false' ); + } + // @codingStandardsIgnoreEnd WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + + add_action( 'wp', array( $this, 'load_markup' ), 100 ); + + add_filter( 'astra_quick_settings', array( $this, 'quick_settings' ) ); + } + + /** + * Update Quick Settings links. + * + * @param array $quick_settings Links to the Quick Settings in Astra. + * @since 3.0.0 + */ + public function quick_settings( $quick_settings ) { + + if ( false === Astra_Builder_Helper::$is_header_footer_builder_active ) { + return $quick_settings; + } + + $quick_settings['header']['title'] = __( 'Header Builder', 'astra' ); + $quick_settings['header']['quick_url'] = admin_url( 'customize.php?autofocus[section]=section-header-builder-layout' ); + + $quick_settings['footer']['title'] = __( 'Footer Builder', 'astra' ); + $quick_settings['footer']['quick_url'] = admin_url( 'customize.php?autofocus[section]=section-footer-builder-layout' ); + + return $quick_settings; + } + + /** + * Advanced Hooks markup loader + * + * Loads appropriate template file based on the style option selected in options panel. + * + * @since 3.0.0 + */ + public function load_markup() { + + if ( ! defined( 'ASTRA_ADVANCED_HOOKS_POST_TYPE' ) || false === Astra_Builder_Helper::$is_header_footer_builder_active ) { + return; + } + + $option = array( + 'location' => 'ast-advanced-hook-location', + 'exclusion' => 'ast-advanced-hook-exclusion', + 'users' => 'ast-advanced-hook-users', + ); + + $result = Astra_Target_Rules_Fields::get_instance()->get_posts_by_conditions( ASTRA_ADVANCED_HOOKS_POST_TYPE, $option ); + $header_counter = 0; + $footer_counter = 0; + $layout_404_counter = 0; + + foreach ( $result as $post_id => $post_data ) { + $post_type = get_post_type(); + + if ( ASTRA_ADVANCED_HOOKS_POST_TYPE !== $post_type ) { + + $layout = get_post_meta( $post_id, 'ast-advanced-hook-layout', false ); + + if ( isset( $layout[0] ) && '404-page' == $layout[0] && 0 == $layout_404_counter ) { + + $layout_404_settings = get_post_meta( $post_id, 'ast-404-page', true ); + if ( isset( $layout_404_settings['disable_header'] ) && 'enabled' == $layout_404_settings['disable_header'] ) { + remove_action( 'astra_header', array( Astra_Builder_Header::get_instance(), 'header_builder_markup' ) ); + } + + if ( isset( $layout_404_settings['disable_footer'] ) && 'enabled' == $layout_404_settings['disable_footer'] ) { + remove_action( 'astra_footer', array( Astra_Builder_Footer::get_instance(), 'footer_markup' ) ); + } + + $layout_404_counter ++; + } elseif ( isset( $layout[0] ) && 'header' == $layout[0] && 0 == $header_counter ) { + // Remove default site's header. + remove_action( 'astra_header', array( Astra_Builder_Header::get_instance(), 'header_builder_markup' ) ); + $header_counter++; + } elseif ( isset( $layout[0] ) && 'footer' == $layout[0] && 0 == $footer_counter ) { + // Remove default site's footer. + remove_action( 'astra_footer', array( Astra_Builder_Footer::get_instance(), 'footer_markup' ) ); + $footer_counter++; + } + } + } + } + } + + /** + * Prepare if class 'Astra_Builder_Loader' exist. + * Kicking this off by calling 'get_instance()' method + */ + Astra_Builder_Loader::get_instance(); +} + + +if ( ! function_exists( 'astra_builder' ) ) { + /** + * Get global class. + * + * @return object + */ + function astra_builder() { + return Astra_Builder_Loader::get_instance(); + } +} diff --git a/inc/builder/controllers/class-astra-builder-ui-controller.php b/inc/builder/controllers/class-astra-builder-ui-controller.php new file mode 100644 index 0000000..0363351 --- /dev/null +++ b/inc/builder/controllers/class-astra-builder-ui-controller.php @@ -0,0 +1,490 @@ +<?php +/** + * Astra Builder UI Controller. + * + * @package astra-builder + */ + +// No direct access, please. +if ( ! defined( 'ABSPATH' ) ) { + exit; +} + +if ( ! class_exists( 'Astra_Builder_UI_Controller' ) ) { + + /** + * Class Astra_Builder_UI_Controller. + */ + final class Astra_Builder_UI_Controller { + + /** + * Astra SVGs. + * + * @var ast_svgs + */ + private static $ast_svgs = null; + + /** + * Get an SVG Icon + * + * @param string $icon the icon name. + * @param bool $base if the baseline class should be added. + */ + public static function fetch_svg_icon( $icon = '', $base = true ) { + $output = '<span class="ahfb-svg-iconset ast-inline-flex' . ( $base ? ' svg-baseline' : '' ) . '">'; + + if ( ! self::$ast_svgs ) { + ob_start(); + include_once ASTRA_THEME_DIR . 'assets/svg/svgs.json'; // phpcs:ignore WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + self::$ast_svgs = json_decode( ob_get_clean(), true ); + self::$ast_svgs = apply_filters( 'astra_svg_icons', self::$ast_svgs ); + } + + $output .= isset( self::$ast_svgs[ $icon ] ) ? self::$ast_svgs[ $icon ] : ''; + $output .= '</span>'; + + return $output; + } + + /** + * Prepare Social Icon HTML. + * + * @param string $index The Index of the social icon. + * @param string $builder_type the type of the builder. + */ + public static function render_social_icon( $index, $builder_type = 'header' ) { + $items = astra_get_option( $builder_type . '-social-icons-' . $index ); + $items = isset( $items['items'] ) ? $items['items'] : array(); + $show_label = astra_get_option( $builder_type . '-social-' . $index . '-label-toggle' ); + $color_type = astra_get_option( $builder_type . '-social-' . $index . '-color-type' ); + $social_stack = astra_get_option( $builder_type . '-social-' . $index . '-stack', 'none' ); + + echo '<div class="ast-' . esc_attr( $builder_type ) . '-social-' . esc_attr( $index ) . '-wrap ast-' . esc_attr( $builder_type ) . '-social-wrap">'; + + if ( is_customize_preview() ) { + self::render_customizer_edit_button(); + } + + echo '<div class="' . esc_attr( $builder_type ) . '-social-inner-wrap element-social-inner-wrap social-show-label-' . ( $show_label ? 'true' : 'false' ) . ' ast-social-color-type-' . esc_attr( $color_type ) . ' ast-social-stack-' . esc_attr( $social_stack ) . ' ast-social-element-style-filled">'; + + if ( is_array( $items ) && ! empty( $items ) ) { + + foreach ( $items as $item ) { + if ( $item['enabled'] ) { + + $link = $item['url']; + + switch ( $item['id'] ) { + + case 'phone': + $link = 'tel:' . $item['url']; + break; + + case 'email': + $link = 'mailto:' . $item['url']; + break; + + case 'whatsapp': + $link = 'https://api.whatsapp.com/send?phone=' . $item['url']; + break; + } + + echo '<a href="' . esc_url( $link ) . '"' . esc_attr( $item['label'] ? ' aria-label=' . $item['label'] . '' : ' aria-label=' . $item['id'] . '' ) . ' ' . ( 'phone' === $item['id'] || 'email' === $item['id'] ? '' : 'target="_blank" rel="noopener noreferrer" ' ) . 'style="--color: ' . esc_attr( ! empty( $item['color'] ) ? $item['color'] : '#3a3a3a' ) . '; --background-color: ' . esc_attr( ! empty( $item['background'] ) ? $item['background'] : 'transparent' ) . ';" class="ast-builder-social-element ast-inline-flex ast-' . esc_attr( $item['id'] ) . ' ' . esc_attr( $builder_type ) . '-social-item">'; + echo self::fetch_svg_icon( $item['icon'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped + + if ( $show_label ) { + echo '<span class="social-item-label">' . esc_html( $item['label'] ) . '</span>'; + } + + echo '</a>'; + } + } + } + echo apply_filters( 'astra_social_icons_after', '' ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped + echo '</div>'; + echo '</div>'; + } + + /** + * Prepare HTML Markup. + * + * @param string $index Key of the HTML Control. + */ + public static function render_html_markup( $index = 'header-html-1' ) { + + $theme_author = astra_get_theme_author_details(); + + $content = astra_get_option( $index ); + if ( $content || is_customize_preview() ) { + $link_style = ''; + echo '<div class="ast-header-html inner-link-style-' . esc_attr( $link_style ) . '">'; + if ( is_customize_preview() ) { + self::render_customizer_edit_button(); + } + echo '<div class="ast-builder-html-element">'; + $content = str_replace( '[copyright]', '©', $content ); + $content = str_replace( '[current_year]', gmdate( 'Y' ), $content ); + $content = str_replace( '[site_title]', get_bloginfo( 'name' ), $content ); + $content = str_replace( '[theme_author]', '<a href=" ' . esc_url( $theme_author['theme_author_url'] ) . '" rel="nofollow noopener" target="_blank">' . $theme_author['theme_name'] . '</a>', $content ); + echo do_shortcode( wpautop( $content ) ); + echo '</div>'; + echo '</div>'; + } + } + + /** + * Prepare Edit icon inside customizer. + */ + public static function render_customizer_edit_button() { + ?> + <div class="customize-partial-edit-shortcut" data-id="ahfb"> + <button aria-label="<?php esc_attr_e( 'Click to edit this element.', 'astra' ); ?>" + title="<?php esc_attr_e( 'Click to edit this element.', 'astra' ); ?>" + class="customize-partial-edit-shortcut-button item-customizer-focus"> + <?php echo self::fetch_svg_icon( 'edit' ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?> + </button> + </div> + <?php + } + + /** + * Prepare Special Edit navigatory trigger for Builder Grid Rows in customizer. + * + * @param string $type Header / Footer row type. + * @param string $row_position Above / Primary / Below. + * + * @since 3.0.0 + */ + public static function render_grid_row_customizer_edit_button( $type, $row_position ) { + + switch ( $row_position ) { + case 'primary': + /* translators: %s: icon term */ + $row_label = sprintf( __( 'Primary %s', 'astra' ), $type ); + break; + case 'above': + /* translators: %s: icon term */ + $row_label = sprintf( __( 'Above %s', 'astra' ), $type ); + break; + case 'below': + /* translators: %s: icon term */ + $row_label = sprintf( __( 'Below %s', 'astra' ), $type ); + break; + default: + $row_label = $type; + break; + } + + ?> + <div class="customize-partial-edit-shortcut row-editor-shortcut" data-id="ahfb"> + <button aria-label="<?php esc_attr_e( 'Click to edit this element.', 'astra' ); ?>" title="<?php esc_attr_e( 'Click to edit this Row.', 'astra' ); ?>" class="item-customizer-focus"> + <?php echo self::fetch_svg_icon( 'edit' ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?> + </button> + </div> + <?php + } + + /** + * Render Trigger Markup. + * + * @since 3.0.0 + */ + public static function render_mobile_trigger() { + + $icon = astra_get_option( 'header-trigger-icon' ); + $mobile_label = astra_get_option( 'mobile-header-menu-label' ); + $toggle_btn_style = astra_get_option( 'mobile-header-toggle-btn-style' ); + $aria_controls = ''; + if ( false === Astra_Builder_Helper::$is_header_footer_builder_active ) { + $aria_controls = 'aria-controls="primary-menu"'; + } + ?> + <div class="ast-button-wrap"> + <button type="button" class="menu-toggle main-header-menu-toggle ast-mobile-menu-trigger-<?php echo esc_attr( $toggle_btn_style ); ?>" <?php echo apply_filters( 'astra_nav_toggle_data_attrs', '' ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?> <?php echo esc_attr( $aria_controls ); ?> aria-expanded="false"> + <span class="screen-reader-text">Main Menu</span> + <span class="mobile-menu-toggle-icon"> + <?php + echo self::fetch_svg_icon( $icon ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped + echo self::fetch_svg_icon( 'close' ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped + ?> + </span> + <?php + if ( isset( $mobile_label ) && ! empty( $mobile_label ) ) { + ?> + + <span class="mobile-menu-wrap"> + <span class="mobile-menu"><?php echo esc_html( $mobile_label ); ?></span> + </span> + <?php + } + ?> + </button> + </div> + <?php + } + + /** + * Prepare Button HTML. + * + * @param string $index The Index of the button. + * @param string $builder_type the type of the builder. + */ + public static function render_button( $index, $builder_type = 'header' ) { + if ( is_customize_preview() ) { + self::render_customizer_edit_button(); + } + + $button_size = astra_get_option( $builder_type . '-button' . $index . '-size' ); + + echo '<div class="ast-builder-button-wrap ast-builder-button-size-' . $button_size . '">'; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped + echo astra_get_custom_button( $builder_type . '-button' . $index . '-text', $builder_type . '-button' . $index . '-link-option', 'header-button' ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped + echo '</div>'; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped + } + + /** + * Site Identity. + */ + public static function render_site_identity() { + ?> + <?php + if ( is_customize_preview() ) { + self::render_customizer_edit_button(); + } + ?> + <div + <?php + echo astra_attr( + 'site-identity', + array( + 'class' => 'site-branding ast-site-identity', + ) + ); + ?> + > + <?php astra_logo(); ?> + </div> + <!-- .site-branding --> + <?php + } + + /** + * Render Mobile Cart Flyout Markup. + * + * @since 3.1.0 + */ + public static function render_mobile_cart_flyout_markup() { + ?> + <div class="astra-mobile-cart-overlay"></div> + <div id="astra-mobile-cart-drawer" class="astra-cart-drawer open-right"> + <div class="astra-cart-drawer-header"> + <button type="button" class="astra-cart-drawer-close"> + <?php echo self::fetch_svg_icon( 'close' ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?> + </button> + <div class="astra-cart-drawer-title"> + <?php + echo apply_filters( 'astra_header_cart_flyout_shopping_cart_text', __( 'Shopping Cart', 'astra' ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped + ?> + </div> + </div> + <div class="astra-cart-drawer-content"> + <?php + if ( class_exists( 'Astra_Woocommerce' ) ) { + the_widget( 'WC_Widget_Cart', 'title=' ); + } + if ( class_exists( 'Easy_Digital_Downloads' ) ) { + the_widget( 'edd_cart_widget', 'title=' ); + } + ?> + </div> + </div> + <?php + } + /** + * Account HTML. + */ + public static function render_account() { + + $is_logged_in = is_user_logged_in(); + + $link_href = ''; + $new_tab = ''; + $link_rel = ''; + $account_link = ''; + $link_url = ''; + $logout_preview = astra_get_option( 'header-account-logout-preview' ); + $is_customizer = is_customize_preview(); + $logged_out_style = astra_get_option( 'header-account-logout-style' ); + + if ( ! $is_logged_in && 'none' === $logged_out_style ) { + return; + } + + $icon_skin = ( '' !== astra_get_option( 'header-account-icon-type' ) ) ? astra_get_option( 'header-account-icon-type' ) : 'account-1'; + + ?> + + <div class="ast-header-account-wrap"> + <?php + if ( $is_customizer ) { + self::render_customizer_edit_button(); + } + + ?> + + <?php if ( $is_logged_in && ( ( ( ( ! $logout_preview ) || ( 'none' === $logged_out_style && $logout_preview ) ) && $is_customizer ) || ( ! $is_customizer ) ) ) { ?> + + <?php + + $account_type = astra_get_option( 'header-account-type' ); + + $login_profile_type = astra_get_option( 'header-account-login-style' ); + + $action_type = astra_get_option( 'header-account-action-type' ); + $link_type = astra_get_option( 'header-account-link-type' ); + + $account_link = astra_get_option( 'header-account-login-link' ); + + $logged_in_text = astra_get_option( 'header-account-logged-in-text' ); + + if ( 'default' !== $account_type && 'default' === $link_type && defined( 'ASTRA_EXT_VER' ) ) { + $new_tab = 'target=_self'; + if ( 'woocommerce' === $account_type && class_exists( 'WooCommerce' ) ) { + + $woocommerce_link = get_permalink( get_option( 'woocommerce_myaccount_page_id' ) ); + + $link_url = ( $woocommerce_link ) ? $woocommerce_link : ''; + + } elseif ( 'lifterlms' === $account_type && class_exists( 'LifterLMS' ) ) { + + $lifterlms_link = get_permalink( llms_get_page_id( 'myaccount' ) ); + + $link_url = ( $lifterlms_link ) ? $lifterlms_link : ''; + } + } elseif ( '' !== $account_link && '' !== $account_link['url'] ) { + + $link_url = $account_link['url']; + + $new_tab = ( $account_link['new_tab'] ? 'target=_blank' : 'target=_self' ); + + $link_rel = ( ! empty( $account_link['link_rel'] ) ? 'rel=' . esc_attr( $account_link['link_rel'] ) : '' ); + } + + $link_href = ( '' !== $link_url ) ? 'href=' . esc_url( $link_url ) : ''; + + $link_classes = 'ast-header-account-link ast-header-account-type-' . $login_profile_type . ' ast-account-action-' . $action_type; + ?> + <div class="ast-header-account-inner-wrap"> + <a class="<?php echo esc_attr( $link_classes ); ?>" aria-label="<?php esc_attr_e( 'Account icon link', 'astra' ); ?>" <?php echo esc_attr( $link_href . ' ' . $new_tab . ' ' . $link_rel ); ?> > + + <?php + if ( 'avatar' === $login_profile_type ) { + + echo get_avatar( get_current_user_id() ); + + } elseif ( 'icon' === $login_profile_type ) { + echo self::fetch_svg_icon( $icon_skin ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped + } elseif ( 'text' === $login_profile_type ) { + ?> + <span class="ast-header-account-text"><?php echo esc_html( $logged_in_text ); ?></span> + <?php } ?> + </a> + <?php + if ( defined( 'ASTRA_EXT_VER' ) && 'menu' === $action_type ) { + Astra_Header_Account_Component::account_menu_markup(); + } + ?> + </div> + <?php } elseif ( ( 'none' !== $logged_out_style ) && ( ( ! $is_logged_in ) || ( $is_logged_in && $logout_preview && $is_customizer ) ) ) { ?> + + <?php + $logged_out_style_class = ''; + $action_type = astra_get_option( 'header-account-logout-action' ); + $logged_out_style_class = 'ast-header-account-link ast-header-account-type-' . $logged_out_style . ' ast-account-action-' . $action_type; + $logged_out_text = astra_get_option( 'header-account-logged-out-text' ); + $login_link = astra_get_option( 'header-account-logout-link' ); + $show_lost_password = astra_get_option( 'header-account-login-lostpass' ); + $show_register = ( get_option( 'users_can_register' ) && astra_get_option( 'header-account-login-register' ) ); + + if ( '' !== $login_link && '' !== $login_link['url'] ) { + + $current_url = home_url( add_query_arg( array(), $GLOBALS['wp']->request ) ); + $default_login = wp_login_url(); + + if ( $default_login === $login_link['url'] ) { + $login_link['url'] = wp_login_url( $current_url ); + } + + $link_url = $login_link['url']; + $new_tab = ( $login_link['new_tab'] ? 'target=_blank' : 'target=_self' ); + + $link_rel = ( ! empty( $login_link['link_rel'] ) ? 'rel=' . esc_attr( $login_link['link_rel'] ) : '' ); + } + + $link_href = 'href=' . esc_url( $link_url ) . ''; + ?> + <a class="<?php echo esc_attr( $logged_out_style_class ); ?>" aria-label="<?php esc_attr_e( 'Account icon link', 'astra' ); ?>" <?php echo esc_attr( $link_href . ' ' . $new_tab . ' ' . $link_rel ); ?> > + <?php if ( 'icon' === $logged_out_style ) { ?> + <?php echo self::fetch_svg_icon( $icon_skin ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?> + <?php } elseif ( 'text' === $logged_out_style ) { ?> + <span class="ast-header-account-text"><?php echo esc_html( $logged_out_text ); ?></span> + <?php } ?> + </a> + <?php if ( defined( 'ASTRA_EXT_VER' ) && 'login' === $action_type ) { ?> + <div id="ast-hb-account-login-wrap" class="ast-hb-account-login-wrapper"> + <div class="ast-hb-account-login-bg"></div> + <div class="ast-hb-account-login"> + <div class="ast-hb-login-header"> + <button id="ast-hb-login-close" class="ast-hb-login-close" aria-label="Close popup"> + <span class="ast-svg-iconset"> + <?php echo self::fetch_svg_icon( 'close' ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?> + </span> + </button> + </div> + <div class="ast-hb-login-body"> + <div class="ast-hb-account-login-form"> + <?php + $args = array( + 'echo' => true, + 'remember' => true, + 'value_remember' => true, + ); + echo wp_login_form( $args ); + ?> + </div> + <div class="ast-hb-account-login-form-footer"> + <?php + if ( $show_lost_password || $show_register ) { + if ( $show_register ) { + $register_url = wp_registration_url(); + ?> + <a class="ast-header-account-footer-link" href="<?php echo esc_url( $register_url ); ?>" > + <span class="ast-header-account-register"><?php echo esc_html( __( 'Register', 'astra' ) ); ?></span> + </a> + <?php + } + if ( $show_lost_password ) { + $lostpass_url = wp_lostpassword_url(); + ?> + <a class="ast-header-account-footer-link" href="<?php echo esc_url( $lostpass_url ); ?>" > + <span class="ast-header-account-lostpass"><?php echo esc_html( __( 'Lost your password?', 'astra' ) ); ?></span> + </a> + <?php + } + } + ?> + </div> + </div> + </div> + </div> + <?php } ?> + <?php } ?> + + </div> + + <?php + } + + } +} + +?> diff --git a/inc/builder/controllers/class-astra-builder-widget-controller.php b/inc/builder/controllers/class-astra-builder-widget-controller.php new file mode 100644 index 0000000..5b7b909 --- /dev/null +++ b/inc/builder/controllers/class-astra-builder-widget-controller.php @@ -0,0 +1,132 @@ +<?php +/** + * Astra Builder Widget Controller. + * + * @package astra-builder + */ + +// No direct access, please. +if ( ! defined( 'ABSPATH' ) ) { + exit; +} + +if ( ! class_exists( 'Astra_Builder_Widget_Controller' ) ) { + + /** + * Class Astra_Builder_Widget_Controller. + */ + final class Astra_Builder_Widget_Controller { + + /** + * Member Variable + * + * @var instance + */ + private static $instance = null; + + + /** + * Initiator + */ + public static function get_instance() { + + if ( is_null( self::$instance ) ) { + self::$instance = new self(); + } + + return self::$instance; + } + + /** + * Constructor + */ + public function __construct() { + + add_action( 'widgets_init', array( $this, 'widget_init' ) ); + add_filter( 'customize_section_active', array( $this, 'display_sidebar' ), 99, 2 ); + + } + + /** + * Display sidebar as section. + * + * @param bool $active ios active. + * @param object $section section. + * @return bool + */ + public function display_sidebar( $active, $section ) { + + if ( false === Astra_Builder_Helper::$is_header_footer_builder_active ) { + return $active; + } + + if ( strpos( $section->id, 'widgets-footer-widget-' ) || strpos( $section->id, 'widgets-header-widget-' ) ) { + $active = true; + } + + return $active; + } + + /** + * Initiate Astra Widgets. + */ + public function widget_init() { + + if ( false === Astra_Builder_Helper::$is_header_footer_builder_active ) { + return; + } + + // Register Footer Widgets. + $component_limit = defined( 'ASTRA_EXT_VER' ) ? Astra_Builder_Helper::$component_limit : Astra_Builder_Helper::$num_of_footer_widgets; + for ( $index = 1; $index <= $component_limit; $index++ ) { + + if ( ! is_customize_preview() && ! Astra_Builder_Helper::is_component_loaded( 'widget-' . $index, 'footer' ) ) { + continue; + } + + $this->register_sidebar( $index, 'footer' ); + } + + $component_limit = defined( 'ASTRA_EXT_VER' ) ? Astra_Builder_Helper::$component_limit : Astra_Builder_Helper::$num_of_header_widgets; + for ( $index = 1; $index <= $component_limit; $index++ ) { + + if ( ! is_customize_preview() && ! Astra_Builder_Helper::is_component_loaded( 'widget-' . $index, 'header' ) ) { + continue; + } + + $this->register_sidebar( $index, 'header' ); + } + + } + + + /** + * Register widget for the builder. + * + * @param integer $index index of widget. + * @param string $builder_type builder type. + */ + public function register_sidebar( $index, $builder_type = 'header' ) { + register_sidebar( + apply_filters( + 'astra_' . $builder_type . '_widget_' . $index . 'args', + array( + 'name' => ucfirst( $builder_type ) . ' Builder Widget ' . $index, + 'id' => $builder_type . '-widget-' . $index, + 'description' => esc_html__( 'Add widgets here:', 'astra' ), + 'before_widget' => '<section id="%1$s" class="widget %2$s">', + 'after_widget' => '</section>', + 'before_title' => '<h2 class="widget-title">', + 'after_title' => '</h2>', + ) + ) + ); + } + } + + /** + * Prepare if class 'Astra_Builder_Widget_Controller' exist. + * Kicking this off by calling 'get_instance()' method + */ + Astra_Builder_Widget_Controller::get_instance(); +} diff --git a/inc/builder/markup/class-astra-builder-footer.php b/inc/builder/markup/class-astra-builder-footer.php new file mode 100644 index 0000000..f90d239 --- /dev/null +++ b/inc/builder/markup/class-astra-builder-footer.php @@ -0,0 +1,284 @@ +<?php +/** + * Astra Builder Loader. + * + * @package astra-builder + */ + +// No direct access, please. +if ( ! defined( 'ABSPATH' ) ) { + exit; +} + +if ( ! class_exists( 'Astra_Builder_Footer' ) ) { + + /** + * Class Astra_Builder_Footer. + */ + final class Astra_Builder_Footer { + + /** + * Member Variable + * + * @var instance + */ + private static $instance = null; + + /** + * Dynamic Methods. + * + * @var dynamic methods + */ + private static $methods = array(); + + /** + * Initiator + */ + public static function get_instance() { + + if ( is_null( self::$instance ) ) { + self::$instance = new self(); + } + + return self::$instance; + } + + /** + * Constructor + */ + public function __construct() { + + if ( true === Astra_Builder_Helper::$is_header_footer_builder_active ) { + + $this->remove_existing_actions(); + + // Footer Builder. + add_action( 'astra_footer', array( $this, 'footer_markup' ), 10 ); + + add_action( 'astra_above_footer', array( $this, 'above_footer' ), 10 ); + add_action( 'astra_primary_footer', array( $this, 'primary_footer' ), 10 ); + add_action( 'astra_below_footer', array( $this, 'below_footer' ), 10 ); + + add_action( 'astra_render_footer_column', array( $this, 'render_column' ), 10, 2 ); + + // Core Components. + add_action( 'astra_footer_copyright', array( $this, 'footer_copyright' ), 10 ); + + for ( $index = 1; $index <= Astra_Builder_Helper::$component_limit; $index++ ) { + + // Buttons. + add_action( 'astra_footer_button_' . $index, array( $this, 'button_' . $index ) ); + self::$methods[] = 'button_' . $index; + + // Htmls. + add_action( 'astra_footer_html_' . $index, array( $this, 'footer_html_' . $index ) ); + self::$methods[] = 'footer_html_' . $index; + + // Social Icons. + add_action( 'astra_footer_social_' . $index, array( $this, 'footer_social_' . $index ) ); + self::$methods[] = 'footer_social_' . $index; + + } + + // Navigation menu. + add_action( 'astra_footer_menu', array( $this, 'footer_menu' ) ); + } + } + + /** + * Callback when method not exists. + * + * @param string $func function name. + * @param array $params function parameters. + */ + public function __call( $func, $params ) { + + if ( in_array( $func, self::$methods, true ) ) { + + if ( 0 === strpos( $func, 'footer_html_' ) ) { + Astra_Builder_UI_Controller::render_html_markup( str_replace( '_', '-', $func ) ); + } elseif ( 0 === strpos( $func, 'button_' ) ) { + $index = (int) substr( $func, strrpos( $func, '_' ) + 1 ); + + if ( $index ) { + Astra_Builder_UI_Controller::render_button( $index, 'footer' ); + } + } elseif ( 0 === strpos( $func, 'footer_social_' ) ) { + $index = (int) substr( $func, strrpos( $func, '_' ) + 1 ); + + if ( $index ) { + Astra_Builder_UI_Controller::render_social_icon( $index, 'footer' ); + } + } + } + } + + + /** + * Remove existing Footer to load Footer Builder. + * + * @since 3.0.0 + * @return void + */ + public function remove_existing_actions() { + remove_action( 'astra_footer_content_top', 'astra_footer_content_top' ); + remove_action( 'astra_footer_content', 'astra_advanced_footer_markup', 1 ); + remove_action( 'astra_footer_content', 'astra_footer_small_footer_template', 5 ); + remove_action( 'astra_footer_content_bottom', 'astra_footer_content_bottom' ); + remove_action( 'astra_footer', 'astra_footer_markup' ); + } + + /** + * Astra Footer Markup. + */ + public function footer_markup() { + + $display_footer = get_post_meta( get_the_ID(), 'footer-sml-layout', true ); + + $display_footer = apply_filters( 'ast_footer_bar_display', $display_footer ); + + if ( 'disabled' !== $display_footer ) { + + get_template_part( 'template-parts/footer/builder/desktop-builder-layout' ); + } + } + + /** + * Call above footer UI. + */ + public function above_footer() { + + if ( astra_wp_version_compare( '5.4.99', '>=' ) ) { + + get_template_part( + 'template-parts/footer/builder/footer', + 'row', + array( + 'row' => 'above', + ) + ); + } else { + + set_query_var( 'row', 'above' ); + get_template_part( 'template-parts/footer/builder/footer', 'row' ); + } + + } + + /** + * Call primary footer UI. + */ + public function primary_footer() { + + if ( astra_wp_version_compare( '5.4.99', '>=' ) ) { + + get_template_part( + 'template-parts/footer/builder/footer', + 'row', + array( + 'row' => 'primary', + ) + ); + } else { + + set_query_var( 'row', 'primary' ); + get_template_part( 'template-parts/footer/builder/footer', 'row' ); + } + + } + + /** + * Call below footer UI. + */ + public function below_footer() { + + if ( astra_wp_version_compare( '5.4.99', '>=' ) ) { + + get_template_part( + 'template-parts/footer/builder/footer', + 'row', + array( + 'row' => 'below', + ) + ); + } else { + + set_query_var( 'row', 'below' ); + get_template_part( 'template-parts/footer/builder/footer', 'row' ); + } + + } + + /** + * Call component footer UI. + * + * @param string $row row. + * @param string $column column. + */ + public function render_column( $row, $column ) { + + Astra_Builder_Helper::render_builder_markup( $row, $column, 'desktop', 'footer' ); + } + + /** + * Render Footer Copyright Markup! + */ + public function footer_copyright() { + + $theme_author = astra_get_theme_author_details(); + + $content = astra_get_option( 'footer-copyright-editor' ); + if ( $content || is_customize_preview() ) { + echo '<div class="ast-footer-copyright">'; + $content = str_replace( '[copyright]', '©', $content ); + $content = str_replace( '[current_year]', gmdate( 'Y' ), $content ); + $content = str_replace( '[site_title]', get_bloginfo( 'name' ), $content ); + $content = str_replace( '[theme_author]', '<a href=" ' . esc_url( $theme_author['theme_author_url'] ) . '" rel="nofollow noopener" target="_blank">' . $theme_author['theme_name'] . '</a>', $content ); + echo do_shortcode( wpautop( $content ) ); + echo '</div>'; + } + + } + + /** + * Render HTML 1. + */ + public function footer_html_1() { + Astra_Builder_UI_Controller::render_html_markup( 'footer-html-1' ); + } + + /** + * Render HTML 2. + */ + public function footer_html_2() { + Astra_Builder_UI_Controller::render_html_markup( 'footer-html-2' ); + } + + /** + * Render HTML 3. + */ + public function footer_html_3() { + Astra_Builder_UI_Controller::render_html_markup( 'footer-html-3' ); + } + + /** + * Render HTML 4. + */ + public function footer_html_4() { + Astra_Builder_UI_Controller::render_html_markup( 'footer-html-4' ); + } + + /** + * Render Menu. + */ + public function footer_menu() { + Astra_Footer_Menu_Component::menu_markup(); + } + } + + /** + * Prepare if class 'Astra_Builder_Footer' exist. + * Kicking this off by calling 'get_instance()' method + */ + Astra_Builder_Footer::get_instance(); +} diff --git a/inc/builder/markup/class-astra-builder-header.php b/inc/builder/markup/class-astra-builder-header.php new file mode 100644 index 0000000..cd1cc51 --- /dev/null +++ b/inc/builder/markup/class-astra-builder-header.php @@ -0,0 +1,434 @@ +<?php +/** + * Astra Builder Loader. + * + * @package astra-builder + */ + +// No direct access, please. +if ( ! defined( 'ABSPATH' ) ) { + exit; +} + +if ( ! class_exists( 'Astra_Builder_Header' ) ) { + + /** + * Class Astra_Builder_Header. + */ + final class Astra_Builder_Header { + + /** + * Member Variable + * + * @var instance + */ + private static $instance = null; + + + /** + * Dynamic Methods. + * + * @var dynamic methods + */ + private static $methods = array(); + + + /** + * Initiator + */ + public static function get_instance() { + + if ( is_null( self::$instance ) ) { + self::$instance = new self(); + } + + return self::$instance; + } + + /** + * Constructor + */ + public function __construct() { + + if ( true === Astra_Builder_Helper::$is_header_footer_builder_active ) { + + $this->remove_existing_actions(); + + add_action( 'body_class', array( $this, 'add_body_class' ) ); + // Header Desktop Builder. + add_action( 'astra_masthead', array( $this, 'desktop_header' ) ); + add_action( 'astra_above_header', array( $this, 'above_header' ) ); + add_action( 'astra_primary_header', array( $this, 'primary_header' ) ); + add_action( 'astra_below_header', array( $this, 'below_header' ) ); + add_action( 'astra_render_header_column', array( $this, 'render_column' ), 10, 2 ); + // Mobile Builder. + add_action( 'astra_mobile_header', array( $this, 'mobile_header' ) ); + add_action( 'astra_mobile_above_header', array( $this, 'mobile_above_header' ) ); + add_action( 'astra_mobile_primary_header', array( $this, 'mobile_primary_header' ) ); + add_action( 'astra_mobile_below_header', array( $this, 'mobile_below_header' ) ); + add_action( 'astra_render_mobile_header_column', array( $this, 'render_mobile_column' ), 10, 2 ); + // Load Off-Canvas Markup on Footer. + add_action( 'wp_footer', array( $this, 'mobile_popup' ) ); + add_action( 'astra_mobile_header_content', array( $this, 'render_mobile_column' ), 10, 2 ); + add_action( 'astra_render_mobile_popup', array( $this, 'render_mobile_column' ), 10, 2 ); + + for ( $index = 1; $index <= Astra_Builder_Helper::$component_limit; $index++ ) { + // Buttons. + add_action( 'astra_header_button_' . $index, array( $this, 'button_' . $index ) ); + self::$methods[] = 'button_' . $index; + // Htmls. + add_action( 'astra_header_html_' . $index, array( $this, 'header_html_' . $index ) ); + self::$methods[] = 'header_html_' . $index; + // Social Icons. + add_action( 'astra_header_social_' . $index, array( $this, 'header_social_' . $index ) ); + self::$methods[] = 'header_social_' . $index; + // Menus. + add_action( 'astra_header_menu_' . $index, array( $this, 'menu_' . $index ) ); + self::$methods[] = 'menu_' . $index; + } + + add_action( 'astra_mobile_site_identity', __CLASS__ . '::site_identity' ); + add_action( 'astra_header_search', array( $this, 'header_search' ), 10, 1 ); + add_action( 'astra_header_woo_cart', array( $this, 'header_woo_cart' ) ); + add_action( 'astra_header_edd_cart', array( $this, 'header_edd_cart' ) ); + add_action( 'astra_header_account', array( $this, 'header_account' ) ); + add_action( 'astra_header_mobile_trigger', array( $this, 'header_mobile_trigger' ) ); + + // Load Cart Flyout Markup on Footer. + add_action( 'wp_footer', array( $this, 'mobile_cart_flyout' ) ); + add_action( 'astra_header_menu_mobile', array( $this, 'header_mobile_menu_markup' ) ); + } + + add_action( 'astra_site_identity', __CLASS__ . '::site_identity' ); + } + + /** + * Callback when method not exists. + * + * @param string $func function name. + * @param array $params function parameters. + */ + public function __call( $func, $params ) { + + if ( in_array( $func, self::$methods, true ) ) { + if ( 0 === strpos( $func, 'header_html_' ) ) { + Astra_Builder_UI_Controller::render_html_markup( str_replace( '_', '-', $func ) ); + } elseif ( 0 === strpos( $func, 'button_' ) ) { + $index = (int) substr( $func, strrpos( $func, '_' ) + 1 ); + if ( $index ) { + Astra_Builder_UI_Controller::render_button( $index, 'header' ); + } + } elseif ( 0 === strpos( $func, 'menu_' ) ) { + $index = (int) substr( $func, strrpos( $func, '_' ) + 1 ); + if ( $index ) { + Astra_Header_Menu_Component::menu_markup( $index ); + } + } elseif ( 0 === strpos( $func, 'header_social_' ) ) { + $index = (int) substr( $func, strrpos( $func, '_' ) + 1 ); + if ( $index ) { + Astra_Builder_UI_Controller::render_social_icon( $index, 'header' ); + } + } + } + } + + /** + * Inherit Header base layout. + * Do all actions for header. + */ + public function header_builder_markup() { + do_action( 'astra_header' ); + } + + /** + * Remove existing Header to load Header Builder. + * + * @since 3.0.0 + * @return void + */ + public function remove_existing_actions() { + remove_action( 'astra_masthead', 'astra_masthead_primary_template' ); + remove_action( 'astra_masthead_content', 'astra_primary_navigation_markup', 10 ); + + remove_filter( 'wp_page_menu_args', 'astra_masthead_custom_page_menu_items', 10, 2 ); + remove_filter( 'wp_nav_menu_items', 'astra_masthead_custom_nav_menu_items' ); + } + + /** + * Header Mobile trigger + */ + public function header_mobile_trigger() { + Astra_Builder_UI_Controller::render_mobile_trigger(); + } + + /** + * Render WooCommerce Cart. + */ + public function header_woo_cart() { + if ( class_exists( 'Astra_Woocommerce' ) ) { + echo Astra_Woocommerce::get_instance()->woo_mini_cart_markup(); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped + } + } + + /** + * Render EDD Cart. + */ + public function header_edd_cart() { + if ( class_exists( 'Easy_Digital_Downloads' ) ) { + echo Astra_Edd::get_instance()->edd_mini_cart_markup(); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped + } + } + + /** + * Render account icon. + */ + public function header_account() { + Astra_Builder_UI_Controller::render_account(); + } + + /** + * Render Search icon. + * + * @param string $device Device name. + */ + public function header_search( $device = 'desktop' ) { + echo astra_get_search( '', $device ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped + } + + /** + * Render site logo. + */ + public static function site_identity() { + Astra_Builder_UI_Controller::render_site_identity(); + } + + /** + * Call component header UI. + * + * @param string $row row. + * @param string $column column. + */ + public function render_column( $row, $column ) { + Astra_Builder_Helper::render_builder_markup( $row, $column, 'desktop', 'header' ); + } + + /** + * Render desktop header layout. + */ + public function desktop_header() { + get_template_part( 'template-parts/header/builder/desktop-builder-layout' ); + } + + /** + * Call above header UI. + */ + public function above_header() { + + $display = get_post_meta( get_the_ID(), 'ast-hfb-above-header-display', true ); + $display = apply_filters( 'astra_above_header_display', $display ); + + if ( 'disabled' !== $display ) { + if ( astra_wp_version_compare( '5.4.99', '>=' ) ) { + get_template_part( + 'template-parts/header/builder/header', + 'row', + array( + 'row' => 'above', + ) + ); + } else { + set_query_var( 'row', 'above' ); + get_template_part( 'template-parts/header/builder/header', 'row' ); + } + } + } + + /** + * Call primary header UI. + */ + public function primary_header() { + + $display = get_post_meta( get_the_ID(), 'ast-main-header-display', true ); + $display = apply_filters( 'ast_main_header_display', $display ); + + if ( 'disabled' !== $display ) { + if ( astra_wp_version_compare( '5.4.99', '>=' ) ) { + get_template_part( + 'template-parts/header/builder/header', + 'row', + array( + 'row' => 'primary', + ) + ); + } else { + set_query_var( 'row', 'primary' ); + get_template_part( 'template-parts/header/builder/header', 'row' ); + } + } + } + + /** + * Call below header UI. + */ + public function below_header() { + + $display = get_post_meta( get_the_ID(), 'ast-hfb-below-header-display', true ); + $display = apply_filters( 'astra_below_header_display', $display ); + + if ( 'disabled' !== $display ) { + if ( astra_wp_version_compare( '5.4.99', '>=' ) ) { + get_template_part( + 'template-parts/header/builder/header', + 'row', + array( + 'row' => 'below', + ) + ); + } else { + set_query_var( 'row', 'below' ); + get_template_part( 'template-parts/header/builder/header', 'row' ); + } + } + } + + /** + * Call mobile component header UI. + * + * @param string $row row. + * @param string $column column. + */ + public function render_mobile_column( $row, $column ) { + Astra_Builder_Helper::render_builder_markup( $row, $column, 'mobile', 'header' ); + } + + /** + * Render Mobile header layout. + */ + public function mobile_header() { + get_template_part( 'template-parts/header/builder/mobile-builder-layout' ); + } + + /** + * Call Mobile above header UI. + */ + public function mobile_above_header() { + + $display = get_post_meta( get_the_ID(), 'ast-hfb-mobile-header-display', true ); + $display = apply_filters( 'astra_above_mobile_header_display', $display ); + + if ( 'disabled' !== $display ) { + if ( astra_wp_version_compare( '5.4.99', '>=' ) ) { + get_template_part( + 'template-parts/header/builder/mobile-header', + 'row', + array( + 'row' => 'above', + ) + ); + } else { + set_query_var( 'row', 'above' ); + get_template_part( 'template-parts/header/builder/mobile-header', 'row' ); + } + } + } + + /** + * Call Mobile primary header UI. + */ + public function mobile_primary_header() { + + $display = get_post_meta( get_the_ID(), 'ast-hfb-mobile-header-display', true ); + $display = apply_filters( 'astra_primary_mobile_header_display', $display ); + + if ( 'disabled' !== $display ) { + if ( astra_wp_version_compare( '5.4.99', '>=' ) ) { + get_template_part( + 'template-parts/header/builder/mobile-header', + 'row', + array( + 'row' => 'primary', + ) + ); + } else { + set_query_var( 'row', 'primary' ); + get_template_part( 'template-parts/header/builder/mobile-header', 'row' ); + } + } + } + + + /** + * Call Mobile below header UI. + */ + public function mobile_below_header() { + + $display = get_post_meta( get_the_ID(), 'ast-hfb-mobile-header-display', true ); + $display = apply_filters( 'astra_below_mobile_header_display', $display ); + + if ( 'disabled' !== $display ) { + if ( astra_wp_version_compare( '5.4.99', '>=' ) ) { + get_template_part( + 'template-parts/header/builder/mobile-header', + 'row', + array( + 'row' => 'below', + ) + ); + } else { + set_query_var( 'row', 'below' ); + get_template_part( 'template-parts/header/builder/mobile-header', 'row' ); + } + } + } + /** + * Call Mobile Popup UI. + */ + public function mobile_popup() { + + $mobile_header_type = astra_get_option( 'mobile-header-type' ); + + if ( 'off-canvas' === $mobile_header_type || 'full-width' === $mobile_header_type || is_customize_preview() ) { + Astra_Builder_Helper::render_mobile_popup_markup(); + } + } + + /** + * Call Mobile Menu Markup. + */ + public function header_mobile_menu_markup() { + Astra_Mobile_Menu_Component::menu_markup(); + } + + /** + * Call Mobile Cart Flyout UI. + */ + public function mobile_cart_flyout() { + + if ( Astra_Builder_Helper::is_component_loaded( 'woo-cart', 'header' ) || Astra_Builder_Helper::is_component_loaded( 'edd-cart', 'header' ) ) { + Astra_Builder_UI_Controller::render_mobile_cart_flyout_markup(); + } + } + + /** + * Add Body Classes + * + * @param array $classes Body Class Array. + * @return array + */ + public function add_body_class( $classes ) { + $classes[] = 'ast-hfb-header'; + + if ( defined( 'ASTRA_EXT_VER' ) && version_compare( ASTRA_EXT_VER, '3.2.0', '<' ) ) { + $classes[] = 'astra-hfb-header'; + } + return $classes; + } + + } + + /** + * Prepare if class 'Astra_Builder_Header' exist. + * Kicking this off by calling 'get_instance()' method + */ + Astra_Builder_Header::get_instance(); +} diff --git a/inc/builder/type/base/assets/js/customizer-preview.js b/inc/builder/type/base/assets/js/customizer-preview.js new file mode 100644 index 0000000..0e1514d --- /dev/null +++ b/inc/builder/type/base/assets/js/customizer-preview.js @@ -0,0 +1,717 @@ +/**
+ * HTML Component CSS.
+ *
+ * @param string builder_type Builder Type.
+ * @param string html_count HTML Count.
+ *
+ */
+function astra_builder_html_css( builder_type = 'header', html_count ) {
+
+ for ( var index = 1; index <= html_count; index++ ) {
+
+ let selector = ( 'header' === builder_type ) ? '.ast-header-html-' + index : '.footer-widget-area[data-section="section-fb-html-' + index + '"]';
+
+ let section = ( 'header' === builder_type ) ? 'section-hb-html-' + index : 'section-fb-html-' + index;
+
+ var tablet_break_point = astraBuilderPreview.tablet_break_point || 768,
+ mobile_break_point = astraBuilderPreview.mobile_break_point || 544;
+
+ // HTML color.
+ astra_color_responsive_css(
+ builder_type + '-html-' + index + '-color',
+ 'astra-settings[' + builder_type + '-html-' + index + 'color]',
+ 'color',
+ selector + ' .ast-builder-html-element'
+ );
+
+ // Link color.
+ astra_color_responsive_css(
+ builder_type + '-html-' + index + '-l-color',
+ 'astra-settings[' + builder_type + '-html-' + index + 'link-color]',
+ 'color',
+ selector + ' .ast-builder-html-element a'
+ );
+
+ // Link Hover color.
+ astra_color_responsive_css(
+ builder_type + '-html-' + index + '-l-h-color',
+ 'astra-settings[' + builder_type + '-html-' + index + 'link-h-color]',
+ 'color',
+ selector + ' .ast-builder-html-element a:hover'
+ );
+
+ // Advanced Visibility CSS Generation.
+ astra_builder_visibility_css( section, selector, 'block' );
+
+ // Margin.
+ wp.customize( 'astra-settings[' + section + '-margin]', function( value ) {
+ value.bind( function( margin ) {
+ if(
+ margin.desktop.bottom != '' || margin.desktop.top != '' || margin.desktop.left != '' || margin.desktop.right != '' ||
+ margin.tablet.bottom != '' || margin.tablet.top != '' || margin.tablet.left != '' || margin.tablet.right != '' ||
+ margin.mobile.bottom != '' || margin.mobile.top != '' || margin.mobile.left != '' || margin.mobile.right != ''
+ ) {
+ var dynamicStyle = '';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['desktop']['left'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['desktop']['right'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['desktop']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['desktop']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['tablet']['left'] + margin['tablet-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['tablet']['right'] + margin['tablet-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['tablet']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['tablet']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['mobile']['left'] + margin['mobile-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['mobile']['right'] + margin['mobile-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['mobile']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['mobile']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+ astra_add_dynamic_css( section + '-margin-toggle-button', dynamicStyle );
+ }
+ } );
+ } );
+
+ // Typography CSS Generation.
+ astra_responsive_font_size(
+ 'astra-settings[font-size-' + section + ']',
+ selector + ' .ast-builder-html-element'
+ );
+ }
+}
+
+/**
+ * Button Component CSS.
+ *
+ * @param string builder_type Builder Type.
+ * @param string button_count Button Count.
+ *
+ */
+function astra_builder_button_css( builder_type = 'header', button_count ) {
+
+ var tablet_break_point = astraBuilderPreview.tablet_break_point || 768,
+ mobile_break_point = astraBuilderPreview.mobile_break_point || 544;
+
+ for ( var index = 1; index <= button_count; index++ ) {
+
+ var section = ( 'header' === builder_type ) ? 'section-hb-button-' + index : 'section-fb-button-' + index;
+ var context = ( 'header' === builder_type ) ? 'hb' : 'fb';
+ var prefix = 'button' + index;
+ var selector = '.ast-' + builder_type + '-button-' + index + ' .ast-builder-button-wrap';
+ var button_selector = '.ast-' + builder_type + '-button-' + index + '[data-section*="section-' + context + '-button-"] .ast-builder-button-wrap';
+
+ astra_css( 'flex', 'display', '.ast-' + builder_type + '-button-' + index + '[data-section="' + section + '"]' );
+
+ // Button Text Color.
+ astra_color_responsive_css(
+ context + '-button-color',
+ 'astra-settings[' + builder_type + '-' + prefix + '-text-color]',
+ 'color',
+ selector + ' .ast-custom-button'
+ );
+ astra_color_responsive_css(
+ context + '-button-color-h',
+ 'astra-settings[' + builder_type + '-' + prefix + '-text-h-color]',
+ 'color',
+ selector + ':hover .ast-custom-button'
+ );
+
+ // Button Background Color.
+ astra_color_responsive_css(
+ context + '-button-bg-color',
+ 'astra-settings[' + builder_type + '-' + prefix + '-back-color]',
+ 'background-color',
+ selector + ' .ast-custom-button'
+ );
+ astra_color_responsive_css(
+ context + '-button-bg-color-h',
+ 'astra-settings[' + builder_type + '-' + prefix + '-back-h-color]',
+ 'background-color',
+ selector + ':hover .ast-custom-button'
+ );
+
+ // Button Typography.
+ astra_responsive_font_size(
+ 'astra-settings[' + builder_type + '-' + prefix + '-font-size]',
+ button_selector + ' .ast-custom-button'
+ );
+
+ // Border Radius.
+ astra_css(
+ 'astra-settings[' + builder_type + '-' + prefix + '-border-radius]',
+ 'border-radius',
+ selector + ' .ast-custom-button',
+ 'px'
+ );
+
+ // Border Color.
+ astra_color_responsive_css(
+ context + '-button-border-color',
+ 'astra-settings[' + builder_type + '-' + prefix + '-border-color]',
+ 'border-color',
+ selector + ' .ast-custom-button'
+ );
+ astra_color_responsive_css(
+ context + '-button-border-color-h',
+ 'astra-settings[' + builder_type + '-' + prefix + '-border-h-color]',
+ 'border-color',
+ selector + ' .ast-custom-button:hover'
+ );
+
+ // Advanced CSS Generation.
+ astra_builder_advanced_css( section, button_selector + ' .ast-custom-button' );
+
+ // Advanced Visibility CSS Generation.
+ astra_builder_visibility_css( section, selector, 'block' );
+
+ (function (index) {
+ wp.customize( 'astra-settings[' + builder_type + '-button'+ index +'-border-size]', function( setting ) {
+ setting.bind( function( border ) {
+ var dynamicStyle = '.ast-' + builder_type + '-button-'+ index +' .ast-custom-button {';
+ dynamicStyle += 'border-top-width:' + border.top + 'px;';
+ dynamicStyle += 'border-right-width:' + border.right + 'px;';
+ dynamicStyle += 'border-left-width:' + border.left + 'px;';
+ dynamicStyle += 'border-bottom-width:' + border.bottom + 'px;';
+ dynamicStyle += '} ';
+ astra_add_dynamic_css( 'astra-settings[' + builder_type + '-button'+ index +'-border-size]', dynamicStyle );
+ } );
+ } );
+
+ if( 'footer' == builder_type ) {
+ wp.customize( 'astra-settings[footer-button-'+ index +'-alignment]', function( value ) {
+ value.bind( function( alignment ) {
+
+ if( alignment.desktop != '' || alignment.tablet != '' || alignment.mobile != '' ) {
+ var dynamicStyle = '';
+ dynamicStyle += '.ast-footer-button-'+ index +'[data-section="section-fb-button-'+ index +'"] {';
+ dynamicStyle += 'justify-content: ' + alignment['desktop'] + ';';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += '.ast-footer-button-'+ index +'[data-section="section-fb-button-'+ index +'"] {';
+ dynamicStyle += 'justify-content: ' + alignment['tablet'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += '.ast-footer-button-'+ index +'[data-section="section-fb-button-'+ index +'"] {';
+ dynamicStyle += 'justify-content: ' + alignment['mobile'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ astra_add_dynamic_css( 'footer-button-'+ index +'-alignment', dynamicStyle );
+ }
+ } );
+ } );
+ }
+ })(index);
+ }
+}
+
+/**
+ * Social Component CSS.
+ *
+ * @param string builder_type Builder Type.
+ * @param string section Section.
+ *
+ */
+function astra_builder_social_css( builder_type = 'header', social_count ) {
+
+ var tablet_break_point = astraBuilderPreview.tablet_break_point || 768,
+ mobile_break_point = astraBuilderPreview.mobile_break_point || 544;
+
+ for ( var index = 1; index <= social_count; index++ ) {
+
+ let selector = '.ast-' + builder_type + '-social-' + index + '-wrap';
+ let section = ( 'header' === builder_type ) ? 'section-hb-social-icons-' + index : 'section-fb-social-icons-' + index;
+ var context = ( 'header' === builder_type ) ? 'hb' : 'fb';
+ var visibility_selector = '.ast-builder-layout-element[data-section="' + section + '"]';
+
+ // Icon Color.
+ astra_color_responsive_css(
+ context + '-soc-color',
+ 'astra-settings[' + builder_type + '-social-' + index + '-color]',
+ 'fill',
+ selector + ' .ast-social-color-type-custom .ast-builder-social-element svg'
+ );
+
+ astra_color_responsive_css(
+ context + '-soc-label-color',
+ 'astra-settings[' + builder_type + '-social-' + index + '-color]',
+ 'color',
+ selector + ' .ast-social-color-type-custom .ast-builder-social-element .social-item-label'
+ );
+
+ astra_color_responsive_css(
+ context + '-soc-color-h',
+ 'astra-settings[' + builder_type + '-social-' + index + '-h-color]',
+ 'color',
+ selector + ' .ast-social-color-type-custom .ast-builder-social-element:hover'
+ );
+
+ astra_color_responsive_css(
+ context + '-soc-label-color-h',
+ 'astra-settings[' + builder_type + '-social-' + index + '-h-color]',
+ 'color',
+ selector + ' .ast-social-color-type-custom .ast-builder-social-element:hover .social-item-label'
+ );
+
+ astra_color_responsive_css(
+ context + '-soc-svg-color-h',
+ 'astra-settings[' + builder_type + '-social-' + index + '-h-color]',
+ 'fill',
+ selector + ' .ast-social-color-type-custom .ast-builder-social-element:hover svg'
+ );
+
+ // Icon Background Color.
+ astra_color_responsive_css(
+ context + '-soc-bg-color',
+ 'astra-settings[' + builder_type + '-social-' + index + '-bg-color]',
+ 'background-color',
+ selector + ' .ast-social-color-type-custom .ast-builder-social-element'
+ );
+
+ astra_color_responsive_css(
+ context + '-soc-bg-color-h',
+ 'astra-settings[' + builder_type + '-social-' + index + '-bg-h-color]',
+ 'background-color',
+ selector + ' .ast-social-color-type-custom .ast-builder-social-element:hover'
+ );
+
+ // Icon Label Color.
+ astra_color_responsive_css(
+ context + '-soc-label-color',
+ 'astra-settings[' + builder_type + '-social-' + index + '-label-color]',
+ 'color',
+ selector + ' .ast-social-color-type-custom .ast-builder-social-element span.social-item-label'
+ );
+
+ astra_color_responsive_css(
+ context + '-soc-label-color-h',
+ 'astra-settings[' + builder_type + '-social-' + index + '-label-h-color]',
+ 'color',
+ selector + ' .ast-social-color-type-custom .ast-builder-social-element:hover span.social-item-label'
+ );
+
+ // Icon Background Space.
+ astra_css(
+ 'astra-settings[' + builder_type + '-social-' + index + '-bg-space]',
+ 'padding',
+ selector + ' .' + builder_type + '-social-inner-wrap .ast-builder-social-element',
+ 'px'
+ );
+
+ // Icon Border Radius.
+ astra_css(
+ 'astra-settings[' + builder_type + '-social-' + index + '-radius]',
+ 'border-radius',
+ selector + ' .' + builder_type + '-social-inner-wrap .ast-builder-social-element',
+ 'px'
+ );
+
+ // Typography CSS Generation.
+ astra_responsive_font_size(
+ 'astra-settings[font-size-' + section + ']',
+ selector
+ );
+
+ // Advanced Visibility CSS Generation.
+ astra_builder_visibility_css( section, visibility_selector, 'block' );
+
+ // Icon Spacing.
+ (function( index ) {
+ // Icon Size.
+ wp.customize( 'astra-settings[' + builder_type + '-social-' + index + '-size]', function( value ) {
+ value.bind( function( size ) {
+
+ if( size.desktop != '' || size.tablet != '' || size.mobile != '' ) {
+ var dynamicStyle = '';
+ dynamicStyle += selector + ' .' + builder_type + '-social-inner-wrap .ast-builder-social-element svg {';
+ dynamicStyle += 'height: ' + size.desktop + 'px;';
+ dynamicStyle += 'width: ' + size.desktop + 'px;';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += selector + ' .' + builder_type + '-social-inner-wrap .ast-builder-social-element svg {';
+ dynamicStyle += 'height: ' + size.tablet + 'px;';
+ dynamicStyle += 'width: ' + size.tablet + 'px;';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += selector + ' .' + builder_type + '-social-inner-wrap .ast-builder-social-element svg {';
+ dynamicStyle += 'height: ' + size.mobile + 'px;';
+ dynamicStyle += 'width: ' + size.mobile + 'px;';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ astra_add_dynamic_css( builder_type + '-social-' + index + '-size', dynamicStyle );
+ }
+ } );
+ } );
+
+
+ // Icon Space.
+ wp.customize( 'astra-settings[' + builder_type + '-social-' + index + '-space]', function( value ) {
+ value.bind( function( spacing ) {
+ var space = '';
+ var dynamicStyle = '';
+ if ( spacing.desktop != '' ) {
+ space = spacing.desktop/2;
+ dynamicStyle += selector + ' .' + builder_type + '-social-inner-wrap .ast-builder-social-element {';
+ dynamicStyle += 'margin-left: ' + space + 'px;';
+ dynamicStyle += 'margin-right: ' + space + 'px;';
+ dynamicStyle += '} ';
+ dynamicStyle += selector + ' .' + builder_type + '-social-inner-wrap .ast-builder-social-element:first-child {';
+ dynamicStyle += 'margin-left: 0;';
+ dynamicStyle += '} ';
+ dynamicStyle += selector + ' .' + builder_type + '-social-inner-wrap .ast-builder-social-element:last-child {';
+ dynamicStyle += 'margin-right: 0;';
+ dynamicStyle += '} ';
+ }
+
+ if ( spacing.tablet != '' ) {
+ space = spacing.tablet/2;
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += selector + ' .' + builder_type + '-social-inner-wrap .ast-builder-social-element {';
+ dynamicStyle += 'margin-left: ' + space + 'px;';
+ dynamicStyle += 'margin-right: ' + space + 'px;';
+ dynamicStyle += '} ';
+ dynamicStyle += selector + ' .' + builder_type + '-social-inner-wrap .ast-builder-social-element:first-child {';
+ dynamicStyle += 'margin-left: 0;';
+ dynamicStyle += '} ';
+ dynamicStyle += selector + ' .' + builder_type + '-social-inner-wrap .ast-builder-social-element:last-child {';
+ dynamicStyle += 'margin-right: 0;';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+ }
+
+ if ( spacing.mobile != '' ) {
+ space = spacing.mobile/2;
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += selector + ' .' + builder_type + '-social-inner-wrap .ast-builder-social-element {';
+ dynamicStyle += 'margin-left: ' + space + 'px;';
+ dynamicStyle += 'margin-right: ' + space + 'px;';
+ dynamicStyle += '} ';
+ dynamicStyle += selector + ' .' + builder_type + '-social-inner-wrap .ast-builder-social-element:first-child {';
+ dynamicStyle += 'margin-left: 0;';
+ dynamicStyle += '} ';
+ dynamicStyle += selector + ' .' + builder_type + '-social-inner-wrap .ast-builder-social-element:last-child {';
+ dynamicStyle += 'margin-right: 0;';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+ }
+
+ astra_add_dynamic_css( builder_type + '-social-icons-icon-space', dynamicStyle );
+ } );
+ } );
+
+ // Color Type - Custom/Official
+ wp.customize( 'astra-settings[' + builder_type + '-social-' + index + '-color-type]', function ( value ) {
+ value.bind( function ( newval ) {
+
+ var side_class = 'ast-social-color-type-' + newval;
+
+ jQuery('.ast-' + builder_type + '-social-' + index + '-wrap .' + builder_type + '-social-inner-wrap').removeClass( 'ast-social-color-type-custom' );
+ jQuery('.ast-' + builder_type + '-social-' + index + '-wrap .' + builder_type + '-social-inner-wrap').removeClass( 'ast-social-color-type-official' );
+ jQuery('.ast-' + builder_type + '-social-' + index + '-wrap .' + builder_type + '-social-inner-wrap').addClass( side_class );
+ } );
+ } );
+
+ // Margin.
+ wp.customize( 'astra-settings[' + section + '-margin]', function( value ) {
+ value.bind( function( margin ) {
+ if(
+ margin.desktop.bottom != '' || margin.desktop.top != '' || margin.desktop.left != '' || margin.desktop.right != '' ||
+ margin.tablet.bottom != '' || margin.tablet.top != '' || margin.tablet.left != '' || margin.tablet.right != '' ||
+ margin.mobile.bottom != '' || margin.mobile.top != '' || margin.mobile.left != '' || margin.mobile.right != ''
+ ) {
+ var dynamicStyle = '';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['desktop']['left'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['desktop']['right'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['desktop']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['desktop']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['tablet']['left'] + margin['tablet-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['tablet']['right'] + margin['tablet-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['tablet']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['tablet']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['mobile']['left'] + margin['mobile-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['mobile']['right'] + margin['mobile-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['mobile']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['mobile']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+ astra_add_dynamic_css( section + '-margin', dynamicStyle );
+ }
+ } );
+ } );
+
+ if ( 'footer' === builder_type ) {
+ // Alignment.
+ wp.customize( 'astra-settings[footer-social-' + index + '-alignment]', function( value ) {
+ value.bind( function( alignment ) {
+ if( alignment.desktop != '' || alignment.tablet != '' || alignment.mobile != '' ) {
+ var dynamicStyle = '';
+ dynamicStyle += '[data-section="section-fb-social-icons-' + index + '"] .footer-social-inner-wrap {';
+ dynamicStyle += 'text-align: ' + alignment['desktop'] + ';';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += '[data-section="section-fb-social-icons-' + index + '"] .footer-social-inner-wrap {';
+ dynamicStyle += 'text-align: ' + alignment['tablet'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += '[data-section="section-fb-social-icons-' + index + '"] .footer-social-inner-wrap {';
+ dynamicStyle += 'text-align: ' + alignment['mobile'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ astra_add_dynamic_css( 'footer-social-' + index + '-alignment', dynamicStyle );
+ }
+ } );
+ } );
+
+ }
+ })( index );
+ }
+}
+
+/**
+ * Widget Component CSS.
+ *
+ * @param string builder_type Builder Type.
+ * @param string section Section.
+ *
+ */
+function astra_builder_widget_css( builder_type = 'header' ) {
+
+ var tablet_break_point = AstraBuilderWidgetData.tablet_break_point || 768,
+ mobile_break_point = AstraBuilderWidgetData.mobile_break_point || 544;
+
+ let widget_count = 'header' === builder_type ? AstraBuilderWidgetData.header_widget_count: AstraBuilderWidgetData.footer_widget_count;
+
+ for ( var index = 1; index <= widget_count; index++ ) {
+
+ var selector = '.' + builder_type + '-widget-area[data-section="sidebar-widgets-' + builder_type + '-widget-' + index + '"]';
+
+ var section = AstraBuilderWidgetData.has_block_editor ? 'astra-sidebar-widgets-' + builder_type + '-widget-' + index : 'sidebar-widgets-' + builder_type + '-widget-' + index;
+
+ // Widget Content Color.
+ astra_color_responsive_css(
+ builder_type + '-widget-' + index + '-color',
+ 'astra-settings[' + builder_type + '-widget-' + index + '-color]',
+ 'color',
+ ( AstraBuilderWidgetData.is_flex_based_css ) ? selector + '.' + builder_type + '-widget-area-inner' : selector + ' .' + builder_type + '-widget-area-inner'
+ );
+
+ // Widget Link Color.
+ astra_color_responsive_css(
+ builder_type + '-widget-' + index + '-link-color',
+ 'astra-settings[' + builder_type + '-widget-' + index + '-link-color]',
+ 'color',
+ ( AstraBuilderWidgetData.is_flex_based_css ) ? selector + '.' + builder_type + '-widget-area-inner a' : selector + ' .' + builder_type + '-widget-area-inner a'
+ );
+
+ // Widget Link Hover Color.
+ astra_color_responsive_css(
+ builder_type + '-widget-' + index + '-link-h-color',
+ 'astra-settings[' + builder_type + '-widget-' + index + '-link-h-color]',
+ 'color',
+ ( AstraBuilderWidgetData.is_flex_based_css ) ? selector + '.' + builder_type + '-widget-area-inner a:hover' : selector + ' .' + builder_type + '-widget-area-inner a:hover'
+ );
+
+ // Widget Title Color.
+ astra_color_responsive_css(
+ builder_type + '-widget-' + index + '-title-color',
+ 'astra-settings[' + builder_type + '-widget-' + index + '-title-color]',
+ 'color',
+ selector + ' .widget-title'
+ );
+
+ // Widget Title Typography.
+ astra_responsive_font_size(
+ 'astra-settings[' + builder_type + '-widget-' + index + '-font-size]',
+ selector + ' .widget-title'
+ );
+
+ // Widget Content Typography.
+ astra_responsive_font_size(
+ 'astra-settings[' + builder_type + '-widget-' + index + '-content-font-size]',
+ ( AstraBuilderWidgetData.is_flex_based_css ) ? selector + '.' + builder_type + '-widget-area-inner' : selector + ' .' + builder_type + '-widget-area-inner'
+ );
+
+ // Advanced Visibility CSS Generation.
+ astra_builder_visibility_css( section, selector, 'block' );
+
+ (function (index) {
+
+ var marginControl = AstraBuilderWidgetData.has_block_editor ? 'astra-sidebar-widgets-' + builder_type + '-widget-' + index + '-margin' : 'sidebar-widgets-' + builder_type + '-widget-' + index + '-margin';
+
+ wp.customize( 'astra-settings[' + marginControl + ']', function( value ) {
+ value.bind( function( margin ) {
+ var selector = '.' + builder_type + '-widget-area[data-section="sidebar-widgets-' + builder_type + '-widget-' + index + '"]';
+ if(
+ margin.desktop.bottom != '' || margin.desktop.top != '' || margin.desktop.left != '' || margin.desktop.right != '' ||
+ margin.tablet.bottom != '' || margin.tablet.top != '' || margin.tablet.left != '' || margin.tablet.right != '' ||
+ margin.mobile.bottom != '' || margin.mobile.top != '' || margin.mobile.left != '' || margin.mobile.right != ''
+ ) {
+ var dynamicStyle = '';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['desktop']['left'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['desktop']['right'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['desktop']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['desktop']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['tablet']['left'] + margin['tablet-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['tablet']['right'] + margin['tablet-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['tablet']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['tablet']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['mobile']['left'] + margin['mobile-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['mobile']['right'] + margin['mobile-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['mobile']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['mobile']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+ astra_add_dynamic_css( 'sidebar-widgets-' + builder_type + '-widget-' + index + '-margin', dynamicStyle );
+ }
+ } );
+ } );
+
+ if ( 'footer' === builder_type ) {
+
+ wp.customize( 'astra-settings[footer-widget-alignment-' + index + ']', function( value ) {
+ value.bind( function( alignment ) {
+ if( alignment.desktop != '' || alignment.tablet != '' || alignment.mobile != '' ) {
+ var dynamicStyle = '';
+ if( AstraBuilderWidgetData.is_flex_based_css ){
+ dynamicStyle += '.footer-widget-area[data-section="sidebar-widgets-footer-widget-' + index + '"].footer-widget-area-inner {';
+ }else{
+ dynamicStyle += '.footer-widget-area[data-section="sidebar-widgets-footer-widget-' + index + '"] .footer-widget-area-inner {';
+ }
+ dynamicStyle += 'text-align: ' + alignment['desktop'] + ';';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ if( AstraBuilderWidgetData.is_flex_based_css ){
+ dynamicStyle += '.footer-widget-area[data-section="sidebar-widgets-footer-widget-' + index + '"].footer-widget-area-inner {';
+ }else{
+ dynamicStyle += '.footer-widget-area[data-section="sidebar-widgets-footer-widget-' + index + '"] .footer-widget-area-inner {';
+ }
+ dynamicStyle += 'text-align: ' + alignment['tablet'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ if( AstraBuilderWidgetData.is_flex_based_css ){
+ dynamicStyle += '.footer-widget-area[data-section="sidebar-widgets-footer-widget-' + index + '"].footer-widget-area-inner {';
+ }else{
+ dynamicStyle += '.footer-widget-area[data-section="sidebar-widgets-footer-widget-' + index + '"] .footer-widget-area-inner {';
+ }
+ dynamicStyle += 'text-align: ' + alignment['mobile'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ astra_add_dynamic_css( 'footer-widget-alignment-' + index, dynamicStyle );
+ }
+ } );
+ } );
+
+ }
+ })(index);
+
+ }
+
+}
+
+/**
+ * Apply Visibility CSS for the element
+ *
+ * @param string section Section ID.
+ * @param string selector Base Selector.
+ * @param string default_property default CSS property.
+ */
+function astra_builder_visibility_css( section, selector, default_property = 'flex' ) {
+
+ var tablet_break_point = astraBuilderPreview.tablet_break_point || 768,
+ mobile_break_point = astraBuilderPreview.mobile_break_point || 544;
+
+ // Header Desktop visibility.
+ wp.customize( 'astra-settings[' + section + '-hide-desktop]', function( setting ) {
+ setting.bind( function( desktop_visible ) {
+
+ var dynamicStyle = '';
+ var is_hidden = ( ! desktop_visible ) ? default_property : 'none';
+
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'display: ' + is_hidden + ';';
+ dynamicStyle += '} ';
+
+ astra_add_dynamic_css( section + '-hide-desktop', dynamicStyle );
+ } );
+
+ } );
+
+ // Header Tablet visibility.
+ wp.customize( 'astra-settings[' + section + '-hide-tablet]', function( setting ) {
+ setting.bind( function( tablet_visible ) {
+
+ var dynamicStyle = '';
+ var is_hidden = ( ! tablet_visible ) ? default_property : 'none';
+
+ dynamicStyle += '@media (min-width: ' + mobile_break_point + 'px) and (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += '.ast-header-break-point ' + selector + ' {';
+ dynamicStyle += 'display: ' + is_hidden + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ astra_add_dynamic_css( section + '-hide-tablet', dynamicStyle );
+ } );
+
+ } );
+
+ // Header Mobile visibility.
+ wp.customize( 'astra-settings[' + section + '-hide-mobile]', function( setting ) {
+ setting.bind( function( mobile_visible ) {
+
+ var dynamicStyle = '';
+ var is_hidden = ( ! mobile_visible ) ? default_property : 'none';
+
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += '.ast-header-break-point ' + selector + ' {';
+ dynamicStyle += 'display: ' + is_hidden + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ astra_add_dynamic_css( section + '-hide-mobile', dynamicStyle );
+ } );
+ } );
+}
diff --git a/inc/builder/type/base/dynamic-css/button/class-astra-button-component-dynamic-css.php b/inc/builder/type/base/dynamic-css/button/class-astra-button-component-dynamic-css.php new file mode 100644 index 0000000..8695773 --- /dev/null +++ b/inc/builder/type/base/dynamic-css/button/class-astra-button-component-dynamic-css.php @@ -0,0 +1,215 @@ +<?php +/** + * Astra Button Component Dynamic CSS. + * + * @package astra-builder + * @author Astra + * @copyright Copyright (c) 2020, Astra + * @link https://wpastra.com/ + * @since 3.0.0 + */ + +// No direct access, please. +if ( ! defined( 'ABSPATH' ) ) { + exit; +} + +/** + * Register Builder Dynamic CSS. + * + * @since 3.0.0 + */ +class Astra_Button_Component_Dynamic_CSS { + + /** + * Dynamic CSS + * + * @param string $builder_type Builder Type. + * @return String Generated dynamic CSS for Heading Colors. + * + * @since 3.0.0 + */ + public static function astra_button_dynamic_css( $builder_type = 'header' ) { + + $generated_css = ''; + + $number_of_button = ( 'header' === $builder_type ) ? Astra_Builder_Helper::$num_of_header_button : Astra_Builder_Helper::$num_of_footer_button; + $hb_button_flag = false; + + for ( $index = 1; $index <= $number_of_button; $index++ ) { + + if ( ! Astra_Builder_Helper::is_component_loaded( 'button-' . $index, $builder_type ) ) { + continue; + } + $hb_button_flag = ( 'header' === $builder_type ) ? true : false; + + $_section = ( 'header' === $builder_type ) ? 'section-hb-button-' . $index : 'section-fb-button-' . $index; + $context = ( 'header' === $builder_type ) ? 'hb' : 'fb'; + + $_prefix = 'button' . $index; + + $selector = '.ast-' . $builder_type . '-button-' . $index; + $button_font_size = astra_get_option( $builder_type . '-' . $_prefix . '-font-size' ); + $button_border_width = astra_get_option( $builder_type . '-' . $_prefix . '-border-size' ); + $button_border_radius = astra_get_option( $builder_type . '-' . $_prefix . '-border-radius' ); + // Normal Responsive Colors. + $button_bg_color_desktop = astra_get_prop( astra_get_option( $builder_type . '-' . $_prefix . '-back-color' ), 'desktop' ); + $button_bg_color_tablet = astra_get_prop( astra_get_option( $builder_type . '-' . $_prefix . '-back-color' ), 'tablet' ); + $button_bg_color_mobile = astra_get_prop( astra_get_option( $builder_type . '-' . $_prefix . '-back-color' ), 'mobile' ); + $button_color_desktop = astra_get_prop( astra_get_option( $builder_type . '-' . $_prefix . '-text-color' ), 'desktop' ); + $button_color_tablet = astra_get_prop( astra_get_option( $builder_type . '-' . $_prefix . '-text-color' ), 'tablet' ); + $button_color_mobile = astra_get_prop( astra_get_option( $builder_type . '-' . $_prefix . '-text-color' ), 'mobile' ); + // Hover Responsive Colors. + $button_bg_h_color_desktop = astra_get_prop( astra_get_option( $builder_type . '-' . $_prefix . '-back-h-color' ), 'desktop' ); + $button_bg_h_color_tablet = astra_get_prop( astra_get_option( $builder_type . '-' . $_prefix . '-back-h-color' ), 'tablet' ); + $button_bg_h_color_mobile = astra_get_prop( astra_get_option( $builder_type . '-' . $_prefix . '-back-h-color' ), 'mobile' ); + $button_h_color_desktop = astra_get_prop( astra_get_option( $builder_type . '-' . $_prefix . '-text-h-color' ), 'desktop' ); + $button_h_color_tablet = astra_get_prop( astra_get_option( $builder_type . '-' . $_prefix . '-text-h-color' ), 'tablet' ); + $button_h_color_mobile = astra_get_prop( astra_get_option( $builder_type . '-' . $_prefix . '-text-h-color' ), 'mobile' ); + + // Normal Responsive Colors. + $button_border_color_desktop = astra_get_prop( astra_get_option( $builder_type . '-' . $_prefix . '-border-color' ), 'desktop' ); + $button_border_color_tablet = astra_get_prop( astra_get_option( $builder_type . '-' . $_prefix . '-border-color' ), 'tablet' ); + $button_border_color_mobile = astra_get_prop( astra_get_option( $builder_type . '-' . $_prefix . '-border-color' ), 'mobile' ); + + // Hover Responsive Colors. + $button_border_h_color_desktop = astra_get_prop( astra_get_option( $builder_type . '-' . $_prefix . '-border-h-color' ), 'desktop' ); + $button_border_h_color_tablet = astra_get_prop( astra_get_option( $builder_type . '-' . $_prefix . '-border-h-color' ), 'tablet' ); + $button_border_h_color_mobile = astra_get_prop( astra_get_option( $builder_type . '-' . $_prefix . '-border-h-color' ), 'mobile' ); + + /** + * Button CSS. + */ + $css_output_desktop = array( + + /** + * Button font size. + */ + $selector . '[data-section*="section-' . $context . '-button-"] .ast-builder-button-wrap .ast-custom-button' => array( + // Typography. + 'font-size' => astra_responsive_font( $button_font_size, 'desktop' ), + ), + + /** + * Button Colors. + */ + $selector . ' .ast-custom-button' => array( + // Colors. + 'color' => $button_color_desktop, + 'background' => $button_bg_color_desktop, + + // Border. + 'border-color' => $button_border_color_desktop, + 'border-top-width' => astra_get_css_value( $button_border_width['top'], 'px' ), + 'border-bottom-width' => astra_get_css_value( $button_border_width['bottom'], 'px' ), + 'border-left-width' => astra_get_css_value( $button_border_width['left'], 'px' ), + 'border-right-width' => astra_get_css_value( $button_border_width['right'], 'px' ), + 'border-radius' => astra_get_css_value( $button_border_radius, 'px' ), + ), + + // Hover Options. + $selector . ' .ast-custom-button:hover' => array( + 'color' => $button_h_color_desktop, + 'background' => $button_bg_h_color_desktop, + 'border-color' => $button_border_h_color_desktop, + ), + ); + + /** + * Button CSS. + */ + $css_output_tablet = array( + + + /** + * Button font size. + */ + $selector . '[data-section*="section-' . $context . '-button-"] .ast-builder-button-wrap .ast-custom-button' => array( + // Typography. + 'font-size' => astra_responsive_font( $button_font_size, 'tablet' ), + ), + + /** + * Button Colors. + */ + $selector . ' .ast-custom-button' => array( + // Typography. + 'font-size' => astra_responsive_font( $button_font_size, 'tablet' ), + + // Colors. + 'color' => $button_color_tablet, + 'background' => $button_bg_color_tablet, + 'border-color' => $button_border_color_tablet, + ), + // Hover Options. + $selector . ' .ast-custom-button:hover' => array( + 'color' => $button_h_color_tablet, + 'background' => $button_bg_h_color_tablet, + 'border-color' => $button_border_h_color_tablet, + ), + ); + + /** + * Button CSS. + */ + $css_output_mobile = array( + + /** + * Button font size. + */ + $selector . '[data-section*="section-' . $context . '-button-"] .ast-builder-button-wrap .ast-custom-button' => array( + // Typography. + 'font-size' => astra_responsive_font( $button_font_size, 'mobile' ), + ), + + /** + * Button Colors. + */ + $selector . ' .ast-custom-button' => array( + // Typography. + 'font-size' => astra_responsive_font( $button_font_size, 'mobile' ), + + // Colors. + 'color' => $button_color_mobile, + 'background' => $button_bg_color_mobile, + 'border-color' => $button_border_color_mobile, + ), + // Hover Options. + $selector . ' ..ast-custom-button:hover' => array( + 'color' => $button_h_color_mobile, + 'background' => $button_bg_h_color_mobile, + 'border-color' => $button_border_h_color_mobile, + ), + ); + + /* Parse CSS from array() */ + $css_output = astra_parse_css( $css_output_desktop ); + $css_output .= astra_parse_css( $css_output_tablet, '', astra_get_tablet_breakpoint() ); + $css_output .= astra_parse_css( $css_output_mobile, '', astra_get_mobile_breakpoint() ); + + $generated_css .= $css_output; + + $generated_css .= Astra_Builder_Base_Dynamic_CSS::prepare_advanced_margin_padding_css( $_section, $selector . '[data-section*="section-' . $context . '-button-"] .ast-builder-button-wrap .ast-custom-button' ); + + $visibility_selector = '.ast-' . $builder_type . '-button-' . $index . '[data-section="' . $_section . '"]'; + $generated_css .= Astra_Builder_Base_Dynamic_CSS::prepare_visibility_css( $_section, $visibility_selector ); + } + + if ( true === $hb_button_flag ) { + $static_hb_css = array( + '[data-section*="section-hb-button-"] .menu-link' => array( + 'display' => 'none', + ), + ); + return astra_parse_css( $static_hb_css ) . $generated_css; + } + + return $generated_css; + } +} + +/** + * Kicking this off by creating object of this class. + */ + +new Astra_Button_Component_Dynamic_CSS(); diff --git a/inc/builder/type/base/dynamic-css/html/class-astra-html-component-dynamic-css.php b/inc/builder/type/base/dynamic-css/html/class-astra-html-component-dynamic-css.php new file mode 100644 index 0000000..e36aca8 --- /dev/null +++ b/inc/builder/type/base/dynamic-css/html/class-astra-html-component-dynamic-css.php @@ -0,0 +1,187 @@ +<?php +/** + * Astra HTML Component Dynamic CSS. + * + * @package astra-builder + * @author Astra + * @copyright Copyright (c) 2020, Astra + * @link https://wpastra.com/ + * @since 3.0.0 + */ + +// No direct access, please. +if ( ! defined( 'ABSPATH' ) ) { + exit; +} + +/** + * Register Builder Dynamic CSS. + * + * @since 3.0.0 + */ +class Astra_Html_Component_Dynamic_CSS { + + /** + * Dynamic CSS + * + * @param string $builder_type Builder Type. + * @return String Generated dynamic CSS for Heading Colors. + * + * @since 3.0.0 + */ + public static function astra_html_dynamic_css( $builder_type = 'header' ) { + + $generated_css = ''; + $html_css_flag = false; + $number_of_html = ( 'header' === $builder_type ) ? Astra_Builder_Helper::$num_of_header_html : Astra_Builder_Helper::$num_of_footer_html; + + for ( $index = 1; $index <= $number_of_html; $index++ ) { + + if ( ! Astra_Builder_Helper::is_component_loaded( 'html-' . $index, $builder_type ) ) { + continue; + } + + $html_css_flag = true; + + $_section = ( 'header' === $builder_type ) ? 'section-hb-html-' . $index : 'section-fb-html-' . $index; + + $margin = astra_get_option( $_section . '-margin' ); + $font_size = astra_get_option( 'font-size-' . $_section ); + + $text_color_desktop = astra_get_prop( astra_get_option( $builder_type . '-html-' . $index . 'color' ), 'desktop' ); + $text_color_tablet = astra_get_prop( astra_get_option( $builder_type . '-html-' . $index . 'color' ), 'tablet' ); + $text_color_mobile = astra_get_prop( astra_get_option( $builder_type . '-html-' . $index . 'color' ), 'mobile' ); + + $link_color_desktop = astra_get_prop( astra_get_option( $builder_type . '-html-' . $index . 'link-color' ), 'desktop' ); + $link_color_tablet = astra_get_prop( astra_get_option( $builder_type . '-html-' . $index . 'link-color' ), 'tablet' ); + $link_color_mobile = astra_get_prop( astra_get_option( $builder_type . '-html-' . $index . 'link-color' ), 'mobile' ); + + $link_h_color_desktop = astra_get_prop( astra_get_option( $builder_type . '-html-' . $index . 'link-h-color' ), 'desktop' ); + $link_h_color_tablet = astra_get_prop( astra_get_option( $builder_type . '-html-' . $index . 'link-h-color' ), 'tablet' ); + $link_h_color_mobile = astra_get_prop( astra_get_option( $builder_type . '-html-' . $index . 'link-h-color' ), 'mobile' ); + + $selector = ( 'header' === $builder_type ) ? '.ast-header-html-' . $index : '.footer-widget-area[data-section="section-fb-html-' . $index . '"]'; + + $display_prop = ( 'header' === $builder_type ) ? 'flex' : 'block'; + + $css_output_desktop = array( + + $selector . ' .ast-builder-html-element' => array( + 'color' => $text_color_desktop, + // Typography. + 'font-size' => astra_responsive_font( $font_size, 'desktop' ), + ), + + $selector => array( + // Margin. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'desktop' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'desktop' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'desktop' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'desktop' ), + ), + + // Link Color. + $selector . ' a' => array( + 'color' => $link_color_desktop, + ), + + // Link Hover Color. + $selector . ' a:hover' => array( + 'color' => $link_h_color_desktop, + ), + ); + + /* Parse CSS from array() */ + $css_output = astra_parse_css( $css_output_desktop ); + + // Tablet CSS. + $css_output_tablet = array( + + $selector . ' .ast-builder-html-element' => array( + 'color' => $text_color_tablet, + // Typography. + 'font-size' => astra_responsive_font( $font_size, 'tablet' ), + ), + + $selector => array( + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'tablet' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'tablet' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'tablet' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'tablet' ), + ), + + // Link Color. + $selector . ' a' => array( + 'color' => $link_color_tablet, + ), + + // Link Hover Color. + $selector . ' a:hover' => array( + 'color' => $link_h_color_tablet, + ), + ); + $css_output .= astra_parse_css( $css_output_tablet, '', astra_get_tablet_breakpoint() ); + + // Mobile CSS. + $css_output_mobile = array( + + $selector . ' .ast-builder-html-element' => array( + 'color' => $text_color_mobile, + // Typography. + 'font-size' => astra_responsive_font( $font_size, 'mobile' ), + ), + + $selector => array( + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'mobile' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'mobile' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'mobile' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'mobile' ), + ), + + // Link Color. + $selector . ' a' => array( + 'color' => $link_color_mobile, + ), + + // Link Hover Color. + $selector . ' a:hover' => array( + 'color' => $link_h_color_mobile, + ), + ); + $css_output .= astra_parse_css( $css_output_mobile, '', astra_get_mobile_breakpoint() ); + + $generated_css .= $css_output; + + $generated_css .= Astra_Builder_Base_Dynamic_CSS::prepare_advanced_typography_css( $_section, $selector ); + + $generated_css .= Astra_Builder_Base_Dynamic_CSS::prepare_visibility_css( $_section, $selector, $display_prop ); + } + if ( true === $html_css_flag ) { + $html_static_css = array( + '.ast-builder-html-element img.alignnone' => array( + 'display' => 'inline-block', + ), + '.ast-builder-html-element p:first-child' => array( + 'margin-top' => '0', + ), + '.ast-builder-html-element p:last-child' => array( + 'margin-bottom' => '0', + ), + '.ast-header-break-point .main-header-bar .ast-builder-html-element' => array( + 'line-height' => '1.85714285714286', + ), + ); + return astra_parse_css( $html_static_css ) . $generated_css; + } + + return $generated_css; + } +} + +/** + * Kicking this off by creating object of this class. + */ + +new Astra_Html_Component_Dynamic_CSS(); diff --git a/inc/builder/type/base/dynamic-css/social/class-astra-social-component-dynamic-css.php b/inc/builder/type/base/dynamic-css/social/class-astra-social-component-dynamic-css.php new file mode 100644 index 0000000..31d8044 --- /dev/null +++ b/inc/builder/type/base/dynamic-css/social/class-astra-social-component-dynamic-css.php @@ -0,0 +1,421 @@ +<?php +/** + * Astra Social Component Dynamic CSS. + * + * @package astra-builder + * @author Astra + * @copyright Copyright (c) 2020, Astra + * @link https://wpastra.com/ + * @since 3.0.0 + */ + +// No direct access, please. +if ( ! defined( 'ABSPATH' ) ) { + exit; +} + +/** + * Register Builder Dynamic CSS. + * + * @since 3.0.0 + */ +class Astra_Social_Component_Dynamic_CSS { + + /** + * Dynamic CSS + * + * @param string $builder_type Builder Type. + * @return String Generated dynamic CSS for Heading Colors. + * + * @since 3.0.0 + */ + public static function astra_social_dynamic_css( $builder_type = 'header' ) { + + $generated_css = ''; + $social_css_flag = false; + + $number_of_social_icons = ( 'header' === $builder_type ) ? Astra_Builder_Helper::$num_of_header_social_icons : Astra_Builder_Helper::$num_of_footer_social_icons; + + for ( $index = 1; $index <= $number_of_social_icons; $index++ ) { + + if ( ! Astra_Builder_Helper::is_component_loaded( 'social-icons-' . $index, $builder_type ) ) { + continue; + } + $social_css_flag = true; + $selector = '.ast-' . $builder_type . '-social-' . $index . '-wrap'; + $_section = ( 'header' === $builder_type ) ? 'section-hb-social-icons-' . $index : 'section-fb-social-icons-' . $index; + + $icon_spacing = astra_get_option( $builder_type . '-social-' . $index . '-space' ); + $icon_bg_spacing = astra_get_option( $builder_type . '-social-' . $index . '-bg-space' ); + $icon_size = astra_get_option( $builder_type . '-social-' . $index . '-size' ); + $icon_radius = astra_get_option( $builder_type . '-social-' . $index . '-radius' ); + + $icon_spacing_desktop = ( isset( $icon_spacing['desktop'] ) && '' !== $icon_spacing['desktop'] ) ? (int) $icon_spacing['desktop'] / 2 : ''; + $icon_spacing_tablet = ( isset( $icon_spacing['tablet'] ) && '' !== $icon_spacing['tablet'] ) ? (int) $icon_spacing['tablet'] / 2 : ''; + $icon_spacing_mobile = ( isset( $icon_spacing['mobile'] ) && '' !== $icon_spacing['mobile'] ) ? (int) $icon_spacing['mobile'] / 2 : ''; + + $icon_size_desktop = ( isset( $icon_size['desktop'] ) && '' !== $icon_size['desktop'] ) ? (int) $icon_size['desktop'] : ''; + $icon_size_tablet = ( isset( $icon_size['tablet'] ) && '' !== $icon_size['tablet'] ) ? (int) $icon_size['tablet'] : ''; + $icon_size_mobile = ( isset( $icon_size['mobile'] ) && '' !== $icon_size['mobile'] ) ? (int) $icon_size['mobile'] : ''; + + $icon_radius = ( isset( $icon_radius ) && '' !== $icon_radius ) ? (int) $icon_radius : ''; + $icon_bg_spacing = ( isset( $icon_bg_spacing ) && '' !== $icon_bg_spacing ) ? (int) $icon_bg_spacing : ''; + + // Normal Responsive Colors. + $color_type = astra_get_option( $builder_type . '-social-' . $index . '-color-type' ); + $social_icons_color_desktop = astra_get_prop( astra_get_option( $builder_type . '-social-' . $index . '-color' ), 'desktop' ); + $social_icons_color_tablet = astra_get_prop( astra_get_option( $builder_type . '-social-' . $index . '-color' ), 'tablet' ); + $social_icons_color_mobile = astra_get_prop( astra_get_option( $builder_type . '-social-' . $index . '-color' ), 'mobile' ); + + // Hover Responsive Colors. + $social_icons_h_color_desktop = astra_get_prop( astra_get_option( $builder_type . '-social-' . $index . '-h-color' ), 'desktop' ); + $social_icons_h_color_tablet = astra_get_prop( astra_get_option( $builder_type . '-social-' . $index . '-h-color' ), 'tablet' ); + $social_icons_h_color_mobile = astra_get_prop( astra_get_option( $builder_type . '-social-' . $index . '-h-color' ), 'mobile' ); + + // Normal Responsive Bg Colors. + $social_icons_bg_color_desktop = astra_get_prop( astra_get_option( $builder_type . '-social-' . $index . '-bg-color' ), 'desktop' ); + $social_icons_bg_color_tablet = astra_get_prop( astra_get_option( $builder_type . '-social-' . $index . '-bg-color' ), 'tablet' ); + $social_icons_bg_color_mobile = astra_get_prop( astra_get_option( $builder_type . '-social-' . $index . '-bg-color' ), 'mobile' ); + + // Hover Responsive Bg Colors. + $social_icons_h_bg_color_desktop = astra_get_prop( astra_get_option( $builder_type . '-social-' . $index . '-bg-h-color' ), 'desktop' ); + $social_icons_h_bg_color_tablet = astra_get_prop( astra_get_option( $builder_type . '-social-' . $index . '-bg-h-color' ), 'tablet' ); + $social_icons_h_bg_color_mobile = astra_get_prop( astra_get_option( $builder_type . '-social-' . $index . '-bg-h-color' ), 'mobile' ); + + // Normal Responsive Label Colors. + $social_icons_label_color_desktop = astra_get_prop( astra_get_option( $builder_type . '-social-' . $index . '-label-color' ), 'desktop' ); + $social_icons_label_color_tablet = astra_get_prop( astra_get_option( $builder_type . '-social-' . $index . '-label-color' ), 'tablet' ); + $social_icons_label_color_mobile = astra_get_prop( astra_get_option( $builder_type . '-social-' . $index . '-label-color' ), 'mobile' ); + + // Hover Responsive Label Colors. + $social_icons_label_h_color_desktop = astra_get_prop( astra_get_option( $builder_type . '-social-' . $index . '-label-h-color' ), 'desktop' ); + $social_icons_label_h_color_tablet = astra_get_prop( astra_get_option( $builder_type . '-social-' . $index . '-label-h-color' ), 'tablet' ); + $social_icons_label_h_color_mobile = astra_get_prop( astra_get_option( $builder_type . '-social-' . $index . '-label-h-color' ), 'mobile' ); + + + $margin = astra_get_option( $_section . '-margin' ); + + /** + * Social Icon CSS. + */ + $css_output_desktop = array( + + $selector . ' .ast-builder-social-element' => array( + // Icon Spacing. + 'margin-left' => astra_get_css_value( $icon_spacing_desktop, 'px' ), + 'margin-right' => astra_get_css_value( $icon_spacing_desktop, 'px' ), + + // Icon Background Space. + 'padding' => astra_get_css_value( $icon_bg_spacing, 'px' ), + + // Icon Radius. + 'border-radius' => astra_get_css_value( $icon_radius, 'px' ), + ), + $selector . ' .ast-builder-social-element svg' => array( + + // Icon Size. + 'width' => astra_get_css_value( $icon_size_desktop, 'px' ), + 'height' => astra_get_css_value( $icon_size_desktop, 'px' ), + ), + $selector . ' .ast-social-icon-image-wrap' => array( + + // Icon Background Space. + 'margin' => astra_get_css_value( $icon_bg_spacing, 'px' ), + ), + $selector => array( + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'desktop' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'desktop' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'desktop' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'desktop' ), + ), + ); + + if ( 'custom' === $color_type || is_customize_preview() ) { + $css_output_desktop[ $selector . ' .ast-social-color-type-custom svg' ]['fill'] = $social_icons_color_desktop; + $css_output_desktop[ $selector . ' .ast-builder-social-element' ]['background'] = $social_icons_bg_color_desktop; + + $css_output_desktop[ $selector . ' .ast-social-color-type-custom .ast-builder-social-element:hover' ] = array( + // Hover. + 'color' => $social_icons_h_color_desktop, + 'background' => $social_icons_h_bg_color_desktop, + ); + + $css_output_desktop[ $selector . ' .ast-social-color-type-custom .ast-builder-social-element:hover svg' ] = array( + 'fill' => $social_icons_h_color_desktop, + ); + + if ( isset( $social_icons_label_color_desktop ) && ! empty( $social_icons_label_color_desktop ) ) { + $css_output_desktop[ $selector . ' .ast-social-color-type-custom .social-item-label' ]['color'] = $social_icons_label_color_desktop; + } else { + $css_output_desktop[ $selector . ' .ast-social-color-type-custom .social-item-label' ]['color'] = $social_icons_color_desktop; + } + if ( isset( $social_icons_label_h_color_desktop ) && ! empty( $social_icons_label_h_color_desktop ) ) { + $css_output_desktop[ $selector . ' .ast-builder-social-element:hover .social-item-label' ]['color'] = $social_icons_label_h_color_desktop; + } else { + $css_output_desktop[ $selector . ' .ast-builder-social-element:hover .social-item-label' ]['color'] = $social_icons_h_color_desktop; + } + } + + /** + * Social_icons CSS. + */ + $css_output_tablet = array( + $selector . ' .ast-builder-social-element svg' => array( + + // Icon Size. + 'width' => astra_get_css_value( $icon_size_tablet, 'px' ), + 'height' => astra_get_css_value( $icon_size_tablet, 'px' ), + ), + $selector . ' .ast-builder-social-element' => array( + // Icon Spacing. + 'margin-left' => astra_get_css_value( $icon_spacing_tablet, 'px' ), + 'margin-right' => astra_get_css_value( $icon_spacing_tablet, 'px' ), + ), + $selector => array( + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'tablet' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'tablet' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'tablet' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'tablet' ), + ), + ); + + if ( 'custom' === $color_type || is_customize_preview() ) { + $css_output_tablet[ $selector . ' .ast-social-color-type-custom svg' ]['fill'] = $social_icons_color_tablet; + + $css_output_tablet[ $selector . ' .ast-social-color-type-custom .ast-builder-social-element' ]['background'] = $social_icons_bg_color_tablet; + + $css_output_tablet[ $selector . ' .ast-social-color-type-custom .ast-builder-social-element:hover' ] = array( + // Hover. + 'color' => $social_icons_h_color_tablet, + 'background' => $social_icons_h_bg_color_tablet, + ); + $css_output_tablet[ $selector . ' .ast-social-color-type-custom .ast-builder-social-element:hover svg' ] = array( + 'fill' => $social_icons_h_color_tablet, + ); + + if ( isset( $social_icons_label_color_tablet ) && ! empty( $social_icons_label_color_tablet ) ) { + $css_output_tablet[ $selector . ' .ast-social-color-type-custom .social-item-label' ]['color'] = $social_icons_label_color_tablet; + } else { + $css_output_tablet[ $selector . ' .ast-social-color-type-custom .social-item-label' ]['color'] = $social_icons_color_tablet; + } + if ( isset( $social_icons_label_h_color_tablet ) && ! empty( $social_icons_label_h_color_tablet ) ) { + $css_output_tablet[ $selector . ' .ast-builder-social-element:hover .social-item-label' ]['color'] = $social_icons_label_h_color_tablet; + } else { + $css_output_tablet[ $selector . ' .ast-builder-social-element:hover .social-item-label' ]['color'] = $social_icons_h_color_tablet; + } + } + + /** + * Social_icons CSS. + */ + $css_output_mobile = array( + $selector . ' .ast-builder-social-element svg' => array( + + // Icon Size. + 'width' => astra_get_css_value( $icon_size_mobile, 'px' ), + 'height' => astra_get_css_value( $icon_size_mobile, 'px' ), + ), + $selector . ' .ast-builder-social-element' => array( + // Icon Spacing. + 'margin-left' => astra_get_css_value( $icon_spacing_mobile, 'px' ), + 'margin-right' => astra_get_css_value( $icon_spacing_mobile, 'px' ), + ), + $selector => array( + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'mobile' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'mobile' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'mobile' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'mobile' ), + ), + ); + + if ( 'custom' === $color_type || is_customize_preview() ) { + $css_output_mobile[ $selector . ' .ast-social-color-type-custom svg' ]['fill'] = $social_icons_color_mobile; + + $css_output_mobile[ $selector . ' .ast-social-color-type-custom .ast-builder-social-element' ]['background'] = $social_icons_bg_color_mobile; + + $css_output_mobile[ $selector . ' .ast-social-color-type-custom .ast-builder-social-element:hover' ] = array( + // Hover. + 'color' => $social_icons_h_color_mobile, + 'background' => $social_icons_h_bg_color_mobile, + ); + $css_output_mobile[ $selector . ' .ast-social-color-type-custom .ast-builder-social-element:hover svg' ] = array( + 'fill' => $social_icons_h_color_mobile, + ); + + if ( isset( $social_icons_label_color_mobile ) && ! empty( $social_icons_label_color_mobile ) ) { + $css_output_mobile[ $selector . ' .ast-social-color-type-custom .social-item-label' ]['color'] = $social_icons_label_color_mobile; + } else { + $css_output_mobile[ $selector . ' .ast-social-color-type-custom .social-item-label' ]['color'] = $social_icons_color_mobile; + } + if ( isset( $social_icons_label_h_color_mobile ) && ! empty( $social_icons_label_h_color_mobile ) ) { + $css_output_mobile[ $selector . ' .ast-builder-social-element:hover .social-item-label' ]['color'] = $social_icons_label_h_color_mobile; + } else { + $css_output_mobile[ $selector . ' .ast-builder-social-element:hover .social-item-label' ]['color'] = $social_icons_h_color_mobile; + } + } + + if ( 'footer' === $builder_type ) { + + // Footer Social Alignment CSS. + $alignment = astra_get_option( 'footer-social-' . $index . '-alignment' ); + + $desktop_alignment = ( isset( $alignment['desktop'] ) ) ? $alignment['desktop'] : ''; + $tablet_alignment = ( isset( $alignment['tablet'] ) ) ? $alignment['tablet'] : ''; + $mobile_alignment = ( isset( $alignment['mobile'] ) ) ? $alignment['mobile'] : ''; + + $css_output_desktop[ '[data-section="section-fb-social-icons-' . $index . '"] .footer-social-inner-wrap' ] = array( + 'text-align' => $desktop_alignment, + ); + $css_output_tablet[ '[data-section="section-fb-social-icons-' . $index . '"] .footer-social-inner-wrap' ] = array( + 'text-align' => $tablet_alignment, + ); + $css_output_mobile[ '[data-section="section-fb-social-icons-' . $index . '"] .footer-social-inner-wrap' ] = array( + 'text-align' => $mobile_alignment, + ); + + } + + /* Parse CSS from array() */ + $css_output = astra_parse_css( $css_output_desktop ); + $css_output .= astra_parse_css( $css_output_tablet, '', astra_get_tablet_breakpoint() ); + $css_output .= astra_parse_css( $css_output_mobile, '', astra_get_mobile_breakpoint() ); + + $css_output .= Astra_Builder_Base_Dynamic_CSS::prepare_advanced_typography_css( $_section, $selector ); + + $visibility_selector = '.ast-builder-layout-element[data-section="' . $_section . '"]'; + $css_output .= Astra_Builder_Base_Dynamic_CSS::prepare_visibility_css( $_section, $visibility_selector ); + + $generated_css .= $css_output; + } + if ( $social_css_flag ) { + return self::get_social_static_css() . $generated_css; + } + + return $generated_css; + } + + /** + * Load Social default css. + * + * @since 3.0.0 + */ + public static function get_social_static_css() { + $social_static_css = ' + .ast-builder-social-element:hover { + color: #0274be; + } + .ast-social-stack-desktop .ast-builder-social-element, + .ast-social-stack-tablet .ast-builder-social-element, + .ast-social-stack-mobile .ast-builder-social-element { + margin-top: 6px; + margin-bottom: 6px; + } + .ast-social-color-type-official .ast-builder-social-element, .ast-social-color-type-official .social-item-label { + color: var(--color); + background-color: var(--background-color); + } + .header-social-inner-wrap.ast-social-color-type-official .ast-builder-social-element svg, + .footer-social-inner-wrap.ast-social-color-type-official .ast-builder-social-element svg { + fill: currentColor; + } + .social-show-label-true .ast-builder-social-element { + width: auto; + padding: 0 0.4em; + } + [data-section^="section-fb-social-icons-"] .footer-social-inner-wrap { + text-align: center; + } + .ast-footer-social-wrap { + width: 100%; + }'; + + if ( is_rtl() ) { + $social_static_css .= '.ast-footer-social-wrap .ast-builder-social-element:first-child { + margin-right: 0; + } + .ast-footer-social-wrap .ast-builder-social-element:last-child { + margin-left: 0; + } + .ast-header-social-wrap .ast-builder-social-element:first-child { + margin-right: 0; + } + .ast-header-social-wrap .ast-builder-social-element:last-child { + margin-left: 0; + } + .ast-builder-social-element { + line-height: 1; + color: #3a3a3a; + background: transparent; + vertical-align: middle; + transition: all 0.01s; + margin-right: 6px; + margin-left: 6px; + justify-content: center; + align-items: center; + } + .ast-builder-social-element { + line-height: 1; + color: #3a3a3a; + background: transparent; + vertical-align: middle; + transition: all 0.01s; + margin-right: 6px; + margin-left: 6px; + justify-content: center; + align-items: center; + } + .ast-builder-social-element .social-item-label { + padding-right: 6px; + }'; + } else { + $social_static_css .= '.ast-footer-social-wrap .ast-builder-social-element:first-child { + margin-left: 0; + } + .ast-footer-social-wrap .ast-builder-social-element:last-child { + margin-right: 0; + } + .ast-header-social-wrap .ast-builder-social-element:first-child { + margin-left: 0; + } + .ast-header-social-wrap .ast-builder-social-element:last-child { + margin-right: 0; + } + .ast-builder-social-element { + line-height: 1; + color: #3a3a3a; + background: transparent; + vertical-align: middle; + transition: all 0.01s; + margin-left: 6px; + margin-right: 6px; + justify-content: center; + align-items: center; + } + .ast-builder-social-element { + line-height: 1; + color: #3a3a3a; + background: transparent; + vertical-align: middle; + transition: all 0.01s; + margin-left: 6px; + margin-right: 6px; + justify-content: center; + align-items: center; + } + .ast-builder-social-element .social-item-label { + padding-left: 6px; + }'; + } + + return Astra_Enqueue_Scripts::trim_css( $social_static_css ); + } +} + +/** + * Kicking this off by creating object of this class. + */ + +new Astra_Social_Component_Dynamic_CSS(); diff --git a/inc/builder/type/base/dynamic-css/widget/class-astra-widget-component-dynamic-css.php b/inc/builder/type/base/dynamic-css/widget/class-astra-widget-component-dynamic-css.php new file mode 100644 index 0000000..243e25b --- /dev/null +++ b/inc/builder/type/base/dynamic-css/widget/class-astra-widget-component-dynamic-css.php @@ -0,0 +1,174 @@ +<?php +/** + * Astra Widget Component Dynamic CSS. + * + * @package astra-builder + * @author Astra + * @copyright Copyright (c) 2020, Astra + * @link https://wpastra.com/ + * @since 3.0.0 + */ + +// No direct access, please. +if ( ! defined( 'ABSPATH' ) ) { + exit; +} + +/** + * Register Builder Dynamic CSS. + * + * @since 3.0.0 + */ +class Astra_Widget_Component_Dynamic_CSS { + + /** + * Dynamic CSS + * + * @param string $builder_type Builder Type. + * @return String Generated dynamic CSS for Heading Colors. + * + * @since 3.0.0 + */ + public static function astra_widget_dynamic_css( $builder_type = 'header' ) { + + $generated_css = ''; + + $no_of_widgets = 'header' === $builder_type ? Astra_Builder_Helper::$num_of_header_widgets : Astra_Builder_Helper::$num_of_footer_widgets; + + for ( $index = 1; $index <= $no_of_widgets; $index++ ) { + + if ( ! Astra_Builder_Helper::is_component_loaded( 'widget-' . $index, $builder_type ) ) { + continue; + } + + $_section = ( ! astra_has_widgets_block_editor() ) ? 'sidebar-widgets-' . $builder_type . '-widget-' . $index : 'astra-sidebar-widgets-' . $builder_type . '-widget-' . $index; + + $selector = '.' . $builder_type . '-widget-area[data-section="sidebar-widgets-' . $builder_type . '-widget-' . $index . '"]'; + + $margin = astra_get_option( $_section . '-margin' ); + + $title_font_size = astra_get_option( $builder_type . '-widget-' . $index . '-font-size' ); + $content_font_size = astra_get_option( $builder_type . '-widget-' . $index . '-content-font-size' ); + + $title_color_desktop = astra_get_prop( astra_get_option( $builder_type . '-widget-' . $index . '-title-color' ), 'desktop' ); + $title_color_tablet = astra_get_prop( astra_get_option( $builder_type . '-widget-' . $index . '-title-color' ), 'tablet' ); + $title_color_mobile = astra_get_prop( astra_get_option( $builder_type . '-widget-' . $index . '-title-color' ), 'mobile' ); + + $text_color_desktop = astra_get_prop( astra_get_option( $builder_type . '-widget-' . $index . '-color' ), 'desktop' ); + $text_color_tablet = astra_get_prop( astra_get_option( $builder_type . '-widget-' . $index . '-color' ), 'tablet' ); + $text_color_mobile = astra_get_prop( astra_get_option( $builder_type . '-widget-' . $index . '-color' ), 'mobile' ); + + $link_color_desktop = astra_get_prop( astra_get_option( $builder_type . '-widget-' . $index . '-link-color' ), 'desktop' ); + $link_color_tablet = astra_get_prop( astra_get_option( $builder_type . '-widget-' . $index . '-link-color' ), 'tablet' ); + $link_color_mobile = astra_get_prop( astra_get_option( $builder_type . '-widget-' . $index . '-link-color' ), 'mobile' ); + + $link_h_color_desktop = astra_get_prop( astra_get_option( $builder_type . '-widget-' . $index . '-link-h-color' ), 'desktop' ); + $link_h_color_tablet = astra_get_prop( astra_get_option( $builder_type . '-widget-' . $index . '-link-h-color' ), 'tablet' ); + $link_h_color_mobile = astra_get_prop( astra_get_option( $builder_type . '-widget-' . $index . '-link-h-color' ), 'mobile' ); + + /** + * Copyright CSS. + */ + if ( Astra_Builder_Helper::apply_flex_based_css() ) { + $builder_widget_selector = $selector . '.' . $builder_type . '-widget-area-inner'; + } else { + $builder_widget_selector = $selector . ' .' . $builder_type . '-widget-area-inner'; + } + $css_output_desktop = array( + $builder_widget_selector => array( + 'color' => $text_color_desktop, + // Typography. + 'font-size' => astra_responsive_font( $content_font_size, 'desktop' ), + ), + $builder_widget_selector . ' a' => array( + 'color' => $link_color_desktop, + ), + $builder_widget_selector . ' a:hover' => array( + 'color' => $link_h_color_desktop, + ), + $selector . ' .widget-title' => array( + 'color' => $title_color_desktop, + // Typography. + 'font-size' => astra_responsive_font( $title_font_size, 'desktop' ), + ), + $selector => array( + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'desktop' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'desktop' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'desktop' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'desktop' ), + ), + ); + + $css_output_tablet = array( + $builder_widget_selector => array( + 'color' => $text_color_tablet, + // Typography. + 'font-size' => astra_responsive_font( $content_font_size, 'tablet' ), + ), + $selector . ' .widget-title' => array( + 'color' => $title_color_tablet, + // Typography. + 'font-size' => astra_responsive_font( $title_font_size, 'tablet' ), + ), + $builder_widget_selector . ' a' => array( + 'color' => $link_color_tablet, + ), + $builder_widget_selector . ' a:hover' => array( + 'color' => $link_h_color_tablet, + ), + $selector => array( + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'tablet' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'tablet' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'tablet' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'tablet' ), + ), + ); + + $css_output_mobile = array( + $builder_widget_selector => array( + 'color' => $text_color_mobile, + // Typography. + 'font-size' => astra_responsive_font( $content_font_size, 'mobile' ), + ), + $selector . ' .widget-title' => array( + 'color' => $title_color_mobile, + // Typography. + 'font-size' => astra_responsive_font( $title_font_size, 'mobile' ), + ), + $builder_widget_selector . ' a' => array( + 'color' => $link_color_mobile, + ), + $builder_widget_selector . ' a:hover' => array( + 'color' => $link_h_color_mobile, + ), + $selector => array( + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'mobile' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'mobile' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'mobile' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'mobile' ), + ), + ); + + /* Parse CSS from array() */ + $css_output = astra_parse_css( $css_output_desktop ); + $css_output .= astra_parse_css( $css_output_tablet, '', astra_get_tablet_breakpoint() ); + $css_output .= astra_parse_css( $css_output_mobile, '', astra_get_mobile_breakpoint() ); + + $css_output .= Astra_Builder_Base_Dynamic_CSS::prepare_visibility_css( $_section, $selector, 'block' ); + + $generated_css .= $css_output; + + } + + return $generated_css; + } +} + +/** + * Kicking this off by creating object of this class. + */ + +new Astra_Widget_Component_Dynamic_CSS(); diff --git a/inc/builder/type/class-astra-builder-base-dynamic-css.php b/inc/builder/type/class-astra-builder-base-dynamic-css.php new file mode 100644 index 0000000..ec87b65 --- /dev/null +++ b/inc/builder/type/class-astra-builder-base-dynamic-css.php @@ -0,0 +1,464 @@ +<?php +/** + * Astra Builder Base Dynamic CSS. + * + * @package astra-builder + */ + +// No direct access, please. +if ( ! defined( 'ABSPATH' ) ) { + exit; +} + +if ( ! class_exists( 'Astra_Builder_Base_Dynamic_CSS' ) ) { + + /** + * Class Astra_Builder_Base_Dynamic_CSS. + */ + final class Astra_Builder_Base_Dynamic_CSS { + + /** + * Member Variable + * + * @var instance + */ + private static $instance = null; + + + /** + * Initiator + */ + public static function get_instance() { + + if ( is_null( self::$instance ) ) { + self::$instance = new self(); + } + + return self::$instance; + } + + /** + * Constructor + */ + public function __construct() { + + add_filter( 'astra_dynamic_theme_css', array( $this, 'footer_dynamic_css' ) ); + add_filter( 'astra_dynamic_theme_css', array( $this, 'mobile_header_logo_css' ) ); + } + + /** + * Prepare Advanced Margin / Padding Dynamic CSS. + * + * @param string $section_id section id. + * @param string $selector selector. + * @return array + */ + public static function prepare_advanced_margin_padding_css( $section_id, $selector ) { + + if ( isset( $section_id ) && isset( $selector ) ) { + + $padding = astra_get_option( $section_id . '-padding' ); + $margin = astra_get_option( $section_id . '-margin' ); + + // Desktop CSS. + $css_output_desktop = array( + + $selector => array( + + // Padding CSS. + 'padding-top' => astra_responsive_spacing( $padding, 'top', 'desktop' ), + 'padding-bottom' => astra_responsive_spacing( $padding, 'bottom', 'desktop' ), + 'padding-left' => astra_responsive_spacing( $padding, 'left', 'desktop' ), + 'padding-right' => astra_responsive_spacing( $padding, 'right', 'desktop' ), + + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'desktop' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'desktop' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'desktop' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'desktop' ), + ), + ); + + // Tablet CSS. + $css_output_tablet = array( + + $selector => array( + + // Padding CSS. + 'padding-top' => astra_responsive_spacing( $padding, 'top', 'tablet' ), + 'padding-bottom' => astra_responsive_spacing( $padding, 'bottom', 'tablet' ), + 'padding-left' => astra_responsive_spacing( $padding, 'left', 'tablet' ), + 'padding-right' => astra_responsive_spacing( $padding, 'right', 'tablet' ), + + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'tablet' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'tablet' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'tablet' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'tablet' ), + ), + ); + + // Mobile CSS. + $css_output_mobile = array( + + $selector => array( + + // Padding CSS. + 'padding-top' => astra_responsive_spacing( $padding, 'top', 'mobile' ), + 'padding-bottom' => astra_responsive_spacing( $padding, 'bottom', 'mobile' ), + 'padding-left' => astra_responsive_spacing( $padding, 'left', 'mobile' ), + 'padding-right' => astra_responsive_spacing( $padding, 'right', 'mobile' ), + + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'mobile' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'mobile' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'mobile' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'mobile' ), + ), + ); + + $css_output = astra_parse_css( $css_output_desktop ); + $css_output .= astra_parse_css( $css_output_tablet, '', astra_get_tablet_breakpoint() ); + $css_output .= astra_parse_css( $css_output_mobile, '', astra_get_mobile_breakpoint() ); + + return $css_output; + } + + return ''; + } + + /** + * Prepare Advanced Margin / Padding Dynamic CSS. + * + * @param string $section_id section id. + * @param string $selector selector. + * @return array + */ + public static function prepare_advanced_typography_css( $section_id, $selector ) { + + $font_size = astra_get_option( 'font-size-' . $section_id ); + + /** + * Typography CSS. + */ + $css_output_desktop = array( + + $selector => array( + + // Typography. + 'font-size' => astra_responsive_font( $font_size, 'desktop' ), + ), + ); + + $css_output_tablet = array( + + $selector => array( + + 'font-size' => astra_responsive_font( $font_size, 'tablet' ), + ), + ); + + $css_output_mobile = array( + + $selector => array( + + 'font-size' => astra_responsive_font( $font_size, 'mobile' ), + ), + ); + + /* Parse CSS from array() */ + $css_output = astra_parse_css( $css_output_desktop ); + $css_output .= astra_parse_css( $css_output_tablet, '', astra_get_tablet_breakpoint() ); + $css_output .= astra_parse_css( $css_output_mobile, '', astra_get_mobile_breakpoint() ); + + return $css_output; + } + + /** + * Prepare Footer Dynamic CSS. + * + * @param string $dynamic_css Appended dynamic CSS. + * @param string $dynamic_css_filtered Filtered dynamic CSS. + * @return array + */ + public static function footer_dynamic_css( $dynamic_css, $dynamic_css_filtered = '' ) { + + /** + * Tablet CSS. + */ + $css_output_tablet = array( + '.ast-builder-grid-row-container.ast-builder-grid-row-tablet-3-firstrow .ast-builder-grid-row > *:first-child, .ast-builder-grid-row-container.ast-builder-grid-row-tablet-3-lastrow .ast-builder-grid-row > *:last-child' => array( + 'grid-column' => '1 / -1', + ), + ); + + /** + * Mobile CSS. + */ + $css_output_mobile = array( + '.ast-builder-grid-row-container.ast-builder-grid-row-mobile-3-firstrow .ast-builder-grid-row > *:first-child, .ast-builder-grid-row-container.ast-builder-grid-row-mobile-3-lastrow .ast-builder-grid-row > *:last-child' => array( + 'grid-column' => '1 / -1', + ), + ); + + /* Parse CSS from array() */ + $css_output = astra_parse_css( $css_output_tablet, '', astra_get_tablet_breakpoint() ); + $css_output .= astra_parse_css( $css_output_mobile, '', astra_get_mobile_breakpoint() ); + + if ( is_customize_preview() ) { + + /** + * Desktop CSS + */ + $css_output_desktop = array( + '.ast-builder-grid-row-6-equal .ast-builder-grid-row' => array( + 'grid-template-columns' => 'repeat( 6, 1fr )', + ), + '.ast-builder-grid-row-5-equal .ast-builder-grid-row' => array( + 'grid-template-columns' => 'repeat( 5, 1fr )', + ), + '.ast-builder-grid-row-4-equal .ast-builder-grid-row' => array( + 'grid-template-columns' => 'repeat( 4, 1fr )', + ), + '.ast-builder-grid-row-4-lheavy .ast-builder-grid-row' => array( + 'grid-template-columns' => '2fr 1fr 1fr 1fr', + ), + '.ast-builder-grid-row-4-rheavy .ast-builder-grid-row' => array( + 'grid-template-columns' => '1fr 1fr 1fr 2fr', + ), + '.ast-builder-grid-row-3-equal .ast-builder-grid-row' => array( + 'grid-template-columns' => 'repeat( 3, 1fr )', + ), + '.ast-builder-grid-row-3-lheavy .ast-builder-grid-row' => array( + 'grid-template-columns' => '2fr 1fr 1fr', + ), + '.ast-builder-grid-row-3-rheavy .ast-builder-grid-row' => array( + 'grid-template-columns' => '1fr 1fr 2fr', + ), + '.ast-builder-grid-row-3-cheavy .ast-builder-grid-row' => array( + 'grid-template-columns' => '1fr 2fr 1fr', + ), + '.ast-builder-grid-row-3-cwide .ast-builder-grid-row' => array( + 'grid-template-columns' => '1fr 3fr 1fr', + ), + '.ast-builder-grid-row-2-equal .ast-builder-grid-row' => array( + 'grid-template-columns' => 'repeat( 2, 1fr )', + ), + '.ast-builder-grid-row-2-lheavy .ast-builder-grid-row' => array( + 'grid-template-columns' => '2fr 1fr', + ), + '.ast-builder-grid-row-2-rheavy .ast-builder-grid-row' => array( + 'grid-template-columns' => '1fr 2fr', + ), + '.ast-builder-grid-row-2-full .ast-builder-grid-row' => array( + 'grid-template-columns' => '2fr', + ), + '.ast-builder-grid-row-full .ast-builder-grid-row' => array( + 'grid-template-columns' => '1fr', + ), + ); + + /** + * Tablet CSS. + */ + $css_output_tablet = array( + '.ast-builder-grid-row-container.ast-builder-grid-row-tablet-6-equal .ast-builder-grid-row' => array( + 'grid-template-columns' => 'repeat( 6, 1fr )', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-tablet-5-equal .ast-builder-grid-row' => array( + 'grid-template-columns' => 'repeat( 5, 1fr )', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-tablet-4-equal .ast-builder-grid-row' => array( + 'grid-template-columns' => 'repeat( 4, 1fr )', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-tablet-4-lheavy .ast-builder-grid-row' => array( + 'grid-template-columns' => '2fr 1fr 1fr 1fr', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-tablet-4-rheavy .ast-builder-grid-row' => array( + 'grid-template-columns' => '1fr 1fr 1fr 2fr', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-tablet-3-equal .ast-builder-grid-row' => array( + 'grid-template-columns' => 'repeat( 3, 1fr )', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-tablet-3-lheavy .ast-builder-grid-row' => array( + 'grid-template-columns' => '2fr 1fr 1fr', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-tablet-3-rheavy .ast-builder-grid-row' => array( + 'grid-template-columns' => '1fr 1fr 2fr', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-tablet-3-cheavy .ast-builder-grid-row' => array( + 'grid-template-columns' => '1fr 2fr 1fr', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-tablet-3-cwide .ast-builder-grid-row' => array( + 'grid-template-columns' => '1fr 3fr 1fr', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-tablet-3-firstrow .ast-builder-grid-row' => array( + 'grid-template-columns' => '1fr 1fr', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-tablet-3-lastrow .ast-builder-grid-row' => array( + 'grid-template-columns' => '1fr 1fr', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-tablet-2-equal .ast-builder-grid-row' => array( + 'grid-template-columns' => 'repeat( 2, 1fr )', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-tablet-2-lheavy .ast-builder-grid-row' => array( + 'grid-template-columns' => '2fr 1fr', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-tablet-2-rheavy .ast-builder-grid-row' => array( + 'grid-template-columns' => '1fr 2fr', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-tablet-full .ast-builder-grid-row' => array( + 'grid-template-columns' => '1fr', + ), + ); + + /** + * Mobile CSS + */ + $css_output_mobile = array( + '.ast-builder-grid-row-container.ast-builder-grid-row-mobile-6-equal .ast-builder-grid-row' => array( + 'grid-template-columns' => 'repeat( 6, 1fr )', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-mobile-5-equal .ast-builder-grid-row' => array( + 'grid-template-columns' => 'repeat( 5, 1fr )', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-mobile-4-equal .ast-builder-grid-row' => array( + 'grid-template-columns' => 'repeat( 4, 1fr )', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-mobile-4-lheavy .ast-builder-grid-row' => array( + 'grid-template-columns' => '2fr 1fr 1fr 1fr', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-mobile-4-rheavy .ast-builder-grid-row' => array( + 'grid-template-columns' => '1fr 1fr 1fr 2fr', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-mobile-3-equal .ast-builder-grid-row' => array( + 'grid-template-columns' => 'repeat( 3, 1fr )', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-mobile-3-lheavy .ast-builder-grid-row' => array( + 'grid-template-columns' => '2fr 1fr 1fr', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-mobile-3-rheavy .ast-builder-grid-row' => array( + 'grid-template-columns' => '1fr 1fr 2fr', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-mobile-3-cheavy .ast-builder-grid-row' => array( + 'grid-template-columns' => '1fr 2fr 1fr', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-mobile-3-cwide .ast-builder-grid-row' => array( + 'grid-template-columns' => '1fr 3fr 1fr', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-mobile-3-firstrow .ast-builder-grid-row' => array( + 'grid-template-columns' => '1fr 1fr', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-mobile-3-lastrow .ast-builder-grid-row' => array( + 'grid-template-columns' => '1fr 1fr', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-mobile-2-equal .ast-builder-grid-row' => array( + 'grid-template-columns' => 'repeat( 2, 1fr )', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-mobile-2-lheavy .ast-builder-grid-row' => array( + 'grid-template-columns' => '2fr 1fr', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-mobile-2-rheavy .ast-builder-grid-row' => array( + 'grid-template-columns' => '1fr 2fr', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-mobile-full .ast-builder-grid-row' => array( + 'grid-template-columns' => '1fr', + ), + ); + + /* Parse CSS from array() */ + $css_output .= astra_parse_css( $css_output_desktop ); + $css_output .= astra_parse_css( $css_output_tablet, '', astra_get_tablet_breakpoint() ); + $css_output .= astra_parse_css( $css_output_mobile, '', astra_get_mobile_breakpoint() ); + } + + $dynamic_css .= $css_output; + + return $dynamic_css; + } + + /** + * Different logo for mobile static CSS. + * + * @param string $dynamic_css Appended dynamic CSS. + * @since 3.5.0 + * @return string + */ + public static function mobile_header_logo_css( $dynamic_css ) { + + $mobile_header_logo = astra_get_option( 'mobile-header-logo' ); + $different_mobile_header_order = astra_get_option( 'different-mobile-logo' ); + + if ( '' !== $mobile_header_logo && '1' == $different_mobile_header_order ) { + $mobile_header_css = ' + .ast-header-break-point .ast-has-mobile-header-logo .custom-logo-link { + display: none; + } + .ast-header-break-point .ast-has-mobile-header-logo .custom-mobile-logo-link { + display: inline-block; + } + .ast-header-break-point.ast-mobile-inherit-site-logo .ast-has-mobile-header-logo .custom-logo-link, + .ast-header-break-point.ast-mobile-inherit-site-logo .ast-has-mobile-header-logo .astra-logo-svg { + display: block; + }'; + + $dynamic_css .= Astra_Enqueue_Scripts::trim_css( $mobile_header_css ); + } + return $dynamic_css; + } + + /** + * Prepare Element visibility Dynamic CSS. + * + * @param string $section_id section id. + * @param string $selector selector. + * @param string $default_property Section default CSS property. + * @param string $mobile_tablet_default Mobile/Tabled display property. + * @return array + */ + public static function prepare_visibility_css( $section_id, $selector, $default_property = 'flex', $mobile_tablet_default = '' ) { + + $css_output_desktop = array(); + $css_output_tablet = array(); + $css_output_mobile = array(); + + // For Mobile/Tablet we need display grid property to display elements centerd alignment. + $mobile_tablet_default = ( $mobile_tablet_default ) ? $mobile_tablet_default : $default_property; + + $hide_desktop = ( ! astra_get_option( $section_id . '-hide-desktop' ) ) ? $default_property : 'none'; + $hide_tablet = ( ! astra_get_option( $section_id . '-hide-tablet' ) ) ? $mobile_tablet_default : 'none'; + $hide_mobile = ( ! astra_get_option( $section_id . '-hide-mobile' ) ) ? $mobile_tablet_default : 'none'; + + $css_output_desktop = array( + $selector => array( + 'display' => $hide_desktop, + ), + ); + + $css_output_tablet = array( + '.ast-header-break-point ' . $selector => array( + 'display' => $hide_tablet, + ), + ); + + $css_output_mobile = array( + '.ast-header-break-point ' . $selector => array( + 'display' => $hide_mobile, + ), + ); + + /* Parse CSS from array() */ + $css_output = astra_parse_css( $css_output_desktop ); + $css_output .= astra_parse_css( $css_output_tablet, '', astra_get_tablet_breakpoint() ); + $css_output .= astra_parse_css( $css_output_mobile, '', astra_get_mobile_breakpoint() ); + + return $css_output; + } + } + + /** + * Prepare if class 'Astra_Builder_Base_Dynamic_CSS' exist. + * Kicking this off by calling 'get_instance()' method + */ + Astra_Builder_Base_Dynamic_CSS::get_instance(); +} diff --git a/inc/builder/type/footer/above-footer/assets/js/minified/customizer-preview.min.js b/inc/builder/type/footer/above-footer/assets/js/minified/customizer-preview.min.js new file mode 100644 index 0000000..8cabe1c --- /dev/null +++ b/inc/builder/type/footer/above-footer/assets/js/minified/customizer-preview.min.js @@ -0,0 +1 @@ +!function(){var r=astraBuilderPreview.tablet_break_point||768,o=astraBuilderPreview.mobile_break_point||544,t="section-above-footer-builder",i='.site-above-footer-wrap[data-section="section-above-footer-builder"]';astra_css("astra-settings[hba-footer-height]","min-height",i,"px"),astra_css("astra-settings[hba-footer-vertical-alignment]","align-items",i+" .ast-builder-grid-row, "+i+" .site-footer-section"),wp.customize("astra-settings[hba-footer-separator]",function(t){t.bind(function(t){var a="";""!==t&&(a=i+" {",a+="border-top-width: "+t+"px;",a+="border-top-style: solid",a+="} "),astra_add_dynamic_css("hba-footer-separator",a)})}),wp.customize("astra-settings[hba-inner-spacing]",function(t){t.bind(function(t){var a="";""!=t.desktop&&(a+=i+" .ast-builder-grid-row {",a+="grid-column-gap: "+t.desktop+"px;",a+="} "),""!=t.tablet&&(a+="@media (max-width: "+r+"px) {",a+=i+" .ast-builder-grid-row {",a+="grid-column-gap: "+t.tablet+"px;",a+="grid-row-gap: "+t.tablet+"px;",a+="} ",a+="} "),""!=t.mobile&&(a+="@media (max-width: "+o+"px) {",a+=i+" .ast-builder-grid-row {",a+="grid-column-gap: "+t.mobile+"px;",a+="grid-row-gap: "+t.mobile+"px;",a+="} ",a+="} "),astra_add_dynamic_css("hba-inner-spacing-toggle-button",a)})}),wp.customize("astra-settings[hba-footer-top-border-color]",function(t){t.bind(function(t){var a="";""!==t&&(a=i+" {",a+="border-top-color: "+t+";",a+="border-top-style: solid",a+="} "),astra_add_dynamic_css("hba-footer-top-border-color",a)})}),wp.customize("astra-settings[hba-footer-layout-width]",function(t){t.bind(function(t){var a="";"content"==t&&(a=i+" .ast-builder-grid-row {",a+="max-width: "+AstraBuilderPrimaryFooterData.footer_content_width+"px;",a+="margin-left: auto;",a+="margin-right: auto;",a+="} "),"full"==t&&(a=i+" .ast-builder-grid-row {",a+="max-width: 100%;",a+="padding-right: 35px; padding-left: 35px;",a+="} "),astra_add_dynamic_css("hba-footer-layout-width",a)})}),astra_apply_responsive_background_css("astra-settings[hba-footer-bg-obj-responsive]",i,"desktop"),astra_apply_responsive_background_css("astra-settings[hba-footer-bg-obj-responsive]",i,"tablet"),astra_apply_responsive_background_css("astra-settings[hba-footer-bg-obj-responsive]",i,"mobile"),astra_builder_advanced_css(t,i),astra_builder_visibility_css(t,i,"grid")}(jQuery);
\ No newline at end of file diff --git a/inc/builder/type/footer/above-footer/assets/js/unminified/customizer-preview.js b/inc/builder/type/footer/above-footer/assets/js/unminified/customizer-preview.js new file mode 100644 index 0000000..0b32c85 --- /dev/null +++ b/inc/builder/type/footer/above-footer/assets/js/unminified/customizer-preview.js @@ -0,0 +1,139 @@ +/**
+ * This file adds some LIVE to the Customizer live preview. To leverage
+ * this, set your custom settings to 'postMessage' and then add your handling
+ * here. Your javascript should grab settings from customizer controls, and
+ * then make any necessary changes to the page using jQuery.
+ *
+ * @package Astra
+ * @since 3.0.0
+ */
+
+( function( $ ) {
+
+ var tablet_break_point = astraBuilderPreview.tablet_break_point || 768,
+ mobile_break_point = astraBuilderPreview.mobile_break_point || 544;
+
+ var section = 'section-above-footer-builder';
+ var selector = '.site-above-footer-wrap[data-section="section-above-footer-builder"]';
+
+ // Footer Height.
+ astra_css(
+ 'astra-settings[hba-footer-height]',
+ 'min-height',
+ selector,
+ 'px'
+ );
+
+ // Footer Vertical Alignment.
+ astra_css(
+ 'astra-settings[hba-footer-vertical-alignment]',
+ 'align-items',
+ selector + ' .ast-builder-grid-row, ' + selector + ' .site-footer-section'
+ );
+
+ // Border Bottom width.
+ wp.customize( 'astra-settings[hba-footer-separator]', function( setting ) {
+ setting.bind( function( separator ) {
+
+ var dynamicStyle = '';
+
+ if ( '' !== separator ) {
+ dynamicStyle = selector + ' {';
+ dynamicStyle += 'border-top-width: ' + separator + 'px;';
+ dynamicStyle += 'border-top-style: solid';
+ dynamicStyle += '} ';
+ }
+
+ astra_add_dynamic_css( 'hba-footer-separator', dynamicStyle );
+
+ } );
+ } );
+
+ // Inner Space.
+ wp.customize( 'astra-settings[hba-inner-spacing]', function( value ) {
+ value.bind( function( spacing ) {
+ var dynamicStyle = '';
+ if ( spacing.desktop != '' ) {
+ dynamicStyle += selector + ' .ast-builder-grid-row {';
+ dynamicStyle += 'grid-column-gap: ' + spacing.desktop + 'px;';
+ dynamicStyle += '} ';
+ }
+
+ if ( spacing.tablet != '' ) {
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += selector + ' .ast-builder-grid-row {';
+ dynamicStyle += 'grid-column-gap: ' + spacing.tablet + 'px;';
+ dynamicStyle += 'grid-row-gap: ' + spacing.tablet + 'px;';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+ }
+
+ if ( spacing.mobile != '' ) {
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += selector + ' .ast-builder-grid-row {';
+ dynamicStyle += 'grid-column-gap: ' + spacing.mobile + 'px;';
+ dynamicStyle += 'grid-row-gap: ' + spacing.mobile + 'px;';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+ }
+
+ astra_add_dynamic_css( 'hba-inner-spacing-toggle-button', dynamicStyle );
+ } );
+ } );
+
+ // Border Color.
+ wp.customize( 'astra-settings[hba-footer-top-border-color]', function( setting ) {
+ setting.bind( function( color ) {
+
+ var dynamicStyle = '';
+
+ if ( '' !== color ) {
+ dynamicStyle = selector + ' {';
+ dynamicStyle += 'border-top-color: ' + color + ';';
+ dynamicStyle += 'border-top-style: solid';
+ dynamicStyle += '} ';
+ }
+
+ astra_add_dynamic_css( 'hba-footer-top-border-color', dynamicStyle );
+
+ } );
+ } );
+
+ // Primary Header - Layout.
+ wp.customize( 'astra-settings[hba-footer-layout-width]', function( setting ) {
+ setting.bind( function( layout ) {
+
+ var dynamicStyle = '';
+
+ if ( 'content' == layout ) {
+ dynamicStyle = selector + ' .ast-builder-grid-row {';
+ dynamicStyle += 'max-width: ' + AstraBuilderPrimaryFooterData.footer_content_width + 'px;';
+ dynamicStyle += 'margin-left: auto;';
+ dynamicStyle += 'margin-right: auto;';
+ dynamicStyle += '} ';
+ }
+
+ if ( 'full' == layout ) {
+ dynamicStyle = selector + ' .ast-builder-grid-row {';
+ dynamicStyle += 'max-width: 100%;';
+ dynamicStyle += 'padding-right: 35px; padding-left: 35px;';
+ dynamicStyle += '} ';
+ }
+
+ astra_add_dynamic_css( 'hba-footer-layout-width', dynamicStyle );
+
+ } );
+ } );
+
+ // Responsive BG styles > Above Footer Row.
+ astra_apply_responsive_background_css( 'astra-settings[hba-footer-bg-obj-responsive]', selector, 'desktop' );
+ astra_apply_responsive_background_css( 'astra-settings[hba-footer-bg-obj-responsive]', selector, 'tablet' );
+ astra_apply_responsive_background_css( 'astra-settings[hba-footer-bg-obj-responsive]', selector, 'mobile' );
+
+ // Advanced CSS Generation.
+ astra_builder_advanced_css( section, selector );
+
+ // Advanced Visibility CSS Generation.
+ astra_builder_visibility_css( section, selector, 'grid' );
+
+} )( jQuery );
diff --git a/inc/builder/type/footer/above-footer/class-astra-above-footer-component-loader.php b/inc/builder/type/footer/above-footer/class-astra-above-footer-component-loader.php new file mode 100644 index 0000000..01242f1 --- /dev/null +++ b/inc/builder/type/footer/above-footer/class-astra-above-footer-component-loader.php @@ -0,0 +1,51 @@ +<?php +/** + * Above Footer Styling Loader for Astra theme. + * + * @package Astra Builder + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since Astra 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Above Footer Initialization + * + * @since 3.0.0 + */ +class Astra_Above_Footer_Component_Loader { + + /** + * Constructor + * + * @since 3.0.0 + */ + public function __construct() { + add_action( 'customize_preview_init', array( $this, 'preview_scripts' ), 110 ); + } + + /** + * Customizer Preview + * + * @since 3.0.0 + */ + public function preview_scripts() { + /** + * Load unminified if SCRIPT_DEBUG is true. + */ + /* Directory and Extension */ + $dir_name = ( SCRIPT_DEBUG ) ? 'unminified' : 'minified'; + $file_prefix = ( SCRIPT_DEBUG ) ? '' : '.min'; + wp_enqueue_script( 'astra-footer-above-customizer-preview-js', ASTRA_BUILDER_FOOTER_ABOVE_FOOTER_URI . '/assets/js/' . $dir_name . '/customizer-preview' . $file_prefix . '.js', array( 'customize-preview', 'astra-customizer-preview-js' ), ASTRA_THEME_VERSION, true ); + } +} + +/** +* Kicking this off by creating the object of the class. +*/ +new Astra_Above_Footer_Component_Loader(); diff --git a/inc/builder/type/footer/above-footer/class-astra-above-footer.php b/inc/builder/type/footer/above-footer/class-astra-above-footer.php new file mode 100644 index 0000000..7832f52 --- /dev/null +++ b/inc/builder/type/footer/above-footer/class-astra-above-footer.php @@ -0,0 +1,49 @@ +<?php +/** + * Above Footer component. + * + * @package Astra Builder + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since Astra 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +define( 'ASTRA_BUILDER_FOOTER_ABOVE_FOOTER_DIR', ASTRA_THEME_DIR . 'inc/builder/type/footer/above-footer' ); +define( 'ASTRA_BUILDER_FOOTER_ABOVE_FOOTER_URI', ASTRA_THEME_URI . 'inc/builder/type/footer/above-footer' ); + +if ( ! class_exists( 'Astra_Above_Footer' ) ) { + + /** + * Above Footer Initial Setup + * + * @since 3.0.0 + */ + class Astra_Above_Footer { + + /** + * Constructor function that initializes required actions and hooks + */ + public function __construct() { + + // @codingStandardsIgnoreStart WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + require_once ASTRA_BUILDER_FOOTER_ABOVE_FOOTER_DIR . '/class-astra-above-footer-component-loader.php'; + + // Include front end files. + if ( ! is_admin() ) { + require_once ASTRA_BUILDER_FOOTER_ABOVE_FOOTER_DIR . '/dynamic-css/dynamic.css.php'; + } + // @codingStandardsIgnoreEnd WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + } + } + + /** + * Kicking this off by creating an object. + */ + new Astra_Above_Footer(); + +} diff --git a/inc/builder/type/footer/above-footer/dynamic-css/dynamic.css.php b/inc/builder/type/footer/above-footer/dynamic-css/dynamic.css.php new file mode 100644 index 0000000..07f94ea --- /dev/null +++ b/inc/builder/type/footer/above-footer/dynamic-css/dynamic.css.php @@ -0,0 +1,151 @@ +<?php +/** + * Above Footer control - Dynamic CSS + * + * @package Astra Builder + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Above Footer CSS + */ +add_filter( 'astra_dynamic_theme_css', 'astra_fb_above_footer_dynamic_css' ); + +/** + * Dynamic CSS + * + * @param string $dynamic_css Astra Dynamic CSS. + * @param string $dynamic_css_filtered Astra Dynamic CSS Filters. + * @return String Generated dynamic CSS for above Footer. + * + * @since 3.0.0 + */ +function astra_fb_above_footer_dynamic_css( $dynamic_css, $dynamic_css_filtered = '' ) { + + if ( ! ( Astra_Builder_Helper::is_footer_row_empty( 'above' ) || is_customize_preview() ) ) { + return $dynamic_css; + } + + $_section = 'section-above-footer-builder'; + + $selector = '.site-above-footer-wrap[data-section="section-above-footer-builder"]'; + + $footer_bg = astra_get_option( 'hba-footer-bg-obj-responsive' ); + $footer_top_border_size = astra_get_option( 'hba-footer-separator' ); + $footer_top_border_color = astra_get_option( 'hba-footer-top-border-color' ); + $footer_height = astra_get_option( 'hba-footer-height' ); + $footer_width = astra_get_option( 'hba-footer-layout-width' ); + $content_width = astra_get_option( 'site-content-width' ); + $inner_spacing = astra_get_option( 'hba-inner-spacing' ); + + $layout = astra_get_option( 'hba-footer-layout' ); + + $desk_layout = ( isset( $layout['desktop'] ) ) ? $layout['desktop'] : 'full'; + $tab_layout = ( isset( $layout['tablet'] ) ) ? $layout['tablet'] : 'full'; + $mob_layout = ( isset( $layout['mobile'] ) ) ? $layout['mobile'] : 'full'; + + $inner_spacing_desktop = ( isset( $inner_spacing['desktop'] ) ) ? $inner_spacing['desktop'] : ''; + $inner_spacing_tablet = ( isset( $inner_spacing['tablet'] ) ) ? $inner_spacing['tablet'] : ''; + $inner_spacing_mobile = ( isset( $inner_spacing['mobile'] ) ) ? $inner_spacing['mobile'] : ''; + + $css_output_desktop = array( + '.site-above-footer-wrap' => array( + 'padding-top' => '20px', + 'padding-bottom' => '20px', + ), + $selector => astra_get_responsive_background_obj( $footer_bg, 'desktop' ), + $selector . ' .ast-builder-grid-row' => array( + 'grid-column-gap' => astra_get_css_value( $inner_spacing_desktop, 'px' ), + ), + $selector . ' .ast-builder-grid-row, ' . $selector . ' .site-footer-section' => array( + 'align-items' => astra_get_option( 'hba-footer-vertical-alignment' ), + ), + $selector . '.ast-footer-row-inline .site-footer-section' => array( + 'display' => 'flex', + 'margin-bottom' => '0', + ), + '.ast-builder-grid-row-' . $desk_layout . ' .ast-builder-grid-row' => array( + 'grid-template-columns' => Astra_Builder_Helper::$grid_size_mapping[ $desk_layout ], + ), + + ); + + if ( isset( $footer_width ) && 'content' === $footer_width ) { + + $css_output_desktop[ $selector . ' .ast-builder-grid-row' ]['max-width'] = astra_get_css_value( $content_width, 'px' ); + $css_output_desktop[ $selector . ' .ast-builder-grid-row' ]['margin-left'] = 'auto'; + $css_output_desktop[ $selector . ' .ast-builder-grid-row' ]['margin-right'] = 'auto'; + } else { + $css_output_desktop[ $selector . ' .ast-builder-grid-row' ]['max-width'] = '100%'; + $css_output_desktop[ $selector . ' .ast-builder-grid-row' ]['padding-left'] = '35px'; + $css_output_desktop[ $selector . ' .ast-builder-grid-row' ]['padding-right'] = '35px'; + } + + + $css_output_desktop[ $selector ]['min-height'] = astra_get_css_value( $footer_height, 'px' ); + + if ( isset( $footer_top_border_size ) && 1 <= $footer_top_border_size ) { + + $css_output_desktop[ $selector ]['border-style'] = 'solid'; + + $css_output_desktop[ $selector ]['border-width'] = '0px'; + + $css_output_desktop[ $selector ]['border-top-width'] = astra_get_css_value( $footer_top_border_size, 'px' ); + + $css_output_desktop[ $selector ]['border-top-color'] = $footer_top_border_color; + } + + $css_output_tablet = array( + + $selector => astra_get_responsive_background_obj( $footer_bg, 'tablet' ), + $selector . ' .ast-builder-grid-row' => array( + 'grid-column-gap' => astra_get_css_value( $inner_spacing_tablet, 'px' ), + 'grid-row-gap' => astra_get_css_value( $inner_spacing_tablet, 'px' ), + ), + $selector . '.ast-footer-row-tablet-inline .site-footer-section' => array( + 'display' => 'flex', + 'margin-bottom' => '0', + ), + $selector . '.ast-footer-row-tablet-stack .site-footer-section' => array( + 'display' => 'block', + 'margin-bottom' => '10px', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-tablet-' . $tab_layout . ' .ast-builder-grid-row' => array( + 'grid-template-columns' => Astra_Builder_Helper::$grid_size_mapping[ $tab_layout ], + ), + ); + $css_output_mobile = array( + + $selector => astra_get_responsive_background_obj( $footer_bg, 'mobile' ), + $selector . ' .ast-builder-grid-row' => array( + 'grid-column-gap' => astra_get_css_value( $inner_spacing_mobile, 'px' ), + 'grid-row-gap' => astra_get_css_value( $inner_spacing_mobile, 'px' ), + ), + $selector . '.ast-footer-row-mobile-inline .site-footer-section' => array( + 'display' => 'flex', + 'margin-bottom' => '0', + ), + $selector . '.ast-footer-row-mobile-stack .site-footer-section' => array( + 'display' => 'block', + 'margin-bottom' => '10px', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-mobile-' . $mob_layout . ' .ast-builder-grid-row' => array( + 'grid-template-columns' => Astra_Builder_Helper::$grid_size_mapping[ $mob_layout ], + ), + ); + + /* Parse CSS from array() */ + $css_output = astra_parse_css( $css_output_desktop ); + $css_output .= astra_parse_css( $css_output_tablet, '', astra_get_tablet_breakpoint() ); + $css_output .= astra_parse_css( $css_output_mobile, '', astra_get_mobile_breakpoint() ); + + $dynamic_css .= $css_output; + + $dynamic_css .= Astra_Builder_Base_Dynamic_CSS::prepare_advanced_margin_padding_css( $_section, $selector ); + $dynamic_css .= Astra_Builder_Base_Dynamic_CSS::prepare_visibility_css( $_section, $selector, 'grid' ); + return $dynamic_css; +} diff --git a/inc/builder/type/footer/below-footer/assets/js/minified/customizer-preview.min.js b/inc/builder/type/footer/below-footer/assets/js/minified/customizer-preview.min.js new file mode 100644 index 0000000..a8355dc --- /dev/null +++ b/inc/builder/type/footer/below-footer/assets/js/minified/customizer-preview.min.js @@ -0,0 +1 @@ +!function(){var o=astraBuilderPreview.tablet_break_point||768,a=astraBuilderPreview.mobile_break_point||544,t="section-below-footer-builder",i='.site-below-footer-wrap[data-section="section-below-footer-builder"]';astra_css("astra-settings[hbb-footer-vertical-alignment]","align-items",i+" .ast-builder-grid-row, "+i+" .site-footer-section"),astra_css("astra-settings[hbb-footer-height]","min-height",i,"px"),wp.customize("astra-settings[hbb-inner-spacing]",function(t){t.bind(function(t){var r="";""!=t.desktop&&(r+=i+" .ast-builder-grid-row {",r+="grid-column-gap: "+t.desktop+"px;",r+="} "),""!=t.tablet&&(r+="@media (max-width: "+o+"px) {",r+=i+" .ast-builder-grid-row {",r+="grid-column-gap: "+t.tablet+"px;",r+="grid-row-gap: "+t.tablet+"px;",r+="} ",r+="} "),""!=t.mobile&&(r+="@media (max-width: "+a+"px) {",r+=i+" .ast-builder-grid-row {",r+="grid-column-gap: "+t.mobile+"px;",r+="grid-row-gap: "+t.mobile+"px;",r+="} ",r+="} "),astra_add_dynamic_css("hbb-inner-spacing-toggle-button",r)})}),wp.customize("astra-settings[hbb-footer-separator]",function(t){t.bind(function(t){var r="";""!==t&&(r=i+" {",r+="border-top-width: "+t+"px;",r+="border-top-style: solid",r+="} "),astra_add_dynamic_css("hbb-footer-separator",r)})}),wp.customize("astra-settings[hbb-footer-top-border-color]",function(t){t.bind(function(t){var r="";""!==t&&(r=i+" {",r+="border-top-color: "+t+";",r+="border-top-style: solid",r+="} "),astra_add_dynamic_css("hbb-footer-top-border-color",r)})}),wp.customize("astra-settings[hbb-footer-layout-width]",function(t){t.bind(function(t){var r="";"content"==t&&(r=i+" .ast-builder-grid-row {",r+="max-width: "+AstraBuilderPrimaryFooterData.footer_content_width+"px;",r+="margin-left: auto;",r+="margin-right: auto;",r+="} "),"full"==t&&(r=i+" .ast-builder-grid-row {",r+="max-width: 100%;",r+="padding-right: 35px; padding-left: 35px;",r+="} "),astra_add_dynamic_css("hbb-footer-layout-width",r)})}),astra_apply_responsive_background_css("astra-settings[hbb-footer-bg-obj-responsive]",i,"desktop"),astra_apply_responsive_background_css("astra-settings[hbb-footer-bg-obj-responsive]",i,"tablet"),astra_apply_responsive_background_css("astra-settings[hbb-footer-bg-obj-responsive]",i,"mobile"),astra_builder_advanced_css(t,i),astra_builder_visibility_css(t,i,"grid")}(jQuery);
\ No newline at end of file diff --git a/inc/builder/type/footer/below-footer/assets/js/unminified/customizer-preview.js b/inc/builder/type/footer/below-footer/assets/js/unminified/customizer-preview.js new file mode 100644 index 0000000..f5d8377 --- /dev/null +++ b/inc/builder/type/footer/below-footer/assets/js/unminified/customizer-preview.js @@ -0,0 +1,142 @@ +/**
+ * This file adds some LIVE to the Customizer live preview. To leverage
+ * this, set your custom settings to 'postMessage' and then add your handling
+ * here. Your javascript should grab settings from customizer controls, and
+ * then make any necessary changes to the page using jQuery.
+ *
+ * @package Astra
+ * @since 3.0.0
+ */
+
+( function( $ ) {
+
+ var tablet_break_point = astraBuilderPreview.tablet_break_point || 768,
+ mobile_break_point = astraBuilderPreview.mobile_break_point || 544;
+
+ var section = 'section-below-footer-builder';
+ var selector = '.site-below-footer-wrap[data-section="section-below-footer-builder"]';
+
+ // Footer Vertical Alignment.
+ astra_css(
+ 'astra-settings[hbb-footer-vertical-alignment]',
+ 'align-items',
+ selector + ' .ast-builder-grid-row, ' + selector + ' .site-footer-section'
+ );
+
+
+ // Header Height.
+ astra_css(
+ 'astra-settings[hbb-footer-height]',
+ 'min-height',
+ selector,
+ 'px'
+ );
+
+ // Inner Space.
+ wp.customize( 'astra-settings[hbb-inner-spacing]', function( value ) {
+ value.bind( function( spacing ) {
+ var dynamicStyle = '';
+ if ( spacing.desktop != '' ) {
+ dynamicStyle += selector + ' .ast-builder-grid-row {';
+ dynamicStyle += 'grid-column-gap: ' + spacing.desktop + 'px;';
+ dynamicStyle += '} ';
+ }
+
+ if ( spacing.tablet != '' ) {
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += selector + ' .ast-builder-grid-row {';
+ dynamicStyle += 'grid-column-gap: ' + spacing.tablet + 'px;';
+ dynamicStyle += 'grid-row-gap: ' + spacing.tablet + 'px;';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+ }
+
+ if ( spacing.mobile != '' ) {
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += selector + ' .ast-builder-grid-row {';
+ dynamicStyle += 'grid-column-gap: ' + spacing.mobile + 'px;';
+ dynamicStyle += 'grid-row-gap: ' + spacing.mobile + 'px;';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+ }
+
+ astra_add_dynamic_css( 'hbb-inner-spacing-toggle-button', dynamicStyle );
+ } );
+ } );
+
+ // Border Top width.
+ wp.customize( 'astra-settings[hbb-footer-separator]', function( setting ) {
+ setting.bind( function( separator ) {
+
+ var dynamicStyle = '';
+
+ if ( '' !== separator ) {
+ dynamicStyle = selector + ' {';
+ dynamicStyle += 'border-top-width: ' + separator + 'px;';
+ dynamicStyle += 'border-top-style: solid';
+ dynamicStyle += '} ';
+ }
+
+ astra_add_dynamic_css( 'hbb-footer-separator', dynamicStyle );
+
+ } );
+ } );
+
+ // Border Color.
+
+ wp.customize( 'astra-settings[hbb-footer-top-border-color]', function( setting ) {
+ setting.bind( function( color ) {
+
+ var dynamicStyle = '';
+
+ if ( '' !== color ) {
+ dynamicStyle = selector + ' {';
+ dynamicStyle += 'border-top-color: ' + color + ';';
+ dynamicStyle += 'border-top-style: solid';
+ dynamicStyle += '} ';
+ }
+
+ astra_add_dynamic_css( 'hbb-footer-top-border-color', dynamicStyle );
+
+ } );
+ } );
+
+ // Primary Header - Layout.
+ wp.customize( 'astra-settings[hbb-footer-layout-width]', function( setting ) {
+ setting.bind( function( layout ) {
+
+ var dynamicStyle = '';
+
+ if ( 'content' == layout ) {
+ dynamicStyle = selector + ' .ast-builder-grid-row {';
+ dynamicStyle += 'max-width: ' + AstraBuilderPrimaryFooterData.footer_content_width + 'px;';
+ dynamicStyle += 'margin-left: auto;';
+ dynamicStyle += 'margin-right: auto;';
+ dynamicStyle += '} ';
+ }
+
+ if ( 'full' == layout ) {
+ dynamicStyle = selector + ' .ast-builder-grid-row {';
+ dynamicStyle += 'max-width: 100%;';
+ dynamicStyle += 'padding-right: 35px; padding-left: 35px;';
+ dynamicStyle += '} ';
+ }
+
+ astra_add_dynamic_css( 'hbb-footer-layout-width', dynamicStyle );
+
+ } );
+ } );
+
+
+ // Responsive BG styles > Below Footer Row.
+ astra_apply_responsive_background_css( 'astra-settings[hbb-footer-bg-obj-responsive]', selector, 'desktop' );
+ astra_apply_responsive_background_css( 'astra-settings[hbb-footer-bg-obj-responsive]', selector, 'tablet' );
+ astra_apply_responsive_background_css( 'astra-settings[hbb-footer-bg-obj-responsive]', selector, 'mobile' );
+
+ // Advanced CSS Generation.
+ astra_builder_advanced_css( section, selector );
+
+ // Advanced Visibility CSS Generation.
+ astra_builder_visibility_css( section, selector, 'grid' );
+
+} )( jQuery );
diff --git a/inc/builder/type/footer/below-footer/class-astra-below-footer-component-loader.php b/inc/builder/type/footer/below-footer/class-astra-below-footer-component-loader.php new file mode 100644 index 0000000..c600d23 --- /dev/null +++ b/inc/builder/type/footer/below-footer/class-astra-below-footer-component-loader.php @@ -0,0 +1,52 @@ +<?php +/** + * Below Footer Styling Loader for Astra theme. + * + * @package Astra Builder + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since Astra 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Below Footer Initialization + * + * @since 3.0.0 + */ +class Astra_Below_Footer_Component_Loader { + + /** + * Constructor + * + * @since 3.0.0 + */ + public function __construct() { + add_action( 'customize_preview_init', array( $this, 'preview_scripts' ), 110 ); + } + + /** + * Customizer Preview + * + * @since 3.0.0 + */ + public function preview_scripts() { + /** + * Load unminified if SCRIPT_DEBUG is true. + */ + /* Directory and Extension */ + $dir_name = ( SCRIPT_DEBUG ) ? 'unminified' : 'minified'; + $file_prefix = ( SCRIPT_DEBUG ) ? '' : '.min'; + wp_enqueue_script( 'astra-footer-below-footer-customizer-preview-js', ASTRA_BUILDER_FOOTER_BELOW_FOOTER_URI . '/assets/js/' . $dir_name . '/customizer-preview' . $file_prefix . '.js', array( 'customize-preview', 'astra-customizer-preview-js' ), ASTRA_THEME_VERSION, true ); + + } +} + +/** +* Kicking this off by creating the object of the class. +*/ +new Astra_Below_Footer_Component_Loader(); diff --git a/inc/builder/type/footer/below-footer/class-astra-below-footer.php b/inc/builder/type/footer/below-footer/class-astra-below-footer.php new file mode 100644 index 0000000..e9ff993 --- /dev/null +++ b/inc/builder/type/footer/below-footer/class-astra-below-footer.php @@ -0,0 +1,49 @@ +<?php +/** + * Below Footer component. + * + * @package Astra Builder + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since Astra 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +define( 'ASTRA_BUILDER_FOOTER_BELOW_FOOTER_DIR', ASTRA_THEME_DIR . 'inc/builder/type/footer/below-footer' ); +define( 'ASTRA_BUILDER_FOOTER_BELOW_FOOTER_URI', ASTRA_THEME_URI . 'inc/builder/type/footer/below-footer' ); + +if ( ! class_exists( 'Astra_Below_Footer' ) ) { + + /** + * Below Footer Initial Setup + * + * @since 3.0.0 + */ + class Astra_Below_Footer { + + /** + * Constructor function that initializes required actions and hooks + */ + public function __construct() { + + // @codingStandardsIgnoreStart WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + require_once ASTRA_BUILDER_FOOTER_BELOW_FOOTER_DIR . '/class-astra-below-footer-component-loader.php'; + + // Include front end files. + if ( ! is_admin() ) { + require_once ASTRA_BUILDER_FOOTER_BELOW_FOOTER_DIR . '/dynamic-css/dynamic.css.php'; + } + // @codingStandardsIgnoreEnd WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + } + } + + /** + * Kicking this off by creating an object. + */ + new Astra_Below_Footer(); + +} diff --git a/inc/builder/type/footer/below-footer/dynamic-css/dynamic.css.php b/inc/builder/type/footer/below-footer/dynamic-css/dynamic.css.php new file mode 100644 index 0000000..7427eb8 --- /dev/null +++ b/inc/builder/type/footer/below-footer/dynamic-css/dynamic.css.php @@ -0,0 +1,153 @@ +<?php +/** + * Below Footer control - Dynamic CSS + * + * @package Astra Builder + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Below Footer CSS + */ +add_filter( 'astra_dynamic_theme_css', 'astra_fb_below_footer_dynamic_css' ); + +/** + * Dynamic CSS + * + * @param string $dynamic_css Astra Dynamic CSS. + * @param string $dynamic_css_filtered Astra Dynamic CSS Filters. + * @return String Generated dynamic CSS for below Footer. + * + * @since 3.0.0 + */ +function astra_fb_below_footer_dynamic_css( $dynamic_css, $dynamic_css_filtered = '' ) { + + if ( ! ( Astra_Builder_Helper::is_footer_row_empty( 'below' ) || is_customize_preview() ) ) { + return $dynamic_css; + } + + $_section = 'section-below-footer-builder'; + + $selector = '.site-below-footer-wrap[data-section="section-below-footer-builder"]'; + + $footer_bg = astra_get_option( 'hbb-footer-bg-obj-responsive' ); + $footer_height = astra_get_option( 'hbb-footer-height' ); + $footer_top_border_size = astra_get_option( 'hbb-footer-separator' ); + $footer_top_border_color = astra_get_option( 'hbb-footer-top-border-color' ); + $footer_width = astra_get_option( 'hbb-footer-layout-width' ); + $content_width = astra_get_option( 'site-content-width' ); + $inner_spacing = astra_get_option( 'hbb-inner-spacing' ); + + $layout = astra_get_option( 'hbb-footer-layout' ); + + $desk_layout = ( isset( $layout['desktop'] ) ) ? $layout['desktop'] : 'full'; + $tab_layout = ( isset( $layout['tablet'] ) ) ? $layout['tablet'] : 'full'; + $mob_layout = ( isset( $layout['mobile'] ) ) ? $layout['mobile'] : 'full'; + + $inner_spacing_desktop = ( isset( $inner_spacing['desktop'] ) ) ? $inner_spacing['desktop'] : ''; + $inner_spacing_tablet = ( isset( $inner_spacing['tablet'] ) ) ? $inner_spacing['tablet'] : ''; + $inner_spacing_mobile = ( isset( $inner_spacing['mobile'] ) ) ? $inner_spacing['mobile'] : ''; + + $css_output_desktop = array( + '.site-below-footer-wrap' => array( + 'padding-top' => '20px', + 'padding-bottom' => '20px', + ), + $selector => astra_get_responsive_background_obj( $footer_bg, 'desktop' ), + $selector . ' .ast-builder-grid-row' => array( + 'grid-column-gap' => astra_get_css_value( $inner_spacing_desktop, 'px' ), + ), + $selector . ' .ast-builder-grid-row, ' . $selector . ' .site-footer-section' => array( + 'align-items' => astra_get_option( 'hbb-footer-vertical-alignment' ), + ), + $selector . '.ast-footer-row-inline .site-footer-section' => array( + 'display' => 'flex', + 'margin-bottom' => '0', + ), + '.ast-builder-grid-row-' . $desk_layout . ' .ast-builder-grid-row' => array( + 'grid-template-columns' => Astra_Builder_Helper::$grid_size_mapping[ $desk_layout ], + ), + + ); + + $css_output_desktop[ $selector ]['min-height'] = astra_get_css_value( $footer_height, 'px' ); + + if ( isset( $footer_top_border_size ) && 1 <= $footer_top_border_size ) { + + $css_output_desktop[ $selector ]['border-style'] = 'solid'; + + $css_output_desktop[ $selector ]['border-width'] = '0px'; + + $css_output_desktop[ $selector ]['border-top-width'] = astra_get_css_value( $footer_top_border_size, 'px' ); + + $css_output_desktop[ $selector ]['border-top-color'] = $footer_top_border_color; + } + + $css_output_tablet = array( + + $selector => astra_get_responsive_background_obj( $footer_bg, 'tablet' ), + $selector . ' .ast-builder-grid-row' => array( + 'grid-column-gap' => astra_get_css_value( $inner_spacing_tablet, 'px' ), + 'grid-row-gap' => astra_get_css_value( $inner_spacing_tablet, 'px' ), + ), + $selector . '.ast-footer-row-tablet-inline .site-footer-section' => array( + 'display' => 'flex', + 'margin-bottom' => '0', + ), + $selector . '.ast-footer-row-tablet-stack .site-footer-section' => array( + 'display' => 'block', + 'margin-bottom' => '10px', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-tablet-' . $tab_layout . ' .ast-builder-grid-row' => array( + 'grid-template-columns' => Astra_Builder_Helper::$grid_size_mapping[ $tab_layout ], + ), + ); + $css_output_mobile = array( + + $selector => astra_get_responsive_background_obj( $footer_bg, 'mobile' ), + $selector . ' .ast-builder-grid-row' => array( + 'grid-column-gap' => astra_get_css_value( $inner_spacing_mobile, 'px' ), + 'grid-row-gap' => astra_get_css_value( $inner_spacing_mobile, 'px' ), + ), + $selector . '.ast-footer-row-mobile-inline .site-footer-section' => array( + 'display' => 'flex', + 'margin-bottom' => '0', + ), + $selector . '.ast-footer-row-mobile-stack .site-footer-section' => array( + 'display' => 'block', + 'margin-bottom' => '10px', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-mobile-' . $mob_layout . ' .ast-builder-grid-row' => array( + 'grid-template-columns' => Astra_Builder_Helper::$grid_size_mapping[ $mob_layout ], + ), + ); + + if ( isset( $footer_width ) && 'content' === $footer_width ) { + + $css_output_desktop[ $selector . ' .ast-builder-grid-row' ]['max-width'] = astra_get_css_value( $content_width, 'px' ); + $css_output_desktop[ $selector . ' .ast-builder-grid-row' ]['margin-left'] = 'auto'; + $css_output_desktop[ $selector . ' .ast-builder-grid-row' ]['margin-right'] = 'auto'; + } else { + $css_output_desktop[ $selector . ' .ast-builder-grid-row' ]['max-width'] = '100%'; + $css_output_desktop[ $selector . ' .ast-builder-grid-row' ]['padding-left'] = '35px'; + $css_output_desktop[ $selector . ' .ast-builder-grid-row' ]['padding-right'] = '35px'; + } + + + /* Parse CSS from array() */ + $css_output = astra_parse_css( $css_output_desktop ); + $css_output .= astra_parse_css( $css_output_tablet, '', astra_get_tablet_breakpoint() ); + $css_output .= astra_parse_css( $css_output_mobile, '', astra_get_mobile_breakpoint() ); + + $dynamic_css .= $css_output; + + $dynamic_css .= Astra_Builder_Base_Dynamic_CSS::prepare_advanced_margin_padding_css( $_section, $selector ); + + $dynamic_css .= Astra_Builder_Base_Dynamic_CSS::prepare_visibility_css( $_section, $selector, 'grid' ); + + return $dynamic_css; +} diff --git a/inc/builder/type/footer/button/assets/js/minified/customizer-preview.min.js b/inc/builder/type/footer/button/assets/js/minified/customizer-preview.min.js new file mode 100644 index 0000000..3a83881 --- /dev/null +++ b/inc/builder/type/footer/button/assets/js/minified/customizer-preview.min.js @@ -0,0 +1 @@ +jQuery,astra_builder_button_css("footer",AstraBuilderFooterButtonData.component_limit);
\ No newline at end of file diff --git a/inc/builder/type/footer/button/assets/js/unminified/customizer-preview.js b/inc/builder/type/footer/button/assets/js/unminified/customizer-preview.js new file mode 100644 index 0000000..45f32cd --- /dev/null +++ b/inc/builder/type/footer/button/assets/js/unminified/customizer-preview.js @@ -0,0 +1,15 @@ +/**
+ * This file adds some LIVE to the Customizer live preview. To leverage
+ * this, set your custom settings to 'postMessage' and then add your handling
+ * here. Your javascript should grab settings from customizer controls, and
+ * then make any necessary changes to the page using jQuery.
+ *
+ * @package Astra
+ * @since 3.0.0
+ */
+
+( function( $ ) {
+
+ astra_builder_button_css( 'footer', AstraBuilderFooterButtonData.component_limit );
+
+} )( jQuery );
diff --git a/inc/builder/type/footer/button/class-astra-footer-button-component-loader.php b/inc/builder/type/footer/button/class-astra-footer-button-component-loader.php new file mode 100644 index 0000000..eb895bf --- /dev/null +++ b/inc/builder/type/footer/button/class-astra-footer-button-component-loader.php @@ -0,0 +1,62 @@ +<?php +/** + * Button Styling Loader for Astra theme. + * + * @package Astra + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since Astra 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Customizer Initialization + * + * @since 3.0.0 + */ +class Astra_Footer_Button_Component_Loader { + + /** + * Constructor + * + * @since 3.0.0 + */ + public function __construct() { + add_action( 'customize_preview_init', array( $this, 'preview_scripts' ), 110 ); + } + + /** + * Customizer Preview + * + * @since 3.0.0 + */ + public function preview_scripts() { + /** + * Load unminified if SCRIPT_DEBUG is true. + */ + /* Directory and Extension */ + $dir_name = ( SCRIPT_DEBUG ) ? 'unminified' : 'minified'; + $file_prefix = ( SCRIPT_DEBUG ) ? '' : '.min'; + wp_enqueue_script( 'astra-footer-button-customizer-preview-js', ASTRA_FOOTER_BUTTON_URI . '/assets/js/' . $dir_name . '/customizer-preview' . $file_prefix . '.js', array( 'customize-preview', 'astra-customizer-preview-js' ), ASTRA_THEME_VERSION, true ); + + // Localize variables for Button JS. + wp_localize_script( + 'astra-footer-button-customizer-preview-js', + 'AstraBuilderFooterButtonData', + array( + 'component_limit' => defined( 'ASTRA_EXT_VER' ) ? Astra_Builder_Helper::$component_limit : Astra_Builder_Helper::$num_of_footer_button, + 'tablet_break_point' => astra_get_tablet_breakpoint(), + 'mobile_break_point' => astra_get_mobile_breakpoint(), + ) + ); + } +} + +/** +* Kicking this off by creating the object of the class. +*/ +new Astra_Footer_Button_Component_Loader(); diff --git a/inc/builder/type/footer/button/class-astra-footer-button-component.php b/inc/builder/type/footer/button/class-astra-footer-button-component.php new file mode 100644 index 0000000..f0344f9 --- /dev/null +++ b/inc/builder/type/footer/button/class-astra-footer-button-component.php @@ -0,0 +1,46 @@ +<?php +/** + * Footer Colors for Astra theme Buttpn. + * + * @package Astra + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since Astra 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + + +define( 'ASTRA_FOOTER_BUTTON_DIR', ASTRA_THEME_DIR . 'inc/builder/type/footer/button' ); +define( 'ASTRA_FOOTER_BUTTON_URI', ASTRA_THEME_URI . 'inc/builder/type/footer/button' ); + +/** + * Heading Initial Setup + * + * @since 3.0.0 + */ +class Astra_Footer_Button_Component { + + /** + * Constructor function that initializes required actions and hooks + */ + public function __construct() { + + // @codingStandardsIgnoreStart WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + require_once ASTRA_FOOTER_BUTTON_DIR . '/class-astra-footer-button-component-loader.php'; + + // Include front end files. + if ( ! is_admin() ) { + require_once ASTRA_FOOTER_BUTTON_DIR . '/dynamic-css/dynamic.css.php'; + } + // @codingStandardsIgnoreEnd WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + } +} + +/** + * Kicking this off by creating an object. + */ +new Astra_Footer_Button_Component(); diff --git a/inc/builder/type/footer/button/dynamic-css/dynamic.css.php b/inc/builder/type/footer/button/dynamic-css/dynamic.css.php new file mode 100644 index 0000000..03e2037 --- /dev/null +++ b/inc/builder/type/footer/button/dynamic-css/dynamic.css.php @@ -0,0 +1,90 @@ +<?php +/** + * Butons - Dynamic CSS + * + * @package Astra + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Heading Colors + */ +add_filter( 'astra_dynamic_theme_css', 'astra_fb_button_dynamic_css' ); + +/** + * Dynamic CSS + * + * @param string $dynamic_css Astra Dynamic CSS. + * @param string $dynamic_css_filtered Astra Dynamic CSS Filters. + * @return String Generated dynamic CSS for Heading Colors. + * + * @since 3.0.0 + */ +function astra_fb_button_dynamic_css( $dynamic_css, $dynamic_css_filtered = '' ) { + + $dynamic_css .= Astra_Button_Component_Dynamic_CSS::astra_button_dynamic_css( 'footer' ); + $fb_button_flag = false; + for ( $index = 1; $index <= Astra_Builder_Helper::$num_of_footer_button; $index++ ) { + + if ( ! Astra_Builder_Helper::is_component_loaded( 'button-' . $index, 'footer' ) ) { + continue; + } + $fb_button_flag = true; + + $selector = '.ast-footer-button-' . $index . '[data-section="section-fb-button-' . $index . '"]'; + + $alignment = astra_get_option( 'footer-button-' . $index . '-alignment' ); + + $desktop_alignment = ( isset( $alignment['desktop'] ) ) ? $alignment['desktop'] : ''; + $tablet_alignment = ( isset( $alignment['tablet'] ) ) ? $alignment['tablet'] : ''; + $mobile_alignment = ( isset( $alignment['mobile'] ) ) ? $alignment['mobile'] : ''; + + /** + * Copyright CSS. + */ + $css_output_desktop = array( + $selector => array( + 'justify-content' => $desktop_alignment, + ), + ); + + $css_output_tablet = array( + $selector => array( + 'justify-content' => $tablet_alignment, + ), + ); + + $css_output_mobile = array( + $selector => array( + 'justify-content' => $mobile_alignment, + ), + ); + + /* Parse CSS from array() */ + $css_output = astra_parse_css( $css_output_desktop ); + $css_output .= astra_parse_css( $css_output_tablet, '', astra_get_tablet_breakpoint() ); + $css_output .= astra_parse_css( $css_output_mobile, '', astra_get_mobile_breakpoint() ); + + $dynamic_css .= $css_output; + } + if ( true === $fb_button_flag ) { + $static_css = array( + '[data-section*="section-fb-button-"] .menu-link' => array( + 'display' => 'none', + ), + '[CLASS*="ast-footer-button-"][data-section^="section-fb-button-"]' => array( + 'justify-content' => 'center', + ), + '.site-footer-focus-item[CLASS*="ast-footer-button-"]' => array( + 'display' => 'flex', + ), + ); + return astra_parse_css( $static_css ) . $dynamic_css; + } + + return $dynamic_css; +} diff --git a/inc/builder/type/footer/copyright/assets/js/minified/customizer-preview.min.js b/inc/builder/type/footer/copyright/assets/js/minified/customizer-preview.min.js new file mode 100644 index 0000000..8d1e5a6 --- /dev/null +++ b/inc/builder/type/footer/copyright/assets/js/minified/customizer-preview.min.js @@ -0,0 +1 @@ +!function(){var i=".ast-footer-copyright",e=astraBuilderPreview.tablet_break_point||768,a=astraBuilderPreview.mobile_break_point||544;astra_css("astra-settings[footer-copyright-color]","color",i),astra_responsive_font_size("astra-settings[font-size-section-footer-copyright]",i),wp.customize("astra-settings[footer-copyright-alignment]",function(t){t.bind(function(t){var o;""==t.desktop&&""==t.tablet&&""==t.mobile||(o="",o+=".ast-footer-copyright {",o+="text-align: "+t.desktop+";",o+="} ",o+="@media (max-width: "+e+"px) {",o+=".ast-footer-copyright {",o+="text-align: "+t.tablet+";",o+="} ",o+="} ",o+="@media (max-width: "+a+"px) {",o+=".ast-footer-copyright {",o+="text-align: "+t.mobile+";",o+="} ",o+="} ",astra_add_dynamic_css("footer-copyright-alignment",o))})}),wp.customize("astra-settings[section-footer-copyright-margin]",function(t){t.bind(function(t){var o;""==t.desktop.bottom&&""==t.desktop.top&&""==t.desktop.left&&""==t.desktop.right&&""==t.tablet.bottom&&""==t.tablet.top&&""==t.tablet.left&&""==t.tablet.right&&""==t.mobile.bottom&&""==t.mobile.top&&""==t.mobile.left&&""==t.mobile.right||(o="",o+=i+" {",o+="margin-left: "+t.desktop.left+t["desktop-unit"]+";",o+="margin-right: "+t.desktop.right+t["desktop-unit"]+";",o+="margin-top: "+t.desktop.top+t["desktop-unit"]+";",o+="margin-bottom: "+t.desktop.bottom+t["desktop-unit"]+";",o+="} ",o+="@media (max-width: "+e+"px) {",o+=i+" {",o+="margin-left: "+t.tablet.left+t["tablet-unit"]+";",o+="margin-right: "+t.tablet.right+t["tablet-unit"]+";",o+="margin-top: "+t.tablet.top+t["desktop-unit"]+";",o+="margin-bottom: "+t.tablet.bottom+t["desktop-unit"]+";",o+="} ",o+="} ",o+="@media (max-width: "+a+"px) {",o+=i+" {",o+="margin-left: "+t.mobile.left+t["mobile-unit"]+";",o+="margin-right: "+t.mobile.right+t["mobile-unit"]+";",o+="margin-top: "+t.mobile.top+t["desktop-unit"]+";",o+="margin-bottom: "+t.mobile.bottom+t["desktop-unit"]+";",o+="} ",o+="} ",astra_add_dynamic_css("footer-copyright-margin",o))})}),astra_builder_visibility_css("section-footer-copyright",".ast-footer-copyright.ast-builder-layout-element")}(jQuery);
\ No newline at end of file diff --git a/inc/builder/type/footer/copyright/assets/js/unminified/customizer-preview.js b/inc/builder/type/footer/copyright/assets/js/unminified/customizer-preview.js new file mode 100644 index 0000000..4a70418 --- /dev/null +++ b/inc/builder/type/footer/copyright/assets/js/unminified/customizer-preview.js @@ -0,0 +1,98 @@ +/**
+ * This file adds some LIVE to the Customizer live preview. To leverage
+ * this, set your custom settings to 'postMessage' and then add your handling
+ * here. Your javascript should grab settings from customizer controls, and
+ * then make any necessary changes to the page using jQuery.
+ *
+ * @package Astra Builder
+ * @since 3.0.0
+ */
+
+( function( $ ) {
+
+ var selector = '.ast-footer-copyright';
+ var visibility_selector = '.ast-footer-copyright.ast-builder-layout-element';
+
+ var tablet_break_point = astraBuilderPreview.tablet_break_point || 768,
+ mobile_break_point = astraBuilderPreview.mobile_break_point || 544;
+
+ // HTML color.
+ astra_css(
+ 'astra-settings[footer-copyright-color]',
+ 'color',
+ selector
+ );
+
+ // Typography CSS Generation.
+ astra_responsive_font_size(
+ 'astra-settings[font-size-section-footer-copyright]',
+ selector
+ );
+
+ wp.customize( 'astra-settings[footer-copyright-alignment]', function( value ) {
+ value.bind( function( alignment ) {
+ if( alignment.desktop != '' || alignment.tablet != '' || alignment.mobile != '' ) {
+ var dynamicStyle = '';
+ dynamicStyle += '.ast-footer-copyright {';
+ dynamicStyle += 'text-align: ' + alignment['desktop'] + ';';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += '.ast-footer-copyright {';
+ dynamicStyle += 'text-align: ' + alignment['tablet'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += '.ast-footer-copyright {';
+ dynamicStyle += 'text-align: ' + alignment['mobile'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ astra_add_dynamic_css( 'footer-copyright-alignment', dynamicStyle );
+ }
+ } );
+ } );
+
+ // Margin.
+ wp.customize( 'astra-settings[section-footer-copyright-margin]', function( value ) {
+ value.bind( function( margin ) {
+ if(
+ margin.desktop.bottom != '' || margin.desktop.top != '' || margin.desktop.left != '' || margin.desktop.right != '' ||
+ margin.tablet.bottom != '' || margin.tablet.top != '' || margin.tablet.left != '' || margin.tablet.right != '' ||
+ margin.mobile.bottom != '' || margin.mobile.top != '' || margin.mobile.left != '' || margin.mobile.right != ''
+ ) {
+ var dynamicStyle = '';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['desktop']['left'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['desktop']['right'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['desktop']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['desktop']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['tablet']['left'] + margin['tablet-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['tablet']['right'] + margin['tablet-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['tablet']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['tablet']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['mobile']['left'] + margin['mobile-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['mobile']['right'] + margin['mobile-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['mobile']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['mobile']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+ astra_add_dynamic_css( 'footer-copyright-margin', dynamicStyle );
+ }
+ } );
+ } );
+
+ // Advanced Visibility CSS Generation.
+ astra_builder_visibility_css( 'section-footer-copyright', visibility_selector );
+
+} )( jQuery );
diff --git a/inc/builder/type/footer/copyright/class-astra-footer-copyright-component-loader.php b/inc/builder/type/footer/copyright/class-astra-footer-copyright-component-loader.php new file mode 100644 index 0000000..cf69a0f --- /dev/null +++ b/inc/builder/type/footer/copyright/class-astra-footer-copyright-component-loader.php @@ -0,0 +1,52 @@ +<?php +/** + * Copyright Styling Loader for Astra theme. + * + * @package Astra Builder + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since Astra 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Customizer Initialization + * + * @since 3.0.0 + */ +class Astra_Footer_Copyright_Component_Loader { + + /** + * Constructor + * + * @since 3.0.0 + */ + public function __construct() { + add_action( 'customize_preview_init', array( $this, 'preview_scripts' ), 110 ); + } + + /** + * Customizer Preview + * + * @since 3.0.0 + */ + public function preview_scripts() { + /** + * Load unminified if SCRIPT_DEBUG is true. + */ + /* Directory and Extension */ + $dir_name = ( SCRIPT_DEBUG ) ? 'unminified' : 'minified'; + $file_prefix = ( SCRIPT_DEBUG ) ? '' : '.min'; + wp_enqueue_script( 'astra-footer-copyright-customizer-preview-js', ASTRA_BUILDER_FOOTER_COPYRIGHT_URI . '/assets/js/' . $dir_name . '/customizer-preview' . $file_prefix . '.js', array( 'customize-preview', 'astra-customizer-preview-js' ), ASTRA_THEME_VERSION, true ); + + } +} + +/** +* Kicking this off by creating the object of the class. +*/ +new Astra_Footer_Copyright_Component_Loader(); diff --git a/inc/builder/type/footer/copyright/class-astra-footer-copyright-component.php b/inc/builder/type/footer/copyright/class-astra-footer-copyright-component.php new file mode 100644 index 0000000..1c03485 --- /dev/null +++ b/inc/builder/type/footer/copyright/class-astra-footer-copyright-component.php @@ -0,0 +1,49 @@ +<?php +/** + * Copyright component. + * + * @package Astra Builder + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since Astra 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +define( 'ASTRA_BUILDER_FOOTER_COPYRIGHT_DIR', ASTRA_THEME_DIR . 'inc/builder/type/footer/copyright' ); +define( 'ASTRA_BUILDER_FOOTER_COPYRIGHT_URI', ASTRA_THEME_URI . 'inc/builder/type/footer/copyright' ); + +if ( ! class_exists( 'Astra_Footer_Copyright_Component' ) ) { + + /** + * Astra_Footer_Copyright_Component + * + * @since 3.0.0 + */ + class Astra_Footer_Copyright_Component { + + /** + * Constructor function that initializes required actions and hooks + */ + public function __construct() { + + // @codingStandardsIgnoreStart WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + require_once ASTRA_BUILDER_FOOTER_COPYRIGHT_DIR . '/class-astra-footer-copyright-component-loader.php'; + + // Include front end files. + if ( ! is_admin() ) { + require_once ASTRA_BUILDER_FOOTER_COPYRIGHT_DIR . '/dynamic-css/dynamic.css.php'; + } + // @codingStandardsIgnoreEnd WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + } + } + + /** + * Kicking this off by creating an object. + */ + new Astra_Footer_Copyright_Component(); + +} diff --git a/inc/builder/type/footer/copyright/dynamic-css/dynamic.css.php b/inc/builder/type/footer/copyright/dynamic-css/dynamic.css.php new file mode 100644 index 0000000..bd74c46 --- /dev/null +++ b/inc/builder/type/footer/copyright/dynamic-css/dynamic.css.php @@ -0,0 +1,102 @@ +<?php +/** + * Copyright control - Dynamic CSS + * + * @package Astra Builder + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Copyright CSS + */ +add_filter( 'astra_dynamic_theme_css', 'astra_fb_copyright_dynamic_css' ); + +/** + * Dynamic CSS + * + * @param string $dynamic_css Astra Dynamic CSS. + * @param string $dynamic_css_filtered Astra Dynamic CSS Filters. + * @return String Generated dynamic CSS for Heading Colors. + * + * @since 3.0.0 + */ +function astra_fb_copyright_dynamic_css( $dynamic_css, $dynamic_css_filtered = '' ) { + + if ( ! Astra_Builder_Helper::is_component_loaded( 'copyright', 'footer' ) ) { + return $dynamic_css; + } + + $_section = 'section-footer-copyright'; + + $selector = '.ast-footer-copyright '; + + $visibility_selector = '.ast-footer-copyright.ast-builder-layout-element'; + + $alignment = astra_get_option( 'footer-copyright-alignment' ); + + $desktop_alignment = ( isset( $alignment['desktop'] ) ) ? $alignment['desktop'] : ''; + $tablet_alignment = ( isset( $alignment['tablet'] ) ) ? $alignment['tablet'] : ''; + $mobile_alignment = ( isset( $alignment['mobile'] ) ) ? $alignment['mobile'] : ''; + + $margin = astra_get_option( $_section . '-margin' ); + + /** + * Copyright CSS. + */ + $css_output_desktop = array( + '.ast-footer-copyright' => array( + 'text-align' => $desktop_alignment, + ), + $selector => array( + 'color' => astra_get_option( 'footer-copyright-color' ), + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'desktop' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'desktop' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'desktop' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'desktop' ), + ), + ); + + $css_output_tablet = array( + '.ast-footer-copyright' => array( + 'text-align' => $tablet_alignment, + ), + $selector => array( + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'tablet' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'tablet' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'tablet' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'tablet' ), + ), + ); + + $css_output_mobile = array( + '.ast-footer-copyright' => array( + 'text-align' => $mobile_alignment, + ), + $selector => array( + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'mobile' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'mobile' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'mobile' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'mobile' ), + ), + ); + + /* Parse CSS from array() */ + $css_output = astra_parse_css( $css_output_desktop ); + $css_output .= astra_parse_css( $css_output_tablet, '', astra_get_tablet_breakpoint() ); + $css_output .= astra_parse_css( $css_output_mobile, '', astra_get_mobile_breakpoint() ); + + $dynamic_css .= $css_output; + + $dynamic_css .= Astra_Builder_Base_Dynamic_CSS::prepare_advanced_typography_css( $_section, $selector ); + + $dynamic_css .= Astra_Builder_Base_Dynamic_CSS::prepare_visibility_css( $_section, $visibility_selector ); + + return $dynamic_css; +} diff --git a/inc/builder/type/footer/html/assets/js/minified/customizer-preview.min.js b/inc/builder/type/footer/html/assets/js/minified/customizer-preview.min.js new file mode 100644 index 0000000..08c135c --- /dev/null +++ b/inc/builder/type/footer/html/assets/js/minified/customizer-preview.min.js @@ -0,0 +1 @@ +!function(){var i=AstraBuilderHTMLData.tablet_break_point||768,o=AstraBuilderHTMLData.mobile_break_point||544;astra_builder_html_css("footer",AstraBuilderHTMLData.component_limit);for(var t=1;t<=AstraBuilderHTMLData.component_limit;t++)!function(a){wp.customize("astra-settings[footer-html-"+a+"-alignment]",function(t){t.bind(function(t){var e;""==t.desktop&&""==t.tablet&&""==t.mobile||(e="",e+='.footer-widget-area[data-section="section-fb-html-'+a+'"] .ast-builder-html-element {',e+="text-align: "+t.desktop+";",e+="} ",e+="@media (max-width: "+i+"px) {",e+='.footer-widget-area[data-section="section-fb-html-'+a+'"] .ast-builder-html-element {',e+="text-align: "+t.tablet+";",e+="} ",e+="} ",e+="@media (max-width: "+o+"px) {",e+='.footer-widget-area[data-section="section-fb-html-'+a+'"] .ast-builder-html-element {',e+="text-align: "+t.mobile+";",e+="} ",e+="} ",astra_add_dynamic_css("footer-html-"+a+"-alignment",e))})})}(t)}(jQuery);
\ No newline at end of file diff --git a/inc/builder/type/footer/html/assets/js/unminified/customizer-preview.js b/inc/builder/type/footer/html/assets/js/unminified/customizer-preview.js new file mode 100644 index 0000000..f437ab2 --- /dev/null +++ b/inc/builder/type/footer/html/assets/js/unminified/customizer-preview.js @@ -0,0 +1,47 @@ +/**
+ * This file adds some LIVE to the Customizer live preview. To leverage
+ * this, set your custom settings to 'postMessage' and then add your handling
+ * here. Your javascript should grab settings from customizer controls, and
+ * then make any necessary changes to the page using jQuery.
+ *
+ * @package Astra Builder
+ * @since 3.0.0
+ */
+
+( function( $ ) {
+
+ var tablet_break_point = AstraBuilderHTMLData.tablet_break_point || 768,
+ mobile_break_point = AstraBuilderHTMLData.mobile_break_point || 544;
+
+ astra_builder_html_css( 'footer', AstraBuilderHTMLData.component_limit );
+
+ for( var index = 1; index <= AstraBuilderHTMLData.component_limit ; index++ ) {
+ (function( index ) {
+ wp.customize( 'astra-settings[footer-html-'+ index +'-alignment]', function( value ) {
+ value.bind( function( alignment ) {
+ if( alignment.desktop != '' || alignment.tablet != '' || alignment.mobile != '' ) {
+ var dynamicStyle = '';
+ dynamicStyle += '.footer-widget-area[data-section="section-fb-html-'+ index +'"] .ast-builder-html-element {';
+ dynamicStyle += 'text-align: ' + alignment['desktop'] + ';';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += '.footer-widget-area[data-section="section-fb-html-'+ index +'"] .ast-builder-html-element {';
+ dynamicStyle += 'text-align: ' + alignment['tablet'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += '.footer-widget-area[data-section="section-fb-html-'+ index +'"] .ast-builder-html-element {';
+ dynamicStyle += 'text-align: ' + alignment['mobile'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ astra_add_dynamic_css( 'footer-html-'+ index +'-alignment', dynamicStyle );
+ }
+ } );
+ } );
+ })( index );
+ }
+
+} )( jQuery );
diff --git a/inc/builder/type/footer/html/class-astra-footer-html-component-loader.php b/inc/builder/type/footer/html/class-astra-footer-html-component-loader.php new file mode 100644 index 0000000..dedd754 --- /dev/null +++ b/inc/builder/type/footer/html/class-astra-footer-html-component-loader.php @@ -0,0 +1,62 @@ +<?php +/** + * HTML Styling Loader for Astra theme. + * + * @package Astra Builder + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since Astra 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Customizer Initialization + * + * @since 3.0.0 + */ +class Astra_Footer_Html_Component_Loader { + + /** + * Constructor + * + * @since 3.0.0 + */ + public function __construct() { + add_action( 'customize_preview_init', array( $this, 'preview_scripts' ), 110 ); + } + + /** + * Customizer Preview + * + * @since 3.0.0 + */ + public function preview_scripts() { + /** + * Load unminified if SCRIPT_DEBUG is true. + */ + /* Directory and Extension */ + $dir_name = ( SCRIPT_DEBUG ) ? 'unminified' : 'minified'; + $file_prefix = ( SCRIPT_DEBUG ) ? '' : '.min'; + wp_enqueue_script( 'astra-footer-html-customizer-preview-js', ASTRA_BUILDER_FOOTER_HTML_URI . '/assets/js/' . $dir_name . '/customizer-preview' . $file_prefix . '.js', array( 'customize-preview', 'astra-customizer-preview-js' ), ASTRA_THEME_VERSION, true ); + + // Localize variables for HTML JS. + wp_localize_script( + 'astra-footer-html-customizer-preview-js', + 'AstraBuilderHTMLData', + array( + 'component_limit' => defined( 'ASTRA_EXT_VER' ) ? Astra_Builder_Helper::$component_limit : Astra_Builder_Helper::$num_of_footer_html, + 'tablet_break_point' => astra_get_tablet_breakpoint(), + 'mobile_break_point' => astra_get_mobile_breakpoint(), + ) + ); + } +} + +/** +* Kicking this off by creating the object of the class. +*/ +new Astra_Footer_Html_Component_Loader(); diff --git a/inc/builder/type/footer/html/class-astra-footer-html-component.php b/inc/builder/type/footer/html/class-astra-footer-html-component.php new file mode 100644 index 0000000..296beb0 --- /dev/null +++ b/inc/builder/type/footer/html/class-astra-footer-html-component.php @@ -0,0 +1,45 @@ +<?php +/** + * HTML component. + * + * @package Astra Builder + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since Astra 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +define( 'ASTRA_BUILDER_FOOTER_HTML_DIR', ASTRA_THEME_DIR . 'inc/builder/type/footer/html' ); +define( 'ASTRA_BUILDER_FOOTER_HTML_URI', ASTRA_THEME_URI . 'inc/builder/type/footer/html' ); + +/** + * Heading Initial Setup + * + * @since 3.0.0 + */ +class Astra_Footer_Html_Component { + + /** + * Constructor function that initializes required actions and hooks + */ + public function __construct() { + + // @codingStandardsIgnoreStart WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + require_once ASTRA_BUILDER_FOOTER_HTML_DIR . '/class-astra-footer-html-component-loader.php'; + + // Include front end files. + if ( ! is_admin() ) { + require_once ASTRA_BUILDER_FOOTER_HTML_DIR . '/dynamic-css/dynamic.css.php'; + } + // @codingStandardsIgnoreEnd WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + } +} + +/** + * Kicking this off by creating an object. + */ +new Astra_Footer_Html_Component(); diff --git a/inc/builder/type/footer/html/dynamic-css/dynamic.css.php b/inc/builder/type/footer/html/dynamic-css/dynamic.css.php new file mode 100644 index 0000000..d40188e --- /dev/null +++ b/inc/builder/type/footer/html/dynamic-css/dynamic.css.php @@ -0,0 +1,86 @@ +<?php +/** + * HTML control - Dynamic CSS + * + * @package Astra Builder + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Heading Colors + */ +add_filter( 'astra_dynamic_theme_css', 'astra_fb_html_dynamic_css' ); + +/** + * Dynamic CSS + * + * @param string $dynamic_css Astra Dynamic CSS. + * @param string $dynamic_css_filtered Astra Dynamic CSS Filters. + * @return String Generated dynamic CSS for Heading Colors. + * + * @since 3.0.0 + */ +function astra_fb_html_dynamic_css( $dynamic_css, $dynamic_css_filtered = '' ) { + + $dynamic_css .= Astra_Html_Component_Dynamic_CSS::astra_html_dynamic_css( 'footer' ); + $static_css_flg = false; + $stati_css_output = ''; + for ( $index = 1; $index <= Astra_Builder_Helper::$num_of_footer_html; $index++ ) { + + if ( ! Astra_Builder_Helper::is_component_loaded( 'html-' . $index, 'footer' ) ) { + continue; + } + + $static_css_flg = true; + $selector = '.footer-widget-area[data-section="section-fb-html-' . $index . '"]'; + + $alignment = astra_get_option( 'footer-html-' . $index . '-alignment' ); + + $desktop_alignment = ( isset( $alignment['desktop'] ) ) ? $alignment['desktop'] : ''; + $tablet_alignment = ( isset( $alignment['tablet'] ) ) ? $alignment['tablet'] : ''; + $mobile_alignment = ( isset( $alignment['mobile'] ) ) ? $alignment['mobile'] : ''; + + /** + * Copyright CSS. + */ + $css_output_desktop = array( + $selector . ' .ast-builder-html-element' => array( + 'text-align' => $desktop_alignment, + ), + ); + + $css_output_tablet = array( + $selector . ' .ast-builder-html-element' => array( + 'text-align' => $tablet_alignment, + ), + ); + + $css_output_mobile = array( + $selector . ' .ast-builder-html-element' => array( + 'text-align' => $mobile_alignment, + ), + ); + + /* Parse CSS from array() */ + $css_output = astra_parse_css( $css_output_desktop ); + $css_output .= astra_parse_css( $css_output_tablet, '', astra_get_tablet_breakpoint() ); + $css_output .= astra_parse_css( $css_output_mobile, '', astra_get_mobile_breakpoint() ); + + $dynamic_css .= $css_output; + } + + if ( true === $static_css_flg ) { + $stati_css_output .= astra_parse_css( + array( + '.footer-widget-area[data-section^="section-fb-html-"] .ast-builder-html-element' => array( + 'text-align' => 'center', + ), + ) + ); + } + return $stati_css_output . $dynamic_css; +} diff --git a/inc/builder/type/footer/menu/assets/js/minified/customizer-preview.min.js b/inc/builder/type/footer/menu/assets/js/minified/customizer-preview.min.js new file mode 100644 index 0000000..b15bb4b --- /dev/null +++ b/inc/builder/type/footer/menu/assets/js/minified/customizer-preview.min.js @@ -0,0 +1 @@ +!function(){var o="#astra-footer-menu",i=astraBuilderPreview.tablet_break_point||768,a=astraBuilderPreview.mobile_break_point||544;wp.customize("astra-settings[footer-menu-alignment]",function(t){t.bind(function(t){var e;""==t.desktop&&""==t.tablet&&""==t.mobile||(e="",e+='.footer-widget-area[data-section="section-footer-menu"] .astra-footer-vertical-menu .menu-item {',e+="align-items: "+t.desktop+";",e+="} ",e+='.footer-widget-area[data-section="section-footer-menu"] .astra-footer-horizontal-menu {',e+="justify-content: "+t.desktop+";",e+="} ",e+="@media (max-width: "+i+"px) {",e+='.footer-widget-area[data-section="section-footer-menu"] .astra-footer-vertical-menu .menu-item {',e+="align-items: "+t.tablet+";",e+="} ",e+='.footer-widget-area[data-section="section-footer-menu"] .astra-footer-horizontal-menu {',e+="justify-content: "+t.tablet+";",e+="} ",e+="} ",e+="@media (max-width: "+a+"px) {",e+='.footer-widget-area[data-section="section-footer-menu"] .astra-footer-vertical-menu .menu-item {',e+="align-items: "+t.mobile+";",e+="} ",e+='.footer-widget-area[data-section="section-footer-menu"] .astra-footer-horizontal-menu {',e+="justify-content: "+t.mobile+";",e+="} ",e+="} ",astra_add_dynamic_css("footer-menu-alignment",e))})}),astra_responsive_font_size("astra-settings[footer-menu-font-size]",o+" .menu-item > a"),astra_color_responsive_css("astra-footer-menu-preview","astra-settings[footer-menu-color-responsive]","color",o+" .menu-item > a"),astra_color_responsive_css("astra-footer-menu-preview","astra-settings[footer-menu-h-color-responsive]","color",o+" .menu-item:hover > a"),astra_color_responsive_css("astra-footer-menu-preview","astra-settings[footer-menu-a-color-responsive]","color",o+" .menu-item.current-menu-item > a"),astra_apply_responsive_background_css("astra-settings[footer-menu-bg-obj-responsive]",o,"desktop"),astra_apply_responsive_background_css("astra-settings[footer-menu-bg-obj-responsive]",o,"tablet"),astra_apply_responsive_background_css("astra-settings[footer-menu-bg-obj-responsive]",o,"mobile"),astra_color_responsive_css("astra-footer-menu-preview","astra-settings[footer-menu-h-bg-color-responsive]","background",o+" .menu-item:hover > a"),astra_color_responsive_css("astra-footer-menu-preview","astra-settings[footer-menu-a-bg-color-responsive]","background",o+" .menu-item.current-menu-item > a"),wp.customize("astra-settings[footer-main-menu-spacing]",function(t){t.bind(function(t){var e;""==t.desktop.bottom&&""==t.desktop.top&&""==t.desktop.left&&""==t.desktop.right&&""==t.tablet.bottom&&""==t.tablet.top&&""==t.tablet.left&&""==t.tablet.right&&""==t.mobile.bottom&&""==t.mobile.top&&""==t.mobile.left&&""==t.mobile.right||(e="",e+=o+" .menu-item > a {",e+="padding-left: "+t.desktop.left+t["desktop-unit"]+";",e+="padding-right: "+t.desktop.right+t["desktop-unit"]+";",e+="padding-top: "+t.desktop.top+t["desktop-unit"]+";",e+="padding-bottom: "+t.desktop.bottom+t["desktop-unit"]+";",e+="} ",e+="@media (max-width: "+i+"px) {",e+=o+" .menu-item > a {",e+="padding-left: "+t.tablet.left+t["tablet-unit"]+";",e+="padding-right: "+t.tablet.right+t["tablet-unit"]+";",e+="padding-top: "+t.tablet.top+t["tablet-unit"]+";",e+="padding-bottom: "+t.tablet.bottom+t["tablet-unit"]+";",e+="} ",e+="} ",e+="@media (max-width: "+a+"px) {",e+=o+" .menu-item > a {",e+="padding-left: "+t.mobile.left+t["mobile-unit"]+";",e+="padding-right: "+t.mobile.right+t["mobile-unit"]+";",e+="padding-top: "+t.mobile.top+t["mobile-unit"]+";",e+="padding-bottom: "+t.mobile.bottom+t["mobile-unit"]+";",e+="} ",e+="} ",astra_add_dynamic_css("footer-menu-spacing",e))})}),wp.customize("astra-settings[section-footer-menu-margin]",function(t){t.bind(function(t){var e;""==t.desktop.bottom&&""==t.desktop.top&&""==t.desktop.left&&""==t.desktop.right&&""==t.tablet.bottom&&""==t.tablet.top&&""==t.tablet.left&&""==t.tablet.right&&""==t.mobile.bottom&&""==t.mobile.top&&""==t.mobile.left&&""==t.mobile.right||(e="",e+=o+" {",e+="margin-left: "+t.desktop.left+t["desktop-unit"]+";",e+="margin-right: "+t.desktop.right+t["desktop-unit"]+";",e+="margin-top: "+t.desktop.top+t["desktop-unit"]+";",e+="margin-bottom: "+t.desktop.bottom+t["desktop-unit"]+";",e+="} ",e+="@media (max-width: "+i+"px) {",e+=o+" {",e+="margin-left: "+t.tablet.left+t["tablet-unit"]+";",e+="margin-right: "+t.tablet.right+t["tablet-unit"]+";",e+="margin-top: "+t.tablet.top+t["desktop-unit"]+";",e+="margin-bottom: "+t.tablet.bottom+t["desktop-unit"]+";",e+="} ",e+="} ",e+="@media (max-width: "+a+"px) {",e+=o+" {",e+="margin-left: "+t.mobile.left+t["mobile-unit"]+";",e+="margin-right: "+t.mobile.right+t["mobile-unit"]+";",e+="margin-top: "+t.mobile.top+t["desktop-unit"]+";",e+="margin-bottom: "+t.mobile.bottom+t["desktop-unit"]+";",e+="} ",e+="} ",astra_add_dynamic_css("section-footer-menu-margin",e))})}),astra_builder_visibility_css("section-footer-menu",'.footer-widget-area[data-section="section-footer-menu"]',"block")}(jQuery);
\ No newline at end of file diff --git a/inc/builder/type/footer/menu/assets/js/unminified/customizer-preview.js b/inc/builder/type/footer/menu/assets/js/unminified/customizer-preview.js new file mode 100644 index 0000000..050aa76 --- /dev/null +++ b/inc/builder/type/footer/menu/assets/js/unminified/customizer-preview.js @@ -0,0 +1,191 @@ +/**
+ * This file adds some LIVE to the Customizer live preview. To leverage
+ * this, set your custom settings to 'postMessage' and then add your handling
+ * here. Your javascript should grab settings from customizer controls, and
+ * then make any necessary changes to the page using jQuery.
+ *
+ * @package Astra
+ * @since 3.0.0
+ */
+
+( function( $ ) {
+
+ var selector = '#astra-footer-menu';
+ var visibility_selector = '.footer-widget-area[data-section="section-footer-menu"]';
+
+ var tablet_break_point = astraBuilderPreview.tablet_break_point || 768,
+ mobile_break_point = astraBuilderPreview.mobile_break_point || 544;
+
+ wp.customize( 'astra-settings[footer-menu-alignment]', function( value ) {
+ value.bind( function( alignment ) {
+ if( alignment.desktop != '' || alignment.tablet != '' || alignment.mobile != '' ) {
+ var dynamicStyle = '';
+ dynamicStyle += '.footer-widget-area[data-section="section-footer-menu"] .astra-footer-vertical-menu .menu-item {';
+ dynamicStyle += 'align-items: ' + alignment['desktop'] + ';';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '.footer-widget-area[data-section="section-footer-menu"] .astra-footer-horizontal-menu {';
+ dynamicStyle += 'justify-content: ' + alignment['desktop'] + ';';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += '.footer-widget-area[data-section="section-footer-menu"] .astra-footer-vertical-menu .menu-item {';
+ dynamicStyle += 'align-items: ' + alignment['tablet'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '.footer-widget-area[data-section="section-footer-menu"] .astra-footer-horizontal-menu {';
+ dynamicStyle += 'justify-content: ' + alignment['tablet'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += '.footer-widget-area[data-section="section-footer-menu"] .astra-footer-vertical-menu .menu-item {';
+ dynamicStyle += 'align-items: ' + alignment['mobile'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '.footer-widget-area[data-section="section-footer-menu"] .astra-footer-horizontal-menu {';
+ dynamicStyle += 'justify-content: ' + alignment['mobile'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ astra_add_dynamic_css( 'footer-menu-alignment', dynamicStyle );
+ }
+ } );
+ } );
+
+ /**
+ * Typography CSS.
+ */
+ astra_responsive_font_size(
+ 'astra-settings[footer-menu-font-size]',
+ selector + ' .menu-item > a'
+ );
+
+ /**
+ * Menu - Colors
+ */
+ astra_color_responsive_css(
+ 'astra-footer-menu-preview',
+ 'astra-settings[footer-menu-color-responsive]',
+ 'color',
+ selector + ' .menu-item > a'
+ );
+
+ // Menu - Hover Color
+ astra_color_responsive_css(
+ 'astra-footer-menu-preview',
+ 'astra-settings[footer-menu-h-color-responsive]',
+ 'color',
+ selector + ' .menu-item:hover > a'
+ );
+
+ // Menu - Active Color
+ astra_color_responsive_css(
+ 'astra-footer-menu-preview',
+ 'astra-settings[footer-menu-a-color-responsive]',
+ 'color',
+ selector + ' .menu-item.current-menu-item > a'
+ );
+
+ // Responsive BG styles > Footer Menu.
+ astra_apply_responsive_background_css( 'astra-settings[footer-menu-bg-obj-responsive]', selector, 'desktop' );
+ astra_apply_responsive_background_css( 'astra-settings[footer-menu-bg-obj-responsive]', selector, 'tablet' );
+ astra_apply_responsive_background_css( 'astra-settings[footer-menu-bg-obj-responsive]', selector, 'mobile' );
+
+ // Menu - Hover Background
+ astra_color_responsive_css(
+ 'astra-footer-menu-preview',
+ 'astra-settings[footer-menu-h-bg-color-responsive]',
+ 'background',
+ selector + ' .menu-item:hover > a'
+ );
+
+ // Menu - Active Background
+ astra_color_responsive_css(
+ 'astra-footer-menu-preview',
+ 'astra-settings[footer-menu-a-bg-color-responsive]',
+ 'background',
+ selector + ' .menu-item.current-menu-item > a'
+ );
+
+ /**
+ * Spacing CSS.
+ */
+ wp.customize( 'astra-settings[footer-main-menu-spacing]', function( value ) {
+ value.bind( function( padding ) {
+ if(
+ padding.desktop.bottom != '' || padding.desktop.top != '' || padding.desktop.left != '' || padding.desktop.right != '' ||
+ padding.tablet.bottom != '' || padding.tablet.top != '' || padding.tablet.left != '' || padding.tablet.right != '' ||
+ padding.mobile.bottom != '' || padding.mobile.top != '' || padding.mobile.left != '' || padding.mobile.right != ''
+ ) {
+ var dynamicStyle = '';
+ dynamicStyle += selector + ' .menu-item > a {';
+ dynamicStyle += 'padding-left: ' + padding['desktop']['left'] + padding['desktop-unit'] + ';';
+ dynamicStyle += 'padding-right: ' + padding['desktop']['right'] + padding['desktop-unit'] + ';';
+ dynamicStyle += 'padding-top: ' + padding['desktop']['top'] + padding['desktop-unit'] + ';';
+ dynamicStyle += 'padding-bottom: ' + padding['desktop']['bottom'] + padding['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += selector + ' .menu-item > a {';
+ dynamicStyle += 'padding-left: ' + padding['tablet']['left'] + padding['tablet-unit'] + ';';
+ dynamicStyle += 'padding-right: ' + padding['tablet']['right'] + padding['tablet-unit'] + ';';
+ dynamicStyle += 'padding-top: ' + padding['tablet']['top'] + padding['tablet-unit'] + ';';
+ dynamicStyle += 'padding-bottom: ' + padding['tablet']['bottom'] + padding['tablet-unit'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += selector + ' .menu-item > a {';
+ dynamicStyle += 'padding-left: ' + padding['mobile']['left'] + padding['mobile-unit'] + ';';
+ dynamicStyle += 'padding-right: ' + padding['mobile']['right'] + padding['mobile-unit'] + ';';
+ dynamicStyle += 'padding-top: ' + padding['mobile']['top'] + padding['mobile-unit'] + ';';
+ dynamicStyle += 'padding-bottom: ' + padding['mobile']['bottom'] + padding['mobile-unit'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ astra_add_dynamic_css( 'footer-menu-spacing', dynamicStyle );
+ }
+ } );
+ } );
+
+ // Margin.
+ wp.customize( 'astra-settings[section-footer-menu-margin]', function( value ) {
+ value.bind( function( margin ) {
+ if(
+ margin.desktop.bottom != '' || margin.desktop.top != '' || margin.desktop.left != '' || margin.desktop.right != '' ||
+ margin.tablet.bottom != '' || margin.tablet.top != '' || margin.tablet.left != '' || margin.tablet.right != '' ||
+ margin.mobile.bottom != '' || margin.mobile.top != '' || margin.mobile.left != '' || margin.mobile.right != ''
+ ) {
+ var dynamicStyle = '';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['desktop']['left'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['desktop']['right'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['desktop']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['desktop']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['tablet']['left'] + margin['tablet-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['tablet']['right'] + margin['tablet-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['tablet']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['tablet']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['mobile']['left'] + margin['mobile-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['mobile']['right'] + margin['mobile-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['mobile']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['mobile']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+ astra_add_dynamic_css( 'section-footer-menu-margin', dynamicStyle );
+ }
+ } );
+ } );
+
+ // Advanced Visibility CSS Generation.
+ astra_builder_visibility_css( 'section-footer-menu', visibility_selector, 'block' );
+
+} )( jQuery );
diff --git a/inc/builder/type/footer/menu/class-astra-footer-menu-component-loader.php b/inc/builder/type/footer/menu/class-astra-footer-menu-component-loader.php new file mode 100644 index 0000000..c4d0355 --- /dev/null +++ b/inc/builder/type/footer/menu/class-astra-footer-menu-component-loader.php @@ -0,0 +1,52 @@ +<?php +/** + * Footer Navigation Menu Styling Loader for Astra theme. + * + * @package Astra Builder + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since Astra 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Footer Navigation Menu Initialization + * + * @since 3.0.0 + */ +class Astra_Footer_Menu_Component_Loader { + + /** + * Constructor + * + * @since 3.0.0 + */ + public function __construct() { + add_action( 'customize_preview_init', array( $this, 'preview_scripts' ), 110 ); + } + + /** + * Customizer Preview + * + * @since 3.0.0 + */ + public function preview_scripts() { + /** + * Load unminified if SCRIPT_DEBUG is true. + */ + /* Directory and Extension */ + $dir_name = ( SCRIPT_DEBUG ) ? 'unminified' : 'minified'; + $file_prefix = ( SCRIPT_DEBUG ) ? '' : '.min'; + wp_enqueue_script( 'astra-footer-menu-customizer-preview', ASTRA_BUILDER_FOOTER_MENU_URI . '/assets/js/' . $dir_name . '/customizer-preview' . $file_prefix . '.js', array( 'customize-preview', 'astra-customizer-preview-js' ), ASTRA_THEME_VERSION, true ); + + } +} + +/** +* Kicking this off by creating the object of the class. +*/ +new Astra_Footer_Menu_Component_Loader(); diff --git a/inc/builder/type/footer/menu/class-astra-footer-menu-component.php b/inc/builder/type/footer/menu/class-astra-footer-menu-component.php new file mode 100644 index 0000000..7a89429 --- /dev/null +++ b/inc/builder/type/footer/menu/class-astra-footer-menu-component.php @@ -0,0 +1,114 @@ +<?php +/** + * Footer Navigation Menu component. + * + * @package Astra Builder + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since Astra 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +define( 'ASTRA_BUILDER_FOOTER_MENU_DIR', ASTRA_THEME_DIR . 'inc/builder/type/footer/menu' ); +define( 'ASTRA_BUILDER_FOOTER_MENU_URI', ASTRA_THEME_URI . 'inc/builder/type/footer/menu' ); + +/** + * Footer Navigation Menu Initial Setup + * + * @since 3.0.0 + */ +class Astra_Footer_Menu_Component { + + /** + * Constructor function that initializes required actions and hooks + */ + public function __construct() { + + // @codingStandardsIgnoreStart WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + require_once ASTRA_BUILDER_FOOTER_MENU_DIR . '/class-astra-footer-menu-component-loader.php'; + + // Include front end files. + if ( ! is_admin() ) { + require_once ASTRA_BUILDER_FOOTER_MENU_DIR . '/dynamic-css/dynamic.css.php'; + } + // @codingStandardsIgnoreEnd WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + } + + /** + * Secondary navigation markup + * + * @since 3.0.0. + */ + public static function menu_markup() { + + // Menu Layout. + $desktop_menu_layout_class = ''; + $tablet_menu_layout_class = ''; + $mobile_menu_layout_class = ''; + $menu_layout = astra_get_option( 'footer-menu-layout' ); + + $desktop_menu_layout = ( isset( $menu_layout['desktop'] ) ) ? $menu_layout['desktop'] : ''; + $tablet_menu_layout = ( isset( $menu_layout['tablet'] ) ) ? $menu_layout['tablet'] : ''; + $mobile_menu_layout = ( isset( $menu_layout['mobile'] ) ) ? $menu_layout['mobile'] : ''; + + if ( ! empty( $desktop_menu_layout ) ) { + $desktop_menu_layout_class = 'astra-footer-' . esc_attr( $desktop_menu_layout ) . '-menu'; + } + + if ( ! empty( $tablet_menu_layout ) ) { + $tablet_menu_layout_class = 'astra-footer-tablet-' . esc_attr( $tablet_menu_layout ) . '-menu'; + } + + if ( ! empty( $mobile_menu_layout ) ) { + $mobile_menu_layout_class = 'astra-footer-mobile-' . esc_attr( $mobile_menu_layout ) . '-menu'; + } + + /** + * Filter the classes(array) for Menu (<ul>). + * + * @since 3.0.0 + * @var Array + */ + $menu_classes = apply_filters( 'astra_menu_classes', array( 'ast-nav-menu', 'ast-flex', $desktop_menu_layout_class, $tablet_menu_layout_class, $mobile_menu_layout_class ) ); + + $items_wrap = '<nav '; + $items_wrap .= astra_attr( + 'site-navigation', + array( + 'id' => 'site-navigation', + 'class' => 'ast-flex-grow-1 navigation-accessibility footer-navigation', + 'aria-label' => esc_attr__( 'Site Navigation', 'astra' ), + ) + ); + $items_wrap .= '>'; + $items_wrap .= '<div class="footer-nav-wrap">'; + $items_wrap .= '<ul id="%1$s" class="%2$s">%3$s</ul>'; + $items_wrap .= '</div>'; + $items_wrap .= '</nav>'; + + // To add default alignment for navigation which can be added through any third party plugin. + // Do not add any CSS from theme except header alignment. + if ( has_nav_menu( 'footer_menu' ) ) { + wp_nav_menu( + array( + 'depth' => 1, + 'menu_id' => 'astra-footer-menu', + 'menu_class' => esc_attr( implode( ' ', $menu_classes ) ), + 'container' => 'div', + 'container_class' => 'footer-bar-navigation', + 'items_wrap' => $items_wrap, + 'theme_location' => 'footer_menu', + ) + ); + } + } +} + +/** + * Kicking this off by creating an object. + */ +new Astra_Footer_Menu_Component(); diff --git a/inc/builder/type/footer/menu/dynamic-css/dynamic.css.php b/inc/builder/type/footer/menu/dynamic-css/dynamic.css.php new file mode 100644 index 0000000..1686dc8 --- /dev/null +++ b/inc/builder/type/footer/menu/dynamic-css/dynamic.css.php @@ -0,0 +1,291 @@ +<?php +/** + * Footer Menu Colors - Dynamic CSS + * + * @package astra-builder + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Footer Menu Colors + */ +add_filter( 'astra_dynamic_theme_css', 'astra_hb_footer_menu_dynamic_css', 11 ); + +/** + * Dynamic CSS + * + * @param string $dynamic_css Astra Dynamic CSS. + * @param string $dynamic_css_filtered Astra Dynamic CSS Filters. + * @return String Generated dynamic CSS for Footer Menu Colors. + * + * @since 3.0.0 + */ +function astra_hb_footer_menu_dynamic_css( $dynamic_css, $dynamic_css_filtered = '' ) { + + if ( ! Astra_Builder_Helper::is_component_loaded( 'menu', 'footer' ) ) { + return $dynamic_css; + } + + $_section = 'section-footer-menu'; + + $selector = '#astra-footer-menu'; + + $visibility_selector = '.footer-widget-area[data-section="section-footer-menu"]'; + + // Menu. + $menu_resp_color = astra_get_option( 'footer-menu-color-responsive' ); + $menu_resp_bg_color = astra_get_option( 'footer-menu-bg-obj-responsive' ); + $menu_resp_color_hover = astra_get_option( 'footer-menu-h-color-responsive' ); + $menu_resp_bg_color_hover = astra_get_option( 'footer-menu-h-bg-color-responsive' ); + $menu_resp_color_active = astra_get_option( 'footer-menu-a-color-responsive' ); + $menu_resp_bg_color_active = astra_get_option( 'footer-menu-a-bg-color-responsive' ); + + $alignment = astra_get_option( 'footer-menu-alignment' ); + + $desktop_alignment = ( isset( $alignment['desktop'] ) ) ? $alignment['desktop'] : ''; + $tablet_alignment = ( isset( $alignment['tablet'] ) ) ? $alignment['tablet'] : ''; + $mobile_alignment = ( isset( $alignment['mobile'] ) ) ? $alignment['mobile'] : ''; + + $menu_resp_color_desktop = ( isset( $menu_resp_color['desktop'] ) ) ? $menu_resp_color['desktop'] : ''; + $menu_resp_color_tablet = ( isset( $menu_resp_color['tablet'] ) ) ? $menu_resp_color['tablet'] : ''; + $menu_resp_color_mobile = ( isset( $menu_resp_color['mobile'] ) ) ? $menu_resp_color['mobile'] : ''; + + $menu_resp_color_hover_desktop = ( isset( $menu_resp_color_hover['desktop'] ) ) ? $menu_resp_color_hover['desktop'] : ''; + $menu_resp_color_hover_tablet = ( isset( $menu_resp_color_hover['tablet'] ) ) ? $menu_resp_color_hover['tablet'] : ''; + $menu_resp_color_hover_mobile = ( isset( $menu_resp_color_hover['mobile'] ) ) ? $menu_resp_color_hover['mobile'] : ''; + + $menu_resp_bg_color_hover_desktop = ( isset( $menu_resp_bg_color_hover['desktop'] ) ) ? $menu_resp_bg_color_hover['desktop'] : ''; + $menu_resp_bg_color_hover_tablet = ( isset( $menu_resp_bg_color_hover['tablet'] ) ) ? $menu_resp_bg_color_hover['tablet'] : ''; + $menu_resp_bg_color_hover_mobile = ( isset( $menu_resp_bg_color_hover['mobile'] ) ) ? $menu_resp_bg_color_hover['mobile'] : ''; + + $menu_resp_color_active_desktop = ( isset( $menu_resp_color_active['desktop'] ) ) ? $menu_resp_color_active['desktop'] : ''; + $menu_resp_color_active_tablet = ( isset( $menu_resp_color_active['tablet'] ) ) ? $menu_resp_color_active['tablet'] : ''; + $menu_resp_color_active_mobile = ( isset( $menu_resp_color_active['mobile'] ) ) ? $menu_resp_color_active['mobile'] : ''; + + $menu_resp_bg_color_active_desktop = ( isset( $menu_resp_bg_color_active['desktop'] ) ) ? $menu_resp_bg_color_active['desktop'] : ''; + $menu_resp_bg_color_active_tablet = ( isset( $menu_resp_bg_color_active['tablet'] ) ) ? $menu_resp_bg_color_active['tablet'] : ''; + $menu_resp_bg_color_active_mobile = ( isset( $menu_resp_bg_color_active['mobile'] ) ) ? $menu_resp_bg_color_active['mobile'] : ''; + + // Typography. + $menu_font_size = astra_get_option( 'footer-menu-font-size' ); + + $menu_font_size_desktop = ( isset( $menu_font_size['desktop'] ) ) ? $menu_font_size['desktop'] : ''; + $menu_font_size_tablet = ( isset( $menu_font_size['tablet'] ) ) ? $menu_font_size['tablet'] : ''; + $menu_font_size_mobile = ( isset( $menu_font_size['mobile'] ) ) ? $menu_font_size['mobile'] : ''; + $menu_font_size_desktop_unit = ( isset( $menu_font_size['desktop-unit'] ) ) ? $menu_font_size['desktop-unit'] : ''; + $menu_font_size_tablet_unit = ( isset( $menu_font_size['tablet-unit'] ) ) ? $menu_font_size['tablet-unit'] : ''; + $menu_font_size_mobile_unit = ( isset( $menu_font_size['mobile-unit'] ) ) ? $menu_font_size['mobile-unit'] : ''; + + // Menu Spacing. + $menu_spacing = astra_get_option( 'footer-main-menu-spacing' ); + + // - Desktop. + $menu_desktop_spacing_top = ( isset( $menu_spacing['desktop']['top'] ) && ! empty( $menu_spacing['desktop']['top'] ) ) ? $menu_spacing['desktop']['top'] : ''; + + $menu_desktop_spacing_bottom = ( isset( $menu_spacing['desktop']['bottom'] ) && ! empty( $menu_spacing['desktop']['bottom'] ) ) ? $menu_spacing['desktop']['bottom'] : ''; + + $menu_desktop_spacing_right = ( isset( $menu_spacing['desktop']['right'] ) && ! empty( $menu_spacing['desktop']['right'] ) ) ? $menu_spacing['desktop']['right'] : ''; + + $menu_desktop_spacing_left = ( isset( $menu_spacing['desktop']['left'] ) && ! empty( $menu_spacing['desktop']['left'] ) ) ? $menu_spacing['desktop']['left'] : ''; + + $menu_desktop_spacing_unit = ( isset( $menu_spacing['desktop-unit'] ) && ! empty( $menu_spacing['desktop-unit'] ) ) ? $menu_spacing['desktop-unit'] : ''; + + // - Tablet. + $menu_tablet_spacing_top = ( isset( $menu_spacing['tablet']['top'] ) && ! empty( $menu_spacing['tablet']['top'] ) ) ? $menu_spacing['tablet']['top'] : ''; + + $menu_tablet_spacing_bottom = ( isset( $menu_spacing['tablet']['bottom'] ) && ! empty( $menu_spacing['tablet']['bottom'] ) ) ? $menu_spacing['tablet']['bottom'] : ''; + + $menu_tablet_spacing_right = ( isset( $menu_spacing['tablet']['right'] ) && ! empty( $menu_spacing['tablet']['right'] ) ) ? $menu_spacing['tablet']['right'] : ''; + + $menu_tablet_spacing_left = ( isset( $menu_spacing['tablet']['left'] ) && ! empty( $menu_spacing['tablet']['left'] ) ) ? $menu_spacing['tablet']['left'] : ''; + + $menu_tablet_spacing_unit = ( isset( $menu_spacing['tablet-unit'] ) && ! empty( $menu_spacing['tablet-unit'] ) ) ? $menu_spacing['tablet-unit'] : ''; + + // - Mobile. + $menu_mobile_spacing_top = ( isset( $menu_spacing['mobile']['top'] ) && ! empty( $menu_spacing['mobile']['top'] ) ) ? $menu_spacing['mobile']['top'] : ''; + + $menu_mobile_spacing_bottom = ( isset( $menu_spacing['mobile']['bottom'] ) && ! empty( $menu_spacing['mobile']['bottom'] ) ) ? $menu_spacing['mobile']['bottom'] : ''; + + $menu_mobile_spacing_right = ( isset( $menu_spacing['mobile']['right'] ) && ! empty( $menu_spacing['mobile']['right'] ) ) ? $menu_spacing['mobile']['right'] : ''; + + $menu_mobile_spacing_left = ( isset( $menu_spacing['mobile']['left'] ) && ! empty( $menu_spacing['mobile']['left'] ) ) ? $menu_spacing['mobile']['left'] : ''; + + $menu_mobile_spacing_unit = ( isset( $menu_spacing['mobile-unit'] ) && ! empty( $menu_spacing['mobile-unit'] ) ) ? $menu_spacing['mobile-unit'] : ''; + + $margin = astra_get_option( $_section . '-margin' ); + + $arr_footer_ul_desktop = array( + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'desktop' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'desktop' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'desktop' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'desktop' ), + ); + + $arr_footer_ul_desktop = array_merge( $arr_footer_ul_desktop, astra_get_responsive_background_obj( $menu_resp_bg_color, 'desktop' ) ); + + $css_output_desktop = array( + '.footer-widget-area[data-section="section-footer-menu"] .astra-footer-horizontal-menu' => array( + 'justify-content' => $desktop_alignment, + ), + '.footer-widget-area[data-section="section-footer-menu"] .astra-footer-vertical-menu .menu-item' => array( + 'align-items' => $desktop_alignment, + ), + $selector . ' .menu-item > a' => array( + 'color' => $menu_resp_color_desktop, + 'font-size' => astra_get_font_css_value( $menu_font_size_desktop, $menu_font_size_desktop_unit ), + 'padding-top' => astra_get_css_value( $menu_desktop_spacing_top, $menu_desktop_spacing_unit ), + 'padding-bottom' => astra_get_css_value( $menu_desktop_spacing_bottom, $menu_desktop_spacing_unit ), + 'padding-left' => astra_get_css_value( $menu_desktop_spacing_left, $menu_desktop_spacing_unit ), + 'padding-right' => astra_get_css_value( $menu_desktop_spacing_right, $menu_desktop_spacing_unit ), + ), + $selector . ' .menu-item:hover > a' => array( + 'color' => $menu_resp_color_hover_desktop, + 'background' => $menu_resp_bg_color_hover_desktop, + ), + $selector . ' .menu-item.current-menu-item > a' => array( + 'color' => $menu_resp_color_active_desktop, + 'background' => $menu_resp_bg_color_active_desktop, + ), + $selector => $arr_footer_ul_desktop, + ); + + $arr_footer_ul_tablet = array( + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'tablet' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'tablet' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'tablet' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'tablet' ), + ); + + $arr_footer_ul_tablet = array_merge( $arr_footer_ul_tablet, astra_get_responsive_background_obj( $menu_resp_bg_color, 'tablet' ) ); + + $css_output_tablet = array( + '.footer-widget-area[data-section="section-footer-menu"] .astra-footer-tablet-horizontal-menu' => array( + 'justify-content' => $tablet_alignment, + ), + '.footer-widget-area[data-section="section-footer-menu"] .astra-footer-tablet-vertical-menu' => array( + 'display' => 'grid', + ), + '.footer-widget-area[data-section="section-footer-menu"] .astra-footer-tablet-vertical-menu .menu-item' => array( + 'align-items' => $tablet_alignment, + ), + $selector . ' .menu-item > a' => array( + 'color' => $menu_resp_color_tablet, + 'font-size' => astra_get_font_css_value( $menu_font_size_tablet, $menu_font_size_tablet_unit ), + 'padding-top' => astra_get_css_value( $menu_tablet_spacing_top, $menu_tablet_spacing_unit ), + 'padding-bottom' => astra_get_css_value( $menu_tablet_spacing_bottom, $menu_tablet_spacing_unit ), + 'padding-left' => astra_get_css_value( $menu_tablet_spacing_left, $menu_tablet_spacing_unit ), + 'padding-right' => astra_get_css_value( $menu_tablet_spacing_right, $menu_tablet_spacing_unit ), + ), + $selector . ' .menu-item:hover > a' => array( + 'color' => $menu_resp_color_hover_tablet, + 'background' => $menu_resp_bg_color_hover_tablet, + ), + $selector . ' .menu-item.current-menu-item > a' => array( + 'color' => $menu_resp_color_active_tablet, + 'background' => $menu_resp_bg_color_active_tablet, + ), + $selector => $arr_footer_ul_tablet, + ); + + $arr_footer_ul_mobile = array( + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'mobile' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'mobile' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'mobile' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'mobile' ), + ); + + $arr_footer_ul_mobile = array_merge( $arr_footer_ul_mobile, astra_get_responsive_background_obj( $menu_resp_bg_color, 'mobile' ) ); + + $css_output_mobile = array( + $selector => astra_get_responsive_background_obj( $menu_resp_bg_color, 'mobile' ), + '.footer-widget-area[data-section="section-footer-menu"] .astra-footer-mobile-horizontal-menu' => array( + 'justify-content' => $mobile_alignment, + ), + '.footer-widget-area[data-section="section-footer-menu"] .astra-footer-mobile-vertical-menu' => array( + 'display' => 'grid', + ), + '.footer-widget-area[data-section="section-footer-menu"] .astra-footer-mobile-vertical-menu .menu-item' => array( + 'align-items' => $mobile_alignment, + ), + $selector . ' .menu-item > a' => array( + 'color' => $menu_resp_color_mobile, + 'font-size' => astra_get_font_css_value( $menu_font_size_mobile, $menu_font_size_mobile_unit ), + 'padding-top' => astra_get_css_value( $menu_mobile_spacing_top, $menu_mobile_spacing_unit ), + 'padding-bottom' => astra_get_css_value( $menu_mobile_spacing_bottom, $menu_mobile_spacing_unit ), + 'padding-left' => astra_get_css_value( $menu_mobile_spacing_left, $menu_mobile_spacing_unit ), + 'padding-right' => astra_get_css_value( $menu_mobile_spacing_right, $menu_mobile_spacing_unit ), + ), + $selector . ' .menu-item:hover > a' => array( + 'color' => $menu_resp_color_hover_mobile, + 'background' => $menu_resp_bg_color_hover_mobile, + ), + $selector . ' .menu-item.current-menu-item > a' => array( + 'color' => $menu_resp_color_active_mobile, + 'background' => $menu_resp_bg_color_active_mobile, + ), + $selector => $arr_footer_ul_mobile, + ); + + /* Parse CSS from array() */ + $css_output = footer_menu_static_css(); + $css_output .= astra_parse_css( $css_output_desktop ); + $css_output .= astra_parse_css( $css_output_tablet, '', astra_get_tablet_breakpoint() ); + $css_output .= astra_parse_css( $css_output_mobile, '', astra_get_mobile_breakpoint() ); + + $dynamic_css .= $css_output; + + $dynamic_css .= Astra_Builder_Base_Dynamic_CSS::prepare_visibility_css( $_section, $visibility_selector, 'block' ); + + return $dynamic_css; +} + +/** + * Footer menu static CSS + * + * @since 3.5.0 + * @return string + */ +function footer_menu_static_css() { + $footer_menu_css = ' + .footer-nav-wrap .astra-footer-vertical-menu { + display: grid; + } + @media (min-width: 769px) { + .footer-nav-wrap .astra-footer-horizontal-menu li { + margin: 0; + } + .footer-nav-wrap .astra-footer-horizontal-menu a { + padding: 0 0.5em; + } + }'; + + if ( is_rtl() ) { + $footer_menu_css .= ' + @media (min-width: 769px) { + .footer-nav-wrap .astra-footer-horizontal-menu li:first-child a { + padding-right: 0; + } + .footer-nav-wrap .astra-footer-horizontal-menu li:last-child a { + padding-left: 0; + } + }'; + } else { + $footer_menu_css .= ' + @media (min-width: 769px) { + .footer-nav-wrap .astra-footer-horizontal-menu li:first-child a { + padding-left: 0; + } + .footer-nav-wrap .astra-footer-horizontal-menu li:last-child a { + padding-right: 0; + } + }'; + } + return Astra_Enqueue_Scripts::trim_css( $footer_menu_css ); +} diff --git a/inc/builder/type/footer/primary-footer/assets/js/minified/customizer-preview.min.js b/inc/builder/type/footer/primary-footer/assets/js/minified/customizer-preview.min.js new file mode 100644 index 0000000..34b93c8 --- /dev/null +++ b/inc/builder/type/footer/primary-footer/assets/js/minified/customizer-preview.min.js @@ -0,0 +1 @@ +!function(){var s=astraBuilderPreview.tablet_break_point||768,a=astraBuilderPreview.mobile_break_point||544,t="section-primary-footer-builder",e='.site-primary-footer-wrap[data-section="section-primary-footer-builder"]';wp.customize("astra-settings[hb-footer-layout-width]",function(t){t.bind(function(t){var r="";"content"==t&&(r=e+" .ast-builder-grid-row {",r+="max-width: "+AstraBuilderPrimaryFooterData.footer_content_width+"px;",r+="margin-left: auto;",r+="margin-right: auto;",r+="} "),"full"==t&&(r=e+" .ast-builder-grid-row {",r+="max-width: 100%;",r+="padding-right: 35px; padding-left: 35px;",r+="} "),astra_add_dynamic_css("hb-footer-layout-width",r)})}),astra_css("astra-settings[hb-footer-vertical-alignment]","align-items",e+" .ast-builder-grid-row, "+e+" .site-footer-section"),wp.customize("astra-settings[hb-inner-spacing]",function(t){t.bind(function(t){var r="";""!=t.desktop&&(r+=e+" .ast-builder-grid-row {",r+="grid-column-gap: "+t.desktop+"px;",r+="} "),""!=t.tablet&&(r+="@media (max-width: "+s+"px) {",r+=e+" .ast-builder-grid-row {",r+="grid-column-gap: "+t.tablet+"px;",r+="grid-row-gap: "+t.tablet+"px;",r+="} ",r+="} "),""!=t.mobile&&(r+="@media (max-width: "+a+"px) {",r+=e+" .ast-builder-grid-row {",r+="grid-column-gap: "+t.mobile+"px;",r+="grid-row-gap: "+t.mobile+"px;",r+="} ",r+="} "),astra_add_dynamic_css("hb-inner-spacing-toggle-button",r)})}),astra_css("astra-settings[hb-footer-main-sep]","border-top-width",e,"px"),astra_css("astra-settings[hb-footer-main-sep-color]","border-color",e);astra_add_dynamic_css("hb-footer-main-sep-color",'.site-primary-footer-wrap[data-section="section-primary-footer-builder"] {border-top-style: solid} '),astra_apply_responsive_background_css("astra-settings[hb-footer-bg-obj-responsive]",e,"desktop"),astra_apply_responsive_background_css("astra-settings[hb-footer-bg-obj-responsive]",e,"tablet"),astra_apply_responsive_background_css("astra-settings[hb-footer-bg-obj-responsive]",e,"mobile"),astra_apply_responsive_background_css("astra-settings[footer-bg-obj-responsive]",".site-footer","desktop"),astra_apply_responsive_background_css("astra-settings[footer-bg-obj-responsive]",".site-footer","tablet"),astra_apply_responsive_background_css("astra-settings[footer-bg-obj-responsive]",".site-footer","mobile"),astra_builder_advanced_css(t,e),astra_builder_advanced_css("section-footer-builder-layout",".ast-hfb-header .site-footer"),astra_builder_visibility_css(t,e,"grid")}(jQuery);
\ No newline at end of file diff --git a/inc/builder/type/footer/primary-footer/assets/js/unminified/customizer-preview.js b/inc/builder/type/footer/primary-footer/assets/js/unminified/customizer-preview.js new file mode 100644 index 0000000..c0e089a --- /dev/null +++ b/inc/builder/type/footer/primary-footer/assets/js/unminified/customizer-preview.js @@ -0,0 +1,124 @@ +/**
+ * This file adds some LIVE to the Customizer live preview. To leverage
+ * this, set your custom settings to 'postMessage' and then add your handling
+ * here. Your javascript should grab settings from customizer controls, and
+ * then make any necessary changes to the page using jQuery.
+ *
+ * @package Astra
+ * @since 3.0.0
+ */
+
+( function( $ ) {
+
+ var tablet_break_point = astraBuilderPreview.tablet_break_point || 768,
+ mobile_break_point = astraBuilderPreview.mobile_break_point || 544;
+
+ var section = 'section-primary-footer-builder';
+ var selector = '.site-primary-footer-wrap[data-section="section-primary-footer-builder"]';
+
+ // Primary Header - Layout.
+ wp.customize( 'astra-settings[hb-footer-layout-width]', function( setting ) {
+ setting.bind( function( layout ) {
+
+ var dynamicStyle = '';
+
+ if ( 'content' == layout ) {
+ dynamicStyle = selector + ' .ast-builder-grid-row {';
+ dynamicStyle += 'max-width: ' + AstraBuilderPrimaryFooterData.footer_content_width + 'px;';
+ dynamicStyle += 'margin-left: auto;';
+ dynamicStyle += 'margin-right: auto;';
+ dynamicStyle += '} ';
+ }
+
+ if ( 'full' == layout ) {
+ dynamicStyle = selector + ' .ast-builder-grid-row {';
+ dynamicStyle += 'max-width: 100%;';
+ dynamicStyle += 'padding-right: 35px; padding-left: 35px;';
+ dynamicStyle += '} ';
+ }
+
+ astra_add_dynamic_css( 'hb-footer-layout-width', dynamicStyle );
+
+ } );
+ } );
+
+ // Footer Vertical Alignment.
+ astra_css(
+ 'astra-settings[hb-footer-vertical-alignment]',
+ 'align-items',
+ selector + ' .ast-builder-grid-row, ' + selector + ' .site-footer-section'
+ );
+
+ // Inner Space.
+ wp.customize( 'astra-settings[hb-inner-spacing]', function( value ) {
+ value.bind( function( spacing ) {
+ var dynamicStyle = '';
+ if ( spacing.desktop != '' ) {
+ dynamicStyle += selector + ' .ast-builder-grid-row {';
+ dynamicStyle += 'grid-column-gap: ' + spacing.desktop + 'px;';
+ dynamicStyle += '} ';
+ }
+
+ if ( spacing.tablet != '' ) {
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += selector + ' .ast-builder-grid-row {';
+ dynamicStyle += 'grid-column-gap: ' + spacing.tablet + 'px;';
+ dynamicStyle += 'grid-row-gap: ' + spacing.tablet + 'px;';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+ }
+
+ if ( spacing.mobile != '' ) {
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += selector + ' .ast-builder-grid-row {';
+ dynamicStyle += 'grid-column-gap: ' + spacing.mobile + 'px;';
+ dynamicStyle += 'grid-row-gap: ' + spacing.mobile + 'px;';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+ }
+
+ astra_add_dynamic_css( 'hb-inner-spacing-toggle-button', dynamicStyle );
+ } );
+ } );
+
+ // Border Top width.
+ astra_css(
+ 'astra-settings[hb-footer-main-sep]',
+ 'border-top-width',
+ selector,
+ 'px'
+ );
+
+ // Border Color.
+ astra_css(
+ 'astra-settings[hb-footer-main-sep-color]',
+ 'border-color',
+ selector
+ );
+
+ var dynamicStyle = selector + ' {';
+ dynamicStyle += 'border-top-style: solid';
+ dynamicStyle += '} ';
+
+ astra_add_dynamic_css( 'hb-footer-main-sep-color', dynamicStyle );
+
+ // Responsive BG styles > Primary Footer Row.
+ astra_apply_responsive_background_css( 'astra-settings[hb-footer-bg-obj-responsive]', selector, 'desktop' );
+ astra_apply_responsive_background_css( 'astra-settings[hb-footer-bg-obj-responsive]', selector, 'tablet' );
+ astra_apply_responsive_background_css( 'astra-settings[hb-footer-bg-obj-responsive]', selector, 'mobile' );
+
+ // Responsive BG styles > Global Footer Row.
+ astra_apply_responsive_background_css( 'astra-settings[footer-bg-obj-responsive]', '.site-footer', 'desktop' );
+ astra_apply_responsive_background_css( 'astra-settings[footer-bg-obj-responsive]', '.site-footer', 'tablet' );
+ astra_apply_responsive_background_css( 'astra-settings[footer-bg-obj-responsive]', '.site-footer', 'mobile' );
+
+ // Advanced CSS Generation.
+ astra_builder_advanced_css( section, selector );
+
+ // Advanced CSS for Header Builder.
+ astra_builder_advanced_css( 'section-footer-builder-layout', '.ast-hfb-header .site-footer' );
+
+ // Advanced Visibility CSS Generation.
+ astra_builder_visibility_css( section, selector, 'grid' );
+
+} )( jQuery );
diff --git a/inc/builder/type/footer/primary-footer/class-astra-primary-footer-component-loader.php b/inc/builder/type/footer/primary-footer/class-astra-primary-footer-component-loader.php new file mode 100644 index 0000000..3e8dbee --- /dev/null +++ b/inc/builder/type/footer/primary-footer/class-astra-primary-footer-component-loader.php @@ -0,0 +1,60 @@ +<?php +/** + * Primary Footer Styling Loader for Astra theme. + * + * @package Astra Builder + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since Astra 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Primary Footer Initialization + * + * @since 3.0.0 + */ +class Astra_Primary_Footer_Component_Loader { + + /** + * Constructor + * + * @since 3.0.0 + */ + public function __construct() { + add_action( 'customize_preview_init', array( $this, 'preview_scripts' ), 110 ); + } + + /** + * Customizer Preview + * + * @since 3.0.0 + */ + public function preview_scripts() { + /** + * Load unminified if SCRIPT_DEBUG is true. + */ + /* Directory and Extension */ + $dir_name = ( SCRIPT_DEBUG ) ? 'unminified' : 'minified'; + $file_prefix = ( SCRIPT_DEBUG ) ? '' : '.min'; + wp_enqueue_script( 'astra-footer-primary-footer-customizer-preview-js', ASTRA_BUILDER_FOOTER_PRIMARY_FOOTER_URI . '/assets/js/' . $dir_name . '/customizer-preview' . $file_prefix . '.js', array( 'customize-preview', 'astra-customizer-preview-js' ), ASTRA_THEME_VERSION, true ); + + // Localize variables for Footer JS. + wp_localize_script( + 'astra-heading-primary-customizer-preview-js', + 'AstraBuilderPrimaryFooterData', + array( + 'footer_content_width' => astra_get_option( 'site-content-width' ), + ) + ); + } +} + +/** +* Kicking this off by creating the object of the class. +*/ +new Astra_Primary_Footer_Component_Loader(); diff --git a/inc/builder/type/footer/primary-footer/class-astra-primary-footer.php b/inc/builder/type/footer/primary-footer/class-astra-primary-footer.php new file mode 100644 index 0000000..6a2b92c --- /dev/null +++ b/inc/builder/type/footer/primary-footer/class-astra-primary-footer.php @@ -0,0 +1,50 @@ +<?php +/** + * Primary Footer component. + * + * @package Astra Builder + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since Astra 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +define( 'ASTRA_BUILDER_FOOTER_PRIMARY_FOOTER_DIR', ASTRA_THEME_DIR . 'inc/builder/type/footer/primary-footer' ); +define( 'ASTRA_BUILDER_FOOTER_PRIMARY_FOOTER_URI', ASTRA_THEME_URI . 'inc/builder/type/footer/primary-footer' ); + +if ( ! class_exists( 'Astra_Primary_Footer' ) ) { + + /** + * Primary Footer Initial Setup + * + * @since 3.0.0 + */ + class Astra_Primary_Footer { + + /** + * Constructor function that initializes required actions and hooks + */ + public function __construct() { + + // @codingStandardsIgnoreStart WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + require_once ASTRA_BUILDER_FOOTER_PRIMARY_FOOTER_DIR . '/class-astra-primary-footer-component-loader.php'; + + // Include front end files. + if ( ! is_admin() ) { + + require_once ASTRA_BUILDER_FOOTER_PRIMARY_FOOTER_DIR . '/dynamic-css/dynamic.css.php'; + } + // @codingStandardsIgnoreEnd WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + } + } + + /** + * Kicking this off by creating an object. + */ + new Astra_Primary_Footer(); + +} diff --git a/inc/builder/type/footer/primary-footer/dynamic-css/dynamic.css.php b/inc/builder/type/footer/primary-footer/dynamic-css/dynamic.css.php new file mode 100644 index 0000000..9cde713 --- /dev/null +++ b/inc/builder/type/footer/primary-footer/dynamic-css/dynamic.css.php @@ -0,0 +1,165 @@ +<?php +/** + * Primary Footer control - Dynamic CSS + * + * @package Astra Builder + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Primary Footer CSS + */ +add_filter( 'astra_dynamic_theme_css', 'astra_fb_primary_footer_dynamic_css' ); + +/** + * Dynamic CSS + * + * @param string $dynamic_css Astra Dynamic CSS. + * @param string $dynamic_css_filtered Astra Dynamic CSS Filters. + * @return String Generated dynamic CSS for Primary Footer. + * + * @since 3.0.0 + */ +function astra_fb_primary_footer_dynamic_css( $dynamic_css, $dynamic_css_filtered = '' ) { + + if ( ! ( Astra_Builder_Helper::is_footer_row_empty( 'primary' ) || is_customize_preview() ) ) { + return $dynamic_css; + } + + $global_footer_bg = astra_get_option( 'footer-bg-obj-responsive' ); + + $css_output_desktop = array( + '.site-footer' => astra_get_responsive_background_obj( $global_footer_bg, 'desktop' ), + ); + + $dynamic_css .= astra_parse_css( $css_output_desktop ); + // Advanced CSS for Header Builder. + $dynamic_css .= Astra_Builder_Base_Dynamic_CSS::prepare_advanced_margin_padding_css( 'section-footer-builder-layout', '.ast-hfb-header .site-footer' ); + + if ( ! ( Astra_Builder_Helper::is_footer_row_empty( 'primary' ) || is_customize_preview() ) ) { + return $dynamic_css; + } + + $_section = 'section-primary-footer-builder'; + + $selector = '.site-primary-footer-wrap[data-section="section-primary-footer-builder"]'; + + $footer_bg = astra_get_option( 'hb-footer-bg-obj-responsive' ); + $footer_top_border_size = astra_get_option( 'hb-footer-main-sep' ); + $footer_top_border_color = astra_get_option( 'hb-footer-main-sep-color' ); + $footer_width = astra_get_option( 'hb-footer-layout-width' ); + $content_width = astra_get_option( 'site-content-width' ); + $inner_spacing = astra_get_option( 'hb-inner-spacing' ); + + $layout = astra_get_option( 'hb-footer-layout' ); + + $desk_layout = ( isset( $layout['desktop'] ) ) ? $layout['desktop'] : 'full'; + $tab_layout = ( isset( $layout['tablet'] ) ) ? $layout['tablet'] : 'full'; + $mob_layout = ( isset( $layout['mobile'] ) ) ? $layout['mobile'] : 'full'; + + $inner_spacing_desktop = ( isset( $inner_spacing['desktop'] ) ) ? $inner_spacing['desktop'] : ''; + $inner_spacing_tablet = ( isset( $inner_spacing['tablet'] ) ) ? $inner_spacing['tablet'] : ''; + $inner_spacing_mobile = ( isset( $inner_spacing['mobile'] ) ) ? $inner_spacing['mobile'] : ''; + + $css_output_desktop = array( + '.site-primary-footer-wrap' => array( + 'padding-top' => '45px', + 'padding-bottom' => '45px', + ), + $selector => astra_get_responsive_background_obj( $footer_bg, 'desktop' ), + $selector . ' .ast-builder-grid-row' => array( + 'grid-column-gap' => astra_get_css_value( $inner_spacing_desktop, 'px' ), + ), + $selector . ' .ast-builder-grid-row, ' . $selector . ' .site-footer-section' => array( + 'align-items' => astra_get_option( 'hb-footer-vertical-alignment' ), + ), + $selector . '.ast-footer-row-inline .site-footer-section' => array( + 'display' => 'flex', + 'margin-bottom' => '0', + ), + '.ast-builder-grid-row-' . $desk_layout . ' .ast-builder-grid-row' => array( + 'grid-template-columns' => Astra_Builder_Helper::$grid_size_mapping[ $desk_layout ], + ), + + ); + + if ( isset( $footer_top_border_size ) && 1 <= $footer_top_border_size ) { + + $css_output_desktop[ $selector ]['border-style'] = 'solid'; + + $css_output_desktop[ $selector ]['border-width'] = '0px'; + + $css_output_desktop[ $selector ]['border-top-width'] = astra_get_css_value( $footer_top_border_size, 'px' ); + + $css_output_desktop[ $selector ]['border-top-color'] = $footer_top_border_color; + } + + if ( isset( $footer_width ) && 'content' === $footer_width ) { + + $css_output_desktop[ $selector . ' .ast-builder-grid-row' ]['max-width'] = astra_get_css_value( $content_width, 'px' ); + $css_output_desktop[ $selector . ' .ast-builder-grid-row' ]['margin-left'] = 'auto'; + $css_output_desktop[ $selector . ' .ast-builder-grid-row' ]['margin-right'] = 'auto'; + } else { + $css_output_desktop[ $selector . ' .ast-builder-grid-row' ]['max-width'] = '100%'; + $css_output_desktop[ $selector . ' .ast-builder-grid-row' ]['padding-left'] = '35px'; + $css_output_desktop[ $selector . ' .ast-builder-grid-row' ]['padding-right'] = '35px'; + } + + $css_output_tablet = array( + + $selector => astra_get_responsive_background_obj( $footer_bg, 'tablet' ), + '.site-footer' => astra_get_responsive_background_obj( $global_footer_bg, 'tablet' ), + $selector . ' .ast-builder-grid-row' => array( + 'grid-column-gap' => astra_get_css_value( $inner_spacing_tablet, 'px' ), + 'grid-row-gap' => astra_get_css_value( $inner_spacing_tablet, 'px' ), + ), + $selector . '.ast-footer-row-tablet-inline .site-footer-section' => array( + 'display' => 'flex', + 'margin-bottom' => '0', + ), + $selector . '.ast-footer-row-tablet-stack .site-footer-section' => array( + 'display' => 'block', + 'margin-bottom' => '10px', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-tablet-' . $tab_layout . ' .ast-builder-grid-row' => array( + 'grid-template-columns' => Astra_Builder_Helper::$grid_size_mapping[ $tab_layout ], + ), + ); + $css_output_mobile = array( + + $selector => astra_get_responsive_background_obj( $footer_bg, 'mobile' ), + '.site-footer' => astra_get_responsive_background_obj( $global_footer_bg, 'mobile' ), + $selector . ' .ast-builder-grid-row' => array( + 'grid-column-gap' => astra_get_css_value( $inner_spacing_mobile, 'px' ), + 'grid-row-gap' => astra_get_css_value( $inner_spacing_mobile, 'px' ), + ), + $selector . '.ast-footer-row-mobile-inline .site-footer-section' => array( + 'display' => 'flex', + 'margin-bottom' => '0', + ), + $selector . '.ast-footer-row-mobile-stack .site-footer-section' => array( + 'display' => 'block', + 'margin-bottom' => '10px', + ), + '.ast-builder-grid-row-container.ast-builder-grid-row-mobile-' . $mob_layout . ' .ast-builder-grid-row' => array( + 'grid-template-columns' => Astra_Builder_Helper::$grid_size_mapping[ $mob_layout ], + ), + ); + + /* Parse CSS from array() */ + $css_output = astra_parse_css( $css_output_desktop ); + $css_output .= astra_parse_css( $css_output_tablet, '', astra_get_tablet_breakpoint() ); + $css_output .= astra_parse_css( $css_output_mobile, '', astra_get_mobile_breakpoint() ); + + $dynamic_css .= $css_output; + + $dynamic_css .= Astra_Builder_Base_Dynamic_CSS::prepare_advanced_margin_padding_css( $_section, $selector ); + + $dynamic_css .= Astra_Builder_Base_Dynamic_CSS::prepare_visibility_css( $_section, $selector, 'grid' ); + + return $dynamic_css; +} diff --git a/inc/builder/type/footer/social-icon/assets/js/minified/customizer-preview.min.js b/inc/builder/type/footer/social-icon/assets/js/minified/customizer-preview.min.js new file mode 100644 index 0000000..8ca4a0a --- /dev/null +++ b/inc/builder/type/footer/social-icon/assets/js/minified/customizer-preview.min.js @@ -0,0 +1 @@ +jQuery,astra_builder_social_css("footer",astraBuilderFooterSocial.component_limit);
\ No newline at end of file diff --git a/inc/builder/type/footer/social-icon/assets/js/unminified/customizer-preview.js b/inc/builder/type/footer/social-icon/assets/js/unminified/customizer-preview.js new file mode 100644 index 0000000..5658cac --- /dev/null +++ b/inc/builder/type/footer/social-icon/assets/js/unminified/customizer-preview.js @@ -0,0 +1,15 @@ +/**
+ * This file adds some LIVE to the Customizer live preview. To leverage
+ * this, set your custom settings to 'postMessage' and then add your handling
+ * here. Your javascript should grab settings from customizer controls, and
+ * then make any necessary changes to the page using jQuery.
+ *
+ * @package Astra
+ * @since 3.0.0
+ */
+
+( function( $ ) {
+
+ astra_builder_social_css( 'footer', astraBuilderFooterSocial.component_limit );
+
+} )( jQuery );
diff --git a/inc/builder/type/footer/social-icon/class-astra-footer-social-icons-component-loader.php b/inc/builder/type/footer/social-icon/class-astra-footer-social-icons-component-loader.php new file mode 100644 index 0000000..408692c --- /dev/null +++ b/inc/builder/type/footer/social-icon/class-astra-footer-social-icons-component-loader.php @@ -0,0 +1,62 @@ +<?php +/** + * Social Icons Styling Loader for Astra theme. + * + * @package Astra Builder + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since Astra 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Social Icons Initialization + * + * @since 3.0.0 + */ +class Astra_Footer_Social_Icons_Component_Loader { + + /** + * Constructor + * + * @since 3.0.0 + */ + public function __construct() { + add_action( 'customize_preview_init', array( $this, 'preview_scripts' ), 110 ); + } + + /** + * Customizer Preview + * + * @since 3.0.0 + */ + public function preview_scripts() { + /** + * Load unminified if SCRIPT_DEBUG is true. + */ + /* Directory and Extension */ + $dir_name = ( SCRIPT_DEBUG ) ? 'unminified' : 'minified'; + $file_prefix = ( SCRIPT_DEBUG ) ? '' : '.min'; + wp_enqueue_script( 'astra-footer-social-icons-customizer-preview-js', ASTRA_BUILDER_FOOTER_SOCIAL_ICONS_URI . '/assets/js/' . $dir_name . '/customizer-preview' . $file_prefix . '.js', array( 'customize-preview', 'astra-customizer-preview-js' ), ASTRA_THEME_VERSION, true ); + + // Localize variables for Astra Breakpoints JS. + wp_localize_script( + 'astra-footer-social-icons-customizer-preview-js', + 'astraBuilderFooterSocial', + array( + 'tablet_break_point' => astra_get_tablet_breakpoint(), + 'mobile_break_point' => astra_get_mobile_breakpoint(), + 'component_limit' => defined( 'ASTRA_EXT_VER' ) ? Astra_Builder_Helper::$component_limit : Astra_Builder_Helper::$num_of_footer_social_icons, + ) + ); + } +} + +/** +* Kicking this off by creating the object of the class. +*/ +new Astra_Footer_Social_Icons_Component_Loader(); diff --git a/inc/builder/type/footer/social-icon/class-astra-footer-social-icons-component.php b/inc/builder/type/footer/social-icon/class-astra-footer-social-icons-component.php new file mode 100644 index 0000000..4890d26 --- /dev/null +++ b/inc/builder/type/footer/social-icon/class-astra-footer-social-icons-component.php @@ -0,0 +1,45 @@ +<?php +/** + * Social Icons component. + * + * @package Astra Builder + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since Astra 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +define( 'ASTRA_BUILDER_FOOTER_SOCIAL_ICONS_DIR', ASTRA_THEME_DIR . 'inc/builder/type/footer/social-icon' ); +define( 'ASTRA_BUILDER_FOOTER_SOCIAL_ICONS_URI', ASTRA_THEME_URI . 'inc/builder/type/footer/social-icon' ); + +/** + * Social Icons Initial Setup + * + * @since 3.0.0 + */ +class Astra_Footer_Social_Icons_Component { + + /** + * Constructor function that initializes required actions and hooks + */ + public function __construct() { + + // @codingStandardsIgnoreStart WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + require_once ASTRA_BUILDER_FOOTER_SOCIAL_ICONS_DIR . '/class-astra-footer-social-icons-component-loader.php'; + + // Include front end files. + if ( ! is_admin() ) { + require_once ASTRA_BUILDER_FOOTER_SOCIAL_ICONS_DIR . '/dynamic-css/dynamic.css.php'; + } + // @codingStandardsIgnoreEnd WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + } +} + +/** + * Kicking this off by creating an object. + */ +new Astra_Footer_Social_Icons_Component(); diff --git a/inc/builder/type/footer/social-icon/dynamic-css/dynamic.css.php b/inc/builder/type/footer/social-icon/dynamic-css/dynamic.css.php new file mode 100644 index 0000000..6ad9621 --- /dev/null +++ b/inc/builder/type/footer/social-icon/dynamic-css/dynamic.css.php @@ -0,0 +1,32 @@ +<?php +/** + * Social Icons control - Dynamic CSS + * + * @package Astra Builder + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Social Icons Colors + */ +add_filter( 'astra_dynamic_theme_css', 'astra_fb_social_icon_dynamic_css' ); + +/** + * Dynamic CSS + * + * @param string $dynamic_css Astra Dynamic CSS. + * @param string $dynamic_css_filtered Astra Dynamic CSS Filters. + * @return String Generated dynamic CSS for Social Icons Colors. + * + * @since 3.0.0 + */ +function astra_fb_social_icon_dynamic_css( $dynamic_css, $dynamic_css_filtered = '' ) { + + $dynamic_css .= Astra_Social_Component_Dynamic_CSS::astra_social_dynamic_css( 'footer' ); + + return $dynamic_css; +} diff --git a/inc/builder/type/footer/widget/assets/js/minified/customizer-preview.min.js b/inc/builder/type/footer/widget/assets/js/minified/customizer-preview.min.js new file mode 100644 index 0000000..febe5a6 --- /dev/null +++ b/inc/builder/type/footer/widget/assets/js/minified/customizer-preview.min.js @@ -0,0 +1 @@ +jQuery,astra_builder_widget_css("footer");
\ No newline at end of file diff --git a/inc/builder/type/footer/widget/assets/js/unminified/customizer-preview.js b/inc/builder/type/footer/widget/assets/js/unminified/customizer-preview.js new file mode 100644 index 0000000..ce30144 --- /dev/null +++ b/inc/builder/type/footer/widget/assets/js/unminified/customizer-preview.js @@ -0,0 +1,15 @@ +/**
+ * This file adds some LIVE to the Customizer live preview. To leverage
+ * this, set your custom settings to 'postMessage' and then add your handling
+ * here. Your javascript should grab settings from customizer controls, and
+ * then make any necessary changes to the page using jQuery.
+ *
+ * @package Astra Builder
+ * @since 3.0.0
+ */
+
+( function( $ ) {
+
+ astra_builder_widget_css('footer');
+
+} )( jQuery );
diff --git a/inc/builder/type/footer/widget/class-astra-footer-widget-component-loader.php b/inc/builder/type/footer/widget/class-astra-footer-widget-component-loader.php new file mode 100644 index 0000000..d08f616 --- /dev/null +++ b/inc/builder/type/footer/widget/class-astra-footer-widget-component-loader.php @@ -0,0 +1,64 @@ +<?php +/** + * WIDGET Styling Loader for Astra theme. + * + * @package Astra Builder + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since Astra 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Customizer Initialization + * + * @since 3.0.0 + */ +class Astra_Footer_Widget_Component_Loader { + + /** + * Constructor + * + * @since 3.0.0 + */ + public function __construct() { + add_action( 'customize_preview_init', array( $this, 'preview_scripts' ), 110 ); + } + + /** + * Customizer Preview + * + * @since 3.0.0 + */ + public function preview_scripts() { + /** + * Load unminified if SCRIPT_DEBUG is true. + */ + /* Directory and Extension */ + $dir_name = ( SCRIPT_DEBUG ) ? 'unminified' : 'minified'; + $file_prefix = ( SCRIPT_DEBUG ) ? '' : '.min'; + wp_enqueue_script( 'astra-footer-widget-customizer-preview-js', ASTRA_BUILDER_FOOTER_WIDGET_URI . '/assets/js/' . $dir_name . '/customizer-preview' . $file_prefix . '.js', array( 'customize-preview', 'astra-customizer-preview-js' ), ASTRA_THEME_VERSION, true ); + + // Localize variables for WIDGET JS. + wp_localize_script( + 'astra-footer-widget-customizer-preview-js', + 'AstraBuilderWidgetData', + array( + 'footer_widget_count' => defined( 'ASTRA_EXT_VER' ) ? Astra_Builder_Helper::$component_limit : Astra_Builder_Helper::$num_of_footer_widgets, + 'tablet_break_point' => astra_get_tablet_breakpoint(), + 'mobile_break_point' => astra_get_mobile_breakpoint(), + 'is_flex_based_css' => Astra_Builder_Helper::apply_flex_based_css(), + 'has_block_editor' => astra_has_widgets_block_editor(), + ) + ); + } +} + +/** +* Kicking this off by creating the object of the class. +*/ +new Astra_Footer_Widget_Component_Loader(); diff --git a/inc/builder/type/footer/widget/class-astra-footer-widget-component.php b/inc/builder/type/footer/widget/class-astra-footer-widget-component.php new file mode 100644 index 0000000..e1bf09d --- /dev/null +++ b/inc/builder/type/footer/widget/class-astra-footer-widget-component.php @@ -0,0 +1,45 @@ +<?php +/** + * WIDGET component. + * + * @package Astra Builder + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since Astra 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +define( 'ASTRA_BUILDER_FOOTER_WIDGET_DIR', ASTRA_THEME_DIR . 'inc/builder/type/footer/widget' ); +define( 'ASTRA_BUILDER_FOOTER_WIDGET_URI', ASTRA_THEME_URI . 'inc/builder/type/footer/widget' ); + +/** + * Heading Initial Setup + * + * @since 3.0.0 + */ +class Astra_Footer_Widget_Component { + + /** + * Constructor function that initializes required actions and hooks + */ + public function __construct() { + + // @codingStandardsIgnoreStart WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + require_once ASTRA_BUILDER_FOOTER_WIDGET_DIR . '/class-astra-footer-widget-component-loader.php'; + + // Include front end files. + if ( ! is_admin() ) { + require_once ASTRA_BUILDER_FOOTER_WIDGET_DIR . '/dynamic-css/dynamic.css.php'; + } + // @codingStandardsIgnoreEnd WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + } +} + +/** + * Kicking this off by creating an object. + */ +new Astra_Footer_Widget_Component(); diff --git a/inc/builder/type/footer/widget/dynamic-css/dynamic.css.php b/inc/builder/type/footer/widget/dynamic-css/dynamic.css.php new file mode 100644 index 0000000..b53af19 --- /dev/null +++ b/inc/builder/type/footer/widget/dynamic-css/dynamic.css.php @@ -0,0 +1,78 @@ +<?php +/** + * WIdget control - Dynamic CSS + * + * @package Astra Builder + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Heading Colors + */ +add_filter( 'astra_dynamic_theme_css', 'astra_fb_widget_dynamic_css' ); + +/** + * Dynamic CSS + * + * @param string $dynamic_css Astra Dynamic CSS. + * @param string $dynamic_css_filtered Astra Dynamic CSS Filters. + * @return String Generated dynamic CSS for Heading Colors. + * + * @since 3.0.0 + */ +function astra_fb_widget_dynamic_css( $dynamic_css, $dynamic_css_filtered = '' ) { + + for ( $index = 1; $index <= Astra_Builder_Helper::$num_of_footer_widgets; $index++ ) { + + if ( ! Astra_Builder_Helper::is_component_loaded( 'widget-' . $index, 'footer' ) ) { + continue; + } + + $selector = '.footer-widget-area[data-section="sidebar-widgets-footer-widget-' . $index . '"]'; + + $alignment = astra_get_option( 'footer-widget-alignment-' . $index ); + + $desktop_alignment = ( isset( $alignment['desktop'] ) ) ? $alignment['desktop'] : ''; + $tablet_alignment = ( isset( $alignment['tablet'] ) ) ? $alignment['tablet'] : ''; + $mobile_alignment = ( isset( $alignment['mobile'] ) ) ? $alignment['mobile'] : ''; + + /** + * Widget CSS. + */ + if ( Astra_Builder_Helper::apply_flex_based_css() ) { + $footer_widget_selector = $selector . '.footer-widget-area-inner'; + } else { + $footer_widget_selector = $selector . ' .footer-widget-area-inner'; + } + $css_output_desktop = array( + $footer_widget_selector => array( + 'text-align' => $desktop_alignment, + ), + ); + $css_output_tablet = array( + $footer_widget_selector => array( + 'text-align' => $tablet_alignment, + ), + ); + $css_output_mobile = array( + $footer_widget_selector => array( + 'text-align' => $mobile_alignment, + ), + ); + + /* Parse CSS from array() */ + $css_output = astra_parse_css( $css_output_desktop ); + $css_output .= astra_parse_css( $css_output_tablet, '', astra_get_tablet_breakpoint() ); + $css_output .= astra_parse_css( $css_output_mobile, '', astra_get_mobile_breakpoint() ); + + $dynamic_css .= $css_output; + + $dynamic_css .= Astra_Widget_Component_Dynamic_CSS::astra_widget_dynamic_css( 'footer' ); + } + + return $dynamic_css; +} diff --git a/inc/builder/type/header/above-header/assets/js/minified/customizer-preview.min.js b/inc/builder/type/header/above-header/assets/js/minified/customizer-preview.min.js new file mode 100644 index 0000000..0a24c24 --- /dev/null +++ b/inc/builder/type/header/above-header/assets/js/minified/customizer-preview.min.js @@ -0,0 +1 @@ +!function(){var r=astraBuilderPreview.tablet_break_point||768,t=astraBuilderPreview.mobile_break_point||544;wp.customize("astra-settings[hba-header-height]",function(a){a.bind(function(a){var e;""==a.desktop&&""==a.tablet&&""==a.mobile||(e="",e+=".ast-above-header-bar .site-above-header-wrap, .ast-mobile-header-wrap .ast-above-header-bar{",e+="min-height: "+a.desktop+"px;",e+="} ",e+=".ast-desktop .ast-above-header-bar .main-header-menu > .menu-item {",e+="line-height: "+a.desktop+"px;",e+="} ",e+="@media (max-width: "+r+"px) {",e+=".ast-above-header-bar .site-above-header-wrap, .ast-mobile-header-wrap .ast-above-header-bar{",e+="min-height: "+a.tablet+"px;",e+="} ",e+="} ",e+="@media (max-width: "+t+"px) {",e+=".ast-above-header-bar .site-above-header-wrap, .ast-mobile-header-wrap .ast-above-header-bar{",e+="min-height: "+a.mobile+"px;",e+="} ",e+="} ",astra_add_dynamic_css("hba-header-height",e))})}),wp.customize("astra-settings[hba-header-separator]",function(a){a.bind(function(a){var e="";e+=".ast-above-header.ast-above-header-bar, .ast-above-header-bar {",e+="border-bottom-width: "+a+"px;",e+="border-bottom-style: solid;",e+="border-color:"+wp.customize("astra-settings[hba-header-bottom-border-color]").get()+";",e+="}",astra_add_dynamic_css("hba-header-separator",e)})}),astra_css("astra-settings[hba-header-bottom-border-color]","border-color",".ast-above-header.ast-above-header-bar, .ast-above-header-bar"),astra_apply_responsive_background_css("astra-settings[hba-header-bg-obj-responsive]",".ast-above-header.ast-above-header-bar","desktop"),astra_apply_responsive_background_css("astra-settings[hba-header-bg-obj-responsive]",".ast-above-header.ast-above-header-bar","tablet"),astra_apply_responsive_background_css("astra-settings[hba-header-bg-obj-responsive]",".ast-above-header.ast-above-header-bar","mobile"),astra_builder_advanced_css("section-above-header-builder",".ast-above-header.ast-above-header-bar"),astra_builder_visibility_css("section-above-header-builder",".ast-above-header-bar","grid")}(jQuery);
\ No newline at end of file diff --git a/inc/builder/type/header/above-header/assets/js/unminified/customizer-preview.js b/inc/builder/type/header/above-header/assets/js/unminified/customizer-preview.js new file mode 100644 index 0000000..1f7d82d --- /dev/null +++ b/inc/builder/type/header/above-header/assets/js/unminified/customizer-preview.js @@ -0,0 +1,81 @@ +/**
+ * This file adds some LIVE to the Customizer live preview. To leverage
+ * this, set your custom settings to 'postMessage' and then add your handling
+ * here. Your javascript should grab settings from customizer controls, and
+ * then make any necessary changes to the page using jQuery.
+ *
+ * @package Astra
+ * @since 3.0.0
+ */
+
+( function( $ ) {
+
+ var tablet_break_point = astraBuilderPreview.tablet_break_point || 768,
+ mobile_break_point = astraBuilderPreview.mobile_break_point || 544;
+
+ wp.customize( 'astra-settings[hba-header-height]', function( value ) {
+ value.bind( function( size ) {
+
+ if( size.desktop != '' || size.tablet != '' || size.mobile != '' ) {
+ var dynamicStyle = '';
+ dynamicStyle += '.ast-above-header-bar .site-above-header-wrap, .ast-mobile-header-wrap .ast-above-header-bar{';
+ dynamicStyle += 'min-height: ' + size.desktop + 'px;';
+ dynamicStyle += '} ';
+ dynamicStyle += '.ast-desktop .ast-above-header-bar .main-header-menu > .menu-item {';
+ dynamicStyle += 'line-height: ' + size.desktop + 'px;';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += '.ast-above-header-bar .site-above-header-wrap, .ast-mobile-header-wrap .ast-above-header-bar{';
+ dynamicStyle += 'min-height: ' + size.tablet + 'px;';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += '.ast-above-header-bar .site-above-header-wrap, .ast-mobile-header-wrap .ast-above-header-bar{';
+ dynamicStyle += 'min-height: ' + size.mobile + 'px;';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ astra_add_dynamic_css( 'hba-header-height', dynamicStyle );
+ }
+ } );
+ } );
+
+ // Border Bottom width.
+ wp.customize( 'astra-settings[hba-header-separator]', function( value ) {
+ value.bind( function( border ) {
+
+ var color = wp.customize( 'astra-settings[hba-header-bottom-border-color]' ).get(),
+ dynamicStyle = '';
+
+ dynamicStyle += '.ast-above-header.ast-above-header-bar, .ast-above-header-bar {';
+ dynamicStyle += 'border-bottom-width: ' + border + 'px;';
+ dynamicStyle += 'border-bottom-style: solid;';
+ dynamicStyle += 'border-color:' + color + ';';
+ dynamicStyle += '}';
+
+ astra_add_dynamic_css( 'hba-header-separator', dynamicStyle );
+
+ } );
+ } );
+
+ // Border Color.
+ astra_css(
+ 'astra-settings[hba-header-bottom-border-color]',
+ 'border-color',
+ '.ast-above-header.ast-above-header-bar, .ast-above-header-bar'
+ );
+
+ // Responsive BG styles > Below Header Row.
+ astra_apply_responsive_background_css( 'astra-settings[hba-header-bg-obj-responsive]', '.ast-above-header.ast-above-header-bar', 'desktop' );
+ astra_apply_responsive_background_css( 'astra-settings[hba-header-bg-obj-responsive]', '.ast-above-header.ast-above-header-bar', 'tablet' );
+ astra_apply_responsive_background_css( 'astra-settings[hba-header-bg-obj-responsive]', '.ast-above-header.ast-above-header-bar', 'mobile' );
+
+ // Advanced CSS Generation.
+ astra_builder_advanced_css( 'section-above-header-builder', '.ast-above-header.ast-above-header-bar' );
+
+ // Advanced Visibility CSS Generation.
+ astra_builder_visibility_css( 'section-above-header-builder', '.ast-above-header-bar', 'grid' );
+
+} )( jQuery );
diff --git a/inc/builder/type/header/above-header/class-astra-above-header-loader.php b/inc/builder/type/header/above-header/class-astra-above-header-loader.php new file mode 100644 index 0000000..41dd14a --- /dev/null +++ b/inc/builder/type/header/above-header/class-astra-above-header-loader.php @@ -0,0 +1,53 @@ +<?php +/** + * Above Header Loader. + * + * @package astra-builder + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Class Astra_Above_Header_Loader + * + * Loads config files. + * + * @since 3.0.0 + */ +class Astra_Above_Header_Loader { + + /** + * Constructor + * + * @since 3.0.0 + */ + public function __construct() { + add_action( 'customize_preview_init', array( $this, 'preview_scripts' ), 110 ); + } + + /** + * Customizer Preview + * + * @since 3.0.0 + */ + public function preview_scripts() { + /** + * Load unminified if SCRIPT_DEBUG is true. + */ + /* Directory and Extension */ + $dir_name = ( SCRIPT_DEBUG ) ? 'unminified' : 'minified'; + $file_prefix = ( SCRIPT_DEBUG ) ? '' : '.min'; + wp_enqueue_script( 'astra-heading-above-customizer-preview-js', ASTRA_ABOVE_HEADER_URI . '/assets/js/' . $dir_name . '/customizer-preview' . $file_prefix . '.js', array( 'customize-preview', 'astra-customizer-preview-js' ), ASTRA_THEME_VERSION, true ); + } +} + +/** +* Kicking this off by creating the object of the class. +*/ +new Astra_Above_Header_Loader(); diff --git a/inc/builder/type/header/above-header/class-astra-above-header.php b/inc/builder/type/header/above-header/class-astra-above-header.php new file mode 100644 index 0000000..d42ce54 --- /dev/null +++ b/inc/builder/type/header/above-header/class-astra-above-header.php @@ -0,0 +1,44 @@ +<?php +/** + * Above Header. + * + * @package astra-builder + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +define( 'ASTRA_ABOVE_HEADER_DIR', ASTRA_THEME_DIR . 'inc/builder/type/header/above-header' ); +define( 'ASTRA_ABOVE_HEADER_URI', ASTRA_THEME_URI . 'inc/builder/type/header/above-header' ); + +/** + * Above Header Initial Setup + * + * @since 3.0.0 + */ +class Astra_Above_Header { + + /** + * Constructor function that initializes required actions and hooks. + */ + public function __construct() { + // @codingStandardsIgnoreStart WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + require_once ASTRA_ABOVE_HEADER_DIR . '/class-astra-above-header-loader.php'; + + // Include front end files. + if ( ! is_admin() ) { + require_once ASTRA_ABOVE_HEADER_DIR . '/dynamic-css/dynamic.css.php'; + } + // @codingStandardsIgnoreEnd WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + } +} + +/** + * Kicking this off by creating an object. + */ +new Astra_Above_Header(); diff --git a/inc/builder/type/header/above-header/dynamic-css/dynamic.css.php b/inc/builder/type/header/above-header/dynamic-css/dynamic.css.php new file mode 100644 index 0000000..618d9aa --- /dev/null +++ b/inc/builder/type/header/above-header/dynamic-css/dynamic.css.php @@ -0,0 +1,153 @@ +<?php +/** + * Above Header - Dynamic CSS + * + * @package astra-builder + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Above Header Row. + */ +add_filter( 'astra_dynamic_theme_css', 'astra_above_header_row_setting', 11 ); + +/** + * Above Header Row - Dynamic CSS + * + * @param string $dynamic_css Astra Dynamic CSS. + * @param string $dynamic_css_filtered Astra Dynamic CSS Filters. + * @return String Generated dynamic CSS for Heading Colors. + * + * @since 3.0.0 + */ +function astra_above_header_row_setting( $dynamic_css, $dynamic_css_filtered = '' ) { + + if ( ! is_customize_preview() && ( ! Astra_Builder_helper::is_row_empty( 'above', 'header', 'desktop' ) && ! Astra_Builder_helper::is_row_empty( 'above', 'header', 'mobile' ) ) ) { + return $dynamic_css; + } + + $parse_css = ''; + + // Common CSS options. + $hba_header_height = astra_get_option( 'hba-header-height' ); + $hba_header_divider = absint( astra_get_option( 'hba-header-separator' ) ); + $hba_border_color = astra_get_option( 'hba-header-bottom-border-color' ); + + // Background CSS options. + $hba_header_bg_obj = astra_get_option( 'hba-header-bg-obj-responsive' ); + $desktop_background = isset( $hba_header_bg_obj['desktop']['background-color'] ) ? $hba_header_bg_obj['desktop']['background-color'] : ''; + $tablet_background = isset( $hba_header_bg_obj['tablet']['background-color'] ) ? $hba_header_bg_obj['tablet']['background-color'] : ''; + $mobile_background = isset( $hba_header_bg_obj['mobile']['background-color'] ) ? $hba_header_bg_obj['mobile']['background-color'] : ''; + + // Header Height. + $hba_header_height_desktop = ( isset( $hba_header_height['desktop'] ) && ! empty( $hba_header_height['desktop'] ) ) ? $hba_header_height['desktop'] : ''; + $hba_header_height_tablet = ( isset( $hba_header_height['tablet'] ) && ! empty( $hba_header_height['tablet'] ) ) ? $hba_header_height['tablet'] : ''; + $hba_header_height_mobile = ( isset( $hba_header_height['mobile'] ) && ! empty( $hba_header_height['mobile'] ) ) ? $hba_header_height['mobile'] : ''; + + // Spacing CSS options. + $hba_header_spacing = astra_get_option( 'hba-header-spacing' ); + + /** + * Above Header General options + */ + $common_css_output = array( + '.ast-above-header .main-header-bar-navigation' => array( + 'height' => '100%', + ), + '.ast-header-break-point .ast-mobile-header-wrap .ast-above-header-wrap .main-header-bar-navigation .inline-on-mobile .menu-item .menu-link' => array( + 'border' => 'none', + ), + '.ast-header-break-point .ast-mobile-header-wrap .ast-above-header-wrap .main-header-bar-navigation .inline-on-mobile .menu-item-has-children > .ast-menu-toggle::before' => array( + 'font-size' => '.6rem', + ), + '.ast-header-break-point .ast-mobile-header-wrap .ast-above-header-wrap .main-header-bar-navigation .ast-submenu-expanded > .ast-menu-toggle::before' => array( + 'transform' => 'rotateX(180deg)', + ), + '.ast-mobile-header-wrap .ast-above-header-bar , .ast-above-header-bar .site-above-header-wrap' => array( + 'min-height' => astra_get_css_value( $hba_header_height_desktop, 'px' ), + ), + '.ast-desktop .ast-above-header-bar .main-header-menu > .menu-item' => array( + 'line-height' => astra_get_css_value( $hba_header_height_desktop, 'px' ), + ), + '.ast-desktop .ast-above-header-bar .ast-header-woo-cart, .ast-desktop .ast-above-header-bar .ast-header-edd-cart' => array( + 'line-height' => astra_get_css_value( $hba_header_height_desktop, 'px' ), + ), + ); + + // Apply border only when it has positive value. + if ( $hba_header_divider ) { + $common_css_output['.ast-above-header-bar'] = array( + 'border-bottom-width' => astra_get_css_value( $hba_header_divider, 'px' ), + 'border-bottom-color' => esc_attr( $hba_border_color ), + 'border-bottom-style' => 'solid', + ); + } else { + $common_css_output['.ast-above-header-bar'] = array( + 'border-bottom-style' => 'none', + ); + } + + if ( is_astra_addon_3_5_0_version() ) { + $common_css_output['.ast-above-header-bar.ast-header-sticked'] = array( + 'z-index' => 9, + ); + } + + $parse_css .= astra_parse_css( $common_css_output ); + + // Above Header Background Responsive - Desktop. + $desktop_bg = array( + '.ast-above-header.ast-above-header-bar' => astra_get_responsive_background_obj( $hba_header_bg_obj, 'desktop' ), + '.ast-header-break-point .ast-above-header-bar' => array( + 'background-color' => esc_attr( $desktop_background ), + ), + ); + $parse_css .= astra_parse_css( $desktop_bg ); + + // Above Header Background Responsive - Tablet. + $tablet_bg = array( + '.ast-above-header.ast-above-header-bar' => astra_get_responsive_background_obj( $hba_header_bg_obj, 'tablet' ), + '.ast-header-break-point .ast-above-header-bar' => array( + 'background-color' => esc_attr( $tablet_background ), + ), + '.ast-mobile-header-wrap .ast-above-header-bar , .ast-above-header-bar .site-above-header-wrap' => array( + 'min-height' => astra_get_css_value( $hba_header_height_tablet, 'px' ), + ), + '#masthead .ast-mobile-header-wrap .ast-above-header-bar' => array( + 'padding-left' => '20px', + 'padding-right' => '20px', + ), + ); + $parse_css .= astra_parse_css( $tablet_bg, '', astra_get_tablet_breakpoint() ); + + // Above Header Background Responsive - Mobile. + $mobile_bg = array( + '.ast-above-header.ast-above-header-bar' => astra_get_responsive_background_obj( $hba_header_bg_obj, 'mobile' ), + '.ast-header-break-point .ast-above-header-bar' => array( + 'background-color' => esc_attr( $mobile_background ), + ), + '.ast-mobile-header-wrap .ast-above-header-bar , .ast-above-header-bar .site-above-header-wrap' => array( + 'min-height' => astra_get_css_value( $hba_header_height_mobile, 'px' ), + ), + ); + $parse_css .= astra_parse_css( $mobile_bg, '', astra_get_mobile_breakpoint() ); + + // Trim white space for faster page loading. + $dynamic_css .= Astra_Enqueue_Scripts::trim_css( $parse_css ); + + $_section = 'section-above-header-builder'; + + $selector = '.site-above-header-wrap[data-section="ast_header_above"]'; + + $parent_selector = '.ast-above-header.ast-above-header-bar'; + + $dynamic_css .= Astra_Builder_Base_Dynamic_CSS::prepare_advanced_margin_padding_css( $_section, $parent_selector ); + + $dynamic_css .= Astra_Builder_Base_Dynamic_CSS::prepare_visibility_css( $_section, '.ast-above-header-bar', 'block', $mobile_tablet_default_display = 'grid' ); + + return $dynamic_css; +} diff --git a/inc/builder/type/header/account/assets/js/minified/customizer-preview.min.js b/inc/builder/type/header/account/assets/js/minified/customizer-preview.min.js new file mode 100644 index 0000000..2088bcb --- /dev/null +++ b/inc/builder/type/header/account/assets/js/minified/customizer-preview.min.js @@ -0,0 +1 @@ +!function(){var o=astraBuilderPreview.tablet_break_point||768,i=astraBuilderPreview.mobile_break_point||544,e=".ast-header-account-wrap";wp.customize("astra-settings[header-account-icon-color]",function(t){t.bind(function(t){var a=e+" .ast-header-account-type-icon .ahfb-svg-iconset svg path:not( .ast-hf-account-unfill ), "+e+" .ast-header-account-type-icon .ahfb-svg-iconset svg circle, .ast-mobile-popup-content"+e+" .ast-header-account-type-icon .ahfb-svg-iconset svg path:not( .ast-hf-account-unfill ), .ast-mobile-popup-content "+e+" .ast-header-account-type-icon .ahfb-svg-iconset svg circle {";a+="fill: "+(t=t||"inherit")+";",a+="} ",astra_add_dynamic_css("header-account-icon-color",a)})}),astra_responsive_font_size("astra-settings[font-size-section-header-account]",e+" .ast-header-account-text"),astra_css("astra-settings[header-account-type-text-color]","color",e+" .ast-header-account-text, .ast-mobile-popup-content "+e+" .ast-header-account-text"),wp.customize("astra-settings[header-account-icon-size]",function(t){t.bind(function(t){var a;""==t.desktop&&""==t.tablet&&""==t.mobile||(a="",a+=e+" .ast-header-account-type-icon .ahfb-svg-iconset svg {",a+="height: "+t.desktop+"px;",a+="width: "+t.desktop+"px;",a+="} ",a+="@media (max-width: "+o+"px) {",a+=e+" .ast-header-account-type-icon .ahfb-svg-iconset svg {",a+="height: "+t.tablet+"px;",a+="width: "+t.tablet+"px;",a+="} ",a+="} ",a+="@media (max-width: "+i+"px) {",a+=e+" .ast-header-account-type-icon .ahfb-svg-iconset svg {",a+="height: "+t.mobile+"px;",a+="width: "+t.mobile+"px;",a+="} ",a+="} ",astra_add_dynamic_css("header-account-icon-size",a))})}),wp.customize("astra-settings[header-account-image-width]",function(t){t.bind(function(t){var a;""==t.desktop&&""==t.tablet&&""==t.mobile||(a="",a+=e+" .ast-header-account-type-avatar .avatar {",a+="width: "+t.desktop+"px;",a+="} ",a+="@media (max-width: "+o+"px) {",a+=e+" .ast-header-account-type-avatar .avatar {",a+="width: "+t.tablet+"px;",a+="} ",a+="} ",a+="@media (max-width: "+i+"px) {",a+=e+" .ast-header-account-type-avatar .avatar {",a+="width: "+t.mobile+"px;",a+="} ",a+="} ",astra_add_dynamic_css("header-account-image-width",a))})}),wp.customize("astra-settings[header-account-margin]",function(t){t.bind(function(t){var a,e;""==t.desktop.bottom&&""==t.desktop.top&&""==t.desktop.left&&""==t.desktop.right&&""==t.tablet.bottom&&""==t.tablet.top&&""==t.tablet.left&&""==t.tablet.right&&""==t.mobile.bottom&&""==t.mobile.top&&""==t.mobile.left&&""==t.mobile.right||(e="",e+=(a=".ast-header-account-wrap")+" {",e+="margin-left: "+t.desktop.left+t["desktop-unit"]+";",e+="margin-right: "+t.desktop.right+t["desktop-unit"]+";",e+="margin-top: "+t.desktop.top+t["desktop-unit"]+";",e+="margin-bottom: "+t.desktop.bottom+t["desktop-unit"]+";",e+="} ",e+="@media (max-width: "+o+"px) {",e+=a+" {",e+="margin-left: "+t.tablet.left+t["tablet-unit"]+";",e+="margin-right: "+t.tablet.right+t["tablet-unit"]+";",e+="margin-top: "+t.tablet.top+t["desktop-unit"]+";",e+="margin-bottom: "+t.tablet.bottom+t["desktop-unit"]+";",e+="} ",e+="} ",e+="@media (max-width: "+i+"px) {",e+=a+" {",e+="margin-left: "+t.mobile.left+t["mobile-unit"]+";",e+="margin-right: "+t.mobile.right+t["mobile-unit"]+";",e+="margin-top: "+t.mobile.top+t["desktop-unit"]+";",e+="margin-bottom: "+t.mobile.bottom+t["desktop-unit"]+";",e+="} ",e+="} ",astra_add_dynamic_css("header-account-margin",e))})}),astra_builder_visibility_css("section-header-account",'.ast-header-account[data-section="section-header-account"]')}(jQuery);
\ No newline at end of file diff --git a/inc/builder/type/header/account/assets/js/unminified/customizer-preview.js b/inc/builder/type/header/account/assets/js/unminified/customizer-preview.js new file mode 100644 index 0000000..8bafe1f --- /dev/null +++ b/inc/builder/type/header/account/assets/js/unminified/customizer-preview.js @@ -0,0 +1,140 @@ +/**
+ * This file adds some LIVE to the Customizer live preview. To leverage
+ * this, set your custom settings to 'postMessage' and then add your handling
+ * here. Your javascript should grab settings from customizer controls, and
+ * then make any necessary changes to the page using jQuery.
+ *
+ * @package Astra
+ * @since x.x.x
+ */
+
+( function( $ ) {
+
+ var tablet_break_point = astraBuilderPreview.tablet_break_point || 768,
+ mobile_break_point = astraBuilderPreview.mobile_break_point || 544;
+
+ var selector = '.ast-header-account-wrap';
+ var section = 'section-header-account';
+ var visibility_selector = '.ast-header-account[data-section="section-header-account"]';
+
+ wp.customize( 'astra-settings[header-account-icon-color]', function( value ) {
+ value.bind( function( color ) {
+ if( ! color ) {
+ color = 'inherit';
+ }
+ var dynamicStyle = selector + ' .ast-header-account-type-icon .ahfb-svg-iconset svg path:not( .ast-hf-account-unfill ), ' + selector + ' .ast-header-account-type-icon .ahfb-svg-iconset svg circle, .ast-mobile-popup-content' + selector + ' .ast-header-account-type-icon .ahfb-svg-iconset svg path:not( .ast-hf-account-unfill ), .ast-mobile-popup-content ' + selector + ' .ast-header-account-type-icon .ahfb-svg-iconset svg circle {';
+ dynamicStyle += 'fill: ' + color + ';';
+ dynamicStyle += '} ';
+ astra_add_dynamic_css( 'header-account-icon-color', dynamicStyle );
+ } );
+ } );
+
+ // Typography CSS Generation.
+ astra_responsive_font_size(
+ 'astra-settings[font-size-section-header-account]',
+ selector + ' .ast-header-account-text'
+ );
+
+ // Text size.
+ astra_css(
+ 'astra-settings[header-account-type-text-color]',
+ 'color',
+ selector + ' .ast-header-account-text, .ast-mobile-popup-content ' + selector + ' .ast-header-account-text'
+ );
+
+ // Icon Size.
+ wp.customize( 'astra-settings[header-account-icon-size]', function( value ) {
+ value.bind( function( size ) {
+ if( size.desktop != '' || size.tablet != '' || size.mobile != '' ) {
+ var dynamicStyle = '';
+ dynamicStyle += selector + ' .ast-header-account-type-icon .ahfb-svg-iconset svg {';
+ dynamicStyle += 'height: ' + size.desktop + 'px' + ';';
+ dynamicStyle += 'width: ' + size.desktop + 'px' + ';';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += selector + ' .ast-header-account-type-icon .ahfb-svg-iconset svg {';
+ dynamicStyle += 'height: ' + size.tablet + 'px' + ';';
+ dynamicStyle += 'width: ' + size.tablet + 'px' + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += selector + ' .ast-header-account-type-icon .ahfb-svg-iconset svg {';
+ dynamicStyle += 'height: ' + size.mobile + 'px' + ';';
+ dynamicStyle += 'width: ' + size.mobile + 'px' + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+ astra_add_dynamic_css( 'header-account-icon-size', dynamicStyle );
+ }
+ } );
+ } );
+
+ // Image Width.
+ wp.customize( 'astra-settings[header-account-image-width]', function( value ) {
+ value.bind( function( size ) {
+ if( size.desktop != '' || size.tablet != '' || size.mobile != '' ) {
+ var dynamicStyle = '';
+ dynamicStyle += selector + ' .ast-header-account-type-avatar .avatar {';
+ dynamicStyle += 'width: ' + size.desktop + 'px' + ';';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += selector + ' .ast-header-account-type-avatar .avatar {';
+ dynamicStyle += 'width: ' + size.tablet + 'px' + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += selector + ' .ast-header-account-type-avatar .avatar {';
+ dynamicStyle += 'width: ' + size.mobile + 'px' + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+ astra_add_dynamic_css( 'header-account-image-width', dynamicStyle );
+ }
+ } );
+ } );
+
+ // Margin.
+ wp.customize( 'astra-settings[header-account-margin]', function( value ) {
+ value.bind( function( margin ) {
+ if(
+ margin.desktop.bottom != '' || margin.desktop.top != '' || margin.desktop.left != '' || margin.desktop.right != '' ||
+ margin.tablet.bottom != '' || margin.tablet.top != '' || margin.tablet.left != '' || margin.tablet.right != '' ||
+ margin.mobile.bottom != '' || margin.mobile.top != '' || margin.mobile.left != '' || margin.mobile.right != ''
+ ) {
+ var selector = '.ast-header-account-wrap';
+ var dynamicStyle = '';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['desktop']['left'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['desktop']['right'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['desktop']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['desktop']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['tablet']['left'] + margin['tablet-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['tablet']['right'] + margin['tablet-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['tablet']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['tablet']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['mobile']['left'] + margin['mobile-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['mobile']['right'] + margin['mobile-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['mobile']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['mobile']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+ astra_add_dynamic_css( 'header-account-margin', dynamicStyle );
+ }
+ } );
+ } );
+
+ // Advanced Visibility CSS Generation.
+ astra_builder_visibility_css( section, visibility_selector );
+
+} )( jQuery );
diff --git a/inc/builder/type/header/account/class-astra-header-account-component-loader.php b/inc/builder/type/header/account/class-astra-header-account-component-loader.php new file mode 100644 index 0000000..edbbbd5 --- /dev/null +++ b/inc/builder/type/header/account/class-astra-header-account-component-loader.php @@ -0,0 +1,53 @@ +<?php +/** + * Account Styling Loader for Astra theme. + * + * @package astra-builder + * @author Astra + * @copyright Copyright (c) 2020, Astra + * @link https://wpastra.com/ + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Customizer Initialization + * + * @since 3.0.0 + */ +class Astra_Header_Account_Component_Loader { + + /** + * Constructor + * + * @since 3.0.0 + */ + public function __construct() { + + add_action( 'customize_preview_init', array( $this, 'preview_scripts' ), 110 ); + } + + /** + * Customizer Preview + * + * @since 3.0.0 + */ + public function preview_scripts() { + /** + * Load unminified if SCRIPT_DEBUG is true. + */ + /* Directory and Extension */ + $dir_name = ( SCRIPT_DEBUG ) ? 'unminified' : 'minified'; + $file_prefix = ( SCRIPT_DEBUG ) ? '' : '.min'; + wp_enqueue_script( 'astra-header-builder-account-customizer-preview-js', ASTRA_HEADER_ACCOUNT_URI . '/assets/js/' . $dir_name . '/customizer-preview' . $file_prefix . '.js', array( 'customize-preview', 'astra-customizer-preview-js' ), ASTRA_THEME_VERSION, true ); + + } +} + +/** +* Kicking this off by creating the object of the class. +*/ +new Astra_Header_Account_Component_Loader(); diff --git a/inc/builder/type/header/account/class-astra-header-account-component.php b/inc/builder/type/header/account/class-astra-header-account-component.php new file mode 100644 index 0000000..b56b58b --- /dev/null +++ b/inc/builder/type/header/account/class-astra-header-account-component.php @@ -0,0 +1,151 @@ +<?php +/** + * Account for Astra theme. + * + * @package astra-builder + * @author Astra + * @copyright Copyright (c) 2020, Astra + * @link https://wpastra.com/ + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +define( 'ASTRA_HEADER_ACCOUNT_DIR', ASTRA_THEME_DIR . 'inc/builder/type/header/account' ); +define( 'ASTRA_HEADER_ACCOUNT_URI', ASTRA_THEME_URI . 'inc/builder/type/header/account' ); + +if ( ! class_exists( 'Astra_Header_Account_Component' ) ) { + + /** + * Heading Initial Setup + * + * @since 3.0.0 + */ + class Astra_Header_Account_Component { + + /** + * Constructor function that initializes required actions and hooks + */ + public function __construct() { + + // @codingStandardsIgnoreStart WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + require_once ASTRA_HEADER_ACCOUNT_DIR . '/class-astra-header-account-component-loader.php'; + + // Include front end files. + if ( ! is_admin() ) { + require_once ASTRA_HEADER_ACCOUNT_DIR . '/dynamic-css/dynamic.css.php'; + } + // @codingStandardsIgnoreEnd WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + } + + /** + * Account navigation markup + */ + public static function account_menu_markup() { + + $theme_location = 'loggedin_account_menu'; + $account_type = astra_get_option( 'header-account-type' ); + $enable_woo_menu = ( 'woocommerce' === $account_type && astra_get_option( 'header-account-woo-menu' ) ); + + /** + * Filter the classes(array) for Menu (<ul>). + * + * @since 3.0.0 + * @var Array + */ + $menu_classes = apply_filters( 'astra_menu_classes', array( 'main-header-menu', 'ast-nav-menu', 'ast-account-nav-menu' ) ); + + $items_wrap = '<nav '; + $items_wrap .= astra_attr( + 'site-navigation', + array( + 'id' => 'site-navigation', + 'class' => 'ast-flex-grow-1 navigation-accessibility site-header-focus-item', + 'aria-label' => esc_attr__( 'Site Navigation', 'astra' ), + ) + ); + $items_wrap .= '>'; + $items_wrap .= '<div class="account-main-navigation">'; + $items_wrap .= '<ul id="%1$s" class="%2$s">%3$s</ul>'; + $items_wrap .= '</div>'; + $items_wrap .= '</nav>'; + + // Fallback Menu if primary menu not set. + $fallback_menu_args = array( + 'theme_location' => $theme_location, + 'menu_id' => 'ast-hf-account-menu', + 'menu_class' => 'account-main-navigation', + 'container' => 'div', + 'before' => '<ul class="' . esc_attr( implode( ' ', $menu_classes ) ) . '">', + 'after' => '</ul>', + 'walker' => new Astra_Walker_Page(), + ); + + // To add default alignment for navigation which can be added through any third party plugin. + // Do not add any CSS from theme except header alignment. + echo '<div class="ast-hf-account-menu-wrap ast-main-header-bar-alignment">'; + + if ( has_nav_menu( $theme_location ) && ! $enable_woo_menu ) { + wp_nav_menu( + array( + 'menu_id' => 'ast-hf-account-menu', + 'menu_class' => esc_attr( implode( ' ', $menu_classes ) ), + 'container' => 'div', + 'container_class' => 'account-main-header-bar-navigation', + 'items_wrap' => $items_wrap, + 'theme_location' => $theme_location, + ) + ); + } elseif ( $enable_woo_menu ) { + echo '<div class="ast-hf-account-menu-wrap ast-main-header-bar-alignment">'; + echo '<div class="account-main-header-bar-navigation">'; + echo '<nav '; + echo astra_attr( + 'account-woo-navigation', + array( + 'id' => 'account-woo-navigation', + ) + ); + echo ' class="ast-flex-grow-1 navigation-accessibility site-header-focus-item" aria-label="' . esc_attr__( 'Account Woo Navigation', 'astra' ) . '">'; + if ( class_exists( 'woocommerce' ) ) { + ?> + <ul id="ast-hf-account-menu" class="main-header-menu ast-nav-menu ast-account-nav-menu ast-header-account-woocommerce-menu"> + <?php foreach ( wc_get_account_menu_items() as $endpoint => $item ) { ?> + <li class="menu-item <?php echo esc_attr( wc_get_account_menu_item_classes( $endpoint ) ); ?>"> + <a href="<?php echo esc_url( wc_get_account_endpoint_url( $endpoint ) ); ?>" class="menu-link"><?php echo esc_html( $item ); ?></a> + </li> + <?php } ?> + </ul> + <?php + } + echo '</nav>'; + echo '</div>'; + echo '</div>'; + } else { + echo '<div class="ast-hf-account-menu-wrap ast-main-header-bar-alignment">'; + echo '<div class="account-main-header-bar-navigation">'; + echo '<nav '; + echo astra_attr( + 'site-navigation', + array( + 'id' => 'site-navigation', + ) + ); + echo ' class="ast-flex-grow-1 navigation-accessibility" aria-label="' . esc_attr__( 'Site Navigation', 'astra' ) . '">'; + wp_page_menu( $fallback_menu_args ); + echo '</nav>'; + echo '</div>'; + echo '</div>'; + } + echo '</div>'; + } + } + + /** + * Kicking this off by creating an object. + */ + new Astra_Header_Account_Component(); + +} diff --git a/inc/builder/type/header/account/dynamic-css/dynamic.css.php b/inc/builder/type/header/account/dynamic-css/dynamic.css.php new file mode 100644 index 0000000..9e9458e --- /dev/null +++ b/inc/builder/type/header/account/dynamic-css/dynamic.css.php @@ -0,0 +1,149 @@ +<?php +/** + * Account - Dynamic CSS + * + * @package Astra + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Account + */ +add_filter( 'astra_dynamic_theme_css', 'astra_hb_account_dynamic_css' ); + +/** + * Dynamic CSS + * + * @param string $dynamic_css Astra Dynamic CSS. + * @param string $dynamic_css_filtered Astra Dynamic CSS Filters. + * @return String Generated dynamic CSS for Account. + * + * @since 3.0.0 + */ +function astra_hb_account_dynamic_css( $dynamic_css, $dynamic_css_filtered = '' ) { + + if ( ! Astra_Builder_Helper::is_component_loaded( 'account', 'header' ) ) { + return $dynamic_css; + } + + $_section = 'section-header-account'; + $selector = '.ast-header-account-wrap'; + + $icon_size = astra_get_option( 'header-account-icon-size' ); + + $icon_size_desktop = ( isset( $icon_size ) && isset( $icon_size['desktop'] ) && ! empty( $icon_size['desktop'] ) ) ? $icon_size['desktop'] : 20; + + $icon_size_tablet = ( isset( $icon_size ) && isset( $icon_size['tablet'] ) && ! empty( $icon_size['tablet'] ) ) ? $icon_size['tablet'] : 20; + + $icon_size_mobile = ( isset( $icon_size ) && isset( $icon_size['mobile'] ) && ! empty( $icon_size['mobile'] ) ) ? $icon_size['mobile'] : 20; + + $image_width = astra_get_option( 'header-account-image-width' ); + + $image_width_desktop = ( isset( $image_width ) && isset( $image_width['desktop'] ) && ! empty( $image_width['desktop'] ) ) ? $image_width['desktop'] : 20; + + $image_width_tablet = ( isset( $image_width ) && isset( $image_width['tablet'] ) && ! empty( $image_width['tablet'] ) ) ? $image_width['tablet'] : 20; + + $image_width_mobile = ( isset( $image_width ) && isset( $image_width['mobile'] ) && ! empty( $image_width['mobile'] ) ) ? $image_width['mobile'] : 20; + + $margin = astra_get_option( 'header-account-margin' ); + $margin_selector = '.ast-header-account-wrap'; + + /** + * Account CSS. + */ + $css_output_desktop = array( + '.ast-header-account-type-icon' => array( + '-js-display' => 'inline-flex', + 'display' => 'inline-flex', + 'align-self' => 'center', + 'vertical-align' => 'middle', + ), + '.ast-header-account-type-avatar .avatar' => array( + 'display' => 'inline', + 'border-radius' => '100%', + 'max-width' => '100%', + ), + '.as.site-header-focus-item.ast-header-account:hover > .customize-partial-edit-shortcut' => array( + 'opacity' => '0', + ), + '.site-header-focus-item.ast-header-account:hover > * > .customize-partial-edit-shortcut' => array( + 'opacity' => '1', + ), + $selector . ' .ast-header-account-type-icon .ahfb-svg-iconset svg path:not( .ast-hf-account-unfill ), ' . $selector . ' .ast-header-account-type-icon .ahfb-svg-iconset svg circle' => array( + 'fill' => esc_attr( astra_get_option( 'header-account-icon-color' ) ), + ), + '.ast-mobile-popup-content ' . $selector . ' .ast-header-account-type-icon .ahfb-svg-iconset svg path:not( .ast-hf-account-unfill ), .ast-mobile-popup-content ' . $selector . ' .ast-header-account-type-icon .ahfb-svg-iconset svg circle' => array( + 'fill' => esc_attr( astra_get_option( 'header-account-icon-color' ) ), + ), + $selector . ' .ast-header-account-type-icon .ahfb-svg-iconset svg' => array( + 'height' => astra_get_css_value( $icon_size_desktop, 'px' ), + 'width' => astra_get_css_value( $icon_size_desktop, 'px' ), + ), + $selector . ' .ast-header-account-type-avatar .avatar' => array( + 'width' => astra_get_css_value( $image_width_desktop, 'px' ), + ), + $selector . ' .ast-header-account-text' => array( + 'color' => esc_attr( astra_get_option( 'header-account-type-text-color' ) ), + ), + $margin_selector => array( + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'desktop' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'desktop' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'desktop' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'desktop' ), + ), + ); + + $css_output_tablet = array( + + $selector . ' .ast-header-account-type-icon .ahfb-svg-iconset svg' => array( + 'height' => astra_get_css_value( $icon_size_tablet, 'px' ), + 'width' => astra_get_css_value( $icon_size_tablet, 'px' ), + ), + $selector . ' .ast-header-account-type-avatar .avatar' => array( + 'width' => astra_get_css_value( $image_width_tablet, 'px' ), + ), + $margin_selector => array( + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'tablet' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'tablet' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'tablet' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'tablet' ), + ), + ); + + $css_output_mobile = array( + + $selector . ' .ast-header-account-type-icon .ahfb-svg-iconset svg' => array( + 'height' => astra_get_css_value( $icon_size_mobile, 'px' ), + 'width' => astra_get_css_value( $icon_size_mobile, 'px' ), + ), + $selector . ' .ast-header-account-type-avatar .avatar' => array( + 'width' => astra_get_css_value( $image_width_mobile, 'px' ), + ), + $margin_selector => array( + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'mobile' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'mobile' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'mobile' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'mobile' ), + ), + ); + + /* Parse CSS from array() */ + $css_output = astra_parse_css( $css_output_desktop ); + $css_output .= astra_parse_css( $css_output_tablet, '', astra_get_tablet_breakpoint() ); + $css_output .= astra_parse_css( $css_output_mobile, '', astra_get_mobile_breakpoint() ); + + $dynamic_css .= $css_output; + + $dynamic_css .= Astra_Builder_Base_Dynamic_CSS::prepare_advanced_typography_css( $_section, $selector . ' .ast-header-account-text' ); + + $dynamic_css .= Astra_Builder_Base_Dynamic_CSS::prepare_visibility_css( $_section, $selector ); + + return $dynamic_css; +} diff --git a/inc/builder/type/header/below-header/assets/js/minified/customizer-preview.min.js b/inc/builder/type/header/below-header/assets/js/minified/customizer-preview.min.js new file mode 100644 index 0000000..769745b --- /dev/null +++ b/inc/builder/type/header/below-header/assets/js/minified/customizer-preview.min.js @@ -0,0 +1 @@ +!function(){var r=astraBuilderPreview.tablet_break_point||768,t=astraBuilderPreview.mobile_break_point||544;wp.customize("astra-settings[hbb-header-height]",function(e){e.bind(function(e){var a;""==e.desktop&&""==e.tablet&&""==e.mobile||(a="",a+=".ast-below-header-bar .site-below-header-wrap, .ast-mobile-header-wrap .ast-below-header-bar {",a+="min-height: "+e.desktop+"px;",a+="} ",a+=".ast-desktop .ast-below-header-bar .main-header-menu > .menu-item {",a+="line-height: "+e.desktop+"px;",a+="} ",a+="@media (max-width: "+r+"px) {",a+=".ast-below-header-bar .site-below-header-wrap, .ast-mobile-header-wrap .ast-below-header-bar {",a+="min-height: "+e.tablet+"px;",a+="} ",a+="} ",a+="@media (max-width: "+t+"px) {",a+=".ast-below-header-bar .site-below-header-wrap, .ast-mobile-header-wrap .ast-below-header-bar {",a+="min-height: "+e.mobile+"px;",a+="} ",a+="} ",astra_add_dynamic_css("hbb-header-height",a))})}),wp.customize("astra-settings[hbb-header-separator]",function(e){e.bind(function(e){var a="";a+=".ast-header-break-point .ast-below-header-bar, .ast-below-header-bar {",a+="border-bottom-width: "+e+"px;",a+="border-bottom-style: solid;",a+="border-color:"+wp.customize("astra-settings[hbb-header-bottom-border-color]").get()+";",a+="}",astra_add_dynamic_css("hbb-header-separator",a)})}),astra_css("astra-settings[hbb-header-bottom-border-color]","border-color",".ast-header-break-point .ast-below-header-bar, .ast-below-header-bar"),astra_apply_responsive_background_css("astra-settings[hbb-header-bg-obj-responsive]",".ast-below-header.ast-below-header-bar","desktop"),astra_apply_responsive_background_css("astra-settings[hbb-header-bg-obj-responsive]",".ast-below-header.ast-below-header-bar","tablet"),astra_apply_responsive_background_css("astra-settings[hbb-header-bg-obj-responsive]",".ast-below-header.ast-below-header-bar","mobile"),astra_builder_advanced_css("section-below-header-builder",".ast-below-header.ast-below-header-bar"),astra_builder_visibility_css("section-below-header-builder",".ast-below-header-bar","grid")}(jQuery);
\ No newline at end of file diff --git a/inc/builder/type/header/below-header/assets/js/unminified/customizer-preview.js b/inc/builder/type/header/below-header/assets/js/unminified/customizer-preview.js new file mode 100644 index 0000000..de0e18c --- /dev/null +++ b/inc/builder/type/header/below-header/assets/js/unminified/customizer-preview.js @@ -0,0 +1,81 @@ +/**
+ * This file adds some LIVE to the Customizer live preview. To leverage
+ * this, set your custom settings to 'postMessage' and then add your handling
+ * here. Your javascript should grab settings from customizer controls, and
+ * then make any necessary changes to the page using jQuery.
+ *
+ * @package Astra
+ * @since 3.0.0
+ */
+
+( function( $ ) {
+
+ var tablet_break_point = astraBuilderPreview.tablet_break_point || 768,
+ mobile_break_point = astraBuilderPreview.mobile_break_point || 544;
+
+ wp.customize( 'astra-settings[hbb-header-height]', function( value ) {
+ value.bind( function( size ) {
+
+ if( size.desktop != '' || size.tablet != '' || size.mobile != '' ) {
+ var dynamicStyle = '';
+ dynamicStyle += '.ast-below-header-bar .site-below-header-wrap, .ast-mobile-header-wrap .ast-below-header-bar {';
+ dynamicStyle += 'min-height: ' + size.desktop + 'px;';
+ dynamicStyle += '} ';
+ dynamicStyle += '.ast-desktop .ast-below-header-bar .main-header-menu > .menu-item {';
+ dynamicStyle += 'line-height: ' + size.desktop + 'px;';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += '.ast-below-header-bar .site-below-header-wrap, .ast-mobile-header-wrap .ast-below-header-bar {';
+ dynamicStyle += 'min-height: ' + size.tablet + 'px;';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += '.ast-below-header-bar .site-below-header-wrap, .ast-mobile-header-wrap .ast-below-header-bar {';
+ dynamicStyle += 'min-height: ' + size.mobile + 'px;';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ astra_add_dynamic_css( 'hbb-header-height', dynamicStyle );
+ }
+ } );
+ } );
+
+ // Border Bottom width.
+ wp.customize( 'astra-settings[hbb-header-separator]', function( value ) {
+ value.bind( function( border ) {
+
+ var color = wp.customize( 'astra-settings[hbb-header-bottom-border-color]' ).get(),
+ dynamicStyle = '';
+
+ dynamicStyle += '.ast-header-break-point .ast-below-header-bar, .ast-below-header-bar {';
+ dynamicStyle += 'border-bottom-width: ' + border + 'px;';
+ dynamicStyle += 'border-bottom-style: solid;';
+ dynamicStyle += 'border-color:' + color + ';';
+ dynamicStyle += '}';
+
+ astra_add_dynamic_css( 'hbb-header-separator', dynamicStyle );
+
+ } );
+ } );
+
+ // Border Color.
+ astra_css(
+ 'astra-settings[hbb-header-bottom-border-color]',
+ 'border-color',
+ '.ast-header-break-point .ast-below-header-bar, .ast-below-header-bar'
+ );
+
+ // Responsive BG styles > Below Header Row.
+ astra_apply_responsive_background_css( 'astra-settings[hbb-header-bg-obj-responsive]', '.ast-below-header.ast-below-header-bar', 'desktop' );
+ astra_apply_responsive_background_css( 'astra-settings[hbb-header-bg-obj-responsive]', '.ast-below-header.ast-below-header-bar', 'tablet' );
+ astra_apply_responsive_background_css( 'astra-settings[hbb-header-bg-obj-responsive]', '.ast-below-header.ast-below-header-bar', 'mobile' );
+
+ // Advanced CSS Generation.
+ astra_builder_advanced_css( 'section-below-header-builder', '.ast-below-header.ast-below-header-bar' );
+
+ // Advanced Visibility CSS Generation.
+ astra_builder_visibility_css( 'section-below-header-builder', '.ast-below-header-bar', 'grid' );
+
+} )( jQuery );
diff --git a/inc/builder/type/header/below-header/class-astra-below-header-loader.php b/inc/builder/type/header/below-header/class-astra-below-header-loader.php new file mode 100644 index 0000000..60ae011 --- /dev/null +++ b/inc/builder/type/header/below-header/class-astra-below-header-loader.php @@ -0,0 +1,53 @@ +<?php +/** + * Below Header Loader. + * + * @package astra-builder + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Class Astra_Below_Header_Loader + * + * Loads config files. + * + * @since 3.0.0 + */ +class Astra_Below_Header_Loader { + + /** + * Constructor + * + * @since 3.0.0 + */ + public function __construct() { + add_action( 'customize_preview_init', array( $this, 'preview_scripts' ), 110 ); + } + + /** + * Customizer Preview + * + * @since 3.0.0 + */ + public function preview_scripts() { + /** + * Load unminified if SCRIPT_DEBUG is true. + */ + /* Directory and Extension */ + $dir_name = ( SCRIPT_DEBUG ) ? 'unminified' : 'minified'; + $file_prefix = ( SCRIPT_DEBUG ) ? '' : '.min'; + wp_enqueue_script( 'astra-heading-below-customizer-preview-js', ASTRA_BELOW_HEADER_URI . '/assets/js/' . $dir_name . '/customizer-preview' . $file_prefix . '.js', array( 'customize-preview', 'astra-customizer-preview-js' ), ASTRA_THEME_VERSION, true ); + } +} + +/** +* Kicking this off by creating the object of the class. +*/ +new Astra_Below_Header_Loader(); diff --git a/inc/builder/type/header/below-header/class-astra-below-header.php b/inc/builder/type/header/below-header/class-astra-below-header.php new file mode 100644 index 0000000..4584cbe --- /dev/null +++ b/inc/builder/type/header/below-header/class-astra-below-header.php @@ -0,0 +1,45 @@ +<?php +/** + * Below Header. + * + * @package astra-builder + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +define( 'ASTRA_BELOW_HEADER_DIR', ASTRA_THEME_DIR . 'inc/builder/type/header/below-header' ); +define( 'ASTRA_BELOW_HEADER_URI', ASTRA_THEME_URI . 'inc/builder/type/header/below-header' ); + +/** + * Below Header Initial Setup + * + * @since 3.0.0 + */ +class Astra_Below_Header { + + /** + * Constructor function that initializes required actions and hooks. + */ + public function __construct() { + + // @codingStandardsIgnoreStart WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + require_once ASTRA_BELOW_HEADER_DIR . '/class-astra-below-header-loader.php'; + + // Include front end files. + if ( ! is_admin() ) { + require_once ASTRA_BELOW_HEADER_DIR . '/dynamic-css/dynamic.css.php'; + } + // @codingStandardsIgnoreEnd WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + } +} + +/** + * Kicking this off by creating an object. + */ +new Astra_Below_Header(); diff --git a/inc/builder/type/header/below-header/dynamic-css/dynamic.css.php b/inc/builder/type/header/below-header/dynamic-css/dynamic.css.php new file mode 100644 index 0000000..69c346a --- /dev/null +++ b/inc/builder/type/header/below-header/dynamic-css/dynamic.css.php @@ -0,0 +1,144 @@ +<?php +/** + * Below Header - Dynamic CSS + * + * @package astra-builder + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Below Header Row. + */ +add_filter( 'astra_dynamic_theme_css', 'astra_below_header_row_setting', 11 ); + +/** + * Below Header Row - Dynamic CSS + * + * @param string $dynamic_css Astra Dynamic CSS. + * @param string $dynamic_css_filtered Astra Dynamic CSS Filters. + * @return String Generated dynamic CSS for Heading Colors. + * + * @since 3.0.0 + */ +function astra_below_header_row_setting( $dynamic_css, $dynamic_css_filtered = '' ) { + + if ( ! is_customize_preview() && ( ! Astra_Builder_helper::is_row_empty( 'below', 'header', 'desktop' ) && ! Astra_Builder_helper::is_row_empty( 'below', 'header', 'mobile' ) ) ) { + return $dynamic_css; + } + + $parse_css = ''; + + // Common CSS options. + $hbb_header_height = astra_get_option( 'hbb-header-height' ); + $hbb_header_divider = absint( astra_get_option( 'hbb-header-separator' ) ); + $hbb_border_color = astra_get_option( 'hbb-header-bottom-border-color' ); + + // Header Height. + $hbb_header_height_desktop = ( isset( $hbb_header_height['desktop'] ) && ! empty( $hbb_header_height['desktop'] ) ) ? $hbb_header_height['desktop'] : ''; + $hbb_header_height_tablet = ( isset( $hbb_header_height['tablet'] ) && ! empty( $hbb_header_height['tablet'] ) ) ? $hbb_header_height['tablet'] : ''; + $hbb_header_height_mobile = ( isset( $hbb_header_height['mobile'] ) && ! empty( $hbb_header_height['mobile'] ) ) ? $hbb_header_height['mobile'] : ''; + + // Background CSS options. + $hbb_header_bg_obj = astra_get_option( 'hbb-header-bg-obj-responsive' ); + $desktop_background = isset( $hbb_header_bg_obj['desktop']['background-color'] ) ? $hbb_header_bg_obj['desktop']['background-color'] : ''; + $tablet_background = isset( $hbb_header_bg_obj['tablet']['background-color'] ) ? $hbb_header_bg_obj['tablet']['background-color'] : ''; + $mobile_background = isset( $hbb_header_bg_obj['mobile']['background-color'] ) ? $hbb_header_bg_obj['mobile']['background-color'] : ''; + + + /** + * Below Header General options + */ + $common_css_output = array( + '.ast-below-header .main-header-bar-navigation' => array( + 'height' => '100%', + ), + '.ast-header-break-point .ast-mobile-header-wrap .ast-below-header-wrap .main-header-bar-navigation .inline-on-mobile .menu-item .menu-link' => array( + 'border' => 'none', + ), + '.ast-header-break-point .ast-mobile-header-wrap .ast-below-header-wrap .main-header-bar-navigation .inline-on-mobile .menu-item-has-children > .ast-menu-toggle::before' => array( + 'font-size' => '.6rem', + ), + '.ast-header-break-point .ast-mobile-header-wrap .ast-below-header-wrap .main-header-bar-navigation .ast-submenu-expanded > .ast-menu-toggle::before' => array( + 'transform' => 'rotateX(180deg)', + ), + '#masthead .ast-mobile-header-wrap .ast-below-header-bar' => array( + 'padding-left' => '20px', + 'padding-right' => '20px', + ), + '.ast-mobile-header-wrap .ast-below-header-bar , .ast-below-header-bar .site-below-header-wrap' => array( + 'min-height' => astra_get_css_value( $hbb_header_height_desktop, 'px' ), + ), + '.ast-desktop .ast-below-header-bar .main-header-menu > .menu-item' => array( + 'line-height' => astra_get_css_value( $hbb_header_height_desktop, 'px' ), + ), + '.ast-desktop .ast-below-header-bar .ast-header-woo-cart, .ast-desktop .ast-below-header-bar .ast-header-edd-cart' => array( + 'line-height' => astra_get_css_value( $hbb_header_height_desktop, 'px' ), + ), + ); + + // Apply border only when it has positive value. + if ( $hbb_header_divider ) { + $common_css_output['.ast-below-header-bar'] = array( + 'border-bottom-width' => astra_get_css_value( $hbb_header_divider, 'px' ), + 'border-bottom-color' => esc_attr( $hbb_border_color ), + 'border-bottom-style' => 'solid', + ); + } else { + $common_css_output['.ast-below-header-bar'] = array( + 'border-bottom-style' => 'none', + ); + } + + $parse_css .= astra_parse_css( $common_css_output ); + + // Below Header Background Responsive - Desktop. + $desktop_bg = array( + '.ast-below-header-bar' => astra_get_responsive_background_obj( $hbb_header_bg_obj, 'desktop' ), + '.ast-header-break-point .ast-below-header-bar' => array( + 'background-color' => esc_attr( $desktop_background ), + ), + ); + $parse_css .= astra_parse_css( $desktop_bg ); + + // Below Header Background Responsive - Tablet. + $tablet_bg = array( + '.ast-below-header-bar' => astra_get_responsive_background_obj( $hbb_header_bg_obj, 'tablet' ), + '.ast-header-break-point .ast-below-header-bar' => array( + 'background-color' => esc_attr( $tablet_background ), + ), + '.ast-mobile-header-wrap .ast-below-header-bar , .ast-below-header-bar .site-below-header-wrap' => array( + 'min-height' => astra_get_css_value( $hbb_header_height_tablet, 'px' ), + ), + ); + $parse_css .= astra_parse_css( $tablet_bg, '', astra_get_tablet_breakpoint() ); + + // Below Header Background Responsive - Mobile. + $mobile_bg = array( + '.ast-below-header-bar' => astra_get_responsive_background_obj( $hbb_header_bg_obj, 'mobile' ), + '.ast-header-break-point .ast-below-header-bar' => array( + 'background-color' => esc_attr( $mobile_background ), + ), + '.ast-mobile-header-wrap .ast-below-header-bar , .ast-below-header-bar .site-below-header-wrap' => array( + 'min-height' => astra_get_css_value( $hbb_header_height_mobile, 'px' ), + ), + ); + $parse_css .= astra_parse_css( $mobile_bg, '', astra_get_mobile_breakpoint() ); + + // Trim white space for faster page loading. + $dynamic_css .= Astra_Enqueue_Scripts::trim_css( $parse_css ); + + $_section = 'section-below-header-builder'; + + + $parent_selector = '.ast-below-header-bar.ast-below-header, .ast-header-break-point .ast-below-header-bar.ast-below-header'; + + $dynamic_css .= Astra_Builder_Base_Dynamic_CSS::prepare_advanced_margin_padding_css( $_section, $parent_selector ); + + $dynamic_css .= Astra_Builder_Base_Dynamic_CSS::prepare_visibility_css( $_section, '.ast-below-header-bar', 'block', 'grid' ); + + return $dynamic_css; +} diff --git a/inc/builder/type/header/button/assets/js/minified/customizer-preview.min.js b/inc/builder/type/header/button/assets/js/minified/customizer-preview.min.js new file mode 100644 index 0000000..d39dab1 --- /dev/null +++ b/inc/builder/type/header/button/assets/js/minified/customizer-preview.min.js @@ -0,0 +1 @@ +jQuery,astra_builder_button_css("header",AstraBuilderButtonData.component_limit);
\ No newline at end of file diff --git a/inc/builder/type/header/button/assets/js/unminified/customizer-preview.js b/inc/builder/type/header/button/assets/js/unminified/customizer-preview.js new file mode 100644 index 0000000..db0ad86 --- /dev/null +++ b/inc/builder/type/header/button/assets/js/unminified/customizer-preview.js @@ -0,0 +1,15 @@ +/**
+ * This file adds some LIVE to the Customizer live preview. To leverage
+ * this, set your custom settings to 'postMessage' and then add your handling
+ * here. Your javascript should grab settings from customizer controls, and
+ * then make any necessary changes to the page using jQuery.
+ *
+ * @package Astra
+ * @since 3.0.0
+ */
+
+( function( $ ) {
+
+ astra_builder_button_css( 'header', AstraBuilderButtonData.component_limit );
+
+} )( jQuery );
diff --git a/inc/builder/type/header/button/class-astra-header-button-component-loader.php b/inc/builder/type/header/button/class-astra-header-button-component-loader.php new file mode 100644 index 0000000..430c074 --- /dev/null +++ b/inc/builder/type/header/button/class-astra-header-button-component-loader.php @@ -0,0 +1,60 @@ +<?php +/** + * Button Styling Loader for Astra theme. + * + * @package Astra + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since Astra 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Customizer Initialization + * + * @since 3.0.0 + */ +class Astra_Header_Button_Component_Loader { + + /** + * Constructor + * + * @since 3.0.0 + */ + public function __construct() { + add_action( 'customize_preview_init', array( $this, 'preview_scripts' ), 110 ); + } + + /** + * Customizer Preview + * + * @since 3.0.0 + */ + public function preview_scripts() { + /** + * Load unminified if SCRIPT_DEBUG is true. + */ + /* Directory and Extension */ + $dir_name = ( SCRIPT_DEBUG ) ? 'unminified' : 'minified'; + $file_prefix = ( SCRIPT_DEBUG ) ? '' : '.min'; + wp_enqueue_script( 'astra-heading-button-customizer-preview-js', ASTRA_HEADER_BUTTON_URI . '/assets/js/' . $dir_name . '/customizer-preview' . $file_prefix . '.js', array( 'customize-preview', 'astra-customizer-preview-js' ), ASTRA_THEME_VERSION, true ); + + // Localize variables for Button JS. + wp_localize_script( + 'astra-heading-button-customizer-preview-js', + 'AstraBuilderButtonData', + array( + 'component_limit' => defined( 'ASTRA_EXT_VER' ) ? Astra_Builder_Helper::$component_limit : Astra_Builder_Helper::$num_of_header_button, + ) + ); + } +} + +/** +* Kicking this off by creating the object of the class. +*/ +new Astra_Header_Button_Component_Loader(); diff --git a/inc/builder/type/header/button/class-astra-header-button-component.php b/inc/builder/type/header/button/class-astra-header-button-component.php new file mode 100644 index 0000000..c8aa233 --- /dev/null +++ b/inc/builder/type/header/button/class-astra-header-button-component.php @@ -0,0 +1,47 @@ +<?php +/** + * Heading Colors for Astra theme. + * + * @package Astra + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since Astra 2.1.4 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + + +define( 'ASTRA_HEADER_BUTTON_DIR', ASTRA_THEME_DIR . 'inc/builder/type/header/button' ); +define( 'ASTRA_HEADER_BUTTON_URI', ASTRA_THEME_URI . 'inc/builder/type/header/button' ); + +/** + * Heading Initial Setup + * + * @since 2.1.4 + */ +class Astra_Header_Button_Component { + + /** + * Constructor function that initializes required actions and hooks + */ + public function __construct() { + + // @codingStandardsIgnoreStart WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + require_once ASTRA_HEADER_BUTTON_DIR . '/class-astra-header-button-component-loader.php'; + + // Include front end files. + if ( ! is_admin() ) { + require_once ASTRA_HEADER_BUTTON_DIR . '/dynamic-css/dynamic.css.php'; + } + // @codingStandardsIgnoreEnd WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + } + +} + +/** + * Kicking this off by creating an object. + */ +new Astra_Header_Button_Component(); diff --git a/inc/builder/type/header/button/dynamic-css/dynamic.css.php b/inc/builder/type/header/button/dynamic-css/dynamic.css.php new file mode 100644 index 0000000..157b8b5 --- /dev/null +++ b/inc/builder/type/header/button/dynamic-css/dynamic.css.php @@ -0,0 +1,32 @@ +<?php +/** + * Butons - Dynamic CSS + * + * @package Astra + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Heading Colors + */ +add_filter( 'astra_dynamic_theme_css', 'astra_hb_button_dynamic_css' ); + +/** + * Dynamic CSS + * + * @param string $dynamic_css Astra Dynamic CSS. + * @param string $dynamic_css_filtered Astra Dynamic CSS Filters. + * @return String Generated dynamic CSS for Heading Colors. + * + * @since 3.0.0 + */ +function astra_hb_button_dynamic_css( $dynamic_css, $dynamic_css_filtered = '' ) { + + $dynamic_css .= Astra_Button_Component_Dynamic_CSS::astra_button_dynamic_css( 'header' ); + + return $dynamic_css; +} diff --git a/inc/builder/type/header/edd-cart/assets/js/minified/customizer-preview.min.js b/inc/builder/type/header/edd-cart/assets/js/minified/customizer-preview.min.js new file mode 100644 index 0000000..c764121 --- /dev/null +++ b/inc/builder/type/header/edd-cart/assets/js/minified/customizer-preview.min.js @@ -0,0 +1 @@ +!function(t){var e=".ast-edd-site-header-cart",d=".astra-cart-drawer.edd-active";astra_css("astra-settings[edd-header-cart-icon-color]","color",e+" .ast-edd-cart-menu-wrap .count, "+e+" .ast-edd-cart-menu-wrap .count:after,"+e+" .ast-edd-header-cart-info-wrap"),astra_css("astra-settings[edd-header-cart-icon-color]","border-color",e+" .ast-edd-cart-menu-wrap .count, "+e+" .ast-edd-cart-menu-wrap .count:after"),astra_color_responsive_css("edd-cart-colors","astra-settings[header-edd-cart-text-color]","color",e+" .widget_edd_cart_widget span, "+e+" .widget_edd_cart_widget strong, "+e+" .widget_edd_cart_widget *, "+d+" .widget_edd_cart_widget span, .astra-cart-drawer .widget_edd_cart_widget *, "+d+" .astra-cart-drawer-title"),astra_color_responsive_css("edd-cart-colors","astra-settings[header-edd-cart-link-color]","color",e+" .widget_edd_cart_widget a, "+e+" .widget_edd_cart_widget a.edd-remove-from-cart, "+e+" .widget_edd_cart_widget .cart-total, "+e+" .widget_edd_cart_widget a.edd-remove-from-cart:after, "+d+" .widget_edd_cart_widget a, "+d+" .widget_edd_cart_widget a.edd-remove-from-cart, "+d+" .widget_edd_cart_widget .cart-total, "+d+" .widget_edd_cart_widget a.edd-remove-from-cart:after"),astra_color_responsive_css("edd-cart-colors","astra-settings[header-edd-cart-link-color]","border-color",e+" .widget_edd_cart_widget a.edd-remove-from-cart:after,"+d+" .widget_edd_cart_widget a.edd-remove-from-cart:after,"),astra_color_responsive_css("edd-cart-colors","astra-settings[header-edd-cart-background-color]","background-color",".ast-builder-layout-element "+e+" .widget_edd_cart_widget ,"+d+", "+d+"#astra-mobile-cart-drawer"),astra_color_responsive_css("edd-cart-border-color","astra-settings[header-edd-cart-background-color]","border-color",".ast-builder-layout-element "+e+" .widget_edd_cart_widget, "+d+" .widget_edd_cart_widget"),astra_color_responsive_css("edd-cart-border-bottom-color","astra-settings[header-edd-cart-background-color]","border-bottom-color",".ast-builder-layout-element "+e+" .widget_edd_cart_widget:before, .ast-builder-layout-element "+e+" .widget_edd_cart_widget:after, "+d+" .widget_edd_cart_widget:before, "+d+" .widget_edd_cart_widget:after"),astra_color_responsive_css("edd-cart-colors","astra-settings[header-edd-cart-separator-color]","border-bottom-color",".ast-builder-layout-element "+e+" .widget_edd_cart_widget .edd-cart-item, .ast-builder-layout-element "+e+" .widget_edd_cart_widget .edd-cart-number-of-items, .ast-builder-layout-element "+e+" .widget_edd_cart_widget .edd-cart-meta,"+d+" .widget_edd_cart_widget .edd-cart-item, "+d+" .widget_edd_cart_widget .edd-cart-number-of-items, "+d+" .widget_edd_cart_widget .edd-cart-meta, "+d+" .astra-cart-drawer-header"),astra_color_responsive_css("edd-cart-colors","astra-settings[header-edd-checkout-btn-text-color]","color",e+" .widget_edd_cart_widget .edd_checkout a, .widget_edd_cart_widget .edd_checkout a, "+d+" .widget_edd_cart_widget .edd_checkout a"),astra_color_responsive_css("edd-cart-colors","astra-settings[header-edd-checkout-btn-background-color]","background-color",e+" .widget_edd_cart_widget .edd_checkout a, .widget_edd_cart_widget .edd_checkout a,"+d+" .widget_edd_cart_widget .edd_checkout a, .widget_edd_cart_widget .edd_checkout a"),astra_color_responsive_css("edd-cart-border-color","astra-settings[header-edd-checkout-btn-background-color]","border-color",e+" .widget_edd_cart_widget .edd_checkout a, .widget_edd_cart_widget .edd_checkout a,"+d+" .widget_edd_cart_widget .edd_checkout a, .widget_edd_cart_widget .edd_checkout a"),astra_color_responsive_css("edd-cart-colors","astra-settings[header-edd-checkout-btn-text-hover-color]","color",e+" .widget_edd_cart_widget .edd_checkout a:hover, .widget_edd_cart_widget .edd_checkout a:hover,"+d+" .widget_edd_cart_widget .edd_checkout a:hover, .widget_edd_cart_widget .edd_checkout a:hover"),astra_color_responsive_css("edd-cart-colors","astra-settings[header-edd-checkout-btn-bg-hover-color]","background-color",e+" .widget_edd_cart_widget .edd_checkout a:hover, .widget_edd_cart_widget .edd_checkout a:hover, "+d+" .widget_edd_cart_widget .edd_checkout a:hover, .widget_edd_cart_widget .edd_checkout a:hover"),wp.customize("astra-settings[edd-header-cart-icon-style]",function(e){e.bind(function(e){var d=t(document).find(".ast-edd-site-header-cart");d.removeClass("ast-edd-menu-cart-fill ast-edd-menu-cart-outline"),d.addClass("ast-edd-menu-cart-"+e);astra_add_dynamic_css("edd-header-cart-icon-style",".ast-edd-site-header-cart a, .ast-edd-site-header-cart a *{ transition: all 0s; } "),wp.customize.preview.send("refresh")})}),wp.customize("astra-settings[edd-header-cart-icon-color]",function(e){e.bind(function(e){wp.customize.preview.send("refresh")})}),wp.customize("astra-settings[edd-header-cart-icon-radius]",function(e){e.bind(function(e){e=".ast-edd-site-header-cart.ast-edd-menu-cart-outline .ast-addon-cart-wrap, .ast-edd-site-header-cart.ast-edd-menu-cart-fill .ast-addon-cart-wrap, .ast-edd-site-header-cart.ast-edd-menu-cart-outline .count, .ast-edd-site-header-cart.ast-edd-menu-cart-fill .count{ border-radius: "+parseInt(e)+"px } ";astra_add_dynamic_css("edd-header-cart-icon-radius",e)})}),wp.customize("astra-settings[transparent-header-edd-cart-icon-color]",function(e){e.bind(function(e){wp.customize.preview.send("refresh")})}),astra_builder_visibility_css("section-header-edd-cart",".ast-header-edd-cart")}(jQuery);
\ No newline at end of file diff --git a/inc/builder/type/header/edd-cart/assets/js/unminified/customizer-preview.js b/inc/builder/type/header/edd-cart/assets/js/unminified/customizer-preview.js new file mode 100644 index 0000000..87f8cf0 --- /dev/null +++ b/inc/builder/type/header/edd-cart/assets/js/unminified/customizer-preview.js @@ -0,0 +1,161 @@ +/**
+ * This file adds some LIVE to the Customizer live preview. To leverage
+ * this, set your custom settings to 'postMessage' and then add your handling
+ * here. Your javascript should grab settings from customizer controls, and
+ * then make any necessary changes to the page using jQuery.
+ *
+ * @package Astra
+ * @since x.x.x
+ */
+
+( function( $ ) {
+
+ var selector = '.ast-edd-site-header-cart';
+ var responsive_selector = '.astra-cart-drawer.edd-active';
+
+ // Icon Color.
+ astra_css(
+ 'astra-settings[edd-header-cart-icon-color]',
+ 'color',
+ selector + ' .ast-edd-cart-menu-wrap .count, ' + selector + ' .ast-edd-cart-menu-wrap .count:after,' + selector + ' .ast-edd-header-cart-info-wrap'
+ );
+
+ // Icon Color.
+ astra_css(
+ 'astra-settings[edd-header-cart-icon-color]',
+ 'border-color',
+ selector + ' .ast-edd-cart-menu-wrap .count, ' + selector + ' .ast-edd-cart-menu-wrap .count:after'
+ );
+
+ // EDD Cart Colors.
+ astra_color_responsive_css(
+ 'edd-cart-colors',
+ 'astra-settings[header-edd-cart-text-color]',
+ 'color',
+ selector + ' .widget_edd_cart_widget span, ' + selector + ' .widget_edd_cart_widget strong, ' + selector + ' .widget_edd_cart_widget *, ' + responsive_selector + ' .widget_edd_cart_widget span, .astra-cart-drawer .widget_edd_cart_widget *, ' + responsive_selector + ' .astra-cart-drawer-title'
+ );
+
+ astra_color_responsive_css(
+ 'edd-cart-colors',
+ 'astra-settings[header-edd-cart-link-color]',
+ 'color',
+ selector + ' .widget_edd_cart_widget a, ' + selector + ' .widget_edd_cart_widget a.edd-remove-from-cart, ' + selector + ' .widget_edd_cart_widget .cart-total, ' + selector + ' .widget_edd_cart_widget a.edd-remove-from-cart:after, '+ responsive_selector + ' .widget_edd_cart_widget a, ' + responsive_selector + ' .widget_edd_cart_widget a.edd-remove-from-cart, ' + responsive_selector + ' .widget_edd_cart_widget .cart-total, ' + responsive_selector + ' .widget_edd_cart_widget a.edd-remove-from-cart:after'
+ );
+ astra_color_responsive_css(
+ 'edd-cart-colors',
+ 'astra-settings[header-edd-cart-link-color]',
+ 'border-color',
+ selector + ' .widget_edd_cart_widget a.edd-remove-from-cart:after,' + responsive_selector + ' .widget_edd_cart_widget a.edd-remove-from-cart:after,'
+ );
+
+ astra_color_responsive_css(
+ 'edd-cart-colors',
+ 'astra-settings[header-edd-cart-background-color]',
+ 'background-color',
+ '.ast-builder-layout-element ' + selector + ' .widget_edd_cart_widget ,' + responsive_selector + ', ' + responsive_selector + '#astra-mobile-cart-drawer'
+ );
+
+ astra_color_responsive_css(
+ 'edd-cart-border-color',
+ 'astra-settings[header-edd-cart-background-color]',
+ 'border-color',
+ '.ast-builder-layout-element ' + selector + ' .widget_edd_cart_widget, ' + responsive_selector + ' .widget_edd_cart_widget'
+ );
+
+ astra_color_responsive_css(
+ 'edd-cart-border-bottom-color',
+ 'astra-settings[header-edd-cart-background-color]',
+ 'border-bottom-color',
+ '.ast-builder-layout-element ' + selector + ' .widget_edd_cart_widget:before, .ast-builder-layout-element ' + selector + ' .widget_edd_cart_widget:after, ' + responsive_selector + ' .widget_edd_cart_widget:before, ' + responsive_selector + ' .widget_edd_cart_widget:after'
+ );
+
+ astra_color_responsive_css(
+ 'edd-cart-colors',
+ 'astra-settings[header-edd-cart-separator-color]',
+ 'border-bottom-color',
+ '.ast-builder-layout-element ' + selector + ' .widget_edd_cart_widget .edd-cart-item, .ast-builder-layout-element ' + selector + ' .widget_edd_cart_widget .edd-cart-number-of-items, .ast-builder-layout-element ' + selector + ' .widget_edd_cart_widget .edd-cart-meta,'+ responsive_selector + ' .widget_edd_cart_widget .edd-cart-item, ' + responsive_selector + ' .widget_edd_cart_widget .edd-cart-number-of-items, ' + responsive_selector + ' .widget_edd_cart_widget .edd-cart-meta, ' + responsive_selector + ' .astra-cart-drawer-header'
+ );
+
+ astra_color_responsive_css(
+ 'edd-cart-colors',
+ 'astra-settings[header-edd-checkout-btn-text-color]',
+ 'color',
+ selector + ' .widget_edd_cart_widget .edd_checkout a, .widget_edd_cart_widget .edd_checkout a, '+ responsive_selector + ' .widget_edd_cart_widget .edd_checkout a'
+ );
+
+ astra_color_responsive_css(
+ 'edd-cart-colors',
+ 'astra-settings[header-edd-checkout-btn-background-color]',
+ 'background-color',
+ selector + ' .widget_edd_cart_widget .edd_checkout a, .widget_edd_cart_widget .edd_checkout a,' + responsive_selector + ' .widget_edd_cart_widget .edd_checkout a, .widget_edd_cart_widget .edd_checkout a'
+ );
+
+ astra_color_responsive_css(
+ 'edd-cart-border-color',
+ 'astra-settings[header-edd-checkout-btn-background-color]',
+ 'border-color',
+ selector + ' .widget_edd_cart_widget .edd_checkout a, .widget_edd_cart_widget .edd_checkout a,' + responsive_selector + ' .widget_edd_cart_widget .edd_checkout a, .widget_edd_cart_widget .edd_checkout a'
+ );
+
+ astra_color_responsive_css(
+ 'edd-cart-colors',
+ 'astra-settings[header-edd-checkout-btn-text-hover-color]',
+ 'color',
+ selector +' .widget_edd_cart_widget .edd_checkout a:hover, .widget_edd_cart_widget .edd_checkout a:hover,' + responsive_selector +' .widget_edd_cart_widget .edd_checkout a:hover, .widget_edd_cart_widget .edd_checkout a:hover'
+ );
+
+ astra_color_responsive_css(
+ 'edd-cart-colors',
+ 'astra-settings[header-edd-checkout-btn-bg-hover-color]',
+ 'background-color',
+ selector +' .widget_edd_cart_widget .edd_checkout a:hover, .widget_edd_cart_widget .edd_checkout a:hover, ' + responsive_selector + ' .widget_edd_cart_widget .edd_checkout a:hover, .widget_edd_cart_widget .edd_checkout a:hover'
+ );
+
+ /**
+ * Cart icon style
+ */
+ wp.customize( 'astra-settings[edd-header-cart-icon-style]', function( setting ) {
+ setting.bind( function( icon_style ) {
+ var buttons = $(document).find('.ast-edd-site-header-cart');
+ buttons.removeClass('ast-edd-menu-cart-fill ast-edd-menu-cart-outline');
+ buttons.addClass( 'ast-edd-menu-cart-' + icon_style );
+ var dynamicStyle = '.ast-edd-site-header-cart a, .ast-edd-site-header-cart a *{ transition: all 0s; } ';
+ astra_add_dynamic_css( 'edd-header-cart-icon-style', dynamicStyle );
+ wp.customize.preview.send( 'refresh' );
+ } );
+ } );
+
+ /**
+ * EDD Cart Button Color
+ */
+ wp.customize( 'astra-settings[edd-header-cart-icon-color]', function( setting ) {
+ setting.bind( function( cart_icon_color ) {
+ wp.customize.preview.send( 'refresh' );
+ });
+ });
+
+ /**
+ * Button Border Radius
+ */
+ wp.customize( 'astra-settings[edd-header-cart-icon-radius]', function( setting ) {
+ setting.bind( function( border ) {
+
+ var dynamicStyle = '.ast-edd-site-header-cart.ast-edd-menu-cart-outline .ast-addon-cart-wrap, .ast-edd-site-header-cart.ast-edd-menu-cart-fill .ast-addon-cart-wrap, .ast-edd-site-header-cart.ast-edd-menu-cart-outline .count, .ast-edd-site-header-cart.ast-edd-menu-cart-fill .count{ border-radius: ' + ( parseInt( border ) ) + 'px } ';
+ astra_add_dynamic_css( 'edd-header-cart-icon-radius', dynamicStyle );
+
+ } );
+ } );
+
+ /**
+ * Transparent Header EDD-Cart color options - Customizer preview CSS.
+ */
+ wp.customize( 'astra-settings[transparent-header-edd-cart-icon-color]', function( setting ) {
+ setting.bind( function( cart_icon_color ) {
+ wp.customize.preview.send( 'refresh' );
+ });
+ });
+
+ // Advanced Visibility CSS Generation.
+ astra_builder_visibility_css( 'section-header-edd-cart', '.ast-header-edd-cart' );
+
+} )( jQuery );
diff --git a/inc/builder/type/header/edd-cart/class-astra-header-edd-cart-component.php b/inc/builder/type/header/edd-cart/class-astra-header-edd-cart-component.php new file mode 100644 index 0000000..3d927c7 --- /dev/null +++ b/inc/builder/type/header/edd-cart/class-astra-header-edd-cart-component.php @@ -0,0 +1,49 @@ +<?php +/** + * EDD Cart for Astra theme. + * + * @package astra-builder + * @author Astra + * @copyright Copyright (c) 2020, Astra + * @link https://wpastra.com/ + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +define( 'ASTRA_HEADER_EDD_CART_DIR', ASTRA_THEME_DIR . 'inc/builder/type/header/edd-cart' ); +define( 'ASTRA_HEADER_EDD_CART_URI', ASTRA_THEME_URI . 'inc/builder/type/header/edd-cart' ); + +if ( ! class_exists( 'Astra_Header_Edd_Cart_Component' ) ) { + + /** + * Heading Initial Setup + * + * @since 3.0.0 + */ + class Astra_Header_Edd_Cart_Component { + + /** + * Constructor function that initializes required actions and hooks + */ + public function __construct() { + + // @codingStandardsIgnoreStart WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + require_once ASTRA_HEADER_EDD_CART_DIR . '/class-astra-header-edd-cart-loader.php'; + + // Include front end files. + if ( ! is_admin() ) { + require_once ASTRA_HEADER_EDD_CART_DIR . '/dynamic-css/dynamic.css.php'; + } + // @codingStandardsIgnoreEnd WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + } + } + + /** + * Kicking this off by creating an object. + */ + new Astra_Header_Edd_Cart_Component(); + +} diff --git a/inc/builder/type/header/edd-cart/class-astra-header-edd-cart-loader.php b/inc/builder/type/header/edd-cart/class-astra-header-edd-cart-loader.php new file mode 100644 index 0000000..59ef2de --- /dev/null +++ b/inc/builder/type/header/edd-cart/class-astra-header-edd-cart-loader.php @@ -0,0 +1,53 @@ +<?php +/** + * EDD Cart Styling Loader for Astra theme. + * + * @package astra-builder + * @author Astra + * @copyright Copyright (c) 2020, Astra + * @link https://wpastra.com/ + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Customizer Initialization + * + * @since 3.0.0 + */ +class Astra_Header_Edd_Cart_Loader { + + /** + * Constructor + * + * @since 3.0.0 + */ + public function __construct() { + + add_action( 'customize_preview_init', array( $this, 'preview_scripts' ), 110 ); + } + + /** + * Customizer Preview + * + * @since 3.0.0 + */ + public function preview_scripts() { + /** + * Load unminified if SCRIPT_DEBUG is true. + */ + /* Directory and Extension */ + $dir_name = ( SCRIPT_DEBUG ) ? 'unminified' : 'minified'; + $file_prefix = ( SCRIPT_DEBUG ) ? '' : '.min'; + wp_enqueue_script( 'astra-header-builder-edd-cart-customizer-preview-js', ASTRA_HEADER_EDD_CART_URI . '/assets/js/' . $dir_name . '/customizer-preview' . $file_prefix . '.js', array( 'customize-preview', 'astra-customizer-preview-js' ), ASTRA_THEME_VERSION, true ); + } + +} + +/** +* Kicking this off by creating the object of the class. +*/ +new Astra_Header_Edd_Cart_Loader(); diff --git a/inc/builder/type/header/edd-cart/dynamic-css/dynamic.css.php b/inc/builder/type/header/edd-cart/dynamic-css/dynamic.css.php new file mode 100644 index 0000000..401b3ed --- /dev/null +++ b/inc/builder/type/header/edd-cart/dynamic-css/dynamic.css.php @@ -0,0 +1,370 @@ +<?php +/** + * EDD Cart - Dynamic CSS + * + * @package Astra + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Search + */ +add_filter( 'astra_dynamic_theme_css', 'astra_hb_edd_cart_dynamic_css' ); + +/** + * Dynamic CSS + * + * @param string $dynamic_css Astra Dynamic CSS. + * @param string $dynamic_css_filtered Astra Dynamic CSS Filters. + * @return String Generated dynamic CSS for Search. + * + * @since 3.0.0 + */ +function astra_hb_edd_cart_dynamic_css( $dynamic_css, $dynamic_css_filtered = '' ) { + + if ( ! Astra_Builder_Helper::is_component_loaded( 'edd-cart', 'header' ) ) { + return $dynamic_css; + } + + $selector = '.ast-edd-site-header-cart'; + $trans_header_cart_selector = '.ast-theme-transparent-header .ast-edd-site-header-cart'; + $theme_color = astra_get_option( 'theme-color' ); + $link_color = astra_get_option( 'link-color', $theme_color ); + $header_cart_icon_style = astra_get_option( 'edd-header-cart-icon-style' ); + $header_cart_icon_color = astra_get_option( 'edd-header-cart-icon-color', $theme_color ); + $header_cart_icon_radius = astra_get_option( 'edd-header-cart-icon-radius' ); + $cart_h_color = astra_get_foreground_color( $header_cart_icon_color ); + + $trans_header_cart_icon_color = astra_get_option( 'transparent-header-edd-cart-icon-color', $theme_color ); + $trans_header_cart_h_color = astra_get_foreground_color( $trans_header_cart_icon_color ); + + $btn_color = astra_get_option( 'button-color' ); + $btn_bg_color = astra_get_option( 'button-bg-color', $theme_color ); + + if ( empty( $btn_color ) ) { + $btn_color = astra_get_foreground_color( $theme_color ); + } + + if ( 'none' === $header_cart_icon_style ) { + $header_cart_icon_color = $theme_color; + $trans_header_cart_icon_color = $theme_color; + } + /** + * - EDD cart styles. + */ + $cart_text_color = astra_get_option( 'header-edd-cart-text-color' ); + $cart_link_color = astra_get_option( 'header-edd-cart-link-color', $link_color ); + $cart_bg_color = astra_get_option( 'header-edd-cart-background-color' ); + $cart_separator_color = astra_get_option( 'header-edd-cart-separator-color' ); + + $checkout_button_text_color = astra_get_option( 'header-edd-checkout-btn-text-color', $btn_color ); + $checkout_button_bg_color = astra_get_option( 'header-edd-checkout-btn-background-color', $btn_bg_color ); + $checkout_button_text_h_color = astra_get_option( 'header-edd-checkout-btn-text-hover-color', $btn_color ); + $checkout_button_bg_h_color = astra_get_option( 'header-edd-checkout-btn-bg-hover-color', $btn_bg_color ); + + $header_cart_icon = ''; + $cart_text_color_desktop = ( ! empty( $cart_text_color['desktop'] ) ) ? $cart_text_color['desktop'] : ''; + $cart_text_color_mobile = ( ! empty( $cart_text_color['mobile'] ) ) ? $cart_text_color['mobile'] : ''; + $cart_text_color_tablet = ( ! empty( $cart_text_color['tablet'] ) ) ? $cart_text_color['tablet'] : ''; + + $cart_bg_color_desktop = ( ! empty( $cart_bg_color['desktop'] ) ) ? $cart_bg_color['desktop'] : ''; + $cart_bg_color_mobile = ( ! empty( $cart_bg_color['mobile'] ) ) ? $cart_bg_color['mobile'] : ''; + $cart_bg_color_tablet = ( ! empty( $cart_bg_color['tablet'] ) ) ? $cart_bg_color['tablet'] : ''; + + $cart_link_color_desktop = ( ! empty( $cart_link_color['desktop'] ) ) ? $cart_link_color['desktop'] : ''; + $cart_link_color_mobile = ( ! empty( $cart_link_color['mobile'] ) ) ? $cart_link_color['mobile'] : ''; + $cart_link_color_tablet = ( ! empty( $cart_link_color['tablet'] ) ) ? $cart_link_color['tablet'] : ''; + + $cart_separator_color_desktop = ( ! empty( $cart_separator_color['desktop'] ) ) ? $cart_separator_color['desktop'] : ''; + $cart_separator_color_mobile = ( ! empty( $cart_separator_color['mobile'] ) ) ? $cart_separator_color['mobile'] : ''; + $cart_separator_color_tablet = ( ! empty( $cart_separator_color['tablet'] ) ) ? $cart_separator_color['tablet'] : ''; + + $checkout_button_text_color_desktop = ( ! empty( $checkout_button_text_color['desktop'] ) ) ? $checkout_button_text_color['desktop'] : ''; + $checkout_button_text_color_mobile = ( ! empty( $checkout_button_text_color['mobile'] ) ) ? $checkout_button_text_color['mobile'] : ''; + $checkout_button_text_color_tablet = ( ! empty( $checkout_button_text_color['tablet'] ) ) ? $checkout_button_text_color['tablet'] : ''; + + $checkout_button_bg_color_desktop = ( ! empty( $checkout_button_bg_color['desktop'] ) ) ? $checkout_button_bg_color['desktop'] : ''; + $checkout_button_bg_color_mobile = ( ! empty( $checkout_button_bg_color['mobile'] ) ) ? $checkout_button_bg_color['mobile'] : ''; + $checkout_button_bg_color_tablet = ( ! empty( $checkout_button_bg_color['tablet'] ) ) ? $checkout_button_bg_color['tablet'] : ''; + + $checkout_button_text_h_color_desktop = ( ! empty( $checkout_button_text_h_color['desktop'] ) ) ? $checkout_button_text_h_color['desktop'] : ''; + $checkout_button_text_h_color_mobile = ( ! empty( $checkout_button_text_h_color['mobile'] ) ) ? $checkout_button_text_h_color['mobile'] : ''; + $checkout_button_text_h_color_tablet = ( ! empty( $checkout_button_text_h_color['tablet'] ) ) ? $checkout_button_text_h_color['tablet'] : ''; + + $checkout_button_bg_h_color_desktop = ( ! empty( $checkout_button_bg_h_color['desktop'] ) ) ? $checkout_button_bg_h_color['desktop'] : ''; + $checkout_button_bg_h_color_mobile = ( ! empty( $checkout_button_bg_h_color['mobile'] ) ) ? $checkout_button_bg_h_color['mobile'] : ''; + $checkout_button_bg_h_color_tablet = ( ! empty( $checkout_button_bg_h_color['tablet'] ) ) ? $checkout_button_bg_h_color['tablet'] : ''; + + /** + * EDD Cart CSS. + */ + $css_output_desktop = array( + + $selector . ' .ast-edd-cart-menu-wrap .count, ' . $selector . ' .ast-edd-cart-menu-wrap .count:after' => array( + 'color' => $theme_color, + 'border-color' => $theme_color, + ), + $selector . ' .ast-edd-cart-menu-wrap:hover .count' => array( + 'color' => esc_attr( $cart_h_color ), + 'background-color' => esc_attr( $theme_color ), + ), + $selector . ' .ast-icon-shopping-cart' => array( + 'color' => $theme_color, + ), + $selector . ' .ast-edd-header-cart-info-wrap' => array( + 'color' => esc_attr( $header_cart_icon_color ), + ), + $selector . ' .ast-addon-cart-wrap span.astra-icon:after' => array( + 'color' => esc_attr( $cart_h_color ), + 'background-color' => esc_attr( $header_cart_icon_color ), + ), + /** + * Transparent Header - EDD Cart icon color. + */ + $trans_header_cart_selector . ' .ast-edd-header-cart-info-wrap' => array( + 'color' => esc_attr( $trans_header_cart_icon_color ), + ), + $trans_header_cart_selector . ' .ast-addon-cart-wrap span.astra-icon:after' => array( + 'color' => esc_attr( $trans_header_cart_h_color ), + 'background-color' => esc_attr( $trans_header_cart_icon_color ), + ), + /** + * General EDD Cart tray color for widget + */ + $selector . ' .widget_edd_cart_widget a, ' . $selector . ' .widget_edd_cart_widget a.edd-remove-from-cart, ' . $selector . ' .widget_edd_cart_widget .cart-total' => array( + 'color' => esc_attr( $cart_link_color_desktop ), + ), + $selector . ' .widget_edd_cart_widget a.edd-remove-from-cart:after' => array( + 'color' => esc_attr( $cart_link_color_desktop ), + 'border-color' => esc_attr( $cart_link_color_desktop ), + ), + $selector . ' .widget_edd_cart_widget span, ' . $selector . ' .widget_edd_cart_widget strong, ' . $selector . ' .widget_edd_cart_widget *' => array( + 'color' => esc_attr( $cart_text_color_desktop ), + ), + '.ast-builder-layout-element ' . $selector . ' .widget_edd_cart_widget' => array( + 'background-color' => esc_attr( $cart_bg_color_desktop ), + 'border-color' => esc_attr( $cart_bg_color_desktop ), + ), + '.ast-builder-layout-element ' . $selector . ' .widget_edd_cart_widget:before, .ast-builder-layout-element ' . $selector . ' .widget_edd_cart_widget:after' => array( + 'border-bottom-color' => esc_attr( $cart_bg_color_desktop ), + ), + $selector . ' .widget_edd_cart_widget .edd-cart-item, ' . $selector . ' .widget_edd_cart_widget .edd-cart-number-of-items, ' . $selector . ' .widget_edd_cart_widget .edd-cart-meta' => array( + 'border-bottom-color' => esc_attr( $cart_separator_color_desktop ), + ), + + /** + * Checkout button color for widget + */ + '.ast-edd-site-header-cart .widget_edd_cart_widget .edd_checkout a, .widget_edd_cart_widget .edd_checkout a' => array( + 'color' => esc_attr( $checkout_button_text_color_desktop ), + 'border-color' => esc_attr( $checkout_button_bg_color_desktop ), + 'background-color' => esc_attr( $checkout_button_bg_color_desktop ), + ), + '.ast-edd-site-header-cart .widget_edd_cart_widget .edd_checkout a:hover, .widget_edd_cart_widget .edd_checkout a:hover' => array( + 'color' => esc_attr( $checkout_button_text_h_color_desktop ), + 'background-color' => esc_attr( $checkout_button_bg_h_color_desktop ), + ), + ); + + $css_output = astra_parse_css( $css_output_desktop ); + + $responsive_selector = '.astra-cart-drawer.edd-active'; + + $css_output_mobile = array( + $responsive_selector . ' .widget_edd_cart_widget a, ' . $responsive_selector . ' .widget_edd_cart_widget a.edd-remove-from-cart, ' . $responsive_selector . ' .widget_edd_cart_widget .cart-total' => array( + 'color' => esc_attr( $cart_link_color_mobile ), + ), + $selector . ' .widget_edd_cart_widget a.edd-remove-from-cart:after' => array( + 'color' => esc_attr( $cart_link_color_mobile ), + 'border-color' => esc_attr( $cart_link_color_mobile ), + ), + $responsive_selector . ' .astra-cart-drawer-title, ' . $responsive_selector . ' .widget_edd_cart_widget span, ' . $responsive_selector . ' .widget_edd_cart_widget strong, ' . $responsive_selector . ' .widget_edd_cart_widget *' => array( + 'color' => esc_attr( $cart_text_color_mobile ), + ), + $responsive_selector => array( + 'background-color' => esc_attr( $cart_bg_color_mobile ), + 'border-color' => esc_attr( $cart_bg_color_mobile ), + ), + $responsive_selector . ' .widget_edd_cart_widget:before, .ast-builder-layout-element ' . $responsive_selector . ' .widget_edd_cart_widget:after' => array( + 'border-bottom-color' => esc_attr( $cart_bg_color_mobile ), + ), + $responsive_selector . ' .widget_edd_cart_widget .edd-cart-item, ' . $responsive_selector . ' .widget_edd_cart_widget .edd-cart-number-of-items, ' . $responsive_selector . ' .widget_edd_cart_widget .edd-cart-meta, ' . + $responsive_selector . ' .astra-cart-drawer-header' => array( + 'border-bottom-color' => esc_attr( $cart_separator_color_mobile ), + ), + /** + * Checkout button color for widget + */ + $responsive_selector . ' .widget_edd_cart_widget .edd_checkout a, .widget_edd_cart_widget .edd_checkout a' => array( + 'color' => esc_attr( $checkout_button_text_color_mobile ), + 'border-color' => esc_attr( $checkout_button_bg_color_mobile ), + 'background-color' => esc_attr( $checkout_button_bg_color_mobile ), + ), + $responsive_selector . ' .widget_edd_cart_widget .edd_checkout a:hover, .widget_edd_cart_widget .edd_checkout a:hover' => array( + 'color' => esc_attr( $checkout_button_text_h_color_mobile ), + 'background-color' => esc_attr( $checkout_button_bg_h_color_mobile ), + ), + ); + + $css_output_tablet = array( + $responsive_selector . ' .widget_edd_cart_widget a, ' . $responsive_selector . ' .widget_edd_cart_widget a.edd-remove-from-cart, ' . $responsive_selector . ' .widget_edd_cart_widget .cart-total' => array( + 'color' => esc_attr( $cart_link_color_tablet ), + ), + $selector . ' .widget_edd_cart_widget a.edd-remove-from-cart:after' => array( + 'color' => esc_attr( $cart_link_color_tablet ), + 'border-color' => esc_attr( $cart_link_color_tablet ), + ), + $responsive_selector . ' .astra-cart-drawer-title, ' . $responsive_selector . ' .widget_edd_cart_widget span, ' . $responsive_selector . ' .widget_edd_cart_widget strong, ' . $responsive_selector . ' .widget_edd_cart_widget *' => array( + 'color' => esc_attr( $cart_text_color_tablet ), + ), + $responsive_selector => array( + 'background-color' => esc_attr( $cart_bg_color_tablet ), + 'border-color' => esc_attr( $cart_bg_color_tablet ), + ), + $responsive_selector . ' .widget_edd_cart_widget:before, .ast-builder-layout-element ' . $responsive_selector . ' .widget_edd_cart_widget:after' => array( + 'border-bottom-color' => esc_attr( $cart_bg_color_tablet ), + ), + $responsive_selector . ' .widget_edd_cart_widget .edd-cart-item, ' . $responsive_selector . ' .widget_edd_cart_widget .edd-cart-number-of-items, ' . $responsive_selector . ' .widget_edd_cart_widget .edd-cart-meta, ' . + $responsive_selector . ' .astra-cart-drawer-header' => array( + 'border-bottom-color' => esc_attr( $cart_separator_color_tablet ), + ), + /** + * Checkout button color for widget + */ + $responsive_selector . ' .widget_edd_cart_widget .edd_checkout a, .widget_edd_cart_widget .edd_checkout a' => array( + 'color' => esc_attr( $checkout_button_text_color_tablet ), + 'border-color' => esc_attr( $checkout_button_bg_color_tablet ), + 'background-color' => esc_attr( $checkout_button_bg_color_tablet ), + ), + $responsive_selector . ' .widget_edd_cart_widget .edd_checkout a:hover, .widget_edd_cart_widget .edd_checkout a:hover' => array( + 'color' => esc_attr( $checkout_button_text_h_color_tablet ), + 'background-color' => esc_attr( $checkout_button_bg_h_color_tablet ), + ), + ); + + $css_output .= astra_parse_css( $css_output_tablet, '', astra_get_tablet_breakpoint() ); + $css_output .= astra_parse_css( $css_output_mobile, '', astra_get_mobile_breakpoint() ); + + /** + * Header Cart color + */ + if ( 'none' !== $header_cart_icon_style ) { + + /** + * Header Cart Icon colors + */ + $header_cart_icon = array( + + $selector . ' .ast-edd-cart-menu-wrap .count' => array( + 'color' => esc_attr( astra_get_option( 'edd-header-cart-icon-color' ) ), + 'border-color' => esc_attr( astra_get_option( 'edd-header-cart-icon-color' ) ), + ), + $selector . ' .ast-edd-cart-menu-wrap .count:after' => array( + 'color' => esc_attr( astra_get_option( 'edd-header-cart-icon-color' ) ), + 'border-color' => esc_attr( astra_get_option( 'edd-header-cart-icon-color' ) ), + ), + $selector . ' .ast-icon-shopping-cart' => array( + 'color' => esc_attr( astra_get_option( 'edd-header-cart-icon-color' ) ), + ), + + // Default icon colors. + '.ast-edd-cart-menu-wrap .count, .ast-edd-cart-menu-wrap .count:after' => array( + 'border-color' => esc_attr( $header_cart_icon_color ), + 'color' => esc_attr( $header_cart_icon_color ), + ), + // Outline icon hover colors. + $selector . ' .ast-edd-cart-menu-wrap:hover .count' => array( + 'color' => esc_attr( $cart_h_color ), + 'background-color' => esc_attr( $header_cart_icon_color ), + ), + // Outline icon colors. + '.ast-edd-menu-cart-outline .ast-addon-cart-wrap' => array( + 'background' => '#ffffff', + 'color' => esc_attr( $header_cart_icon_color ), + ), + // Outline Info colors. + $selector . ' .ast-menu-cart-outline .ast-edd-header-cart-info-wrap' => array( + 'color' => esc_attr( $header_cart_icon_color ), + ), + // Fill icon Color. + '.ast-edd-site-header-cart.ast-edd-menu-cart-fill .ast-edd-cart-menu-wrap .count,.ast-edd-menu-cart-fill .ast-addon-cart-wrap, .ast-edd-menu-cart-fill .ast-addon-cart-wrap .ast-edd-header-cart-info-wrap, .ast-edd-menu-cart-fill .ast-addon-cart-wrap .ast-icon-shopping-cart' => array( + 'background-color' => esc_attr( $header_cart_icon_color ), + 'color' => esc_attr( $cart_h_color ), + ), + + // Transparent Header - Count colors. + $trans_header_cart_selector . ' .ast-edd-cart-menu-wrap .count' => array( + 'color' => esc_attr( astra_get_option( 'transparent-header-edd-cart-icon-color' ) ), + 'border-color' => esc_attr( astra_get_option( 'transparent-header-edd-cart-icon-color' ) ), + ), + $trans_header_cart_selector . ' .ast-edd-cart-menu-wrap .count:after' => array( + 'color' => esc_attr( astra_get_option( 'transparent-header-edd-cart-icon-color' ) ), + 'border-color' => esc_attr( astra_get_option( 'transparent-header-edd-cart-icon-color' ) ), + ), + $trans_header_cart_selector . ' .ast-icon-shopping-cart' => array( + 'color' => esc_attr( astra_get_option( 'transparent-header-edd-cart-icon-color' ) ), + ), + + // Transparent Header - Default icon colors. + '.ast-theme-transparent-header .ast-edd-cart-menu-wrap .count, .ast-theme-transparent-header .ast-edd-cart-menu-wrap .count:after' => array( + 'border-color' => esc_attr( $trans_header_cart_icon_color ), + 'color' => esc_attr( $trans_header_cart_icon_color ), + ), + // Transparent Header - Outline icon hover colors. + $trans_header_cart_selector . ' .ast-edd-cart-menu-wrap:hover .count' => array( + 'color' => esc_attr( $trans_header_cart_h_color ), + 'background-color' => esc_attr( $trans_header_cart_icon_color ), + ), + // Transparent Header - Outline icon colors. + '.ast-theme-transparent-header .ast-edd-menu-cart-outline .ast-addon-cart-wrap' => array( + 'background' => '#ffffff', + 'color' => esc_attr( $trans_header_cart_icon_color ), + ), + // Transparent Header - Outline Info colors. + $trans_header_cart_selector . ' .ast-menu-cart-outline .ast-edd-header-cart-info-wrap' => array( + 'color' => esc_attr( $trans_header_cart_icon_color ), + ), + // Transparent Header - Fill icon Color. + '.ast-theme-transparent-header .ast-edd-site-header-cart.ast-edd-menu-cart-fill .ast-edd-cart-menu-wrap .count, .ast-theme-transparent-header .ast-edd-menu-cart-fill .ast-addon-cart-wrap, .ast-theme-transparent-header .ast-edd-menu-cart-fill .ast-edd-site-header-cart-wrap .ast-icon-shopping-cart, .ast-theme-transparent-header .ast-edd-site-header-cart .ast-addon-cart-wrap span.astra-icon:after' => array( + 'background-color' => esc_attr( $trans_header_cart_icon_color ), + 'color' => esc_attr( $trans_header_cart_h_color ), + ), + + // Border radius. + '.ast-edd-site-header-cart.ast-edd-menu-cart-outline .ast-addon-cart-wrap, .ast-edd-site-header-cart.ast-edd-menu-cart-fill .ast-addon-cart-wrap, .ast-edd-site-header-cart.ast-edd-menu-cart-outline .count, .ast-edd-site-header-cart.ast-edd-menu-cart-fill .count, .ast-edd-site-header-cart.ast-edd-menu-cart-outline .ast-addon-cart-wrap .ast-edd-header-cart-info-wrap, .ast-edd-site-header-cart.ast-edd-menu-cart-fill .ast-addon-cart-wrap .ast-edd-header-cart-info-wrap' => array( + 'border-radius' => astra_get_css_value( $header_cart_icon_radius, 'px' ), + ), + ); + + // We adding this conditional CSS only to maintain backwards. Remove this condition after 2-3 updates of add-on. + if ( defined( 'ASTRA_EXT_VER' ) && version_compare( ASTRA_EXT_VER, '3.4.2', '<' ) ) { + // Outline cart style border. + $header_cart_icon['.ast-edd-menu-cart-outline .ast-addon-cart-wrap'] = array( + 'background' => '#ffffff', + 'border' => '1px solid ' . $header_cart_icon_color, + 'color' => esc_attr( $header_cart_icon_color ), + ); + // Transparent Header outline cart style border. + $header_cart_icon['.ast-theme-transparent-header .ast-edd-menu-cart-outline .ast-addon-cart-wrap'] = array( + 'background' => '#ffffff', + 'border' => '1px solid ' . $trans_header_cart_icon_color, + 'color' => esc_attr( $trans_header_cart_icon_color ), + ); + } + + $header_cart_icon = astra_parse_css( $header_cart_icon ); + } + + /* Parse CSS from array() */ + $css_output .= $header_cart_icon; + + $css_output .= Astra_Builder_Base_Dynamic_CSS::prepare_visibility_css( 'section-header-edd-cart', '.ast-header-edd-cart' ); + + $dynamic_css .= $css_output; + + return $dynamic_css; +} diff --git a/inc/builder/type/header/html/assets/js/minified/customizer-preview.min.js b/inc/builder/type/header/html/assets/js/minified/customizer-preview.min.js new file mode 100644 index 0000000..08f5336 --- /dev/null +++ b/inc/builder/type/header/html/assets/js/minified/customizer-preview.min.js @@ -0,0 +1 @@ +jQuery,astra_builder_html_css("header",AstraBuilderHTMLData.component_limit);
\ No newline at end of file diff --git a/inc/builder/type/header/html/assets/js/unminified/customizer-preview.js b/inc/builder/type/header/html/assets/js/unminified/customizer-preview.js new file mode 100644 index 0000000..0535a8a --- /dev/null +++ b/inc/builder/type/header/html/assets/js/unminified/customizer-preview.js @@ -0,0 +1,15 @@ +/**
+ * This file adds some LIVE to the Customizer live preview. To leverage
+ * this, set your custom settings to 'postMessage' and then add your handling
+ * here. Your javascript should grab settings from customizer controls, and
+ * then make any necessary changes to the page using jQuery.
+ *
+ * @package Astra Builder
+ * @since 3.0.0
+ */
+
+( function( $ ) {
+
+ astra_builder_html_css( 'header', AstraBuilderHTMLData.component_limit );
+
+} )( jQuery );
diff --git a/inc/builder/type/header/html/class-astra-header-html-component-loader.php b/inc/builder/type/header/html/class-astra-header-html-component-loader.php new file mode 100644 index 0000000..6c3d002 --- /dev/null +++ b/inc/builder/type/header/html/class-astra-header-html-component-loader.php @@ -0,0 +1,60 @@ +<?php +/** + * HTML Styling Loader for Astra theme. + * + * @package Astra Builder + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since Astra 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Customizer Initialization + * + * @since 3.0.0 + */ +class Astra_Header_Html_Component_Loader { + + /** + * Constructor + * + * @since 3.0.0 + */ + public function __construct() { + add_action( 'customize_preview_init', array( $this, 'preview_scripts' ), 110 ); + } + + /** + * Customizer Preview + * + * @since 3.0.0 + */ + public function preview_scripts() { + /** + * Load unminified if SCRIPT_DEBUG is true. + */ + /* Directory and Extension */ + $dir_name = ( SCRIPT_DEBUG ) ? 'unminified' : 'minified'; + $file_prefix = ( SCRIPT_DEBUG ) ? '' : '.min'; + wp_enqueue_script( 'astra-heading-html-customizer-preview-js', ASTRA_HEADER_HTML_URI . '/assets/js/' . $dir_name . '/customizer-preview' . $file_prefix . '.js', array( 'customize-preview', 'ahfb-base-customizer-preview' ), ASTRA_THEME_VERSION, true ); + + // Localize variables for HTML JS. + wp_localize_script( + 'astra-heading-html-customizer-preview-js', + 'AstraBuilderHTMLData', + array( + 'component_limit' => defined( 'ASTRA_EXT_VER' ) ? Astra_Builder_Helper::$component_limit : Astra_Builder_Helper::$num_of_header_html, + ) + ); + } +} + +/** +* Kicking this off by creating the object of the class. +*/ +new Astra_Header_Html_Component_Loader(); diff --git a/inc/builder/type/header/html/class-astra-header-html-component.php b/inc/builder/type/header/html/class-astra-header-html-component.php new file mode 100644 index 0000000..0abed4c --- /dev/null +++ b/inc/builder/type/header/html/class-astra-header-html-component.php @@ -0,0 +1,45 @@ +<?php +/** + * HTML component. + * + * @package Astra Builder + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since Astra 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +define( 'ASTRA_HEADER_HTML_DIR', ASTRA_THEME_DIR . 'inc/builder/type/header/html' ); +define( 'ASTRA_HEADER_HTML_URI', ASTRA_THEME_URI . 'inc/builder/type/header/html' ); + +/** + * Heading Initial Setup + * + * @since 3.0.0 + */ +class Astra_Header_Html_Component { + + /** + * Constructor function that initializes required actions and hooks + */ + public function __construct() { + + // @codingStandardsIgnoreStart WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + require_once ASTRA_HEADER_HTML_DIR . '/class-astra-header-html-component-loader.php'; + + // Include front end files. + if ( ! is_admin() ) { + require_once ASTRA_HEADER_HTML_DIR . '/dynamic-css/dynamic.css.php'; + } + // @codingStandardsIgnoreEnd WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + } +} + +/** + * Kicking this off by creating an object. + */ +new Astra_Header_Html_Component(); diff --git a/inc/builder/type/header/html/dynamic-css/dynamic.css.php b/inc/builder/type/header/html/dynamic-css/dynamic.css.php new file mode 100644 index 0000000..4f1a396 --- /dev/null +++ b/inc/builder/type/header/html/dynamic-css/dynamic.css.php @@ -0,0 +1,32 @@ +<?php +/** + * HTML control - Dynamic CSS + * + * @package Astra Builder + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Heading Colors + */ +add_filter( 'astra_dynamic_theme_css', 'astra_hb_html_dynamic_css' ); + +/** + * Dynamic CSS + * + * @param string $dynamic_css Astra Dynamic CSS. + * @param string $dynamic_css_filtered Astra Dynamic CSS Filters. + * @return String Generated dynamic CSS for Heading Colors. + * + * @since 3.0.0 + */ +function astra_hb_html_dynamic_css( $dynamic_css, $dynamic_css_filtered = '' ) { + + $dynamic_css .= Astra_Html_Component_Dynamic_CSS::astra_html_dynamic_css( 'header' ); + + return $dynamic_css; +} diff --git a/inc/builder/type/header/menu/assets/js/minified/customizer-preview.min.js b/inc/builder/type/header/menu/assets/js/minified/customizer-preview.min.js new file mode 100644 index 0000000..41296e8 --- /dev/null +++ b/inc/builder/type/header/menu/assets/js/minified/customizer-preview.min.js @@ -0,0 +1 @@ +!function(){for(var a=AstraBuilderMenuData.tablet_break_point||768,s=AstraBuilderMenuData.mobile_break_point||544,n=AstraBuilderMenuData.nav_menu_enabled||!1,e=1;e<=AstraBuilderMenuData.component_limit;e++){var t="menu"+e,i=".ast-builder-menu-"+e;astra_builder_visibility_css("section-hb-menu-"+e,i),astra_generate_outside_font_family_css("astra-settings[header-"+t+"-font-family]",i+" .menu-item > .menu-link"),astra_generate_font_weight_css("astra-settings[header-"+t+"-font-family]","astra-settings[header-"+t+"-font-weight]","font-weight",i+" .menu-item > .menu-link"),astra_css("astra-settings[header-"+t+"-text-transform]","text-transform",i+" .menu-item > .menu-link"),astra_responsive_font_size("astra-settings[header-"+t+"-font-size]",i+" .menu-item > .menu-link"),astra_css("astra-settings[header-"+t+"-line-height]","line-height",i+" .menu-item > .menu-link"),astra_css("astra-settings[header-"+t+"-letter-spacing]","letter-spacing",i+" .menu-item > .menu-link","px"),astra_color_responsive_css("astra-menu-color-preview","astra-settings[header-"+t+"-color-responsive]","color",i+" .main-header-menu .menu-item > .menu-link"),astra_color_responsive_css("astra-menu-h-color-preview","astra-settings[header-"+t+"-h-color-responsive]","color",i+" .menu-item:hover > .menu-link, "+i+" .inline-on-mobile .menu-item:hover > .ast-menu-toggle"),astra_color_responsive_css("astra-builder-toggle","astra-settings[header-"+t+"-color-responsive]","color",i+" .menu-item > .ast-menu-toggle"),astra_color_responsive_css("astra-menu-h-toogle-color-preview","astra-settings[header-"+t+"-h-color-responsive]","color",i+" .menu-item:hover > .ast-menu-toggle"),astra_color_responsive_css("astra-menu-active-color-preview","astra-settings[header-"+t+"-a-color-responsive]","color",i+" .menu-item.current-menu-item > .menu-link, "+i+" .inline-on-mobile .menu-item.current-menu-item > .ast-menu-toggle, "+i+" .current-menu-ancestor > .menu-link, "+i+" .current-menu-ancestor > .ast-menu-toggle"),astra_apply_responsive_background_css("astra-settings[header-"+t+"-bg-obj-responsive]",i+" .main-header-menu, "+i+" .main-header-menu .sub-menu","desktop"),astra_apply_responsive_background_css("astra-settings[header-"+t+"-bg-obj-responsive]",i+" .main-header-menu, "+i+" .main-header-menu .sub-menu","tablet"),astra_apply_responsive_background_css("astra-settings[header-"+t+"-bg-obj-responsive]",i+" .main-header-menu, "+i+" .main-header-menu .sub-menu","mobile"),astra_color_responsive_css("astra-menu-bg-preview","astra-settings[header-"+t+"-h-bg-color-responsive]","background",i+" .menu-item:hover > .menu-link, "+i+" .inline-on-mobile .menu-item:hover > .ast-menu-toggle"),astra_color_responsive_css("astra-builder","astra-settings[header-"+t+"-a-bg-color-responsive]","background",i+" .menu-item.current-menu-item > .menu-link, "+i+" .inline-on-mobile .menu-item.current-menu-item > .ast-menu-toggle, "+i+" .current-menu-ancestor > .menu-link, "+i+" .current-menu-ancestor > .ast-menu-toggle"),function(i){wp.customize("astra-settings[header-menu"+i+"-submenu-border]",function(e){e.bind(function(e){var t=".ast-builder-menu-"+i+" .sub-menu, .ast-builder-menu-"+i+" .inline-on-mobile .sub-menu, .ast-builder-menu-"+i+" .main-header-menu.submenu-with-border .astra-megamenu, .ast-builder-menu-"+i+" .main-header-menu.submenu-with-border .astra-full-megamenu-wrapper {";t+="border-top-width:"+e.top+"px;",t+="border-right-width:"+e.right+"px;",t+="border-left-width:"+e.left+"px;",t+="border-style: solid;",t+="border-bottom-width:"+e.bottom+"px;",t+="}",astra_add_dynamic_css("header-menu"+i+"-submenu-border",t)})}),wp.customize("astra-settings[header-menu"+i+"-menu-spacing]",function(e){e.bind(function(e){var t="";t+=".ast-builder-menu-"+i+" .main-header-menu .menu-item > .menu-link {",t+="padding-left: "+e.desktop.left+e["desktop-unit"]+";",t+="padding-right: "+e.desktop.right+e["desktop-unit"]+";",t+="padding-top: "+e.desktop.top+e["desktop-unit"]+";",t+="padding-bottom: "+e.desktop.bottom+e["desktop-unit"]+";",t+="} ",t+="@media (max-width: "+a+"px) {",t+=".ast-header-break-point .ast-builder-menu-"+i+" .main-header-menu .menu-item > .menu-link {",t+="padding-left: "+e.tablet.left+e["tablet-unit"]+";",t+="padding-right: "+e.tablet.right+e["tablet-unit"]+";",t+="padding-top: "+e.tablet.top+e["tablet-unit"]+";",t+="padding-bottom: "+e.tablet.bottom+e["tablet-unit"]+";",t+="} ",t+=".ast-hfb-header .ast-builder-menu-"+i+" .main-navigation ul .menu-item.menu-item-has-children > .ast-menu-toggle {",t+="top: "+e.tablet.top+e["tablet-unit"]+";",t+="right: calc( "+e.tablet.right+e["tablet-unit"]+" - 0.907em );",t+="} ",t+="} ",t+="@media (max-width: "+s+"px) {",t+=".ast-header-break-point .ast-builder-menu-"+i+" .main-header-menu .menu-item > .menu-link {",t+="padding-left: "+e.mobile.left+e["mobile-unit"]+";",t+="padding-right: "+e.mobile.right+e["mobile-unit"]+";",t+="padding-top: "+e.mobile.top+e["mobile-unit"]+";",t+="padding-bottom: "+e.mobile.bottom+e["mobile-unit"]+";",t+="} ",t+=".ast-hfb-header .ast-builder-menu-"+i+" .main-navigation ul .menu-item.menu-item-has-children > .ast-menu-toggle {",t+="top: "+e.mobile.top+e["mobile-unit"]+";",t+="right: calc( "+e.mobile.right+e["mobile-unit"]+" - 0.907em );",t+="} ",t+="} ",astra_add_dynamic_css("header-menu"+i+"-menu-spacing-toggle-button",t)})}),wp.customize("astra-settings[section-hb-menu-"+i+"-margin]",function(e){e.bind(function(e){var t=".ast-builder-menu-"+i+" .main-header-menu, .ast-header-break-point .ast-builder-menu-"+i+" .main-header-menu",n="";n+=t+" {",n+="margin-left: "+e.desktop.left+e["desktop-unit"]+";",n+="margin-right: "+e.desktop.right+e["desktop-unit"]+";",n+="margin-top: "+e.desktop.top+e["desktop-unit"]+";",n+="margin-bottom: "+e.desktop.bottom+e["desktop-unit"]+";",n+="} ",n+="@media (max-width: "+a+"px) {",n+=t+" {",n+="margin-left: "+e.tablet.left+e["tablet-unit"]+";",n+="margin-right: "+e.tablet.right+e["tablet-unit"]+";",n+="margin-top: "+e.tablet.top+e["desktop-unit"]+";",n+="margin-bottom: "+e.tablet.bottom+e["desktop-unit"]+";",n+="} ",n+="} ",n+="@media (max-width: "+s+"px) {",n+=t+" {",n+="margin-left: "+e.mobile.left+e["mobile-unit"]+";",n+="margin-right: "+e.mobile.right+e["mobile-unit"]+";",n+="margin-top: "+e.mobile.top+e["desktop-unit"]+";",n+="margin-bottom: "+e.mobile.bottom+e["desktop-unit"]+";",n+="} ",n+="} ",astra_add_dynamic_css("section-hb-menu-"+i+"-margin",n)})}),wp.customize("astra-settings[header-menu"+i+"-submenu-item-b-color]",function(e){e.bind(function(e){var t=wp.customize("astra-settings[header-menu"+i+"-submenu-item-border]").get(),n=wp.customize("astra-settings[header-menu"+i+"-submenu-item-b-size]").get();""!=e?1==t&&(t="",t+=".ast-desktop .ast-builder-menu-"+i+" .main-header-menu .menu-item .sub-menu .menu-link",t+="{",t+="border-bottom-width:"+(n?n+"px;":"0px;"),t+="border-color:"+e+";",t+="border-style: solid;",t+="}",t+=".ast-desktop .ast-builder-menu-"+i+" .main-header-menu .menu-item .sub-menu .menu-item:last-child .menu-link{ border-style: none; }",astra_add_dynamic_css("header-menu"+i+"-submenu-item-b-color",t)):wp.customize.preview.send("refresh")})}),wp.customize("astra-settings[header-menu"+i+"-submenu-item-b-size]",function(e){e.bind(function(e){var t=".ast-desktop .ast-builder-menu-"+i+" .main-header-menu",n="";n+=t+" .menu-item .sub-menu .menu-link {",n+="border-bottom-width: "+e+"px;",n+="} ",n+=t+" .menu-item .sub-menu .menu-item:last-child .menu-link {",n+="border-bottom-width: 0px",n+="} ",astra_add_dynamic_css("header-menu"+i+"-submenu-item-b-size",n)})}),wp.customize("astra-settings[header-menu"+i+"-submenu-item-border]",function(e){e.bind(function(e){var t=wp.customize("astra-settings[header-menu"+i+"-submenu-item-b-color]").get(),n=wp.customize("astra-settings[header-menu"+i+"-submenu-item-b-size]").get(),a=".ast-desktop .ast-builder-menu-"+i+" .main-header-menu.submenu-with-border .sub-menu .menu-link";!0===e?(a+="{",a+="border-bottom-width:"+(n?n+"px;":"0px;"),a+="border-color:"+t+";",a+="border-style: solid;"):(a+="{",a+="border-style: none;"),a+="}",a+=".ast-desktop .ast-builder-menu-"+i+" .menu-item .sub-menu .menu-item:last-child .menu-link{ border-style: none; }",astra_add_dynamic_css("header-menu"+i+"-submenu-item-border",a)})}),wp.customize("astra-settings[header-menu"+i+"-menu-hover-animation]",function(e){e.bind(function(e){var t=jQuery("#ast-desktop-header #ast-hf-menu-"+i);t.removeClass("ast-menu-hover-style-underline"),t.removeClass("ast-menu-hover-style-zoom"),t.removeClass("ast-menu-hover-style-overline"),n&&document.dispatchEvent(new CustomEvent("astMenuHoverStyleChanged",{detail:{}})),t.addClass("ast-menu-hover-style-"+e)})}),wp.customize("astra-settings[header-menu"+i+"-submenu-container-animation]",function(e){e.bind(function(e){var t=jQuery("#ast-desktop-header #ast-hf-menu-"+i);t.removeClass("astra-menu-animation-fade"),t.removeClass("astra-menu-animation-slide-down"),t.removeClass("astra-menu-animation-slide-up"),""!=e&&t.addClass("astra-menu-animation-"+e)})}),wp.customize("astra-settings[header-menu"+i+"-menu-stack-on-mobile]",function(e){e.bind(function(e){var t=jQuery("#ast-mobile-header #ast-hf-menu-"+i+".main-header-menu");t.removeClass("inline-on-mobile"),t.removeClass("stack-on-mobile"),!1===e?t.addClass("inline-on-mobile"):t.addClass("stack-on-mobile")})}),wp.customize("astra-settings[header-menu"+i+"-submenu-border-radius]",function(e){e.bind(function(e){var t=".ast-builder-menu-"+i+" li.menu-item .sub-menu, .ast-builder-menu-"+i+" ul.inline-on-mobile li.menu-item .sub-menu {";t+="border-radius: "+e+"px",t+="}",astra_add_dynamic_css("header-menu"+i+"-submenu-border-radius",t)})}),wp.customize("astra-settings[header-menu"+i+"-submenu-top-offset]",function(e){e.bind(function(e){var t=".ast-desktop .ast-builder-menu-"+i+" li.menu-item .sub-menu, .ast-desktop .ast-builder-menu-"+i+" ul.inline-on-mobile li.menu-item .sub-menu, .ast-desktop .ast-builder-menu-"+i+" li.menu-item .astra-full-megamenu-wrapper {";t+="margin-top: "+e+"px",t+="}",t+=".ast-desktop .ast-builder-menu-"+i+" .main-header-menu > .menu-item > .sub-menu:before, .ast-desktop .ast-builder-menu-"+i+" .main-header-menu > .menu-item > .astra-full-megamenu-wrapper:before {",t+="height: calc( "+e+"px + 5px );",t+="}",astra_add_dynamic_css("header-menu"+i+"-submenu-top-offset",t)})}),wp.customize("astra-settings[header-menu"+i+"-submenu-width]",function(e){e.bind(function(e){var t=".ast-builder-menu-"+i+" li.menu-item .sub-menu, .ast-builder-menu-"+i+" ul.inline-on-mobile li.menu-item .sub-menu {";t+="width: "+e+"px",t+="}",astra_add_dynamic_css("header-menu"+i+"-submenu-width",t)})})}(e),astra_css("astra-settings[header-"+t+"-submenu-b-color]","border-color",i+" li.menu-item .sub-menu, "+i+" .inline-on-mobile li.menu-item .sub-menu ")}astra_color_responsive_css("astra-builder-transparent-submenu","astra-settings[transparent-submenu-h-color-responsive]","color",".ast-theme-transparent-header .main-header-menu .menu-item .sub-menu .menu-item:hover > .menu-link")}(jQuery);
\ No newline at end of file diff --git a/inc/builder/type/header/menu/assets/js/unminified/customizer-preview.js b/inc/builder/type/header/menu/assets/js/unminified/customizer-preview.js new file mode 100644 index 0000000..54fa93b --- /dev/null +++ b/inc/builder/type/header/menu/assets/js/unminified/customizer-preview.js @@ -0,0 +1,407 @@ +/**
+ * This file adds some LIVE to the Customizer live preview. To leverage
+ * this, set your custom settings to 'postMessage' and then add your handling
+ * here. Your javascript should grab settings from customizer controls, and
+ * then make any necessary changes to the page using jQuery.
+ *
+ * @package Astra
+ * @since 3.0.0
+ */
+
+( function( $ ) {
+
+ var tablet_break_point = AstraBuilderMenuData.tablet_break_point || 768,
+ mobile_break_point = AstraBuilderMenuData.mobile_break_point || 544,
+ isNavMenuEnabled = AstraBuilderMenuData.nav_menu_enabled || false;
+
+ for ( var index = 1; index <= AstraBuilderMenuData.component_limit; index++ ) {
+
+ var prefix = 'menu' + index;
+ var selector = '.ast-builder-menu-' + index;
+ var section = 'section-hb-menu-' + index;
+
+ // Advanced Visibility CSS Generation.
+ astra_builder_visibility_css( section, selector );
+
+ /**
+ * Typography CSS.
+ */
+
+ // Menu Typography.
+ astra_generate_outside_font_family_css(
+ 'astra-settings[header-' + prefix + '-font-family]',
+ selector + ' .menu-item > .menu-link'
+ );
+ astra_generate_font_weight_css(
+ 'astra-settings[header-' + prefix + '-font-family]',
+ 'astra-settings[header-' + prefix + '-font-weight]',
+ 'font-weight',
+ selector + ' .menu-item > .menu-link'
+ );
+ astra_css(
+ 'astra-settings[header-' + prefix + '-text-transform]',
+ 'text-transform',
+ selector + ' .menu-item > .menu-link'
+ );
+ astra_responsive_font_size(
+ 'astra-settings[header-' + prefix + '-font-size]',
+ selector + ' .menu-item > .menu-link'
+ );
+ astra_css(
+ 'astra-settings[header-' + prefix + '-line-height]',
+ 'line-height',
+ selector + ' .menu-item > .menu-link'
+ );
+ astra_css(
+ 'astra-settings[header-' + prefix + '-letter-spacing]',
+ 'letter-spacing',
+ selector + ' .menu-item > .menu-link',
+ 'px'
+ );
+
+ /**
+ * Color CSS.
+ */
+
+ /**
+ * Menu - Colors
+ */
+
+ // Menu - Normal Color
+ astra_color_responsive_css(
+ 'astra-menu-color-preview',
+ 'astra-settings[header-' + prefix + '-color-responsive]',
+ 'color',
+ selector + ' .main-header-menu .menu-item > .menu-link'
+ );
+
+ // Menu - Hover Color
+ astra_color_responsive_css(
+ 'astra-menu-h-color-preview',
+ 'astra-settings[header-' + prefix + '-h-color-responsive]',
+ 'color',
+ selector + ' .menu-item:hover > .menu-link, ' + selector + ' .inline-on-mobile .menu-item:hover > .ast-menu-toggle'
+ );
+
+ // Menu Toggle - Color
+ astra_color_responsive_css(
+ 'astra-builder-toggle',
+ 'astra-settings[header-' + prefix + '-color-responsive]',
+ 'color',
+ selector + ' .menu-item > .ast-menu-toggle'
+ );
+
+ // Menu Toggle - Hover Color
+ astra_color_responsive_css(
+ 'astra-menu-h-toogle-color-preview',
+ 'astra-settings[header-' + prefix + '-h-color-responsive]',
+ 'color',
+ selector + ' .menu-item:hover > .ast-menu-toggle'
+ );
+ // Menu - Active Color
+ astra_color_responsive_css(
+ 'astra-menu-active-color-preview',
+ 'astra-settings[header-' + prefix + '-a-color-responsive]',
+ 'color',
+ selector + ' .menu-item.current-menu-item > .menu-link, ' + selector + ' .inline-on-mobile .menu-item.current-menu-item > .ast-menu-toggle, ' + selector + ' .current-menu-ancestor > .menu-link, ' + selector + ' .current-menu-ancestor > .ast-menu-toggle'
+ );
+
+ // Menu - Normal Background
+ astra_apply_responsive_background_css( 'astra-settings[header-' + prefix + '-bg-obj-responsive]', selector + ' .main-header-menu, ' + selector + ' .main-header-menu .sub-menu', 'desktop' );
+ astra_apply_responsive_background_css( 'astra-settings[header-' + prefix + '-bg-obj-responsive]', selector + ' .main-header-menu, ' + selector + ' .main-header-menu .sub-menu', 'tablet' );
+ astra_apply_responsive_background_css( 'astra-settings[header-' + prefix + '-bg-obj-responsive]', selector + ' .main-header-menu, ' + selector + ' .main-header-menu .sub-menu', 'mobile' );
+
+ // Menu - Hover Background
+ astra_color_responsive_css(
+ 'astra-menu-bg-preview',
+ 'astra-settings[header-' + prefix + '-h-bg-color-responsive]',
+ 'background',
+ selector + ' .menu-item:hover > .menu-link, ' + selector + ' .inline-on-mobile .menu-item:hover > .ast-menu-toggle'
+ );
+
+ // Menu - Active Background
+ astra_color_responsive_css(
+ 'astra-builder',
+ 'astra-settings[header-' + prefix + '-a-bg-color-responsive]',
+ 'background',
+ selector + ' .menu-item.current-menu-item > .menu-link, ' + selector + ' .inline-on-mobile .menu-item.current-menu-item > .ast-menu-toggle, ' + selector + ' .current-menu-ancestor > .menu-link, ' + selector + ' .current-menu-ancestor > .ast-menu-toggle'
+ );
+
+ /**
+ * Border CSS.
+ */
+
+ (function (index) {
+
+ // Menu 1 > Sub Menu Border Size.
+ wp.customize( 'astra-settings[header-menu'+ index +'-submenu-border]', function( setting ) {
+ setting.bind( function( border ) {
+
+ var dynamicStyle = '.ast-builder-menu-'+ index +' .sub-menu, .ast-builder-menu-'+ index +' .inline-on-mobile .sub-menu, .ast-builder-menu-'+ index +' .main-header-menu.submenu-with-border .astra-megamenu, .ast-builder-menu-'+ index +' .main-header-menu.submenu-with-border .astra-full-megamenu-wrapper {';
+ dynamicStyle += 'border-top-width:' + border.top + 'px;';
+ dynamicStyle += 'border-right-width:' + border.right + 'px;';
+ dynamicStyle += 'border-left-width:' + border.left + 'px;';
+ dynamicStyle += 'border-style: solid;';
+ dynamicStyle += 'border-bottom-width:' + border.bottom + 'px;';
+
+ dynamicStyle += '}';
+ astra_add_dynamic_css( 'header-menu'+ index +'-submenu-border', dynamicStyle );
+
+ } );
+ } );
+
+ // Menu Spacing - Menu 1.
+ wp.customize( 'astra-settings[header-menu'+ index +'-menu-spacing]', function( value ) {
+ value.bind( function( padding ) {
+ var dynamicStyle = '';
+ dynamicStyle += '.ast-builder-menu-'+ index +' .main-header-menu .menu-item > .menu-link {';
+ dynamicStyle += 'padding-left: ' + padding['desktop']['left'] + padding['desktop-unit'] + ';';
+ dynamicStyle += 'padding-right: ' + padding['desktop']['right'] + padding['desktop-unit'] + ';';
+ dynamicStyle += 'padding-top: ' + padding['desktop']['top'] + padding['desktop-unit'] + ';';
+ dynamicStyle += 'padding-bottom: ' + padding['desktop']['bottom'] + padding['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += '.ast-header-break-point .ast-builder-menu-'+ index +' .main-header-menu .menu-item > .menu-link {';
+ dynamicStyle += 'padding-left: ' + padding['tablet']['left'] + padding['tablet-unit'] + ';';
+ dynamicStyle += 'padding-right: ' + padding['tablet']['right'] + padding['tablet-unit'] + ';';
+ dynamicStyle += 'padding-top: ' + padding['tablet']['top'] + padding['tablet-unit'] + ';';
+ dynamicStyle += 'padding-bottom: ' + padding['tablet']['bottom'] + padding['tablet-unit'] + ';';
+ dynamicStyle += '} ';
+ // Toggle top.
+ dynamicStyle += '.ast-hfb-header .ast-builder-menu-'+ index +' .main-navigation ul .menu-item.menu-item-has-children > .ast-menu-toggle {';
+ dynamicStyle += 'top: ' + padding['tablet']['top'] + padding['tablet-unit'] + ';';
+ dynamicStyle += 'right: calc( ' + padding['tablet']['right'] + padding['tablet-unit'] + ' - 0.907em );'
+ dynamicStyle += '} ';
+
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += '.ast-header-break-point .ast-builder-menu-'+ index +' .main-header-menu .menu-item > .menu-link {';
+ dynamicStyle += 'padding-left: ' + padding['mobile']['left'] + padding['mobile-unit'] + ';';
+ dynamicStyle += 'padding-right: ' + padding['mobile']['right'] + padding['mobile-unit'] + ';';
+ dynamicStyle += 'padding-top: ' + padding['mobile']['top'] + padding['mobile-unit'] + ';';
+ dynamicStyle += 'padding-bottom: ' + padding['mobile']['bottom'] + padding['mobile-unit'] + ';';
+ dynamicStyle += '} ';
+ // Toggle top.
+ dynamicStyle += '.ast-hfb-header .ast-builder-menu-'+ index +' .main-navigation ul .menu-item.menu-item-has-children > .ast-menu-toggle {';
+ dynamicStyle += 'top: ' + padding['mobile']['top'] + padding['mobile-unit'] + ';';
+ dynamicStyle += 'right: calc( ' + padding['mobile']['right'] + padding['mobile-unit'] + ' - 0.907em );'
+ dynamicStyle += '} ';
+
+ dynamicStyle += '} ';
+
+ astra_add_dynamic_css( 'header-menu'+ index +'-menu-spacing-toggle-button', dynamicStyle );
+ } );
+ } );
+
+ // Margin - Menu 1.
+ wp.customize( 'astra-settings[section-hb-menu-'+ index +'-margin]', function( value ) {
+ value.bind( function( margin ) {
+ var selector = '.ast-builder-menu-'+ index +' .main-header-menu, .ast-header-break-point .ast-builder-menu-'+ index +' .main-header-menu';
+ var dynamicStyle = '';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['desktop']['left'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['desktop']['right'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['desktop']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['desktop']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['tablet']['left'] + margin['tablet-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['tablet']['right'] + margin['tablet-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['tablet']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['tablet']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['mobile']['left'] + margin['mobile-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['mobile']['right'] + margin['mobile-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['mobile']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['mobile']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+ astra_add_dynamic_css( 'section-hb-menu-'+ index +'-margin', dynamicStyle );
+ } );
+ } );
+
+ /**
+ * Header Menu 1 > Submenu border Color
+ */
+ wp.customize('astra-settings[header-menu'+ index +'-submenu-item-b-color]', function (value) {
+ value.bind(function (color) {
+ var insideBorder = wp.customize('astra-settings[header-menu'+ index +'-submenu-item-border]').get(),
+ borderSize = wp.customize('astra-settings[header-menu'+ index +'-submenu-item-b-size]').get();
+ if ('' != color) {
+ if ( true == insideBorder ) {
+
+ var dynamicStyle = '';
+
+ dynamicStyle += '.ast-desktop .ast-builder-menu-'+ index +' .main-header-menu .menu-item .sub-menu .menu-link';
+ dynamicStyle += '{';
+ dynamicStyle += 'border-bottom-width:' + ( ( borderSize ) ? borderSize + 'px;' : '0px;' );
+ dynamicStyle += 'border-color:' + color + ';';
+ dynamicStyle += 'border-style: solid;';
+ dynamicStyle += '}';
+ dynamicStyle += '.ast-desktop .ast-builder-menu-'+ index +' .main-header-menu .menu-item .sub-menu .menu-item:last-child .menu-link{ border-style: none; }';
+
+ astra_add_dynamic_css('header-menu'+ index +'-submenu-item-b-color', dynamicStyle);
+ }
+ } else {
+ wp.customize.preview.send('refresh');
+ }
+ });
+ });
+
+ // Sub Menu - Divider Size.
+ wp.customize( 'astra-settings[header-menu'+ index +'-submenu-item-b-size]', function( value ) {
+ value.bind( function( borderSize ) {
+ var selector = '.ast-desktop .ast-builder-menu-'+ index + ' .main-header-menu';
+ var dynamicStyle = '';
+ dynamicStyle += selector + ' .menu-item .sub-menu .menu-link {';
+ dynamicStyle += 'border-bottom-width: ' + borderSize + 'px;';
+ dynamicStyle += '} ';
+ dynamicStyle += selector + ' .menu-item .sub-menu .menu-item:last-child .menu-link {';
+ dynamicStyle += 'border-bottom-width: 0px';
+ dynamicStyle += '} ';
+ astra_add_dynamic_css( 'header-menu'+ index +'-submenu-item-b-size', dynamicStyle );
+ } );
+ } );
+
+ /**
+ * Header Menu 1 > Submenu border Color
+ */
+ wp.customize( 'astra-settings[header-menu'+ index +'-submenu-item-border]', function( value ) {
+ value.bind( function( border ) {
+ var color = wp.customize( 'astra-settings[header-menu'+ index +'-submenu-item-b-color]' ).get(),
+ borderSize = wp.customize('astra-settings[header-menu'+ index +'-submenu-item-b-size]').get();
+
+ var dynamicStyle = '.ast-desktop .ast-builder-menu-'+ index +' .main-header-menu.submenu-with-border .sub-menu .menu-link';
+
+ if( true === border ) {
+ dynamicStyle += '{';
+ dynamicStyle += 'border-bottom-width:' + ( ( borderSize ) ? borderSize + 'px;' : '0px;' );
+ dynamicStyle += 'border-color:' + color + ';';
+ dynamicStyle += 'border-style: solid;';
+ dynamicStyle += '}';
+ } else {
+ dynamicStyle += '{';
+ dynamicStyle += 'border-style: none;';
+ dynamicStyle += '}';
+ }
+
+ dynamicStyle += '.ast-desktop .ast-builder-menu-'+ index +' .menu-item .sub-menu .menu-item:last-child .menu-link{ border-style: none; }';
+ astra_add_dynamic_css( 'header-menu'+ index +'-submenu-item-border', dynamicStyle );
+
+ } );
+ } );
+
+ // Animation preview support.
+ // Adding customizer-refresh because if megamenu is enabled on menu then caluculated left & width JS value of megamenu wrapper wiped out due to partial refresh.
+ wp.customize( 'astra-settings[header-menu'+ index +'-menu-hover-animation]', function( setting ) {
+ setting.bind( function( animation ) {
+
+ var menuWrapper = jQuery( '#ast-desktop-header #ast-hf-menu-'+ index );
+ menuWrapper.removeClass('ast-menu-hover-style-underline');
+ menuWrapper.removeClass('ast-menu-hover-style-zoom');
+ menuWrapper.removeClass('ast-menu-hover-style-overline');
+
+ if ( isNavMenuEnabled ) {
+ document.dispatchEvent( new CustomEvent( "astMenuHoverStyleChanged", { "detail": {} }) );
+ }
+
+ menuWrapper.addClass( 'ast-menu-hover-style-' + animation );
+ } );
+ } );
+
+ wp.customize( 'astra-settings[header-menu'+ index +'-submenu-container-animation]', function( setting ) {
+ setting.bind( function( animation ) {
+
+ var menuWrapper = jQuery( '#ast-desktop-header #ast-hf-menu-'+ index );
+ menuWrapper.removeClass('astra-menu-animation-fade');
+ menuWrapper.removeClass('astra-menu-animation-slide-down');
+ menuWrapper.removeClass('astra-menu-animation-slide-up');
+
+ if ( '' != animation ) {
+ menuWrapper.addClass( 'astra-menu-animation-' + animation );
+ }
+ } );
+ } );
+
+ // Stack on Mobile CSS
+ wp.customize( 'astra-settings[header-menu'+ index +'-menu-stack-on-mobile]', function( setting ) {
+ setting.bind( function( stack ) {
+
+ var menu_div = jQuery( '#ast-mobile-header #ast-hf-menu-'+ index + '.main-header-menu' );
+ menu_div.removeClass('inline-on-mobile');
+ menu_div.removeClass('stack-on-mobile');
+
+ if ( false === stack ) {
+ menu_div.addClass('inline-on-mobile');
+ } else {
+ menu_div.addClass('stack-on-mobile');
+ }
+ } );
+ } );
+
+ // Sub Menu - Border Radius.
+ wp.customize( 'astra-settings[header-menu'+ index +'-submenu-border-radius]', function( value ) {
+ value.bind( function( border ) {
+
+ var dynamicStyle = '.ast-builder-menu-' + index + ' li.menu-item .sub-menu, .ast-builder-menu-' + index + ' ul.inline-on-mobile li.menu-item .sub-menu {';
+ dynamicStyle += 'border-radius: ' + border + 'px';
+ dynamicStyle += '}';
+
+ astra_add_dynamic_css( 'header-menu'+ index +'-submenu-border-radius', dynamicStyle );
+
+ } );
+ } );
+
+ // Sub Menu - Top Offset.
+ wp.customize( 'astra-settings[header-menu'+ index +'-submenu-top-offset]', function( value ) {
+ value.bind( function( offset ) {
+
+ var dynamicStyle = '.ast-desktop .ast-builder-menu-' + index + ' li.menu-item .sub-menu, .ast-desktop .ast-builder-menu-' + index + ' ul.inline-on-mobile li.menu-item .sub-menu, .ast-desktop .ast-builder-menu-' + index + ' li.menu-item .astra-full-megamenu-wrapper {';
+ dynamicStyle += 'margin-top: ' + offset + 'px';
+ dynamicStyle += '}';
+
+ dynamicStyle += '.ast-desktop .ast-builder-menu-' + index + ' .main-header-menu > .menu-item > .sub-menu:before, .ast-desktop .ast-builder-menu-' + index + ' .main-header-menu > .menu-item > .astra-full-megamenu-wrapper:before {';
+ dynamicStyle += 'height: calc( ' + offset + 'px + 5px );';
+ dynamicStyle += '}';
+
+ astra_add_dynamic_css( 'header-menu'+ index +'-submenu-top-offset', dynamicStyle );
+
+ } );
+ } );
+
+ // Sub Menu - Width.
+ wp.customize( 'astra-settings[header-menu'+ index +'-submenu-width]', function( value ) {
+ value.bind( function( width ) {
+
+ var dynamicStyle = '.ast-builder-menu-' + index + ' li.menu-item .sub-menu, .ast-builder-menu-' + index + ' ul.inline-on-mobile li.menu-item .sub-menu {';
+ dynamicStyle += 'width: ' + width + 'px';
+ dynamicStyle += '}';
+
+ astra_add_dynamic_css( 'header-menu'+ index +'-submenu-width', dynamicStyle );
+
+ } );
+ } );
+
+ })(index);
+
+
+ // Sub Menu - Border Color.
+ astra_css(
+ 'astra-settings[header-' + prefix + '-submenu-b-color]',
+ 'border-color',
+ selector + ' li.menu-item .sub-menu, ' + selector + ' .inline-on-mobile li.menu-item .sub-menu '
+ );
+ }
+
+ // Transparent header > Submenu link hover color.
+ astra_color_responsive_css( 'astra-builder-transparent-submenu', 'astra-settings[transparent-submenu-h-color-responsive]', 'color', '.ast-theme-transparent-header .main-header-menu .menu-item .sub-menu .menu-item:hover > .menu-link' );
+
+} )( jQuery );
diff --git a/inc/builder/type/header/menu/class-astra-header-menu-component-loader.php b/inc/builder/type/header/menu/class-astra-header-menu-component-loader.php new file mode 100644 index 0000000..aeb74dc --- /dev/null +++ b/inc/builder/type/header/menu/class-astra-header-menu-component-loader.php @@ -0,0 +1,89 @@ +<?php +/** + * Menu Styling Loader for Astra theme. + * + * @package astra-builder + * @author Astra + * @copyright Copyright (c) 2020, Astra + * @link https://wpastra.com/ + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Customizer Initialization + * + * @since 3.0.0 + */ +class Astra_Header_Menu_Component_Loader { + + /** + * Constructor + * + * @since 3.0.0 + */ + public function __construct() { + add_action( 'customize_preview_init', array( $this, 'preview_scripts' ), 110 ); + // Load Google fonts. + add_action( 'astra_get_fonts', array( $this, 'add_fonts' ), 1 ); + } + + /** + * Enqueue google fonts. + * + * @since 3.0.0 + */ + public function add_fonts() { + + $component_limit = defined( 'ASTRA_EXT_VER' ) ? Astra_Builder_Helper::$component_limit : Astra_Builder_Helper::$num_of_header_menu; + for ( $index = 1; $index <= $component_limit; $index++ ) { + + $_prefix = 'menu' . $index; + + $menu_font_family = astra_get_option( 'header-' . $_prefix . '-font-family' ); + $menu_font_weight = astra_get_option( 'header-' . $_prefix . '-font-weight' ); + + Astra_Fonts::add_font( $menu_font_family, $menu_font_weight ); + } + + $mobile_menu_font_family = astra_get_option( 'header-mobile-menu-font-family' ); + $mobile_menu_font_weight = astra_get_option( 'header-mobile-menu-font-weight' ); + + Astra_Fonts::add_font( $mobile_menu_font_family, $mobile_menu_font_weight ); + } + + /** + * Customizer Preview + * + * @since 3.0.0 + */ + public function preview_scripts() { + /** + * Load unminified if SCRIPT_DEBUG is true. + */ + /* Directory and Extension */ + $dir_name = ( SCRIPT_DEBUG ) ? 'unminified' : 'minified'; + $file_prefix = ( SCRIPT_DEBUG ) ? '' : '.min'; + wp_enqueue_script( 'astra-heading-menu-customizer-preview-js', ASTRA_HEADER_MENU_URI . '/assets/js/' . $dir_name . '/customizer-preview' . $file_prefix . '.js', array( 'customize-preview', 'astra-customizer-preview-js' ), ASTRA_THEME_VERSION, true ); + + // Localize variables for Menu JS. + wp_localize_script( + 'astra-heading-menu-customizer-preview-js', + 'AstraBuilderMenuData', + array( + 'component_limit' => defined( 'ASTRA_EXT_VER' ) ? Astra_Builder_Helper::$component_limit : Astra_Builder_Helper::$num_of_header_menu, + 'nav_menu_enabled' => ( defined( 'ASTRA_EXT_VER' ) && Astra_Ext_Extension::is_active( 'nav-menu' ) ) ? true : false, + 'tablet_break_point' => astra_get_tablet_breakpoint(), + 'mobile_break_point' => astra_get_mobile_breakpoint(), + ) + ); + } +} + +/** +* Kicking this off by creating the object of the class. +*/ +new Astra_Header_Menu_Component_Loader(); diff --git a/inc/builder/type/header/menu/class-astra-header-menu-component.php b/inc/builder/type/header/menu/class-astra-header-menu-component.php new file mode 100644 index 0000000..5c565b6 --- /dev/null +++ b/inc/builder/type/header/menu/class-astra-header-menu-component.php @@ -0,0 +1,153 @@ +<?php +/** + * Menu for Astra theme. + * + * @package astra-builder + * @author Astra + * @copyright Copyright (c) 2020, Astra + * @link https://wpastra.com/ + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +define( 'ASTRA_HEADER_MENU_DIR', ASTRA_THEME_DIR . 'inc/builder/type/header/menu' ); +define( 'ASTRA_HEADER_MENU_URI', ASTRA_THEME_URI . 'inc/builder/type/header/menu' ); + +/** + * Heading Initial Setup + * + * @since 3.0.0 + */ +class Astra_Header_Menu_Component { + + /** + * Constructor function that initializes required actions and hooks + */ + public function __construct() { + // @codingStandardsIgnoreStart WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + require_once ASTRA_HEADER_MENU_DIR . '/class-astra-header-menu-component-loader.php'; + + // Include front end files. + if ( ! is_admin() ) { + require_once ASTRA_HEADER_MENU_DIR . '/dynamic-css/dynamic.css.php'; + } + // @codingStandardsIgnoreEnd WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + } + + /** + * Secondary navigation markup + * + * @param int $index index. + */ + public static function menu_markup( $index ) { + + switch ( $index ) { + case 1: + $theme_location = 'primary'; + break; + case 2: + $theme_location = 'secondary_menu'; + break; + default: + $theme_location = 'menu_' . $index; + break; + } + + $_prefix = 'menu' . $index; + + $submenu_class = apply_filters( 'secondary_submenu_border_class', ' submenu-with-border' ); + $stack_on_mobile_class = 'inline-on-mobile'; + + if ( astra_get_option( 'header-' . $_prefix . '-menu-stack-on-mobile' ) ) { + $stack_on_mobile_class = 'stack-on-mobile'; + } + + // Menu Animation. + $menu_animation = astra_get_option( 'header-menu' . $index . '-submenu-container-animation' ); + if ( ! empty( $menu_animation ) ) { + $submenu_class .= ' astra-menu-animation-' . esc_attr( $menu_animation ) . ' '; + } + + // Menu hover animation. + $menu_hover_animation = astra_get_option( 'header-' . $_prefix . '-menu-hover-animation' ); + if ( '' !== $menu_hover_animation ) { + $submenu_class .= ' ast-menu-hover-style-' . esc_attr( $menu_hover_animation ) . ' '; + } + + /** + * Filter the classes(array) for Menu (<ul>). + * + * @since 3.0.0 + * @var Array + */ + $menu_classes = apply_filters( 'astra_' . $theme_location . '_menu_classes', array( 'main-header-menu', 'ast-nav-menu', 'ast-flex', $submenu_class, $stack_on_mobile_class ) ); + + $items_wrap = '<nav '; + $items_wrap .= astra_attr( + 'site-navigation', + array( + 'id' => 'site-navigation', + 'class' => 'ast-flex-grow-1 navigation-accessibility site-header-focus-item', + 'aria-label' => esc_attr__( 'Site Navigation', 'astra' ), + ) + ); + $items_wrap .= '>'; + $items_wrap .= '<div class="main-navigation ast-inline-flex">'; + $items_wrap .= '<ul id="%1$s" class="%2$s">%3$s</ul>'; + $items_wrap .= '</div>'; + $items_wrap .= '</nav>'; + + // Fallback Menu if primary menu not set. + $fallback_menu_args = array( + 'theme_location' => $theme_location, + 'menu_id' => 'ast-hf-menu-' . $index, + 'menu_class' => 'main-navigation ast-inline-flex', + 'container' => 'div', + 'before' => '<ul class="' . esc_attr( implode( ' ', $menu_classes ) ) . '">', + 'after' => '</ul>', + 'walker' => new Astra_Walker_Page(), + ); + + // To add default alignment for navigation which can be added through any third party plugin. + // Do not add any CSS from theme except header alignment. + echo '<div ' . astra_attr( 'ast-main-header-bar-alignment' ) . '>'; + + if ( is_customize_preview() ) { + Astra_Builder_UI_Controller::render_customizer_edit_button(); + } + if ( has_nav_menu( $theme_location ) ) { + wp_nav_menu( + array( + 'menu_id' => 'ast-hf-menu-' . $index, + 'menu_class' => esc_attr( implode( ' ', $menu_classes ) ), + 'container' => 'div', + 'container_class' => 'main-header-bar-navigation', + 'items_wrap' => $items_wrap, + 'theme_location' => $theme_location, + ) + ); + } else { + echo '<div class="main-header-bar-navigation ast-flex-1">'; + echo '<nav '; + echo astra_attr( + 'site-navigation', + array( + 'id' => 'site-navigation', + ) + ); + echo ' class="ast-flex-grow-1 navigation-accessibility" aria-label="' . esc_attr__( 'Site Navigation', 'astra' ) . '">'; + wp_page_menu( $fallback_menu_args ); + echo '</nav>'; + echo '</div>'; + } + echo '</div>'; + } +} + +/** + * Kicking this off by creating an object. + */ +new Astra_Header_Menu_Component(); diff --git a/inc/builder/type/header/menu/dynamic-css/dynamic.css.php b/inc/builder/type/header/menu/dynamic-css/dynamic.css.php new file mode 100644 index 0000000..074abb7 --- /dev/null +++ b/inc/builder/type/header/menu/dynamic-css/dynamic.css.php @@ -0,0 +1,370 @@ +<?php +/** + * Heading Colors - Dynamic CSS + * + * @package astra-builder + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Heading Colors + */ +add_filter( 'astra_dynamic_theme_css', 'astra_hb_menu_dynamic_css' ); + +/** + * Dynamic CSS + * + * @param string $dynamic_css Astra Dynamic CSS. + * @param string $dynamic_css_filtered Astra Dynamic CSS Filters. + * @return String Generated dynamic CSS for Heading Colors. + * + * @since 3.0.0 + */ +function astra_hb_menu_dynamic_css( $dynamic_css, $dynamic_css_filtered = '' ) { + + for ( $index = 1; $index <= Astra_Builder_Helper::$num_of_header_menu; $index++ ) { + + if ( ! Astra_Builder_Helper::is_component_loaded( 'menu-' . $index, 'header' ) ) { + continue; + } + + $_prefix = 'menu' . $index; + $_section = 'section-hb-menu-' . $index; + + $selector = '.ast-builder-menu-' . $index; + + // Theme color. + $theme_color = astra_get_option( 'theme-color' ); + + // Sub Menu. + $sub_menu_border = astra_get_option( 'header-' . $_prefix . '-submenu-border' ); + $sub_menu_divider_toggle = astra_get_option( 'header-' . $_prefix . '-submenu-item-border' ); + $sub_menu_divider_size = astra_get_option( 'header-' . $_prefix . '-submenu-item-b-size' ); + $sub_menu_divider_color = astra_get_option( 'header-' . $_prefix . '-submenu-item-b-color' ); + $sub_menu_border_radius = astra_get_option( 'header-' . $_prefix . '-submenu-border-radius' ); + $sub_menu_top_offset = astra_get_option( 'header-' . $_prefix . '-submenu-top-offset' ); + $sub_menu_width = astra_get_option( 'header-' . $_prefix . '-submenu-width' ); + + // Menu. + $menu_resp_color = astra_get_option( 'header-' . $_prefix . '-color-responsive' ); + $menu_resp_bg_color = astra_get_option( 'header-' . $_prefix . '-bg-obj-responsive' ); + $menu_resp_color_hover = astra_get_option( 'header-' . $_prefix . '-h-color-responsive' ); + $menu_resp_bg_color_hover = astra_get_option( 'header-' . $_prefix . '-h-bg-color-responsive' ); + $menu_resp_color_active = astra_get_option( 'header-' . $_prefix . '-a-color-responsive' ); + $menu_resp_bg_color_active = astra_get_option( 'header-' . $_prefix . '-a-bg-color-responsive' ); + + $menu_resp_color_desktop = ( isset( $menu_resp_color['desktop'] ) ) ? $menu_resp_color['desktop'] : ''; + $menu_resp_color_tablet = ( isset( $menu_resp_color['tablet'] ) ) ? $menu_resp_color['tablet'] : ''; + $menu_resp_color_mobile = ( isset( $menu_resp_color['mobile'] ) ) ? $menu_resp_color['mobile'] : ''; + + $menu_resp_color_hover_desktop = ( isset( $menu_resp_color_hover['desktop'] ) ) ? $menu_resp_color_hover['desktop'] : ''; + $menu_resp_color_hover_tablet = ( isset( $menu_resp_color_hover['tablet'] ) ) ? $menu_resp_color_hover['tablet'] : ''; + $menu_resp_color_hover_mobile = ( isset( $menu_resp_color_hover['mobile'] ) ) ? $menu_resp_color_hover['mobile'] : ''; + + $menu_resp_bg_color_hover_desktop = ( isset( $menu_resp_bg_color_hover['desktop'] ) ) ? $menu_resp_bg_color_hover['desktop'] : ''; + $menu_resp_bg_color_hover_tablet = ( isset( $menu_resp_bg_color_hover['tablet'] ) ) ? $menu_resp_bg_color_hover['tablet'] : ''; + $menu_resp_bg_color_hover_mobile = ( isset( $menu_resp_bg_color_hover['mobile'] ) ) ? $menu_resp_bg_color_hover['mobile'] : ''; + + $menu_resp_color_active_desktop = ( isset( $menu_resp_color_active['desktop'] ) ) ? $menu_resp_color_active['desktop'] : ''; + $menu_resp_color_active_tablet = ( isset( $menu_resp_color_active['tablet'] ) ) ? $menu_resp_color_active['tablet'] : ''; + $menu_resp_color_active_mobile = ( isset( $menu_resp_color_active['mobile'] ) ) ? $menu_resp_color_active['mobile'] : ''; + + $menu_resp_bg_color_active_desktop = ( isset( $menu_resp_bg_color_active['desktop'] ) ) ? $menu_resp_bg_color_active['desktop'] : ''; + $menu_resp_bg_color_active_tablet = ( isset( $menu_resp_bg_color_active['tablet'] ) ) ? $menu_resp_bg_color_active['tablet'] : ''; + $menu_resp_bg_color_active_mobile = ( isset( $menu_resp_bg_color_active['mobile'] ) ) ? $menu_resp_bg_color_active['mobile'] : ''; + + // Typography. + $menu_font_family = astra_get_option( 'header-' . $_prefix . '-font-family' ); + $menu_font_size = astra_get_option( 'header-' . $_prefix . '-font-size' ); + $menu_font_weight = astra_get_option( 'header-' . $_prefix . '-font-weight' ); + $menu_text_transform = astra_get_option( 'header-' . $_prefix . '-text-transform' ); + $menu_line_height = astra_get_option( 'header-' . $_prefix . '-line-height' ); + + $menu_font_size_desktop = ( isset( $menu_font_size['desktop'] ) ) ? $menu_font_size['desktop'] : ''; + $menu_font_size_tablet = ( isset( $menu_font_size['tablet'] ) ) ? $menu_font_size['tablet'] : ''; + $menu_font_size_mobile = ( isset( $menu_font_size['mobile'] ) ) ? $menu_font_size['mobile'] : ''; + $menu_font_size_desktop_unit = ( isset( $menu_font_size['desktop-unit'] ) ) ? $menu_font_size['desktop-unit'] : ''; + $menu_font_size_tablet_unit = ( isset( $menu_font_size['tablet-unit'] ) ) ? $menu_font_size['tablet-unit'] : ''; + $menu_font_size_mobile_unit = ( isset( $menu_font_size['mobile-unit'] ) ) ? $menu_font_size['mobile-unit'] : ''; + + + // Spacing. + $menu_spacing = astra_get_option( 'header-' . $_prefix . '-menu-spacing' ); + + $sub_menu_border_top = ( isset( $sub_menu_border ) && ! empty( $sub_menu_border['top'] ) ) ? $sub_menu_border['top'] : 0; + + $sub_menu_border_bottom = ( isset( $sub_menu_border ) && ! empty( $sub_menu_border['bottom'] ) ) ? $sub_menu_border['bottom'] : 0; + + $sub_menu_border_right = ( isset( $sub_menu_border ) && ! empty( $sub_menu_border['right'] ) ) ? $sub_menu_border['right'] : 0; + + $sub_menu_border_left = ( isset( $sub_menu_border ) && ! empty( $sub_menu_border['left'] ) ) ? $sub_menu_border['left'] : 0; + + // Border-Radius. + $sub_menu_border_radius = ! empty( $sub_menu_border_radius ) ? $sub_menu_border_radius : 0; + + // Top offset position. + $sub_menu_top_offset = ! empty( $sub_menu_top_offset ) ? $sub_menu_top_offset : 0; + + // Submenu container width. + $sub_menu_width = ! empty( $sub_menu_width ) ? $sub_menu_width : ''; + + // Margin. + $margin = astra_get_option( $_section . '-margin' ); + $margin_selector = '.ast-builder-menu-' . $index . ' .main-header-menu, .ast-header-break-point .ast-builder-menu-' . $index . ' .main-header-menu'; + + $css_output_desktop = array( + + // Menu. + $selector => array( + 'font-family' => astra_get_font_family( $menu_font_family ), + 'font-weight' => esc_attr( $menu_font_weight ), + 'text-transform' => esc_attr( $menu_text_transform ), + ), + $selector . ' .menu-item > .menu-link' => array( + 'line-height' => esc_attr( $menu_line_height ), + 'font-size' => astra_get_font_css_value( $menu_font_size_desktop, $menu_font_size_desktop_unit ), + 'color' => $menu_resp_color_desktop, + 'padding-top' => astra_responsive_spacing( $menu_spacing, 'top', 'desktop' ), + 'padding-bottom' => astra_responsive_spacing( $menu_spacing, 'bottom', 'desktop' ), + 'padding-left' => astra_responsive_spacing( $menu_spacing, 'left', 'desktop' ), + 'padding-right' => astra_responsive_spacing( $menu_spacing, 'right', 'desktop' ), + ), + $selector . ' .menu-item > .ast-menu-toggle' => array( + 'color' => $menu_resp_color_desktop, + ), + $selector . ' .menu-item:hover > .menu-link, ' . $selector . ' .inline-on-mobile .menu-item:hover > .ast-menu-toggle' => array( + 'color' => $menu_resp_color_hover_desktop, + 'background' => $menu_resp_bg_color_hover_desktop, + ), + $selector . ' .menu-item:hover > .ast-menu-toggle' => array( + 'color' => $menu_resp_color_hover_desktop, + ), + $selector . ' .menu-item.current-menu-item > .menu-link, ' . $selector . ' .inline-on-mobile .menu-item.current-menu-item > .ast-menu-toggle, ' . $selector . ' .current-menu-ancestor > .menu-link' => array( + 'color' => $menu_resp_color_active_desktop, + 'background' => $menu_resp_bg_color_active_desktop, + ), + $selector . ' .menu-item.current-menu-item > .ast-menu-toggle' => array( + 'color' => $menu_resp_color_active_desktop, + ), + // Sub Menu. + $selector . ' .sub-menu, ' . $selector . ' .inline-on-mobile .sub-menu' => array( + 'border-top-width' => astra_get_css_value( $sub_menu_border_top, 'px' ), + 'border-bottom-width' => astra_get_css_value( $sub_menu_border_bottom, 'px' ), + 'border-right-width' => astra_get_css_value( $sub_menu_border_right, 'px' ), + 'border-left-width' => astra_get_css_value( $sub_menu_border_left, 'px' ), + 'border-color' => esc_attr( astra_get_option( 'header-' . $_prefix . '-submenu-b-color', $theme_color ) ), + 'border-style' => 'solid', + 'width' => astra_get_css_value( $sub_menu_width, 'px' ), + 'border-radius' => astra_get_css_value( $sub_menu_border_radius, 'px' ), + ), + $selector . ' .main-header-menu > .menu-item > .sub-menu, ' . $selector . ' .main-header-menu > .menu-item > .astra-full-megamenu-wrapper' => array( + 'margin-top' => astra_get_css_value( $sub_menu_top_offset, 'px' ), + ), + '.ast-desktop ' . $selector . ' .main-header-menu > .menu-item > .sub-menu:before, .ast-desktop ' . $selector . ' .main-header-menu > .menu-item > .astra-full-megamenu-wrapper:before' => array( + 'height' => astra_calculate_spacing( $sub_menu_top_offset . 'px', '+', '5', 'px' ), + ), + $selector . ' .menu-item.menu-item-has-children > .ast-menu-toggle' => array( + 'top' => astra_responsive_spacing( $menu_spacing, 'top', 'desktop' ), + 'right' => astra_calculate_spacing( astra_responsive_spacing( $menu_spacing, 'right', 'desktop' ), '-', '0.907', 'em' ), + ), + // Margin CSS. + $margin_selector => array( + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'desktop' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'desktop' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'desktop' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'desktop' ), + ), + ); + + $css_output_desktop[ $selector . ' .main-header-menu, ' . $selector . ' .main-header-menu .sub-menu' ] = astra_get_responsive_background_obj( $menu_resp_bg_color, 'desktop' ); + + $mobile_selector = '.ast-header-break-point .ast-builder-menu-' . $index; + + $menu_spacing_mobile_top = astra_responsive_spacing( $menu_spacing, 'top', 'mobile' ); + $menu_spacing_mobile_top = ( isset( $menu_spacing_mobile_top ) && ! empty( $menu_spacing_mobile_top ) ) ? $menu_spacing_mobile_top : 0; + + $menu_spacing_tablet_top = astra_responsive_spacing( $menu_spacing, 'top', 'tablet' ); + $menu_spacing_tablet_top = ( isset( $menu_spacing_tablet_top ) && ! empty( $menu_spacing_tablet_top ) ) ? $menu_spacing_tablet_top : 0; + + $css_output_tablet = array( + + $mobile_selector => array( + 'font-size' => astra_get_font_css_value( $menu_font_size_tablet, $menu_font_size_tablet_unit ), + ), + $mobile_selector . ' .main-header-menu .menu-item > .menu-link' => array( + 'padding-top' => astra_responsive_spacing( $menu_spacing, 'top', 'tablet' ), + 'padding-bottom' => astra_responsive_spacing( $menu_spacing, 'bottom', 'tablet' ), + 'padding-left' => astra_responsive_spacing( $menu_spacing, 'left', 'tablet' ), + 'padding-right' => astra_responsive_spacing( $menu_spacing, 'right', 'tablet' ), + ), + $selector . ' .main-header-menu .menu-item > .menu-link' => array( + 'color' => $menu_resp_color_tablet, + ), + $selector . ' .menu-item > .ast-menu-toggle' => array( + 'color' => $menu_resp_color_tablet, + ), + $selector . ' .menu-item:hover > .menu-link, ' . $selector . ' .inline-on-mobile .menu-item:hover > .ast-menu-toggle' => array( + 'color' => $menu_resp_color_hover_tablet, + 'background' => $menu_resp_bg_color_hover_tablet, + ), + $selector . ' .menu-item:hover > .ast-menu-toggle' => array( + 'color' => $menu_resp_color_hover_tablet, + ), + $selector . ' .menu-item.current-menu-item > .menu-link, ' . $selector . ' .inline-on-mobile .menu-item.current-menu-item > .ast-menu-toggle, ' . $selector . ' .current-menu-ancestor > .menu-link, ' . $selector . ' .current-menu-ancestor > .ast-menu-toggle' => array( + 'color' => $menu_resp_color_active_tablet, + 'background' => $menu_resp_bg_color_active_tablet, + ), + $selector . ' .menu-item.current-menu-item > .ast-menu-toggle' => array( + 'color' => $menu_resp_color_active_tablet, + ), + $mobile_selector . ' .menu-item.menu-item-has-children > .ast-menu-toggle' => array( + 'top' => $menu_spacing_tablet_top, + 'right' => astra_calculate_spacing( astra_responsive_spacing( $menu_spacing, 'right', 'tablet' ), '-', '0.907', 'em' ), + ), + $selector . ' .menu-item-has-children > .menu-link:after' => array( + 'content' => 'unset', + ), + // Margin CSS. + $margin_selector => array( + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'tablet' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'tablet' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'tablet' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'tablet' ), + ), + ); + + $css_output_tablet[ $selector . ' .main-header-menu, ' . $selector . ' .main-header-menu .sub-menu' ] = astra_get_responsive_background_obj( $menu_resp_bg_color, 'tablet' ); + + $css_output_mobile = array( + + $mobile_selector => array( + 'font-size' => astra_get_font_css_value( $menu_font_size_mobile, $menu_font_size_mobile_unit ), + ), + $mobile_selector . ' .main-header-menu .menu-item > .menu-link' => array( + 'padding-top' => astra_responsive_spacing( $menu_spacing, 'top', 'mobile' ), + 'padding-bottom' => astra_responsive_spacing( $menu_spacing, 'bottom', 'mobile' ), + 'padding-left' => astra_responsive_spacing( $menu_spacing, 'left', 'mobile' ), + 'padding-right' => astra_responsive_spacing( $menu_spacing, 'right', 'mobile' ), + ), + $selector . ' .main-header-menu .menu-item > .menu-link' => array( + 'color' => $menu_resp_color_mobile, + ), + $selector . ' .menu-item > .ast-menu-toggle' => array( + 'color' => $menu_resp_color_mobile, + ), + $selector . ' .menu-item:hover > .menu-link, ' . $selector . ' .inline-on-mobile .menu-item:hover > .ast-menu-toggle' => array( + 'color' => $menu_resp_color_hover_mobile, + 'background' => $menu_resp_bg_color_hover_mobile, + ), + $selector . ' .menu-item:hover > .ast-menu-toggle' => array( + 'color' => $menu_resp_color_hover_mobile, + ), + $selector . ' .menu-item.current-menu-item > .menu-link, ' . $selector . ' .inline-on-mobile .menu-item.current-menu-item > .ast-menu-toggle, ' . $selector . ' .current-menu-ancestor > .menu-link, ' . $selector . ' .current-menu-ancestor > .ast-menu-toggle' => array( + 'color' => $menu_resp_color_active_mobile, + 'background' => $menu_resp_bg_color_active_mobile, + ), + $selector . ' .menu-item.current-menu-item > .ast-menu-toggle' => array( + 'color' => $menu_resp_color_active_mobile, + ), + $mobile_selector . ' .menu-item.menu-item-has-children > .ast-menu-toggle' => array( + 'top' => $menu_spacing_mobile_top, + 'right' => astra_calculate_spacing( astra_responsive_spacing( $menu_spacing, 'right', 'mobile' ), '-', '0.907', 'em' ), + ), + // Margin CSS. + $margin_selector => array( + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'mobile' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'mobile' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'mobile' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'mobile' ), + ), + ); + + $css_output_mobile[ $selector . ' .main-header-menu, ' . $selector . ' .main-header-menu .sub-menu' ] = astra_get_responsive_background_obj( $menu_resp_bg_color, 'mobile' ); + + if ( true === $sub_menu_divider_toggle ) { + // Sub Menu Divider. + $css_output_desktop[ '.ast-desktop ' . $selector . ' .menu-item .sub-menu .menu-link' ] = array( + 'border-bottom-width' => $sub_menu_divider_size . 'px', + 'border-color' => $sub_menu_divider_color, + 'border-style' => 'solid', + ); + $css_output_desktop[ '.ast-desktop ' . $selector . ' .menu-item .sub-menu .menu-item:last-child .menu-link' ] = array( + 'border-bottom-width' => 0, + ); + } else { + + $css_output_desktop[ '.ast-desktop .ast-builder-menu-' . $index . ' .menu-item .sub-menu .menu-link' ] = array( + 'border-style' => 'none', + ); + } + + /* Parse CSS from array() */ + $css_output = astra_parse_css( $css_output_desktop ); + $css_output .= astra_parse_css( $css_output_tablet, '', astra_get_tablet_breakpoint() ); + $css_output .= astra_parse_css( $css_output_mobile, '', astra_get_mobile_breakpoint() ); + + $dynamic_css .= $css_output; + + $dynamic_css .= Astra_Builder_Base_Dynamic_CSS::prepare_visibility_css( $_section, $selector ); + + } + + $dynamic_css .= astra_menu_hover_style_css(); + return $dynamic_css; +} + +/** + * Load Menu hover style static CSS if any one of the menu hover style is selected. + * + * @return string + * @since 3.5.0 + */ +function astra_menu_hover_style_css() { + $hover_style_flg = false; + $menu_hover_css = ''; + for ( $index = 1; $index <= Astra_Builder_Helper::$num_of_header_menu; $index++ ) { + if ( '' !== astra_get_option( 'header-menu' . $index . '-menu-hover-animation' ) ) { + $hover_style_flg = true; + } + } + + if ( true === $hover_style_flg ) { + $menu_hover_css = ' + .ast-desktop .ast-menu-hover-style-underline > .menu-item > .menu-link:before, + .ast-desktop .ast-menu-hover-style-overline > .menu-item > .menu-link:before { + content: ""; + position: absolute; + width: 100%; + right: 50%; + height: 1px; + background-color: transparent; + transform: scale(0, 0) translate(-50%, 0); + transition: transform .3s ease-in-out, color .0s ease-in-out; + } + + .ast-desktop .ast-menu-hover-style-underline > .menu-item:hover > .menu-link:before, + .ast-desktop .ast-menu-hover-style-overline > .menu-item:hover > .menu-link:before { + width: calc(100% - 1.2em); + background-color: currentColor; + transform: scale(1, 1) translate(50%, 0); + } + + .ast-desktop .ast-menu-hover-style-underline > .menu-item > .menu-link:before { + bottom: 0; + } + + .ast-desktop .ast-menu-hover-style-overline > .menu-item > .menu-link:before { + top: 0; + } + + .ast-desktop .ast-menu-hover-style-zoom > .menu-item > .menu-link:hover { + transition: all .3s ease; + transform: scale(1.2); + }'; + } + return Astra_Enqueue_Scripts::trim_css( $menu_hover_css ); +} diff --git a/inc/builder/type/header/mobile-menu/assets/js/minified/customizer-preview.min.js b/inc/builder/type/header/mobile-menu/assets/js/minified/customizer-preview.min.js new file mode 100644 index 0000000..5697634 --- /dev/null +++ b/inc/builder/type/header/mobile-menu/assets/js/minified/customizer-preview.min.js @@ -0,0 +1 @@ +!function(){var n=AstraBuilderMenuData.tablet_break_point||768,a=AstraBuilderMenuData.mobile_break_point||544,e=".ast-builder-menu-mobile .main-navigation";astra_builder_visibility_css("section-header-mobile-menu",e,"block"),astra_generate_outside_font_family_css("astra-settings[header-mobile-menu-font-family]",e+" .menu-item > .menu-link"),astra_generate_font_weight_css("astra-settings[header-mobile-menu-font-family]","astra-settings[header-mobile-menu-font-weight]","font-weight",e+" .menu-item > .menu-link"),astra_css("astra-settings[header-mobile-menu-text-transform]","text-transform",e+" .menu-item > .menu-link"),astra_responsive_font_size("astra-settings[header-mobile-menu-font-size]",e+" .menu-item > .menu-link"),astra_css("astra-settings[header-mobile-menu-line-height]","line-height",e+" .menu-item > .menu-link, "+e+" .menu-item > .ast-menu-toggle"),astra_css("astra-settings[header-mobile-menu-letter-spacing]","letter-spacing",e+" .menu-item > .menu-link","px"),astra_color_responsive_css("astra-menu-color-preview","astra-settings[header-mobile-menu-color-responsive]","color",e+" .main-header-menu .menu-item > .menu-link"),astra_color_responsive_css("astra-menu-h-color-preview","astra-settings[header-mobile-menu-h-color-responsive]","color",e+" .menu-item:hover > .menu-link, "+e+" .inline-on-mobile .menu-item:hover > .ast-menu-toggle"),astra_color_responsive_css("astra-builder-toggle","astra-settings[header-mobile-menu-color-responsive]","color",e+" .menu-item > .ast-menu-toggle"),astra_color_responsive_css("astra-menu-h-toogle-color-preview","astra-settings[header-mobile-menu-h-color-responsive]","color",e+" .menu-item:hover > .ast-menu-toggle"),astra_color_responsive_css("astra-menu-active-color-preview","astra-settings[header-mobile-menu-a-color-responsive]","color",e+" .menu-item.current-menu-item > .menu-link, "+e+" .inline-on-mobile .menu-item.current-menu-item > .ast-menu-toggle"),astra_apply_responsive_background_css("astra-settings[header-mobile-menu-bg-obj-responsive]",e+" .main-header-menu, "+e+" .main-header-menu .sub-menu","desktop"),astra_apply_responsive_background_css("astra-settings[header-mobile-menu-bg-obj-responsive]",e+" .main-header-menu, "+e+" .main-header-menu .sub-menu","tablet"),astra_apply_responsive_background_css("astra-settings[header-mobile-menu-bg-obj-responsive]",e+" .main-header-menu, "+e+" .main-header-menu .sub-menu","mobile"),astra_color_responsive_css("astra-menu-bg-preview","astra-settings[header-mobile-menu-h-bg-color-responsive]","background",e+" .menu-item:hover > .menu-link, "+e+" .inline-on-mobile .menu-item:hover > .ast-menu-toggle"),astra_color_responsive_css("astra-builder","astra-settings[header-mobile-menu-a-bg-color-responsive]","background",e+" .menu-item.current-menu-item > .menu-link, "+e+" .inline-on-mobile .menu-item.current-menu-item > .ast-menu-toggle"),wp.customize("astra-settings[header-mobile-menu-submenu-item-b-size]",function(e){e.bind(function(e){var t=".ast-hfb-header .ast-builder-menu-mobile .main-navigation",i="";i+=t+" .main-header-menu {",i+="border-top-width: "+e+"px;",i+="} ",i+=t+" .menu-item .sub-menu .menu-link, "+t+" .menu-item .menu-link {",i+="border-bottom-width: "+e+"px;",i+="} ",astra_add_dynamic_css("header-mobile-menu-submenu-item-b-size",i)})}),wp.customize("astra-settings[header-mobile-menu-submenu-border]",function(e){e.bind(function(e){var t=".ast-builder-menu-mobile .sub-menu {";t+="border-top-width:"+e.top+"px;",t+="border-right-width:"+e.right+"px;",t+="border-left-width:"+e.left+"px;",t+="border-style: solid;",t+="border-bottom-width:"+e.bottom+"px;",t+="}",astra_add_dynamic_css("header-mobile-menu-submenu-border",t)})}),wp.customize("astra-settings[header-mobile-menu-menu-spacing]",function(e){e.bind(function(e){var t="";t+=".ast-hfb-header .ast-builder-menu-mobile .main-header-menu .menu-item > .menu-link {",t+="padding-left: "+e.desktop.left+e["desktop-unit"]+";",t+="padding-right: "+e.desktop.right+e["desktop-unit"]+";",t+="padding-top: "+e.desktop.top+e["desktop-unit"]+";",t+="padding-bottom: "+e.desktop.bottom+e["desktop-unit"]+";",t+="} ",t+=".ast-hfb-header .ast-builder-menu-mobile .main-navigation ul .menu-item.menu-item-has-children > .ast-menu-toggle {",t+="top: "+e.desktop.top+e["desktop-unit"]+";",t+="right: calc( "+e.desktop.right+e["desktop-unit"]+" - 0.907em );",t+="} ",t+="@media (max-width: "+n+"px) {",t+=".ast-header-break-point .ast-builder-menu-mobile .main-header-menu .menu-item > .menu-link {",t+="padding-left: "+e.tablet.left+e["tablet-unit"]+";",t+="padding-right: "+e.tablet.right+e["tablet-unit"]+";",t+="padding-top: "+e.tablet.top+e["tablet-unit"]+";",t+="padding-bottom: "+e.tablet.bottom+e["tablet-unit"]+";",t+="} ",t+=".ast-hfb-header .ast-builder-menu-mobile .main-navigation ul .menu-item.menu-item-has-children > .ast-menu-toggle {",t+="top: "+e.tablet.top+e["tablet-unit"]+";",t+="right: calc( "+e.tablet.right+e["tablet-unit"]+" - 0.907em );",t+="} ",t+="} ",t+="@media (max-width: "+a+"px) {",t+=".ast-header-break-point .ast-builder-menu-mobile .main-header-menu .menu-item > .menu-link {",t+="padding-left: "+e.mobile.left+e["mobile-unit"]+";",t+="padding-right: "+e.mobile.right+e["mobile-unit"]+";",t+="padding-top: "+e.mobile.top+e["mobile-unit"]+";",t+="padding-bottom: "+e.mobile.bottom+e["mobile-unit"]+";",t+="} ",t+=".ast-hfb-header .ast-builder-menu-mobile .main-navigation ul .menu-item.menu-item-has-children > .ast-menu-toggle {",t+="top: "+e.mobile.top+e["mobile-unit"]+";",t+="right: calc( "+e.mobile.right+e["mobile-unit"]+" - 0.907em );",t+="} ",t+="} ",astra_add_dynamic_css("header-mobile-menu-menu-spacing-toggle-button",t)})}),wp.customize("astra-settings[section-header-mobile-menu-margin]",function(e){e.bind(function(e){var t=".ast-builder-menu-mobile .main-header-menu, .ast-header-break-point .ast-builder-menu-mobile .main-header-menu",i="";i+=t+" {",i+="margin-left: "+e.desktop.left+e["desktop-unit"]+";",i+="margin-right: "+e.desktop.right+e["desktop-unit"]+";",i+="margin-top: "+e.desktop.top+e["desktop-unit"]+";",i+="margin-bottom: "+e.desktop.bottom+e["desktop-unit"]+";",i+="} ",i+="@media (max-width: "+n+"px) {",i+=t+" {",i+="margin-left: "+e.tablet.left+e["tablet-unit"]+";",i+="margin-right: "+e.tablet.right+e["tablet-unit"]+";",i+="margin-top: "+e.tablet.top+e["desktop-unit"]+";",i+="margin-bottom: "+e.tablet.bottom+e["desktop-unit"]+";",i+="} ",i+="} ",i+="@media (max-width: "+a+"px) {",i+=t+" {",i+="margin-left: "+e.mobile.left+e["mobile-unit"]+";",i+="margin-right: "+e.mobile.right+e["mobile-unit"]+";",i+="margin-top: "+e.mobile.top+e["desktop-unit"]+";",i+="margin-bottom: "+e.mobile.bottom+e["desktop-unit"]+";",i+="} ",i+="} ",astra_add_dynamic_css("section-header-mobile-menu-margin",i)})}),wp.customize("astra-settings[header-mobile-menu-submenu-item-b-color]",function(e){e.bind(function(e){var t,i=wp.customize("astra-settings[header-mobile-menu-submenu-item-border]").get(),n=wp.customize("astra-settings[header-mobile-menu-submenu-item-b-size]").get();""!=e&&1==i?(t="",t+=".ast-hfb-header .ast-builder-menu-mobile .main-navigation .menu-item .sub-menu .menu-link, .ast-hfb-header .ast-builder-menu-mobile .main-navigation .menu-item .menu-link",t+="{",t+="border-bottom-width:"+(!0===i?n+"px;":"0px;"),t+="border-color:"+e+";",t+="border-style: solid;",t+="}",t+=".ast-hfb-header .ast-builder-menu-mobile .main-navigation .main-header-menu",t+="{",t+="border-top-width:"+(!0===i?n+"px;":"0px;"),t+="border-color:"+e+";",t+="}",astra_add_dynamic_css("header-mobile-menu-submenu-item-b-color",t)):wp.customize.preview.send("refresh")})}),wp.customize("astra-settings[header-mobile-menu-submenu-item-border]",function(e){e.bind(function(e){var t,i=wp.customize("astra-settings[header-mobile-menu-submenu-item-b-color]").get(),n=wp.customize("astra-settings[header-mobile-menu-submenu-item-b-size]").get();!0===e?(t=".ast-builder-menu-mobile .main-navigation .main-header-menu .menu-item .sub-menu .menu-link, .ast-builder-menu-mobile .main-navigation .main-header-menu .menu-item .menu-link",t+="{",t+="border-bottom-width:"+(!0===e?n+"px;":"0px;"),t+="border-color:"+i+";",t+="border-style: solid;",t+="}",t+=".ast-builder-menu-mobile .main-navigation .main-header-menu",t+="{",t+="border-top-width:"+(!0===e?n+"px;":"0px;"),t+="border-style: solid;",t+="border-color:"+i+";",t+="}",astra_add_dynamic_css("header-mobile-menu-submenu-item-border",t)):wp.customize.preview.send("refresh")})}),astra_css("astra-settings[header-mobile-menu-submenu-b-color]","border-color",e+" li.menu-item .sub-menu, "+e+" .main-header-menu"),astra_color_responsive_css("astra-builder-transparent-submenu","astra-settings[transparent-submenu-h-color-responsive]","color",".ast-theme-transparent-header .main-header-menu .menu-item .sub-menu .menu-item:hover > .menu-link")}(jQuery);
\ No newline at end of file diff --git a/inc/builder/type/header/mobile-menu/assets/js/unminified/customizer-preview.js b/inc/builder/type/header/mobile-menu/assets/js/unminified/customizer-preview.js new file mode 100644 index 0000000..e809116 --- /dev/null +++ b/inc/builder/type/header/mobile-menu/assets/js/unminified/customizer-preview.js @@ -0,0 +1,324 @@ +/**
+ * This file adds some LIVE to the Customizer live preview. To leverage
+ * this, set your custom settings to 'postMessage' and then add your handling
+ * here. Your javascript should grab settings from customizer controls, and
+ * then make any necessary changes to the page using jQuery.
+ *
+ * @package Astra
+ * @since 3.0.0
+ */
+
+( function( $ ) {
+
+ var tablet_break_point = AstraBuilderMenuData.tablet_break_point || 768,
+ mobile_break_point = AstraBuilderMenuData.mobile_break_point || 544;
+
+ var selector = '.ast-builder-menu-mobile .main-navigation';
+ var section = 'section-header-mobile-menu';
+
+ // Advanced Visibility CSS Generation.
+ astra_builder_visibility_css( section, selector, 'block' );
+
+ /**
+ * Typography CSS.
+ */
+
+ // Menu Typography.
+ astra_generate_outside_font_family_css(
+ 'astra-settings[header-mobile-menu-font-family]',
+ selector + ' .menu-item > .menu-link'
+ );
+ astra_generate_font_weight_css(
+ 'astra-settings[header-mobile-menu-font-family]',
+ 'astra-settings[header-mobile-menu-font-weight]',
+ 'font-weight',
+ selector + ' .menu-item > .menu-link'
+ );
+ astra_css(
+ 'astra-settings[header-mobile-menu-text-transform]',
+ 'text-transform',
+ selector + ' .menu-item > .menu-link'
+ );
+ astra_responsive_font_size(
+ 'astra-settings[header-mobile-menu-font-size]',
+ selector + ' .menu-item > .menu-link'
+ );
+ astra_css(
+ 'astra-settings[header-mobile-menu-line-height]',
+ 'line-height',
+ selector + ' .menu-item > .menu-link, ' + selector + ' .menu-item > .ast-menu-toggle'
+ );
+ astra_css(
+ 'astra-settings[header-mobile-menu-letter-spacing]',
+ 'letter-spacing',
+ selector + ' .menu-item > .menu-link',
+ 'px'
+ );
+
+ /**
+ * Color CSS.
+ */
+
+ /**
+ * Menu - Colors
+ */
+
+ // Menu - Normal Color
+ astra_color_responsive_css(
+ 'astra-menu-color-preview',
+ 'astra-settings[header-mobile-menu-color-responsive]',
+ 'color',
+ selector + ' .main-header-menu .menu-item > .menu-link'
+ );
+
+ // Menu - Hover Color
+ astra_color_responsive_css(
+ 'astra-menu-h-color-preview',
+ 'astra-settings[header-mobile-menu-h-color-responsive]',
+ 'color',
+ selector + ' .menu-item:hover > .menu-link, ' + selector + ' .inline-on-mobile .menu-item:hover > .ast-menu-toggle'
+ );
+
+ // Menu Toggle - Color
+ astra_color_responsive_css(
+ 'astra-builder-toggle',
+ 'astra-settings[header-mobile-menu-color-responsive]',
+ 'color',
+ selector + ' .menu-item > .ast-menu-toggle'
+ );
+
+ // Menu Toggle - Hover Color
+ astra_color_responsive_css(
+ 'astra-menu-h-toogle-color-preview',
+ 'astra-settings[header-mobile-menu-h-color-responsive]',
+ 'color',
+ selector + ' .menu-item:hover > .ast-menu-toggle'
+ );
+ // Menu - Active Color
+ astra_color_responsive_css(
+ 'astra-menu-active-color-preview',
+ 'astra-settings[header-mobile-menu-a-color-responsive]',
+ 'color',
+ selector + ' .menu-item.current-menu-item > .menu-link, ' + selector + ' .inline-on-mobile .menu-item.current-menu-item > .ast-menu-toggle'
+ );
+
+ // Menu - Normal Background
+ astra_apply_responsive_background_css( 'astra-settings[header-mobile-menu-bg-obj-responsive]', selector + ' .main-header-menu, ' + selector + ' .main-header-menu .sub-menu', 'desktop' );
+ astra_apply_responsive_background_css( 'astra-settings[header-mobile-menu-bg-obj-responsive]', selector + ' .main-header-menu, ' + selector + ' .main-header-menu .sub-menu', 'tablet' );
+ astra_apply_responsive_background_css( 'astra-settings[header-mobile-menu-bg-obj-responsive]', selector + ' .main-header-menu, ' + selector + ' .main-header-menu .sub-menu', 'mobile' );
+
+ // Menu - Hover Background
+ astra_color_responsive_css(
+ 'astra-menu-bg-preview',
+ 'astra-settings[header-mobile-menu-h-bg-color-responsive]',
+ 'background',
+ selector + ' .menu-item:hover > .menu-link, ' + selector + ' .inline-on-mobile .menu-item:hover > .ast-menu-toggle'
+ );
+
+ // Menu - Active Background
+ astra_color_responsive_css(
+ 'astra-builder',
+ 'astra-settings[header-mobile-menu-a-bg-color-responsive]',
+ 'background',
+ selector + ' .menu-item.current-menu-item > .menu-link, ' + selector + ' .inline-on-mobile .menu-item.current-menu-item > .ast-menu-toggle'
+ );
+
+ /**
+ * Border CSS.
+ */
+
+ (function () {
+
+ // Sub Menu - Divider Size.
+ wp.customize( 'astra-settings[header-mobile-menu-submenu-item-b-size]', function( value ) {
+ value.bind( function( borderSize ) {
+ var selector = '.ast-hfb-header .ast-builder-menu-mobile .main-navigation';
+ var dynamicStyle = '';
+ dynamicStyle += selector + ' .main-header-menu {';
+ dynamicStyle += 'border-top-width: ' + borderSize + 'px;';
+ dynamicStyle += '} ';
+ dynamicStyle += selector + ' .menu-item .sub-menu .menu-link, ' + selector + ' .menu-item .menu-link {';
+ dynamicStyle += 'border-bottom-width: ' + borderSize + 'px;';
+ dynamicStyle += '} ';
+ astra_add_dynamic_css( 'header-mobile-menu-submenu-item-b-size', dynamicStyle );
+ } );
+ } );
+
+ // Menu 1 > Sub Menu Border Size.
+ wp.customize( 'astra-settings[header-mobile-menu-submenu-border]', function( setting ) {
+ setting.bind( function( border ) {
+
+ var dynamicStyle = '.ast-builder-menu-mobile .sub-menu {';
+ dynamicStyle += 'border-top-width:' + border.top + 'px;';
+ dynamicStyle += 'border-right-width:' + border.right + 'px;';
+ dynamicStyle += 'border-left-width:' + border.left + 'px;';
+ dynamicStyle += 'border-style: solid;';
+ dynamicStyle += 'border-bottom-width:' + border.bottom + 'px;';
+
+ dynamicStyle += '}';
+ astra_add_dynamic_css( 'header-mobile-menu-submenu-border', dynamicStyle );
+
+ } );
+ } );
+
+ // Menu Spacing - Menu 1.
+ wp.customize( 'astra-settings[header-mobile-menu-menu-spacing]', function( value ) {
+ value.bind( function( padding ) {
+ var dynamicStyle = '';
+ dynamicStyle += '.ast-hfb-header .ast-builder-menu-mobile .main-header-menu .menu-item > .menu-link {';
+ dynamicStyle += 'padding-left: ' + padding['desktop']['left'] + padding['desktop-unit'] + ';';
+ dynamicStyle += 'padding-right: ' + padding['desktop']['right'] + padding['desktop-unit'] + ';';
+ dynamicStyle += 'padding-top: ' + padding['desktop']['top'] + padding['desktop-unit'] + ';';
+ dynamicStyle += 'padding-bottom: ' + padding['desktop']['bottom'] + padding['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+
+ // Toggle top.
+ dynamicStyle += '.ast-hfb-header .ast-builder-menu-mobile .main-navigation ul .menu-item.menu-item-has-children > .ast-menu-toggle {';
+ dynamicStyle += 'top: ' + padding['desktop']['top'] + padding['desktop-unit'] + ';';
+ dynamicStyle += 'right: calc( ' + padding['desktop']['right'] + padding['desktop-unit'] + ' - 0.907em );'
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += '.ast-header-break-point .ast-builder-menu-mobile .main-header-menu .menu-item > .menu-link {';
+ dynamicStyle += 'padding-left: ' + padding['tablet']['left'] + padding['tablet-unit'] + ';';
+ dynamicStyle += 'padding-right: ' + padding['tablet']['right'] + padding['tablet-unit'] + ';';
+ dynamicStyle += 'padding-top: ' + padding['tablet']['top'] + padding['tablet-unit'] + ';';
+ dynamicStyle += 'padding-bottom: ' + padding['tablet']['bottom'] + padding['tablet-unit'] + ';';
+ dynamicStyle += '} ';
+ // Toggle top.
+ dynamicStyle += '.ast-hfb-header .ast-builder-menu-mobile .main-navigation ul .menu-item.menu-item-has-children > .ast-menu-toggle {';
+ dynamicStyle += 'top: ' + padding['tablet']['top'] + padding['tablet-unit'] + ';';
+ dynamicStyle += 'right: calc( ' + padding['tablet']['right'] + padding['tablet-unit'] + ' - 0.907em );'
+ dynamicStyle += '} ';
+
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += '.ast-header-break-point .ast-builder-menu-mobile .main-header-menu .menu-item > .menu-link {';
+ dynamicStyle += 'padding-left: ' + padding['mobile']['left'] + padding['mobile-unit'] + ';';
+ dynamicStyle += 'padding-right: ' + padding['mobile']['right'] + padding['mobile-unit'] + ';';
+ dynamicStyle += 'padding-top: ' + padding['mobile']['top'] + padding['mobile-unit'] + ';';
+ dynamicStyle += 'padding-bottom: ' + padding['mobile']['bottom'] + padding['mobile-unit'] + ';';
+ dynamicStyle += '} ';
+ // Toggle top.
+ dynamicStyle += '.ast-hfb-header .ast-builder-menu-mobile .main-navigation ul .menu-item.menu-item-has-children > .ast-menu-toggle {';
+ dynamicStyle += 'top: ' + padding['mobile']['top'] + padding['mobile-unit'] + ';';
+ dynamicStyle += 'right: calc( ' + padding['mobile']['right'] + padding['mobile-unit'] + ' - 0.907em );'
+ dynamicStyle += '} ';
+
+ dynamicStyle += '} ';
+
+ astra_add_dynamic_css( 'header-mobile-menu-menu-spacing-toggle-button', dynamicStyle );
+ } );
+ } );
+
+ // Margin - Menu 1.
+ wp.customize( 'astra-settings[section-header-mobile-menu-margin]', function( value ) {
+ value.bind( function( margin ) {
+ var selector = '.ast-builder-menu-mobile .main-header-menu, .ast-header-break-point .ast-builder-menu-mobile .main-header-menu';
+ var dynamicStyle = '';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['desktop']['left'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['desktop']['right'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['desktop']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['desktop']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['tablet']['left'] + margin['tablet-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['tablet']['right'] + margin['tablet-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['tablet']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['tablet']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['mobile']['left'] + margin['mobile-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['mobile']['right'] + margin['mobile-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['mobile']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['mobile']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+ astra_add_dynamic_css( 'section-header-mobile-menu-margin', dynamicStyle );
+ } );
+ } );
+
+ /**
+ * Header Menu 1 > Submenu border Color
+ */
+ wp.customize('astra-settings[header-mobile-menu-submenu-item-b-color]', function (value) {
+ value.bind(function (color) {
+ var insideBorder = wp.customize('astra-settings[header-mobile-menu-submenu-item-border]').get(),
+ borderSize = wp.customize('astra-settings[header-mobile-menu-submenu-item-b-size]').get();
+ if ('' != color) {
+ if ( true == insideBorder ) {
+
+ var dynamicStyle = '';
+
+ dynamicStyle += '.ast-hfb-header .ast-builder-menu-mobile .main-navigation .menu-item .sub-menu .menu-link, .ast-hfb-header .ast-builder-menu-mobile .main-navigation .menu-item .menu-link';
+ dynamicStyle += '{';
+ dynamicStyle += 'border-bottom-width:' + ( ( true === insideBorder ) ? borderSize + 'px;' : '0px;' );
+ dynamicStyle += 'border-color:' + color + ';';
+ dynamicStyle += 'border-style: solid;';
+ dynamicStyle += '}';
+ dynamicStyle += '.ast-hfb-header .ast-builder-menu-mobile .main-navigation .main-header-menu';
+ dynamicStyle += '{';
+ dynamicStyle += 'border-top-width:' + ( ( true === insideBorder ) ? borderSize + 'px;' : '0px;' );
+ dynamicStyle += 'border-color:' + color + ';';
+ dynamicStyle += '}';
+
+ astra_add_dynamic_css('header-mobile-menu-submenu-item-b-color', dynamicStyle);
+ } else {
+ wp.customize.preview.send( 'refresh' );
+ }
+ } else {
+ wp.customize.preview.send('refresh');
+ }
+ });
+ });
+
+ /**
+ * Header Menu 1 > Submenu border Color
+ */
+ wp.customize( 'astra-settings[header-mobile-menu-submenu-item-border]', function( value ) {
+ value.bind( function( border ) {
+ var color = wp.customize( 'astra-settings[header-mobile-menu-submenu-item-b-color]' ).get(),
+ borderSize = wp.customize('astra-settings[header-mobile-menu-submenu-item-b-size]').get();
+
+ if( true === border ) {
+ var dynamicStyle = '.ast-builder-menu-mobile .main-navigation .main-header-menu .menu-item .sub-menu .menu-link, .ast-builder-menu-mobile .main-navigation .main-header-menu .menu-item .menu-link';
+ dynamicStyle += '{';
+ dynamicStyle += 'border-bottom-width:' + ( ( true === border ) ? borderSize + 'px;' : '0px;' );
+ dynamicStyle += 'border-color:' + color + ';';
+ dynamicStyle += 'border-style: solid;';
+ dynamicStyle += '}';
+ dynamicStyle += '.ast-builder-menu-mobile .main-navigation .main-header-menu';
+ dynamicStyle += '{';
+ dynamicStyle += 'border-top-width:' + ( ( true === border ) ? borderSize + 'px;' : '0px;' );
+ dynamicStyle += 'border-style: solid;';
+ dynamicStyle += 'border-color:' + color + ';';
+ dynamicStyle += '}';
+
+ astra_add_dynamic_css( 'header-mobile-menu-submenu-item-border', dynamicStyle );
+ } else {
+ wp.customize.preview.send( 'refresh' );
+ }
+
+ } );
+ } );
+ })();
+
+
+ // Sub Menu - Border Color.
+ astra_css(
+ 'astra-settings[header-mobile-menu-submenu-b-color]',
+ 'border-color',
+ selector + ' li.menu-item .sub-menu, ' + selector + ' .main-header-menu'
+ );
+
+ // Transparent header > Submenu link hover color.
+ astra_color_responsive_css( 'astra-builder-transparent-submenu', 'astra-settings[transparent-submenu-h-color-responsive]', 'color', '.ast-theme-transparent-header .main-header-menu .menu-item .sub-menu .menu-item:hover > .menu-link' );
+
+} )( jQuery );
diff --git a/inc/builder/type/header/mobile-menu/class-astra-mobile-menu-component-loader.php b/inc/builder/type/header/mobile-menu/class-astra-mobile-menu-component-loader.php new file mode 100644 index 0000000..f14a3a5 --- /dev/null +++ b/inc/builder/type/header/mobile-menu/class-astra-mobile-menu-component-loader.php @@ -0,0 +1,52 @@ +<?php +/** + * Mobile Navigation Menu Styling Loader for Astra theme. + * + * @package Astra Builder + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since Astra 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Mobile Navigation Menu Initialization + * + * @since 3.0.0 + */ +class Astra_Mobile_Menu_Component_Loader { + + /** + * Constructor + * + * @since 3.0.0 + */ + public function __construct() { + add_action( 'customize_preview_init', array( $this, 'preview_scripts' ), 110 ); + } + + /** + * Customizer Preview + * + * @since 3.0.0 + */ + public function preview_scripts() { + /** + * Load unminified if SCRIPT_DEBUG is true. + */ + /* Directory and Extension */ + $dir_name = ( SCRIPT_DEBUG ) ? 'unminified' : 'minified'; + $file_prefix = ( SCRIPT_DEBUG ) ? '' : '.min'; + wp_enqueue_script( 'astra-mobile-menu-customizer-preview', ASTRA_BUILDER_MOBILE_MENU_URI . '/assets/js/' . $dir_name . '/customizer-preview' . $file_prefix . '.js', array( 'customize-preview', 'astra-customizer-preview-js' ), ASTRA_THEME_VERSION, true ); + + } +} + +/** +* Kicking this off by creating the object of the class. +*/ +new Astra_Mobile_Menu_Component_Loader(); diff --git a/inc/builder/type/header/mobile-menu/class-astra-mobile-menu-component.php b/inc/builder/type/header/mobile-menu/class-astra-mobile-menu-component.php new file mode 100644 index 0000000..4c46c8c --- /dev/null +++ b/inc/builder/type/header/mobile-menu/class-astra-mobile-menu-component.php @@ -0,0 +1,131 @@ +<?php +/** + * Header Navigation Menu component. + * + * @package Astra Builder + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since Astra 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +define( 'ASTRA_BUILDER_MOBILE_MENU_DIR', ASTRA_THEME_DIR . 'inc/builder/type/header/mobile-menu' ); +define( 'ASTRA_BUILDER_MOBILE_MENU_URI', ASTRA_THEME_URI . 'inc/builder/type/header/mobile-menu' ); + +/** + * Header Navigation Menu Initial Setup + * + * @since 3.0.0 + */ +class Astra_Mobile_Menu_Component { + + /** + * Constructor function that initializes required actions and hooks + */ + public function __construct() { + + // @codingStandardsIgnoreStart WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + require_once ASTRA_BUILDER_MOBILE_MENU_DIR . '/class-astra-mobile-menu-component-loader.php'; + + // Include front end files. + if ( ! is_admin() ) { + require_once ASTRA_BUILDER_MOBILE_MENU_DIR . '/dynamic-css/dynamic.css.php'; + } + // @codingStandardsIgnoreEnd WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + } + + /** + * Secondary navigation markup + * + * @since 3.0.0. + */ + public static function menu_markup() { + + $theme_location = 'mobile_menu'; + $submenu_class = apply_filters( 'secondary_submenu_border_class', ' submenu-with-border' ); + $stack_on_mobile_class = 'stack-on-mobile'; + + // Menu Animation. + $menu_animation = astra_get_option( 'header-mobile-menu-submenu-container-animation' ); + if ( ! empty( $menu_animation ) ) { + $submenu_class .= ' astra-menu-animation-' . esc_attr( $menu_animation ) . ' '; + } + + /** + * Filter the classes(array) for Menu (<ul>). + * + * @since 3.0.0 + * @var Array + */ + $menu_classes = apply_filters( 'astra_primary_menu_classes', array( 'main-header-menu', 'ast-nav-menu', 'ast-flex', $submenu_class, $stack_on_mobile_class ) ); + + $items_wrap = '<nav '; + $items_wrap .= astra_attr( + 'site-navigation', + array( + 'id' => 'site-navigation', + 'class' => 'ast-flex-grow-1 navigation-accessibility site-header-focus-item', + 'aria-label' => esc_attr__( 'Site Navigation', 'astra' ), + ) + ); + $items_wrap .= '>'; + $items_wrap .= '<div class="main-navigation">'; + $items_wrap .= '<ul id="%1$s" class="%2$s">%3$s</ul>'; + $items_wrap .= '</div>'; + $items_wrap .= '</nav>'; + + // Fallback Menu if primary menu not set. + $fallback_menu_args = array( + 'theme_location' => $theme_location, + 'menu_id' => 'ast-hf-mobile-menu', + 'menu_class' => 'main-navigation', + 'container' => 'div', + 'before' => '<ul class="' . esc_attr( implode( ' ', $menu_classes ) ) . '">', + 'after' => '</ul>', + 'walker' => new Astra_Walker_Page(), + ); + + // To add default alignment for navigation which can be added through any third party plugin. + // Do not add any CSS from theme except header alignment. + echo '<div ' . astra_attr( 'ast-main-header-bar-alignment' ) . '>'; + + if ( is_customize_preview() ) { + Astra_Builder_UI_Controller::render_customizer_edit_button(); + } + if ( has_nav_menu( $theme_location ) ) { + wp_nav_menu( + array( + 'menu_id' => 'ast-hf-mobile-menu', + 'menu_class' => esc_attr( implode( ' ', $menu_classes ) ), + 'container' => 'div', + 'container_class' => 'main-header-bar-navigation', + 'items_wrap' => $items_wrap, + 'theme_location' => $theme_location, + ) + ); + } else { + echo '<div class="main-header-bar-navigation">'; + echo '<nav '; + echo astra_attr( + 'site-navigation', + array( + 'id' => 'site-navigation', + ) + ); + echo ' class="ast-flex-grow-1 navigation-accessibility" aria-label="' . esc_attr__( 'Site Navigation', 'astra' ) . '">'; + wp_page_menu( $fallback_menu_args ); + echo '</nav>'; + echo '</div>'; + } + echo '</div>'; + } +} + +/** + * Kicking this off by creating an object. + */ +new Astra_Mobile_Menu_Component(); diff --git a/inc/builder/type/header/mobile-menu/dynamic-css/dynamic.css.php b/inc/builder/type/header/mobile-menu/dynamic-css/dynamic.css.php new file mode 100644 index 0000000..4943f82 --- /dev/null +++ b/inc/builder/type/header/mobile-menu/dynamic-css/dynamic.css.php @@ -0,0 +1,293 @@ +<?php +/** + * Header Menu Colors - Dynamic CSS + * + * @package astra-builder + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Header Menu Colors + */ +add_filter( 'astra_dynamic_theme_css', 'astra_hb_mobile_menu_dynamic_css', 11 ); + +/** + * Dynamic CSS + * + * @param string $dynamic_css Astra Dynamic CSS. + * @param string $dynamic_css_filtered Astra Dynamic CSS Filters. + * @return String Generated dynamic CSS for Header Menu Colors. + * + * @since 3.0.0 + */ +function astra_hb_mobile_menu_dynamic_css( $dynamic_css, $dynamic_css_filtered = '' ) { + + if ( ! Astra_Builder_Helper::is_component_loaded( 'mobile-menu', 'header' ) ) { + return $dynamic_css; + } + + $_section = 'section-header-mobile-menu'; + + $selector = '.ast-builder-menu-mobile .main-navigation'; + + + // Sub Menu. + $sub_menu_divider_toggle = astra_get_option( 'header-mobile-menu-submenu-item-border' ); + $sub_menu_divider_size = astra_get_option( 'header-mobile-menu-submenu-item-b-size' ); + $sub_menu_divider_color = astra_get_option( 'header-mobile-menu-submenu-item-b-color' ); + + // Menu. + $menu_resp_color = astra_get_option( 'header-mobile-menu-color-responsive' ); + $menu_resp_bg_color = astra_get_option( 'header-mobile-menu-bg-obj-responsive' ); + $menu_resp_color_hover = astra_get_option( 'header-mobile-menu-h-color-responsive' ); + $menu_resp_bg_color_hover = astra_get_option( 'header-mobile-menu-h-bg-color-responsive' ); + $menu_resp_color_active = astra_get_option( 'header-mobile-menu-a-color-responsive' ); + $menu_resp_bg_color_active = astra_get_option( 'header-mobile-menu-a-bg-color-responsive' ); + + $menu_resp_color_desktop = ( isset( $menu_resp_color['desktop'] ) ) ? $menu_resp_color['desktop'] : ''; + $menu_resp_color_tablet = ( isset( $menu_resp_color['tablet'] ) ) ? $menu_resp_color['tablet'] : ''; + $menu_resp_color_mobile = ( isset( $menu_resp_color['mobile'] ) ) ? $menu_resp_color['mobile'] : ''; + + $menu_resp_color_hover_desktop = ( isset( $menu_resp_color_hover['desktop'] ) ) ? $menu_resp_color_hover['desktop'] : ''; + $menu_resp_color_hover_tablet = ( isset( $menu_resp_color_hover['tablet'] ) ) ? $menu_resp_color_hover['tablet'] : ''; + $menu_resp_color_hover_mobile = ( isset( $menu_resp_color_hover['mobile'] ) ) ? $menu_resp_color_hover['mobile'] : ''; + + $menu_resp_bg_color_hover_desktop = ( isset( $menu_resp_bg_color_hover['desktop'] ) ) ? $menu_resp_bg_color_hover['desktop'] : ''; + $menu_resp_bg_color_hover_tablet = ( isset( $menu_resp_bg_color_hover['tablet'] ) ) ? $menu_resp_bg_color_hover['tablet'] : ''; + $menu_resp_bg_color_hover_mobile = ( isset( $menu_resp_bg_color_hover['mobile'] ) ) ? $menu_resp_bg_color_hover['mobile'] : ''; + + $menu_resp_color_active_desktop = ( isset( $menu_resp_color_active['desktop'] ) ) ? $menu_resp_color_active['desktop'] : ''; + $menu_resp_color_active_tablet = ( isset( $menu_resp_color_active['tablet'] ) ) ? $menu_resp_color_active['tablet'] : ''; + $menu_resp_color_active_mobile = ( isset( $menu_resp_color_active['mobile'] ) ) ? $menu_resp_color_active['mobile'] : ''; + + $menu_resp_bg_color_active_desktop = ( isset( $menu_resp_bg_color_active['desktop'] ) ) ? $menu_resp_bg_color_active['desktop'] : ''; + $menu_resp_bg_color_active_tablet = ( isset( $menu_resp_bg_color_active['tablet'] ) ) ? $menu_resp_bg_color_active['tablet'] : ''; + $menu_resp_bg_color_active_mobile = ( isset( $menu_resp_bg_color_active['mobile'] ) ) ? $menu_resp_bg_color_active['mobile'] : ''; + + // Typography. + $menu_font_family = astra_get_option( 'header-mobile-menu-font-family' ); + $menu_font_size = astra_get_option( 'header-mobile-menu-font-size' ); + $menu_font_weight = astra_get_option( 'header-mobile-menu-font-weight' ); + $menu_text_transform = astra_get_option( 'header-mobile-menu-text-transform' ); + $menu_line_height = astra_get_option( 'header-mobile-menu-line-height' ); + + $menu_font_size_desktop = ( isset( $menu_font_size['desktop'] ) ) ? $menu_font_size['desktop'] : ''; + $menu_font_size_tablet = ( isset( $menu_font_size['tablet'] ) ) ? $menu_font_size['tablet'] : ''; + $menu_font_size_mobile = ( isset( $menu_font_size['mobile'] ) ) ? $menu_font_size['mobile'] : ''; + $menu_font_size_desktop_unit = ( isset( $menu_font_size['desktop-unit'] ) ) ? $menu_font_size['desktop-unit'] : ''; + $menu_font_size_tablet_unit = ( isset( $menu_font_size['tablet-unit'] ) ) ? $menu_font_size['tablet-unit'] : ''; + $menu_font_size_mobile_unit = ( isset( $menu_font_size['mobile-unit'] ) ) ? $menu_font_size['mobile-unit'] : ''; + + + // Spacing. + $menu_spacing = astra_get_option( 'header-mobile-menu-menu-spacing' ); + + $sub_menu_divider_color = ( true === $sub_menu_divider_toggle ) ? $sub_menu_divider_color : ''; + + // Margin. + $margin = astra_get_option( $_section . '-margin' ); + $margin_selector = '.ast-builder-menu-mobile .main-header-menu, .ast-header-break-point .ast-builder-menu-mobile .main-header-menu'; + + $menu_spacing_desktop_top = astra_responsive_spacing( $menu_spacing, 'top', 'desktop' ); + $menu_spacing_desktop_top = ( isset( $menu_spacing_desktop_top ) && ! empty( $menu_spacing_desktop_top ) ) ? $menu_spacing_desktop_top : 0; + + $menu_spacing_tablet_top = astra_responsive_spacing( $menu_spacing, 'top', 'tablet' ); + $menu_spacing_tablet_top = ( isset( $menu_spacing_tablet_top ) && ! empty( $menu_spacing_tablet_top ) ) ? $menu_spacing_tablet_top : 0; + + $menu_spacing_mobile_top = astra_responsive_spacing( $menu_spacing, 'top', 'mobile' ); + + if ( isset( $menu_spacing_mobile_top ) && '' === $menu_spacing_mobile_top && isset( $menu_spacing_tablet_top ) && '' !== $menu_spacing_tablet_top && 0 !== $menu_spacing_tablet_top ) { + + $menu_spacing_mobile_top = $menu_spacing_tablet_top; + } + + $menu_spacing_mobile_top = ( isset( $menu_spacing_mobile_top ) && ! empty( $menu_spacing_mobile_top ) ) ? $menu_spacing_mobile_top : 0; + + $css_output_desktop = array( + + $selector . ' .menu-item > .menu-link' => array( + 'font-family' => astra_get_font_family( $menu_font_family ), + 'font-weight' => esc_attr( $menu_font_weight ), + 'line-height' => esc_attr( $menu_line_height ), + 'text-transform' => esc_attr( $menu_text_transform ), + ), + $selector => array( + 'font-size' => astra_get_font_css_value( $menu_font_size_desktop, $menu_font_size_desktop_unit ), + ), + $selector . ' .main-header-menu .menu-item > .menu-link' => array( + 'color' => $menu_resp_color_desktop, + 'padding-top' => astra_responsive_spacing( $menu_spacing, 'top', 'desktop' ), + 'padding-bottom' => astra_responsive_spacing( $menu_spacing, 'bottom', 'desktop' ), + 'padding-left' => astra_responsive_spacing( $menu_spacing, 'left', 'desktop' ), + 'padding-right' => astra_responsive_spacing( $menu_spacing, 'right', 'desktop' ), + ), + $selector . ' .main-header-menu .menu-item > .ast-menu-toggle' => array( + 'color' => $menu_resp_color_desktop, + ), + $selector . ' .menu-item:hover > .menu-link, ' . $selector . ' .inline-on-mobile .menu-item:hover > .ast-menu-toggle' => array( + 'color' => $menu_resp_color_hover_desktop, + 'background' => $menu_resp_bg_color_hover_desktop, + ), + $selector . ' .menu-item:hover > .ast-menu-toggle' => array( + 'color' => $menu_resp_color_hover_desktop, + ), + $selector . ' .menu-item.current-menu-item > .menu-link, ' . $selector . ' .inline-on-mobile .menu-item.current-menu-item > .ast-menu-toggle, ' . $selector . ' .menu-item.current-menu-ancestor > .menu-link, ' . $selector . ' .menu-item.current-menu-ancestor > .ast-menu-toggle' => array( + 'color' => $menu_resp_color_active_desktop, + 'background' => $menu_resp_bg_color_active_desktop, + ), + $selector . ' .menu-item.current-menu-item > .ast-menu-toggle' => array( + 'color' => $menu_resp_color_active_desktop, + ), + $selector . ' .menu-item.menu-item-has-children > .ast-menu-toggle' => array( + 'top' => $menu_spacing_desktop_top, + 'right' => astra_calculate_spacing( astra_responsive_spacing( $menu_spacing, 'right', 'desktop' ), '-', '0.907', 'em' ), + ), + $selector . ' .menu-item-has-children > .menu-link:after' => array( + 'content' => 'unset', + ), + // Margin CSS. + $margin_selector => array( + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'desktop' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'desktop' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'desktop' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'desktop' ), + ), + ); + + $css_output_desktop[ $selector . ' .main-header-menu, ' . $selector . ' .main-header-menu .sub-menu' ] = astra_get_responsive_background_obj( $menu_resp_bg_color, 'desktop' ); + + $css_output_tablet = array( + + $selector => array( + 'font-size' => astra_get_font_css_value( $menu_font_size_tablet, $menu_font_size_tablet_unit ), + ), + $selector . ' .main-header-menu .menu-item > .menu-link' => array( + 'color' => $menu_resp_color_tablet, + 'padding-top' => astra_responsive_spacing( $menu_spacing, 'top', 'tablet' ), + 'padding-bottom' => astra_responsive_spacing( $menu_spacing, 'bottom', 'tablet' ), + 'padding-left' => astra_responsive_spacing( $menu_spacing, 'left', 'tablet' ), + 'padding-right' => astra_responsive_spacing( $menu_spacing, 'right', 'tablet' ), + ), + $selector . ' .menu-item > .ast-menu-toggle' => array( + 'color' => $menu_resp_color_tablet, + ), + $selector . ' .menu-item:hover > .menu-link, ' . $selector . ' .inline-on-mobile .menu-item:hover > .ast-menu-toggle' => array( + 'color' => $menu_resp_color_hover_tablet, + 'background' => $menu_resp_bg_color_hover_tablet, + ), + $selector . ' .menu-item:hover > .ast-menu-toggle' => array( + 'color' => $menu_resp_color_hover_tablet, + ), + $selector . ' .menu-item.current-menu-item > .menu-link, ' . $selector . ' .inline-on-mobile .menu-item.current-menu-item > .ast-menu-toggle, ' . $selector . ' .menu-item.current-menu-ancestor > .menu-link, ' . $selector . ' .menu-item.current-menu-ancestor > .ast-menu-toggle' => array( + 'color' => $menu_resp_color_active_tablet, + 'background' => $menu_resp_bg_color_active_tablet, + ), + $selector . ' .menu-item.current-menu-item > .ast-menu-toggle' => array( + 'color' => $menu_resp_color_active_tablet, + ), + $selector . ' .menu-item.menu-item-has-children > .ast-menu-toggle' => array( + 'top' => $menu_spacing_tablet_top, + 'right' => astra_calculate_spacing( astra_responsive_spacing( $menu_spacing, 'right', 'tablet' ), '-', '0.907', 'em' ), + ), + $selector . ' .menu-item-has-children > .menu-link:after' => array( + 'content' => 'unset', + ), + // Margin CSS. + $margin_selector => array( + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'tablet' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'tablet' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'tablet' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'tablet' ), + ), + ); + + $css_output_tablet[ $selector . ' .main-header-menu, ' . $selector . ' .main-header-menu .sub-menu' ] = astra_get_responsive_background_obj( $menu_resp_bg_color, 'tablet' ); + + $css_output_mobile = array( + + $selector => array( + 'font-size' => astra_get_font_css_value( $menu_font_size_mobile, $menu_font_size_mobile_unit ), + ), + $selector . ' .main-header-menu .menu-item > .menu-link' => array( + 'color' => $menu_resp_color_mobile, + 'padding-top' => astra_responsive_spacing( $menu_spacing, 'top', 'mobile' ), + 'padding-bottom' => astra_responsive_spacing( $menu_spacing, 'bottom', 'mobile' ), + 'padding-left' => astra_responsive_spacing( $menu_spacing, 'left', 'mobile' ), + 'padding-right' => astra_responsive_spacing( $menu_spacing, 'right', 'mobile' ), + ), + $selector . ' .menu-item > .ast-menu-toggle' => array( + 'color' => $menu_resp_color_mobile, + ), + $selector . ' .menu-item:hover > .menu-link, ' . $selector . ' .inline-on-mobile .menu-item:hover > .ast-menu-toggle' => array( + 'color' => $menu_resp_color_hover_mobile, + 'background' => $menu_resp_bg_color_hover_mobile, + ), + $selector . ' .menu-item:hover > .ast-menu-toggle' => array( + 'color' => $menu_resp_color_hover_mobile, + ), + $selector . ' .menu-item.current-menu-item > .menu-link, ' . $selector . ' .inline-on-mobile .menu-item.current-menu-item > .ast-menu-toggle, ' . $selector . ' .menu-item.current-menu-ancestor > .menu-link, ' . $selector . ' .menu-item.current-menu-ancestor > .ast-menu-toggle' => array( + 'color' => $menu_resp_color_active_mobile, + 'background' => $menu_resp_bg_color_active_mobile, + ), + $selector . ' .menu-item.current-menu-item > .ast-menu-toggle' => array( + 'color' => $menu_resp_color_active_mobile, + ), + $selector . ' .menu-item.menu-item-has-children > .ast-menu-toggle' => array( + 'top' => $menu_spacing_mobile_top, + 'right' => astra_calculate_spacing( astra_responsive_spacing( $menu_spacing, 'right', 'mobile' ), '-', '0.907', 'em' ), + ), + // Margin CSS. + $margin_selector => array( + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'mobile' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'mobile' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'mobile' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'mobile' ), + ), + ); + + $css_output_mobile[ $selector . ' .main-header-menu, ' . $selector . ' .main-header-menu .sub-menu' ] = astra_get_responsive_background_obj( $menu_resp_bg_color, 'mobile' ); + + if ( true === $sub_menu_divider_toggle ) { + + $css_output_desktop_submenu = array( + '.ast-hfb-header ' . $selector . ' .main-header-menu, .ast-hfb-header ' . $selector . ' .main-header-menu, .ast-hfb-header .ast-mobile-header-content ' . $selector . ' .main-header-menu, .ast-hfb-header .ast-mobile-popup-content ' . $selector . ' .main-header-menu' => array( + 'border-top-width' => $sub_menu_divider_size . 'px', + 'border-color' => $sub_menu_divider_color, + ), + '.ast-hfb-header ' . $selector . ' .menu-item .sub-menu .menu-link, .ast-hfb-header ' . $selector . ' .menu-item .menu-link, .ast-hfb-header ' . $selector . ' .menu-item .sub-menu .menu-link, .ast-hfb-header ' . $selector . ' .menu-item .menu-link, .ast-hfb-header .ast-mobile-header-content ' . $selector . ' .menu-item .sub-menu .menu-link, .ast-hfb-header .ast-mobile-header-content ' . $selector . ' .menu-item .menu-link, .ast-hfb-header .ast-mobile-popup-content ' . $selector . ' .menu-item .sub-menu .menu-link, .ast-hfb-header .ast-mobile-popup-content ' . $selector . ' .menu-item .menu-link' => array( + 'border-bottom-width' => $sub_menu_divider_size . 'px', + 'border-color' => $sub_menu_divider_color, + 'border-style' => 'solid', + ), + ); + + } else { + + $css_output_desktop_submenu = array( + + '.ast-hfb-header .ast-builder-menu-mobile .main-header-menu, .ast-hfb-header .ast-builder-menu-mobile .main-navigation .menu-item .menu-link, .ast-hfb-header .ast-builder-menu-mobile .main-navigation .menu-item .sub-menu .menu-link' => array( + 'border-style' => 'none', + ), + ); + } + + $css_output_desktop_submenu[ $selector . ' .menu-item.menu-item-has-children > .ast-menu-toggle' ] = array( + 'top' => $menu_spacing_desktop_top, + 'right' => astra_calculate_spacing( astra_responsive_spacing( $menu_spacing, 'right', 'desktop' ), '-', '0.907', 'em' ), + ); + + $css_output = astra_parse_css( $css_output_desktop ); + $css_output .= astra_parse_css( $css_output_desktop_submenu ); + $css_output .= astra_parse_css( $css_output_tablet, '', astra_get_tablet_breakpoint() ); + $css_output .= astra_parse_css( $css_output_mobile, '', astra_get_mobile_breakpoint() ); + + $dynamic_css .= $css_output; + + $dynamic_css .= Astra_Builder_Base_Dynamic_CSS::prepare_visibility_css( $_section, $selector, 'block' ); + + return $dynamic_css; +} diff --git a/inc/builder/type/header/mobile-trigger/assets/js/minified/customizer-preview.min.js b/inc/builder/type/header/mobile-trigger/assets/js/minified/customizer-preview.min.js new file mode 100644 index 0000000..40c6536 --- /dev/null +++ b/inc/builder/type/header/mobile-trigger/assets/js/minified/customizer-preview.min.js @@ -0,0 +1 @@ +!function(){var i=astraBuilderPreview.tablet_break_point||768,a=astraBuilderPreview.mobile_break_point||544;astra_css("astra-settings[mobile-header-toggle-btn-color]","fill",'[data-section="section-header-mobile-trigger"] .ast-button-wrap .mobile-menu-toggle-icon .ast-mobile-svg'),astra_css("astra-settings[mobile-header-toggle-btn-color]","color",'[data-section="section-header-mobile-trigger"] .ast-button-wrap .mobile-menu-wrap .mobile-menu'),astra_css("astra-settings[mobile-header-toggle-icon-size]","width",'[data-section="section-header-mobile-trigger"] .ast-button-wrap .mobile-menu-toggle-icon .ast-mobile-svg',"px"),astra_css("astra-settings[mobile-header-toggle-icon-size]","height",'[data-section="section-header-mobile-trigger"] .ast-button-wrap .mobile-menu-toggle-icon .ast-mobile-svg',"px"),astra_css("astra-settings[mobile-header-toggle-btn-bg-color]","background",'[data-section="section-header-mobile-trigger"] .ast-button-wrap .menu-toggle.ast-mobile-menu-trigger-fill'),wp.customize("astra-settings[mobile-header-toggle-btn-border-size]",function(t){t.bind(function(t){var e='[data-section="section-header-mobile-trigger"] .ast-button-wrap .menu-toggle.main-header-menu-toggle {';e+="border-top-width:"+t.top+"px;",e+="border-right-width:"+t.right+"px;",e+="border-left-width:"+t.left+"px;",e+="border-bottom-width:"+t.bottom+"px;",e+="} ",astra_add_dynamic_css("astra-settings[mobile-header-toggle-btn-border-size]",e)})}),astra_css("astra-settings[mobile-header-toggle-border-radius]","border-radius",'[data-section="section-header-mobile-trigger"] .ast-button-wrap .menu-toggle.main-header-menu-toggle',"px"),astra_css("astra-settings[mobile-header-toggle-border-color]","border-color",'[data-section="section-header-mobile-trigger"] .ast-button-wrap .menu-toggle.ast-mobile-menu-trigger-outline, [data-section="section-header-mobile-trigger"] .ast-button-wrap .menu-toggle.ast-mobile-menu-trigger-fill'),wp.customize("astra-settings[section-header-mobile-trigger-margin]",function(t){t.bind(function(t){var e,o;""==t.desktop.bottom&&""==t.desktop.top&&""==t.desktop.left&&""==t.desktop.right&&""==t.tablet.bottom&&""==t.tablet.top&&""==t.tablet.left&&""==t.tablet.right&&""==t.mobile.bottom&&""==t.mobile.top&&""==t.mobile.left&&""==t.mobile.right||(o="",o+=(e='[data-section="section-header-mobile-trigger"] .ast-button-wrap .menu-toggle.main-header-menu-toggle')+" {",o+="margin-left: "+t.desktop.left+t["desktop-unit"]+";",o+="margin-right: "+t.desktop.right+t["desktop-unit"]+";",o+="margin-top: "+t.desktop.top+t["desktop-unit"]+";",o+="margin-bottom: "+t.desktop.bottom+t["desktop-unit"]+";",o+="} ",o+="@media (max-width: "+i+"px) {",o+=e+" {",o+="margin-left: "+t.tablet.left+t["tablet-unit"]+";",o+="margin-right: "+t.tablet.right+t["tablet-unit"]+";",o+="margin-top: "+t.tablet.top+t["desktop-unit"]+";",o+="margin-bottom: "+t.tablet.bottom+t["desktop-unit"]+";",o+="} ",o+="} ",o+="@media (max-width: "+a+"px) {",o+=e+" {",o+="margin-left: "+t.mobile.left+t["mobile-unit"]+";",o+="margin-right: "+t.mobile.right+t["mobile-unit"]+";",o+="margin-top: "+t.mobile.top+t["desktop-unit"]+";",o+="margin-bottom: "+t.mobile.bottom+t["desktop-unit"]+";",o+="} ",o+="} ",astra_add_dynamic_css("header-mobile-trigger-margin",o))})}),astra_css("astra-settings[mobile-header-label-font-size]","font-size",'[data-section="section-header-mobile-trigger"] .ast-button-wrap .mobile-menu-wrap .mobile-menu',"px")}(jQuery);
\ No newline at end of file diff --git a/inc/builder/type/header/mobile-trigger/assets/js/unminified/customizer-preview.js b/inc/builder/type/header/mobile-trigger/assets/js/unminified/customizer-preview.js new file mode 100644 index 0000000..16c2454 --- /dev/null +++ b/inc/builder/type/header/mobile-trigger/assets/js/unminified/customizer-preview.js @@ -0,0 +1,128 @@ +/**
+ * This file adds some LIVE to the Customizer live preview. To leverage
+ * this, set your custom settings to 'postMessage' and then add your handling
+ * here. Your javascript should grab settings from customizer controls, and
+ * then make any necessary changes to the page using jQuery.
+ *
+ * @package Astra
+ * @since 3.0.0
+ */
+
+( function( $ ) {
+
+ var tablet_break_point = astraBuilderPreview.tablet_break_point || 768,
+ mobile_break_point = astraBuilderPreview.mobile_break_point || 544;
+
+ // Trigger Icon Color.
+ astra_css(
+ 'astra-settings[mobile-header-toggle-btn-color]',
+ 'fill',
+ '[data-section="section-header-mobile-trigger"] .ast-button-wrap .mobile-menu-toggle-icon .ast-mobile-svg'
+ );
+
+ // Trigger Label Color.
+ astra_css(
+ 'astra-settings[mobile-header-toggle-btn-color]',
+ 'color',
+ '[data-section="section-header-mobile-trigger"] .ast-button-wrap .mobile-menu-wrap .mobile-menu'
+ );
+
+ // Trigger Icon Width.
+ astra_css(
+ 'astra-settings[mobile-header-toggle-icon-size]',
+ 'width',
+ '[data-section="section-header-mobile-trigger"] .ast-button-wrap .mobile-menu-toggle-icon .ast-mobile-svg',
+ 'px'
+ );
+
+ // Trigger Icon Height.
+ astra_css(
+ 'astra-settings[mobile-header-toggle-icon-size]',
+ 'height',
+ '[data-section="section-header-mobile-trigger"] .ast-button-wrap .mobile-menu-toggle-icon .ast-mobile-svg',
+ 'px'
+ );
+
+ // Trigger Button Background Color.
+ astra_css(
+ 'astra-settings[mobile-header-toggle-btn-bg-color]',
+ 'background',
+ '[data-section="section-header-mobile-trigger"] .ast-button-wrap .menu-toggle.ast-mobile-menu-trigger-fill'
+ );
+
+ // Border Size for Trigger Button.
+ wp.customize( 'astra-settings[mobile-header-toggle-btn-border-size]', function( setting ) {
+ setting.bind( function( border ) {
+ var dynamicStyle = '[data-section="section-header-mobile-trigger"] .ast-button-wrap .menu-toggle.main-header-menu-toggle {';
+ dynamicStyle += 'border-top-width:' + border.top + 'px;';
+ dynamicStyle += 'border-right-width:' + border.right + 'px;';
+ dynamicStyle += 'border-left-width:' + border.left + 'px;';
+ dynamicStyle += 'border-bottom-width:' + border.bottom + 'px;';
+ dynamicStyle += '} ';
+ astra_add_dynamic_css( 'astra-settings[mobile-header-toggle-btn-border-size]', dynamicStyle );
+ } );
+ } );
+
+ // Border Radius.
+ astra_css(
+ 'astra-settings[mobile-header-toggle-border-radius]',
+ 'border-radius',
+ '[data-section="section-header-mobile-trigger"] .ast-button-wrap .menu-toggle.main-header-menu-toggle',
+ 'px'
+ );
+
+ // Border Color.
+ astra_css(
+ 'astra-settings[mobile-header-toggle-border-color]',
+ 'border-color',
+ '[data-section="section-header-mobile-trigger"] .ast-button-wrap .menu-toggle.ast-mobile-menu-trigger-outline, [data-section="section-header-mobile-trigger"] .ast-button-wrap .menu-toggle.ast-mobile-menu-trigger-fill'
+ );
+
+ // Margin.
+ wp.customize( 'astra-settings[section-header-mobile-trigger' + '-margin]', function( value ) {
+ value.bind( function( margin ) {
+ if(
+ margin.desktop.bottom != '' || margin.desktop.top != '' || margin.desktop.left != '' || margin.desktop.right != '' ||
+ margin.tablet.bottom != '' || margin.tablet.top != '' || margin.tablet.left != '' || margin.tablet.right != '' ||
+ margin.mobile.bottom != '' || margin.mobile.top != '' || margin.mobile.left != '' || margin.mobile.right != ''
+ ) {
+ var selector = '[data-section="section-header-mobile-trigger"] .ast-button-wrap .menu-toggle.main-header-menu-toggle';
+ var dynamicStyle = '';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['desktop']['left'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['desktop']['right'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['desktop']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['desktop']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['tablet']['left'] + margin['tablet-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['tablet']['right'] + margin['tablet-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['tablet']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['tablet']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['mobile']['left'] + margin['mobile-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['mobile']['right'] + margin['mobile-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['mobile']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['mobile']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+ astra_add_dynamic_css( 'header-mobile-trigger-margin', dynamicStyle );
+ }
+ } );
+ } );
+
+ // Trigger Typography.
+ astra_css(
+ 'astra-settings[mobile-header-label-font-size]',
+ 'font-size',
+ '[data-section="section-header-mobile-trigger"] .ast-button-wrap .mobile-menu-wrap .mobile-menu',
+ 'px'
+ );
+
+} )( jQuery );
diff --git a/inc/builder/type/header/mobile-trigger/class-astra-mobile-trigger-loader.php b/inc/builder/type/header/mobile-trigger/class-astra-mobile-trigger-loader.php new file mode 100644 index 0000000..ccfcba1 --- /dev/null +++ b/inc/builder/type/header/mobile-trigger/class-astra-mobile-trigger-loader.php @@ -0,0 +1,54 @@ +<?php +/** + * Mobile Trigger Loader. + * + * @package astra-builder + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Class Mobile Trigger Loader. + * + * Loads config files. + * + * @since 3.0.0 + */ +class Astra_Mobile_Trigger_Loader { + + /** + * Constructor + * + * @since 3.0.0 + */ + public function __construct() { + add_action( 'customize_preview_init', array( $this, 'preview_scripts' ), 110 ); + } + + /** + * Customizer Preview + * + * @since 3.0.0 + */ + public function preview_scripts() { + /** + * Load unminified if SCRIPT_DEBUG is true. + */ + /* Directory and Extension */ + $dir_name = ( SCRIPT_DEBUG ) ? 'unminified' : 'minified'; + $file_prefix = ( SCRIPT_DEBUG ) ? '' : '.min'; + wp_enqueue_script( 'astra-mobile-trigger-customizer-preview-js', ASTRA_MOBILE_TRIGGER_URI . '/assets/js/' . $dir_name . '/customizer-preview' . $file_prefix . '.js', array( 'customize-preview', 'astra-customizer-preview-js' ), ASTRA_THEME_VERSION, true ); + + } +} + +/** +* Kicking this off by creating the object of the class. +*/ +new Astra_Mobile_Trigger_Loader(); diff --git a/inc/builder/type/header/mobile-trigger/class-astra-mobile-trigger.php b/inc/builder/type/header/mobile-trigger/class-astra-mobile-trigger.php new file mode 100644 index 0000000..c025edf --- /dev/null +++ b/inc/builder/type/header/mobile-trigger/class-astra-mobile-trigger.php @@ -0,0 +1,44 @@ +<?php +/** + * Mobile Trigger. + * + * @package astra-builder + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +define( 'ASTRA_MOBILE_TRIGGER_DIR', ASTRA_THEME_DIR . 'inc/builder/type/header/mobile-trigger' ); +define( 'ASTRA_MOBILE_TRIGGER_URI', ASTRA_THEME_URI . 'inc/builder/type/header/mobile-trigger' ); + +/** + * Mobile Trigger Initial Setup + * + * @since 3.0.0 + */ +class Astra_Mobile_Trigger { + + /** + * Constructor function that initializes required actions and hooks. + */ + public function __construct() { + // @codingStandardsIgnoreStart WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + require_once ASTRA_MOBILE_TRIGGER_DIR . '/class-astra-mobile-trigger-loader.php'; + + // Include front end files. + if ( ! is_admin() ) { + require_once ASTRA_MOBILE_TRIGGER_DIR . '/dynamic-css/dynamic.css.php'; + } + // @codingStandardsIgnoreEnd WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + } +} + +/** + * Kicking this off by creating an object. + */ +new Astra_Mobile_Trigger(); diff --git a/inc/builder/type/header/mobile-trigger/dynamic-css/dynamic.css.php b/inc/builder/type/header/mobile-trigger/dynamic-css/dynamic.css.php new file mode 100644 index 0000000..b7bbbbb --- /dev/null +++ b/inc/builder/type/header/mobile-trigger/dynamic-css/dynamic.css.php @@ -0,0 +1,184 @@ +<?php +/** + * Mobile Trigger - Dynamic CSS + * + * @package astra-builder + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Mobile Trigger. + */ +add_filter( 'astra_dynamic_theme_css', 'astra_mobile_trigger_row_setting', 11 ); + +/** + * Mobile Trigger - Dynamic CSS + * + * @param string $dynamic_css Astra Dynamic CSS. + * @param string $dynamic_css_filtered Astra Dynamic CSS Filters. + * @return String Generated dynamic CSS for Heading Colors. + * + * @since 3.0.0 + */ +function astra_mobile_trigger_row_setting( $dynamic_css, $dynamic_css_filtered = '' ) { + + if ( ! Astra_Builder_Helper::is_component_loaded( 'mobile-trigger', 'header', 'mobile' ) ) { + return $dynamic_css; + } + + $_section = 'section-header-mobile-trigger'; + + $selector = '[data-section="section-header-mobile-trigger"]'; + + $theme_color = astra_get_option( 'theme-color' ); + $icon_size = astra_get_option( 'mobile-header-toggle-icon-size' ); + $trigger_bg = astra_get_option( 'mobile-header-toggle-btn-bg-color', $theme_color ); + $trigger_border_width = astra_get_option( 'mobile-header-toggle-btn-border-size' ); + $trigger_border_color = astra_get_option( 'mobile-header-toggle-border-color', $trigger_bg ); + $trigger_border_radius = astra_get_option( 'mobile-header-toggle-border-radius' ); + $font_size = astra_get_option( 'mobile-header-label-font-size' ); + $style = astra_get_option( 'mobile-header-toggle-btn-style' ); + $default = '#ffffff'; + + if ( 'fill' !== $style ) { + $default = $theme_color; + } + + $icon_color = astra_get_option( 'mobile-header-toggle-btn-color', $default ); + + // Border. + $trigger_border_width_top = ( isset( $trigger_border_width ) && isset( $trigger_border_width['top'] ) ) ? $trigger_border_width['top'] : 0; + + $trigger_border_width_bottom = ( isset( $trigger_border_width ) && isset( $trigger_border_width['bottom'] ) ) ? $trigger_border_width['bottom'] : 0; + + $trigger_border_width_right = ( isset( $trigger_border_width ) && isset( $trigger_border_width['right'] ) ) ? $trigger_border_width['right'] : 0; + + $trigger_border_width_left = ( isset( $trigger_border_width ) && isset( $trigger_border_width['left'] ) ) ? $trigger_border_width['left'] : 0; + + $margin = astra_get_option( $_section . '-margin' ); + $margin_selector = $selector . ' .ast-button-wrap .menu-toggle'; + + /** + * Off-Canvas CSS. + */ + $css_output = array( + + $selector . ' .ast-button-wrap .mobile-menu-toggle-icon .ast-mobile-svg' => array( + 'width' => astra_get_css_value( $icon_size, 'px' ), + 'height' => astra_get_css_value( $icon_size, 'px' ), + 'fill' => $icon_color, + ), + $selector . ' .ast-button-wrap .mobile-menu-wrap .mobile-menu' => array( + // Color. + 'color' => $icon_color, + + // Typography. + 'font-size' => astra_get_css_value( $font_size, 'px' ), + ), + $margin_selector => array( + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'desktop' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'desktop' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'desktop' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'desktop' ), + ), + ); + + // Execute all cases in customizer preview. + $is_customizer = false; + if ( is_customize_preview() ) { + $is_customizer = true; + } + switch ( $style ) { + case 'minimal': // phpcs:ignore PSR2.ControlStructures.SwitchDeclaration.TerminatingComment + $css_output_minimal = array( + $selector . ' .ast-button-wrap .ast-mobile-menu-trigger-minimal' => array( + // Color & Border. + 'color' => esc_attr( $icon_color ), + 'border' => 'none', + 'background' => 'transparent', + ), + ); + $dynamic_css .= astra_parse_css( $css_output_minimal ); + if ( false === $is_customizer ) { + break; + } + + case 'fill': // phpcs:ignore PSR2.ControlStructures.SwitchDeclaration.TerminatingComment + $css_output_fill = array( + $selector . ' .ast-button-wrap .ast-mobile-menu-trigger-fill' => array( + // Color & Border. + 'color' => esc_attr( $icon_color ), + 'border' => 'none', + 'background' => esc_attr( $trigger_bg ), + 'border-radius' => astra_get_css_value( $trigger_border_radius, 'px' ), + ), + ); + $dynamic_css .= astra_parse_css( $css_output_fill ); + if ( false === $is_customizer ) { + break; + } + + case 'outline': // phpcs:ignore PSR2.ControlStructures.SwitchDeclaration.TerminatingComment + $css_output_outline = array( + $selector . ' .ast-button-wrap .ast-mobile-menu-trigger-outline' => array( + 'background' => 'transparent', + 'color' => esc_attr( $icon_color ), + 'border-top-width' => astra_get_css_value( $trigger_border_width_top, 'px' ), + 'border-bottom-width' => astra_get_css_value( $trigger_border_width_bottom, 'px' ), + 'border-right-width' => astra_get_css_value( $trigger_border_width_right, 'px' ), + 'border-left-width' => astra_get_css_value( $trigger_border_width_left, 'px' ), + 'border-style' => 'solid', + 'border-color' => $trigger_border_color, + 'border-radius' => astra_get_css_value( $trigger_border_radius, 'px' ), + ), + ); + $dynamic_css .= astra_parse_css( $css_output_outline ); + if ( false === $is_customizer ) { + break; + } + + default: + $dynamic_css .= ''; + break; + + } + + // Tablet CSS. + $css_output_tablet = array( + + $margin_selector => array( + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'tablet' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'tablet' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'tablet' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'tablet' ), + ), + ); + + // Mobile CSS. + $css_output_mobile = array( + + $margin_selector => array( + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'mobile' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'mobile' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'mobile' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'mobile' ), + ), + ); + + /* Parse CSS from array() */ + $css_output = astra_parse_css( $css_output ); + $css_output .= astra_parse_css( $css_output_tablet, '', astra_get_tablet_breakpoint() ); + $css_output .= astra_parse_css( $css_output_mobile, '', astra_get_mobile_breakpoint() ); + + + $dynamic_css .= $css_output; + + return $dynamic_css; +} diff --git a/inc/builder/type/header/off-canvas/assets/js/minified/customizer-preview.min.js b/inc/builder/type/header/off-canvas/assets/js/minified/customizer-preview.min.js new file mode 100644 index 0000000..8b9f45b --- /dev/null +++ b/inc/builder/type/header/off-canvas/assets/js/minified/customizer-preview.min.js @@ -0,0 +1 @@ +!function(){var a=astraBuilderPreview.tablet_break_point||768,o=astraBuilderPreview.mobile_break_point||544;astra_css("astra-settings[off-canvas-close-color]","color",".ast-mobile-popup-drawer.active .menu-toggle-close"),wp.customize("astra-settings[off-canvas-background]",function(e){e.bind(function(e){astra_background_obj_css(wp.customize,e,"off-canvas-background"," .ast-mobile-popup-drawer.active .ast-mobile-popup-inner, .ast-mobile-header-wrap .ast-mobile-header-content, .ast-desktop-header-content { {{css}} }")})}),wp.customize("astra-settings[off-canvas-inner-spacing]",function(e){e.bind(function(e){var t="";""!=e&&(t+=".ast-mobile-popup-content > *, .ast-mobile-header-content > *, .ast-desktop-popup-content > *, .ast-desktop-header-content > * {",t+="padding-top: "+e+"px;",t+="padding-bottom: "+e+"px;",t+="} "),astra_add_dynamic_css("off-canvas-inner-spacing",t)})}),wp.customize("astra-settings[mobile-header-type]",function(e){e.bind(function(e){var t=document.querySelectorAll("#ast-mobile-header"),a=document.querySelectorAll("#ast-desktop-header"),o=e,s=void 0!==wp.customize._value["astra-settings[off-canvas-slide]"]?wp.customize._value["astra-settings[off-canvas-slide]"]._value:"right",e="";"off-canvas"===o?e="left"===s?"ast-mobile-popup-left":"ast-mobile-popup-right":"full-width"===o&&(e="ast-mobile-popup-full-width"),jQuery(".ast-mobile-popup-drawer").removeClass("ast-mobile-popup-left"),jQuery(".ast-mobile-popup-drawer").removeClass("ast-mobile-popup-right"),jQuery(".ast-mobile-popup-drawer").removeClass("ast-mobile-popup-full-width"),jQuery(".ast-mobile-popup-drawer").addClass(e),"full-width"===o&&(o="off-canvas");for(var n=0;n<t.length;n++)t[n].setAttribute("data-type",o);for(n=0;n<a.length;n++)a[n].setAttribute("data-type",o);e=new CustomEvent("astMobileHeaderTypeChange",{detail:{type:o}});document.dispatchEvent(e)})}),wp.customize("astra-settings[off-canvas-slide]",function(e){e.bind(function(e){var t="",t="left"===e?"ast-mobile-popup-left":"ast-mobile-popup-right";jQuery(".ast-mobile-popup-drawer").removeClass("ast-mobile-popup-left"),jQuery(".ast-mobile-popup-drawer").removeClass("ast-mobile-popup-right"),jQuery(".ast-mobile-popup-drawer").removeClass("ast-mobile-popup-full-width"),jQuery(".ast-mobile-popup-drawer").addClass(t)})}),wp.customize("astra-settings[off-canvas-padding]",function(e){e.bind(function(e){var t;""!=e.desktop.bottom||""!=e.desktop.top||""!=e.desktop.left||""!=e.desktop.right||""!=e.tablet.bottom||""!=e.tablet.top||""!=e.tablet.left||""!=e.tablet.right||""!=e.mobile.bottom||""!=e.mobile.top||""!=e.mobile.left||""!=e.mobile.right?(t="",t+=".ast-mobile-popup-drawer.active .ast-desktop-popup-content, .ast-mobile-popup-drawer.active .ast-mobile-popup-content {",t+="padding-left: "+e.desktop.left+e["desktop-unit"]+";",t+="padding-right: "+e.desktop.right+e["desktop-unit"]+";",t+="padding-top: "+e.desktop.top+e["desktop-unit"]+";",t+="padding-bottom: "+e.desktop.bottom+e["desktop-unit"]+";",t+="} ",t+="@media (max-width: "+a+"px) {",t+=".ast-mobile-popup-drawer.active .ast-desktop-popup-content, .ast-mobile-popup-drawer.active .ast-mobile-popup-content {",t+="padding-left: "+e.tablet.left+e["tablet-unit"]+";",t+="padding-right: "+e.tablet.right+e["tablet-unit"]+";",t+="padding-top: "+e.tablet.top+e["tablet-unit"]+";",t+="padding-bottom: "+e.tablet.bottom+e["tablet-unit"]+";",t+="} ",t+="} ",t+="@media (max-width: "+o+"px) {",t+=".ast-mobile-popup-drawer.active .ast-desktop-popup-content, .ast-mobile-popup-drawer.active .ast-mobile-popup-content {",t+="padding-left: "+e.mobile.left+e["mobile-unit"]+";",t+="padding-right: "+e.mobile.right+e["mobile-unit"]+";",t+="padding-top: "+e.mobile.top+e["mobile-unit"]+";",t+="padding-bottom: "+e.mobile.bottom+e["mobile-unit"]+";",t+="} ",t+="} ",astra_add_dynamic_css("off-canvas-padding",t)):astra_add_dynamic_css("off-canvas-padding","")})}),wp.customize("astra-settings[header-builder-menu-toggle-target]",function(e){e.bind(function(e){e="ast-builder-menu-toggle-"+e+" ";jQuery(".site-header").removeClass("ast-builder-menu-toggle-icon"),jQuery(".site-header").removeClass("ast-builder-menu-toggle-link"),jQuery(".site-header").addClass(e)})}),wp.customize("astra-settings[header-offcanvas-content-alignment]",function(e){e.bind(function(e){var t="content-align-"+e+" ",a="center";jQuery(".ast-mobile-header-content").removeClass("content-align-flex-start"),jQuery(".ast-mobile-header-content").removeClass("content-align-flex-end"),jQuery(".ast-mobile-header-content").removeClass("content-align-center"),jQuery(".ast-mobile-popup-drawer").removeClass("content-align-flex-end"),jQuery(".ast-mobile-popup-drawer").removeClass("content-align-flex-start"),jQuery(".ast-mobile-popup-drawer").removeClass("content-align-center"),jQuery(".ast-desktop-header-content").removeClass("content-align-flex-start"),jQuery(".ast-desktop-header-content").removeClass("content-align-flex-end"),jQuery(".ast-desktop-header-content").removeClass("content-align-center"),jQuery(".ast-desktop-header-content").addClass(t),jQuery(".ast-mobile-header-content").addClass(t),jQuery(".ast-mobile-popup-drawer").addClass(t),"flex-start"===e?a="left":"flex-end"===e&&(a="right");t=".content-align-"+e+" .ast-builder-layout-element {";t+="justify-content: "+e+";",t+="} ",t+=".content-align-"+e+" .main-header-menu {",t+="text-align: "+a+";",t+="} ",astra_add_dynamic_css("header-offcanvas-content-alignment",t)})})}(jQuery);
\ No newline at end of file diff --git a/inc/builder/type/header/off-canvas/assets/js/unminified/customizer-preview.js b/inc/builder/type/header/off-canvas/assets/js/unminified/customizer-preview.js new file mode 100644 index 0000000..dcf518b --- /dev/null +++ b/inc/builder/type/header/off-canvas/assets/js/unminified/customizer-preview.js @@ -0,0 +1,205 @@ +/**
+ * This file adds some LIVE to the Customizer live preview. To leverage
+ * this, set your custom settings to 'postMessage' and then add your handling
+ * here. Your javascript should grab settings from customizer controls, and
+ * then make any necessary changes to the page using jQuery.
+ *
+ * @package Astra
+ * @since 3.0.0
+ */
+
+( function( $ ) {
+
+ var tablet_break_point = astraBuilderPreview.tablet_break_point || 768,
+ mobile_break_point = astraBuilderPreview.mobile_break_point || 544;
+
+ // Close Icon Color.
+ astra_css(
+ 'astra-settings[off-canvas-close-color]',
+ 'color',
+ '.ast-mobile-popup-drawer.active .menu-toggle-close'
+ );
+
+ // Off-Canvas Background Color.
+ wp.customize( 'astra-settings[off-canvas-background]', function( value ) {
+ value.bind( function( bg_obj ) {
+ var dynamicStyle = ' .ast-mobile-popup-drawer.active .ast-mobile-popup-inner, .ast-mobile-header-wrap .ast-mobile-header-content, .ast-desktop-header-content { {{css}} }';
+ astra_background_obj_css( wp.customize, bg_obj, 'off-canvas-background', dynamicStyle );
+ } );
+ } );
+
+ wp.customize( 'astra-settings[off-canvas-inner-spacing]', function ( value ) {
+ value.bind( function ( spacing ) {
+ var dynamicStyle = '';
+ if( spacing != '' ) {
+ dynamicStyle += '.ast-mobile-popup-content > *, .ast-mobile-header-content > *, .ast-desktop-popup-content > *, .ast-desktop-header-content > * {';
+ dynamicStyle += 'padding-top: ' + spacing + 'px;';
+ dynamicStyle += 'padding-bottom: ' + spacing + 'px;';
+ dynamicStyle += '} ';
+ }
+ astra_add_dynamic_css( 'off-canvas-inner-spacing', dynamicStyle );
+ } );
+ } );
+
+ wp.customize( 'astra-settings[mobile-header-type]', function ( value ) {
+ value.bind( function ( newVal ) {
+
+ var mobile_header = document.querySelectorAll( "#ast-mobile-header" );
+ var desktop_header = document.querySelectorAll( "#ast-desktop-header" );
+ var header_type = newVal;
+ var off_canvas_slide = ( typeof ( wp.customize._value['astra-settings[off-canvas-slide]'] ) != 'undefined' ) ? wp.customize._value['astra-settings[off-canvas-slide]']._value : 'right';
+
+ var side_class = '';
+
+ if ( 'off-canvas' === header_type ) {
+
+ if ( 'left' === off_canvas_slide ) {
+
+ side_class = 'ast-mobile-popup-left';
+ } else {
+
+ side_class = 'ast-mobile-popup-right';
+ }
+ } else if ( 'full-width' === header_type ) {
+
+ side_class = 'ast-mobile-popup-full-width';
+ }
+
+ jQuery('.ast-mobile-popup-drawer').removeClass( 'ast-mobile-popup-left' );
+ jQuery('.ast-mobile-popup-drawer').removeClass( 'ast-mobile-popup-right' );
+ jQuery('.ast-mobile-popup-drawer').removeClass( 'ast-mobile-popup-full-width' );
+ jQuery('.ast-mobile-popup-drawer').addClass( side_class );
+
+ if( 'full-width' === header_type ) {
+
+ header_type = 'off-canvas';
+ }
+
+ for ( var k = 0; k < mobile_header.length; k++ ) {
+ mobile_header[k].setAttribute( 'data-type', header_type );
+ }
+ for ( var k = 0; k < desktop_header.length; k++ ) {
+ desktop_header[k].setAttribute( 'data-type', header_type );
+ }
+
+ var event = new CustomEvent( "astMobileHeaderTypeChange",
+ {
+ "detail": { 'type' : header_type }
+ }
+ );
+
+ document.dispatchEvent(event);
+ } );
+ } );
+
+ wp.customize( 'astra-settings[off-canvas-slide]', function ( value ) {
+ value.bind( function ( newval ) {
+
+ var side_class = '';
+
+ if ( 'left' === newval ) {
+
+ side_class = 'ast-mobile-popup-left';
+ } else {
+
+ side_class = 'ast-mobile-popup-right';
+ }
+
+ jQuery('.ast-mobile-popup-drawer').removeClass( 'ast-mobile-popup-left' );
+ jQuery('.ast-mobile-popup-drawer').removeClass( 'ast-mobile-popup-right' );
+ jQuery('.ast-mobile-popup-drawer').removeClass( 'ast-mobile-popup-full-width' );
+ jQuery('.ast-mobile-popup-drawer').addClass( side_class );
+ } );
+ } );
+
+ // Padding.
+ wp.customize( 'astra-settings[off-canvas-padding]', function( value ) {
+ value.bind( function( padding ) {
+ if(
+ padding.desktop.bottom != '' || padding.desktop.top != '' || padding.desktop.left != '' || padding.desktop.right != '' ||
+ padding.tablet.bottom != '' || padding.tablet.top != '' || padding.tablet.left != '' || padding.tablet.right != '' ||
+ padding.mobile.bottom != '' || padding.mobile.top != '' || padding.mobile.left != '' || padding.mobile.right != ''
+ ) {
+ var dynamicStyle = '';
+ dynamicStyle += '.ast-mobile-popup-drawer.active .ast-desktop-popup-content, .ast-mobile-popup-drawer.active .ast-mobile-popup-content {';
+ dynamicStyle += 'padding-left: ' + padding['desktop']['left'] + padding['desktop-unit'] + ';';
+ dynamicStyle += 'padding-right: ' + padding['desktop']['right'] + padding['desktop-unit'] + ';';
+ dynamicStyle += 'padding-top: ' + padding['desktop']['top'] + padding['desktop-unit'] + ';';
+ dynamicStyle += 'padding-bottom: ' + padding['desktop']['bottom'] + padding['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += '.ast-mobile-popup-drawer.active .ast-desktop-popup-content, .ast-mobile-popup-drawer.active .ast-mobile-popup-content {';
+ dynamicStyle += 'padding-left: ' + padding['tablet']['left'] + padding['tablet-unit'] + ';';
+ dynamicStyle += 'padding-right: ' + padding['tablet']['right'] + padding['tablet-unit'] + ';';
+ dynamicStyle += 'padding-top: ' + padding['tablet']['top'] + padding['tablet-unit'] + ';';
+ dynamicStyle += 'padding-bottom: ' + padding['tablet']['bottom'] + padding['tablet-unit'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += '.ast-mobile-popup-drawer.active .ast-desktop-popup-content, .ast-mobile-popup-drawer.active .ast-mobile-popup-content {';
+ dynamicStyle += 'padding-left: ' + padding['mobile']['left'] + padding['mobile-unit'] + ';';
+ dynamicStyle += 'padding-right: ' + padding['mobile']['right'] + padding['mobile-unit'] + ';';
+ dynamicStyle += 'padding-top: ' + padding['mobile']['top'] + padding['mobile-unit'] + ';';
+ dynamicStyle += 'padding-bottom: ' + padding['mobile']['bottom'] + padding['mobile-unit'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+ astra_add_dynamic_css( 'off-canvas-padding', dynamicStyle );
+ } else {
+ astra_add_dynamic_css( 'off-canvas-padding', '' );
+ }
+ } );
+ } );
+
+ wp.customize( 'astra-settings[header-builder-menu-toggle-target]', function ( value ) {
+ value.bind( function ( newval ) {
+ var menuTargetClass = 'ast-builder-menu-toggle-' + newval + ' ';
+
+ jQuery( '.site-header' ).removeClass( 'ast-builder-menu-toggle-icon' );
+ jQuery( '.site-header' ).removeClass( 'ast-builder-menu-toggle-link' );
+ jQuery( '.site-header' ).addClass( menuTargetClass );
+ } );
+ } );
+
+ wp.customize( 'astra-settings[header-offcanvas-content-alignment]', function ( value ) {
+ value.bind( function ( newval ) {
+
+ var alignment_class = 'content-align-' + newval + ' ';
+ var menu_content_alignment = 'center';
+
+ jQuery('.ast-mobile-header-content').removeClass( 'content-align-flex-start' );
+ jQuery('.ast-mobile-header-content').removeClass( 'content-align-flex-end' );
+ jQuery('.ast-mobile-header-content').removeClass( 'content-align-center' );
+ jQuery('.ast-mobile-popup-drawer').removeClass( 'content-align-flex-end' );
+ jQuery('.ast-mobile-popup-drawer').removeClass( 'content-align-flex-start' );
+ jQuery('.ast-mobile-popup-drawer').removeClass( 'content-align-center' );
+ jQuery('.ast-desktop-header-content').removeClass( 'content-align-flex-start' );
+ jQuery('.ast-desktop-header-content').removeClass( 'content-align-flex-end' );
+ jQuery('.ast-desktop-header-content').removeClass( 'content-align-center' );
+
+ jQuery('.ast-desktop-header-content').addClass( alignment_class );
+ jQuery('.ast-mobile-header-content').addClass( alignment_class );
+ jQuery('.ast-mobile-popup-drawer').addClass( alignment_class );
+
+
+
+ if ( 'flex-start' === newval ) {
+ menu_content_alignment = 'left';
+ } else if ( 'flex-end' === newval ) {
+ menu_content_alignment = 'right';
+ }
+
+ var dynamicStyle = '.content-align-' + newval + ' .ast-builder-layout-element {';
+ dynamicStyle += 'justify-content: ' + newval + ';';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '.content-align-' + newval + ' .main-header-menu {';
+ dynamicStyle += 'text-align: ' + menu_content_alignment + ';';
+ dynamicStyle += '} ';
+
+ astra_add_dynamic_css( 'header-offcanvas-content-alignment', dynamicStyle );
+ } );
+ } );
+
+} )( jQuery );
diff --git a/inc/builder/type/header/off-canvas/class-astra-off-canvas-loader.php b/inc/builder/type/header/off-canvas/class-astra-off-canvas-loader.php new file mode 100644 index 0000000..dbabfae --- /dev/null +++ b/inc/builder/type/header/off-canvas/class-astra-off-canvas-loader.php @@ -0,0 +1,53 @@ +<?php +/** + * Off Canvas Loader. + * + * @package astra-builder + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Class Astra_Off_Canvas_Loader + * + * Loads config files. + * + * @since 3.0.0 + */ +class Astra_Off_Canvas_Loader { + + /** + * Constructor + * + * @since 3.0.0 + */ + public function __construct() { + add_action( 'customize_preview_init', array( $this, 'preview_scripts' ), 110 ); + } + + /** + * Customizer Preview + * + * @since 3.0.0 + */ + public function preview_scripts() { + /** + * Load unminified if SCRIPT_DEBUG is true. + */ + /* Directory and Extension */ + $dir_name = ( SCRIPT_DEBUG ) ? 'unminified' : 'minified'; + $file_prefix = ( SCRIPT_DEBUG ) ? '' : '.min'; + wp_enqueue_script( 'astra-off-canvas-customizer-preview-js', ASTRA_OFF_CANVAS_URI . '/assets/js/' . $dir_name . '/customizer-preview' . $file_prefix . '.js', array( 'customize-preview', 'astra-customizer-preview-js' ), ASTRA_THEME_VERSION, true ); + } +} + +/** +* Kicking this off by creating the object of the class. +*/ +new Astra_Off_Canvas_Loader(); diff --git a/inc/builder/type/header/off-canvas/class-astra-off-canvas.php b/inc/builder/type/header/off-canvas/class-astra-off-canvas.php new file mode 100644 index 0000000..48166b1 --- /dev/null +++ b/inc/builder/type/header/off-canvas/class-astra-off-canvas.php @@ -0,0 +1,45 @@ +<?php +/** + * Off Canvas. + * + * @package astra-builder + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +define( 'ASTRA_OFF_CANVAS_DIR', ASTRA_THEME_DIR . 'inc/builder/type/header/off-canvas' ); +define( 'ASTRA_OFF_CANVAS_URI', ASTRA_THEME_URI . 'inc/builder/type/header/off-canvas' ); + +/** + * Off Canvas Initial Setup + * + * @since 3.0.0 + */ +class Astra_Off_Canvas { + + /** + * Constructor function that initializes required actions and hooks. + */ + public function __construct() { + + // @codingStandardsIgnoreStart WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + require_once ASTRA_OFF_CANVAS_DIR . '/class-astra-off-canvas-loader.php'; + + // Include front end files. + if ( ! is_admin() ) { + require_once ASTRA_OFF_CANVAS_DIR . '/dynamic-css/dynamic.css.php'; + } + // @codingStandardsIgnoreEnd WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + } +} + +/** + * Kicking this off by creating an object. + */ +new Astra_Off_Canvas(); diff --git a/inc/builder/type/header/off-canvas/dynamic-css/dynamic.css.php b/inc/builder/type/header/off-canvas/dynamic-css/dynamic.css.php new file mode 100644 index 0000000..d0c1517 --- /dev/null +++ b/inc/builder/type/header/off-canvas/dynamic-css/dynamic.css.php @@ -0,0 +1,592 @@ +<?php +/** + * Off Canvas - Dynamic CSS + * + * @package astra-builder + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Off Canvas Row. + */ +add_filter( 'astra_dynamic_theme_css', 'astra_off_canvas_row_setting', 11 ); + +/** + * Off Canvas Row - Dynamic CSS + * + * @param string $dynamic_css Astra Dynamic CSS. + * @param string $dynamic_css_filtered Astra Dynamic CSS Filters. + * @return String Generated dynamic CSS for Heading Colors. + * + * @since 3.0.0 + */ +function astra_off_canvas_row_setting( $dynamic_css, $dynamic_css_filtered = '' ) { + + $selector = '.ast-mobile-popup-drawer.active'; + + $off_canvas_background = astra_get_option( 'off-canvas-background' ); + $off_canvas_close_color = astra_get_option( 'off-canvas-close-color' ); + $offcanvas_content_alignment = astra_get_option( 'header-offcanvas-content-alignment', 'flex-start' ); + $padding = astra_get_option( 'off-canvas-padding' ); + $menu_content_alignment = 'center'; + $inner_spacing = astra_get_option( 'off-canvas-inner-spacing' ); + $mobile_header_type = astra_get_option( 'mobile-header-type' ); + + $inner_spacing = ( isset( $inner_spacing ) ) ? (int) $inner_spacing : ''; + + if ( 'flex-start' === $offcanvas_content_alignment ) { + $menu_content_alignment = 'left'; + } elseif ( 'flex-end' === $offcanvas_content_alignment ) { + $menu_content_alignment = 'right'; + } + + if ( 'off-canvas' === $mobile_header_type || 'full-width' === $mobile_header_type || is_customize_preview() ) { + $dynamic_css .= astra_off_canvas_static_css(); + } + if ( 'dropdown' === $mobile_header_type || is_customize_preview() ) { + $dynamic_css .= astra_dropdown_type_static_css(); + } + + /** + * Off-Canvas CSS. + */ + $css_output = array( + + $selector . ' .ast-mobile-popup-inner' => astra_get_background_obj( $off_canvas_background ), + + '.ast-mobile-header-wrap .ast-mobile-header-content, .ast-desktop-header-content' => astra_get_background_obj( $off_canvas_background ), + '.ast-mobile-popup-drawer.active .ast-desktop-popup-content, .ast-mobile-popup-drawer.active .ast-mobile-popup-content' => array( + // Padding CSS. + 'padding-top' => astra_responsive_spacing( $padding, 'top', 'desktop' ), + 'padding-bottom' => astra_responsive_spacing( $padding, 'bottom', 'desktop' ), + 'padding-left' => astra_responsive_spacing( $padding, 'left', 'desktop' ), + 'padding-right' => astra_responsive_spacing( $padding, 'right', 'desktop' ), + ), + '.ast-mobile-popup-content > *, .ast-mobile-header-content > *, .ast-desktop-popup-content > *, .ast-desktop-header-content > *' => array( + 'padding-top' => astra_get_css_value( $inner_spacing, 'px' ), + 'padding-bottom' => astra_get_css_value( $inner_spacing, 'px' ), + ), + '.content-align-' . esc_attr( $offcanvas_content_alignment ) . ' .ast-builder-layout-element' => array( + 'justify-content' => esc_attr( $offcanvas_content_alignment ), + ), + '.content-align-' . esc_attr( $offcanvas_content_alignment ) . ' .main-header-menu' => array( + 'text-align' => esc_attr( $menu_content_alignment ), + ), + ); + + $css_output[ $selector . ' .ast-mobile-popup-drawer.active .menu-toggle-close' ]['color'] = $off_canvas_close_color; + + /* Parse CSS from array() */ + $css_output = astra_parse_css( $css_output ); + + // Tablet CSS. + $css_output_tablet = array( + '.ast-mobile-popup-drawer.active .ast-desktop-popup-content, .ast-mobile-popup-drawer.active .ast-mobile-popup-content' => array( + // Padding CSS. + 'padding-top' => astra_responsive_spacing( $padding, 'top', 'tablet' ), + 'padding-bottom' => astra_responsive_spacing( $padding, 'bottom', 'tablet' ), + 'padding-left' => astra_responsive_spacing( $padding, 'left', 'tablet' ), + 'padding-right' => astra_responsive_spacing( $padding, 'right', 'tablet' ), + ), + ); + + $css_output_mobile = array( + + '.ast-mobile-popup-drawer.active .ast-desktop-popup-content, .ast-mobile-popup-drawer.active .ast-mobile-popup-content' => array( + // Padding CSS. + 'padding-top' => astra_responsive_spacing( $padding, 'top', 'mobile' ), + 'padding-bottom' => astra_responsive_spacing( $padding, 'bottom', 'mobile' ), + 'padding-left' => astra_responsive_spacing( $padding, 'left', 'mobile' ), + 'padding-right' => astra_responsive_spacing( $padding, 'right', 'mobile' ), + ), + ); + + $css_output .= astra_parse_css( $css_output_tablet, '', astra_get_tablet_breakpoint() ); + $css_output .= astra_parse_css( $css_output_mobile, '', astra_get_mobile_breakpoint() ); + + $dynamic_css .= $css_output; + + return $dynamic_css; +} + +/** + * Add static CSS for Off-canvas flyout. + * + * @since 3.4.0 + * @return string. + */ +function astra_off_canvas_static_css() { + $off_canvas_css = ' + .ast-off-canvas-active body.ast-main-header-nav-open { + overflow: hidden; + } + .ast-mobile-popup-drawer .ast-mobile-popup-overlay { + background-color: rgba(0, 0, 0, 0.4); + position: fixed; + top: 0; + right: 0; + bottom: 0; + left: 0; + visibility: hidden; + opacity: 0; + transition: opacity 0.2s ease-in-out; + } + .ast-mobile-popup-drawer .ast-mobile-popup-header { + -js-display: flex; + display: flex; + justify-content: flex-end; + min-height: calc( 1.2em + 24px); + } + .ast-mobile-popup-drawer .ast-mobile-popup-header .menu-toggle-close { + background: transparent; + border: 0; + font-size: 24px; + line-height: 1; + padding: .6em; + color: inherit; + -js-display: flex; + display: flex; + box-shadow: none; + } + .ast-mobile-popup-drawer.ast-mobile-popup-full-width .ast-mobile-popup-inner { + max-width: none; + transition: transform 0s ease-in, opacity 0.2s ease-in; + } + .ast-mobile-popup-drawer.active { + left: 0; + opacity: 1; + right: 0; + z-index: 100000; + transition: opacity 0.25s ease-out; + } + .ast-mobile-popup-drawer.active .ast-mobile-popup-overlay { + opacity: 1; + cursor: pointer; + visibility: visible; + } + body.admin-bar .ast-mobile-popup-drawer, body.admin-bar .ast-mobile-popup-drawer .ast-mobile-popup-inner { + top: 32px; + } + body.admin-bar.ast-primary-sticky-header-active .ast-mobile-popup-drawer, body.admin-bar.ast-primary-sticky-header-active .ast-mobile-popup-drawer .ast-mobile-popup-inner { + top: 0px; + } + @media (max-width: 782px) { + body.admin-bar .ast-mobile-popup-drawer,body.admin-bar .ast-mobile-popup-drawer .ast-mobile-popup-inner { + top: 46px; + } + } + .ast-mobile-popup-content > *, + .ast-desktop-popup-content > *{ + padding: 10px 0; + height: auto; + } + + .ast-mobile-popup-content > *:first-child, + .ast-desktop-popup-content > *:first-child{ + padding-top: 10px; + } + + .ast-mobile-popup-content > .ast-builder-menu, + .ast-desktop-popup-content > .ast-builder-menu{ + padding-top: 0; + } + .ast-mobile-popup-content > *:last-child, + .ast-desktop-popup-content > *:last-child { + padding-bottom: 0; + } + .ast-mobile-popup-drawer .ast-mobile-popup-content .ast-search-icon, + .ast-mobile-popup-drawer .main-header-bar-navigation .menu-item-has-children .sub-menu, + .ast-mobile-popup-drawer .ast-desktop-popup-content .ast-search-icon { + display: none; + } + + .ast-mobile-popup-drawer .ast-mobile-popup-content .ast-search-menu-icon.ast-inline-search label, + .ast-mobile-popup-drawer .ast-desktop-popup-content .ast-search-menu-icon.ast-inline-search label { + width: 100%; + } + .ast-mobile-popup-content .ast-builder-menu-mobile .main-header-menu, .ast-mobile-popup-content .ast-builder-menu-mobile .main-header-menu .sub-menu { + background-color: transparent; + } + .ast-mobile-popup-content .ast-icon svg { + height: .85em; + width: .95em; + margin-top: 15px; + } + .ast-mobile-popup-content .ast-icon.icon-search svg { + margin-top: 0; + } + .ast-desktop .ast-desktop-popup-content .astra-menu-animation-slide-up > .menu-item > .sub-menu, + .ast-desktop .ast-desktop-popup-content .astra-menu-animation-slide-up > .menu-item .menu-item > .sub-menu, + .ast-desktop .ast-desktop-popup-content .astra-menu-animation-slide-down > .menu-item > .sub-menu, + .ast-desktop .ast-desktop-popup-content .astra-menu-animation-slide-down > .menu-item .menu-item > .sub-menu, + .ast-desktop .ast-desktop-popup-content .astra-menu-animation-fade > .menu-item > .sub-menu, + .ast-mobile-popup-drawer.show, + .ast-desktop .ast-desktop-popup-content .astra-menu-animation-fade > .menu-item .menu-item > .sub-menu{ + opacity: 1; + visibility: visible; + }'; + + if ( is_rtl() ) { + $off_canvas_css .= ' + .ast-mobile-popup-drawer { + position: fixed; + top: 0; + bottom: 0; + right: -99999rem; + left: 99999rem; + transition: opacity 0.25s ease-in, right 0s 0.25s, left 0s 0.25s; + opacity: 0; + } + .ast-mobile-popup-drawer .ast-mobile-popup-inner { + width: 100%; + transform: translateX(100%); + max-width: 90%; + left: 0; + top: 0; + background: #fafafa; + color: #3a3a3a; + bottom: 0; + opacity: 0; + position: fixed; + box-shadow: 0 0 2rem 0 rgba(0, 0, 0, 0.1); + -js-display: flex; + display: flex; + flex-direction: column; + transition: transform 0.2s ease-in, opacity 0.2s ease-in; + overflow-y:auto; + overflow-x:hidden; + } + .ast-mobile-popup-drawer.ast-mobile-popup-left .ast-mobile-popup-inner { + transform: translateX(-100%); + left: auto; + right: 0; + } + .ast-hfb-header.ast-default-menu-enable.ast-header-break-point .ast-mobile-popup-drawer .main-header-bar-navigation ul .menu-item .sub-menu .menu-link { + padding-right: 30px; + } + .ast-hfb-header.ast-default-menu-enable.ast-header-break-point .ast-mobile-popup-drawer .main-header-bar-navigation .sub-menu .menu-item .menu-item .menu-link { + padding-right: 40px; + } + .ast-mobile-popup-drawer .main-header-bar-navigation .menu-item-has-children > .ast-menu-toggle { + left: calc( 20px - 0.907em); + } + .ast-mobile-popup-drawer.content-align-flex-end .main-header-bar-navigation .menu-item-has-children > .ast-menu-toggle { + right: calc( 20px - 0.907em); + } + .ast-mobile-popup-drawer .ast-mobile-popup-content .ast-search-menu-icon, + .ast-mobile-popup-drawer .ast-mobile-popup-content .ast-search-menu-icon.slide-search, + .ast-mobile-popup-drawer .ast-desktop-popup-content .ast-search-menu-icon, + .ast-mobile-popup-drawer .ast-desktop-popup-content .ast-search-menu-icon.slide-search { + width: 100%; + position: relative; + display: block; + left: auto; + transform: none; + } + .ast-mobile-popup-drawer .ast-mobile-popup-content .ast-search-menu-icon.slide-search .search-form, + .ast-mobile-popup-drawer .ast-mobile-popup-content .ast-search-menu-icon .search-form, + .ast-mobile-popup-drawer .ast-desktop-popup-content .ast-search-menu-icon.slide-search .search-form, + .ast-mobile-popup-drawer .ast-desktop-popup-content .ast-search-menu-icon .search-form { + left: 0; + visibility: visible; + opacity: 1; + position: relative; + top: auto; + transform: none; + padding: 0; + display: block; + overflow: hidden; + } + + .ast-mobile-popup-drawer .ast-mobile-popup-content .ast-search-menu-icon.ast-inline-search .search-field, + .ast-mobile-popup-drawer .ast-mobile-popup-content .ast-search-menu-icon .search-field, + .ast-mobile-popup-drawer .ast-desktop-popup-content .ast-search-menu-icon.ast-inline-search .search-field, + .ast-mobile-popup-drawer .ast-desktop-popup-content .ast-search-menu-icon .search-field { + width: 100%; + padding-left: 5.5em; + } + .ast-mobile-popup-drawer .ast-mobile-popup-content .ast-search-menu-icon .search-submit, + .ast-mobile-popup-drawer .ast-desktop-popup-content .ast-search-menu-icon .search-submit { + display: block; + position: absolute; + height: 100%; + top: 0; + left: 0; + padding: 0 1em; + border-radius: 0; + }'; + } else { + $off_canvas_css .= ' + .ast-mobile-popup-drawer { + position: fixed; + top: 0; + bottom: 0; + left: -99999rem; + right: 99999rem; + transition: opacity 0.25s ease-in, left 0s 0.25s, right 0s 0.25s; + opacity: 0; + } + .ast-mobile-popup-drawer .ast-mobile-popup-inner { + width: 100%; + transform: translateX(100%); + max-width: 90%; + right: 0; + top: 0; + background: #fafafa; + color: #3a3a3a; + bottom: 0; + opacity: 0; + position: fixed; + box-shadow: 0 0 2rem 0 rgba(0, 0, 0, 0.1); + -js-display: flex; + display: flex; + flex-direction: column; + transition: transform 0.2s ease-in, opacity 0.2s ease-in; + overflow-y:auto; + overflow-x:hidden; + } + .ast-mobile-popup-drawer.ast-mobile-popup-left .ast-mobile-popup-inner { + transform: translateX(-100%); + right: auto; + left: 0; + } + .ast-hfb-header.ast-default-menu-enable.ast-header-break-point .ast-mobile-popup-drawer .main-header-bar-navigation ul .menu-item .sub-menu .menu-link { + padding-left: 30px; + } + .ast-hfb-header.ast-default-menu-enable.ast-header-break-point .ast-mobile-popup-drawer .main-header-bar-navigation .sub-menu .menu-item .menu-item .menu-link { + padding-left: 40px; + } + .ast-mobile-popup-drawer .main-header-bar-navigation .menu-item-has-children > .ast-menu-toggle { + right: calc( 20px - 0.907em); + } + .ast-mobile-popup-drawer.content-align-flex-end .main-header-bar-navigation .menu-item-has-children > .ast-menu-toggle { + left: calc( 20px - 0.907em); + } + .ast-mobile-popup-drawer .ast-mobile-popup-content .ast-search-menu-icon, + .ast-mobile-popup-drawer .ast-mobile-popup-content .ast-search-menu-icon.slide-search, + .ast-mobile-popup-drawer .ast-desktop-popup-content .ast-search-menu-icon, + .ast-mobile-popup-drawer .ast-desktop-popup-content .ast-search-menu-icon.slide-search { + width: 100%; + position: relative; + display: block; + right: auto; + transform: none; + } + .ast-mobile-popup-drawer .ast-mobile-popup-content .ast-search-menu-icon.slide-search .search-form, + .ast-mobile-popup-drawer .ast-mobile-popup-content .ast-search-menu-icon .search-form, + .ast-mobile-popup-drawer .ast-desktop-popup-content .ast-search-menu-icon.slide-search .search-form, + .ast-mobile-popup-drawer .ast-desktop-popup-content .ast-search-menu-icon .search-form { + right: 0; + visibility: visible; + opacity: 1; + position: relative; + top: auto; + transform: none; + padding: 0; + display: block; + overflow: hidden; + } + + .ast-mobile-popup-drawer .ast-mobile-popup-content .ast-search-menu-icon.ast-inline-search .search-field, + .ast-mobile-popup-drawer .ast-mobile-popup-content .ast-search-menu-icon .search-field, + .ast-mobile-popup-drawer .ast-desktop-popup-content .ast-search-menu-icon.ast-inline-search .search-field, + .ast-mobile-popup-drawer .ast-desktop-popup-content .ast-search-menu-icon .search-field { + width: 100%; + padding-right: 5.5em; + } + .ast-mobile-popup-drawer .ast-mobile-popup-content .ast-search-menu-icon .search-submit, + .ast-mobile-popup-drawer .ast-desktop-popup-content .ast-search-menu-icon .search-submit { + display: block; + position: absolute; + height: 100%; + top: 0; + right: 0; + padding: 0 1em; + border-radius: 0; + }'; + } + + // Adding this CSS to bottom because it needs to be load after above style loads. As it required to hide/show flyout offcanvas. + $off_canvas_css .= ' + .ast-mobile-popup-drawer.active .ast-mobile-popup-inner { + opacity: 1; + visibility: visible; + transform: translateX(0%); + }'; + + return Astra_Enqueue_Scripts::trim_css( $off_canvas_css ); +} + + +/** + * Add static CSS for Dropdown Type. + * + * @since 3.4.0 + * @return string. + */ +function astra_dropdown_type_static_css() { + $dropdown_type_css = ' + .ast-mobile-header-content > *, + .ast-desktop-header-content > * { + padding: 10px 0; + height: auto; + } + .ast-mobile-header-content > *:first-child, + .ast-desktop-header-content > *:first-child { + padding-top: 10px; + } + .ast-mobile-header-content > .ast-builder-menu, + .ast-desktop-header-content > .ast-builder-menu { + padding-top: 0; + } + + .ast-mobile-header-content > *:last-child, + .ast-desktop-header-content > *:last-child { + padding-bottom: 0; + } + .ast-mobile-header-content .ast-search-menu-icon.ast-inline-search label, + .ast-desktop-header-content .ast-search-menu-icon.ast-inline-search label { + width: 100%; + } + .ast-desktop-header-content .main-header-bar-navigation .ast-submenu-expanded > .ast-menu-toggle::before { + transform: rotateX(180deg); + } + #ast-desktop-header .ast-desktop-header-content, + .ast-mobile-header-content .ast-search-icon, + .ast-desktop-header-content .ast-search-icon, + .ast-mobile-header-wrap .ast-mobile-header-content, + .ast-main-header-nav-open.ast-popup-nav-open .ast-mobile-header-wrap .ast-mobile-header-content, + .ast-main-header-nav-open.ast-popup-nav-open .ast-desktop-header-content { + display: none; + } + .ast-main-header-nav-open.ast-header-break-point #ast-desktop-header .ast-desktop-header-content, + .ast-main-header-nav-open.ast-header-break-point .ast-mobile-header-wrap .ast-mobile-header-content { + display: block; + } + .ast-desktop .ast-desktop-header-content .astra-menu-animation-slide-up > .menu-item > .sub-menu, + .ast-desktop .ast-desktop-header-content .astra-menu-animation-slide-up > .menu-item .menu-item > .sub-menu, + .ast-desktop .ast-desktop-header-content .astra-menu-animation-slide-down > .menu-item > .sub-menu, + .ast-desktop .ast-desktop-header-content .astra-menu-animation-slide-down > .menu-item .menu-item > .sub-menu, + .ast-desktop .ast-desktop-header-content .astra-menu-animation-fade > .menu-item > .sub-menu, + .ast-desktop .ast-desktop-header-content .astra-menu-animation-fade > .menu-item .menu-item > .sub-menu { + opacity: 1; + visibility: visible; + } + .ast-hfb-header.ast-default-menu-enable.ast-header-break-point .ast-mobile-header-wrap .ast-mobile-header-content .main-header-bar-navigation { + width: unset; + margin: unset; + }'; + + if ( is_rtl() ) { + $dropdown_type_css .= ' + .ast-mobile-header-content.content-align-flex-end .main-header-bar-navigation .menu-item-has-children > .ast-menu-toggle, + .ast-desktop-header-content.content-align-flex-end .main-header-bar-navigation .menu-item-has-children > .ast-menu-toggle { + right: calc( 20px - 0.907em); + } + .ast-mobile-header-content .ast-search-menu-icon, + .ast-mobile-header-content .ast-search-menu-icon.slide-search, + .ast-desktop-header-content .ast-search-menu-icon, + .ast-desktop-header-content .ast-search-menu-icon.slide-search { + width: 100%; + position: relative; + display: block; + left: auto; + transform: none; + } + .ast-mobile-header-content .ast-search-menu-icon.slide-search .search-form, + .ast-mobile-header-content .ast-search-menu-icon .search-form, + .ast-desktop-header-content .ast-search-menu-icon.slide-search .search-form, + .ast-desktop-header-content .ast-search-menu-icon .search-form { + left: 0; + visibility: visible; + opacity: 1; + position: relative; + top: auto; + transform: none; + padding: 0; + display: block; + overflow: hidden; + } + .ast-mobile-header-content .ast-search-menu-icon.ast-inline-search .search-field, + .ast-mobile-header-content .ast-search-menu-icon .search-field, + .ast-desktop-header-content .ast-search-menu-icon.ast-inline-search .search-field, + .ast-desktop-header-content .ast-search-menu-icon .search-field { + width: 100%; + padding-left: 5.5em; + } + .ast-mobile-header-content .ast-search-menu-icon .search-submit, + .ast-desktop-header-content .ast-search-menu-icon .search-submit { + display: block; + position: absolute; + height: 100%; + top: 0; + left: 0; + padding: 0 1em; + border-radius: 0; + } + .ast-hfb-header.ast-default-menu-enable.ast-header-break-point .ast-mobile-header-wrap .ast-mobile-header-content .main-header-bar-navigation ul .sub-menu .menu-link { + padding-right: 30px; + } + .ast-hfb-header.ast-default-menu-enable.ast-header-break-point .ast-mobile-header-wrap .ast-mobile-header-content .main-header-bar-navigation .sub-menu .menu-item .menu-item .menu-link { + padding-right: 40px; + }'; + } else { + $dropdown_type_css .= ' + .ast-mobile-header-content.content-align-flex-end .main-header-bar-navigation .menu-item-has-children > .ast-menu-toggle, + .ast-desktop-header-content.content-align-flex-end .main-header-bar-navigation .menu-item-has-children > .ast-menu-toggle { + left: calc( 20px - 0.907em); + } + .ast-mobile-header-content .ast-search-menu-icon, + .ast-mobile-header-content .ast-search-menu-icon.slide-search, + .ast-desktop-header-content .ast-search-menu-icon, + .ast-desktop-header-content .ast-search-menu-icon.slide-search { + width: 100%; + position: relative; + display: block; + right: auto; + transform: none; + } + .ast-mobile-header-content .ast-search-menu-icon.slide-search .search-form, + .ast-mobile-header-content .ast-search-menu-icon .search-form, + .ast-desktop-header-content .ast-search-menu-icon.slide-search .search-form, + .ast-desktop-header-content .ast-search-menu-icon .search-form { + right: 0; + visibility: visible; + opacity: 1; + position: relative; + top: auto; + transform: none; + padding: 0; + display: block; + overflow: hidden; + } + .ast-mobile-header-content .ast-search-menu-icon.ast-inline-search .search-field, + .ast-mobile-header-content .ast-search-menu-icon .search-field, + .ast-desktop-header-content .ast-search-menu-icon.ast-inline-search .search-field, + .ast-desktop-header-content .ast-search-menu-icon .search-field { + width: 100%; + padding-right: 5.5em; + } + .ast-mobile-header-content .ast-search-menu-icon .search-submit, + .ast-desktop-header-content .ast-search-menu-icon .search-submit { + display: block; + position: absolute; + height: 100%; + top: 0; + right: 0; + padding: 0 1em; + border-radius: 0; + } + .ast-hfb-header.ast-default-menu-enable.ast-header-break-point .ast-mobile-header-wrap .ast-mobile-header-content .main-header-bar-navigation ul .sub-menu .menu-link { + padding-left: 30px; + } + .ast-hfb-header.ast-default-menu-enable.ast-header-break-point .ast-mobile-header-wrap .ast-mobile-header-content .main-header-bar-navigation .sub-menu .menu-item .menu-item .menu-link { + padding-left: 40px; + }'; + } + return Astra_Enqueue_Scripts::trim_css( $dropdown_type_css ); +} diff --git a/inc/builder/type/header/primary-header/assets/js/minified/customizer-preview.min.js b/inc/builder/type/header/primary-header/assets/js/minified/customizer-preview.min.js new file mode 100644 index 0000000..993c385 --- /dev/null +++ b/inc/builder/type/header/primary-header/assets/js/minified/customizer-preview.min.js @@ -0,0 +1 @@ +!function(){var t=AstraBuilderPrimaryHeaderData.tablet_break_point||768,r=AstraBuilderPrimaryHeaderData.mobile_break_point||544;wp.customize("astra-settings[hb-header-height]",function(a){a.bind(function(a){var e;""==a.desktop&&""==a.tablet&&""==a.mobile||(e="",e+=".ast-mobile-header-wrap .ast-primary-header-bar , .ast-primary-header-bar .site-primary-header-wrap {",e+="min-height: "+a.desktop+"px;",e+="} ",e+=".ast-desktop .ast-primary-header-bar .main-header-menu > .menu-item {",e+="line-height: "+a.desktop+"px;",e+="} ",e+="@media (max-width: "+t+"px) {",e+=".ast-mobile-header-wrap .ast-primary-header-bar , .ast-primary-header-bar .site-primary-header-wrap {",e+="min-height: "+a.tablet+"px;",e+="} ",e+="} ",e+="@media (max-width: "+r+"px) {",e+=".ast-mobile-header-wrap .ast-primary-header-bar , .ast-primary-header-bar .site-primary-header-wrap {",e+="min-height: "+a.mobile+"px;",e+="} ",e+="} ",astra_add_dynamic_css("hb-header-height",e))})}),wp.customize("astra-settings[hb-header-main-layout-width]",function(a){a.bind(function(a){var e="";"content"!==a?(e+="#masthead .ast-container, .site-header-focus-item + .ast-breadcrumbs-wrapper {",e+="max-width: unset;",e+="padding-left: 35px;",e+="padding-right: 35px;"):(e="#masthead .ast-container, .site-header-focus-item + .ast-breadcrumbs-wrapper {",e+="max-width: 100%",e+="padding-left: 20px;",e+="padding-right: 20px;"),e+="} ",e+="@media (max-width: "+AstraBuilderPrimaryHeaderData.header_break_point+"px) {",e+="#masthead .ast-mobile-header-wrap .ast-above-header-bar, #masthead .ast-mobile-header-wrap .ast-primary-header-bar, #masthead .ast-mobile-header-wrap .ast-below-header-bar {",e+="padding-left: 20px;",e+="padding-right: 20px;",e+="} ",e+="} ",astra_add_dynamic_css("hb-header-main-layout-width",e)})}),wp.customize("astra-settings[hb-header-main-sep]",function(a){a.bind(function(a){var e="";e+=".ast-header-break-point .ast-primary-header-bar, .ast-primary-header-bar {",e+="border-bottom-width: "+a+"px;",e+="border-bottom-style: solid;",e+="border-color:"+wp.customize("astra-settings[hb-header-main-sep-color]").get()+";",e+="}",astra_add_dynamic_css("hb-header-main-sep",e)})}),astra_css("astra-settings[hb-header-main-sep-color]","border-color",".ast-header-break-point .ast-primary-header-bar, .ast-primary-header-bar"),astra_apply_responsive_background_css("astra-settings[hb-header-bg-obj-responsive]",".main-header-bar","desktop"),astra_apply_responsive_background_css("astra-settings[hb-header-bg-obj-responsive]",".ast-primary-header.main-header-bar","tablet"),astra_apply_responsive_background_css("astra-settings[hb-header-bg-obj-responsive]",".ast-primary-header.main-header-bar","mobile"),astra_builder_advanced_css("section-primary-header-builder",".ast-desktop .ast-primary-header-bar, .ast-header-break-point .ast-primary-header-bar"),astra_builder_visibility_css("section-primary-header-builder",".ast-primary-header-bar","grid"),wp.customize("astra-settings[section-header-builder-layout-margin]",function(a){a.bind(function(a){var e;""==a.desktop.bottom&&""==a.desktop.top&&""==a.desktop.left&&""==a.desktop.right&&""==a.tablet.bottom&&""==a.tablet.top&&""==a.tablet.left&&""==a.tablet.right&&""==a.mobile.bottom&&""==a.mobile.top&&""==a.mobile.left&&""==a.mobile.right||(e="",e+=".ast-hfb-header .site-header {",e+="margin-left: "+a.desktop.left+a["desktop-unit"]+";",e+="margin-right: "+a.desktop.right+a["desktop-unit"]+";",e+="margin-top: "+a.desktop.top+a["desktop-unit"]+";",e+="margin-bottom: "+a.desktop.bottom+a["desktop-unit"]+";",e+="} ",e+="@media (max-width: "+t+"px) {",e+=".ast-hfb-header .site-header {",e+="margin-left: "+a.tablet.left+a["tablet-unit"]+";",e+="margin-right: "+a.tablet.right+a["tablet-unit"]+";",e+="margin-top: "+a.tablet.top+a["desktop-unit"]+";",e+="margin-bottom: "+a.tablet.bottom+a["desktop-unit"]+";",e+="} ",e+="} ",e+="@media (max-width: "+r+"px) {",e+=".ast-hfb-header .site-header {",e+="margin-left: "+a.mobile.left+a["mobile-unit"]+";",e+="margin-right: "+a.mobile.right+a["mobile-unit"]+";",e+="margin-top: "+a.mobile.top+a["desktop-unit"]+";",e+="margin-bottom: "+a.mobile.bottom+a["desktop-unit"]+";",e+="} ",e+="} ",astra_add_dynamic_css("section-header-builder-layout-margin-toggle-button",e))})})}(jQuery);
\ No newline at end of file diff --git a/inc/builder/type/header/primary-header/assets/js/unminified/customizer-preview.js b/inc/builder/type/header/primary-header/assets/js/unminified/customizer-preview.js new file mode 100644 index 0000000..1118135 --- /dev/null +++ b/inc/builder/type/header/primary-header/assets/js/unminified/customizer-preview.js @@ -0,0 +1,152 @@ +/**
+ * This file adds some LIVE to the Customizer live preview. To leverage
+ * this, set your custom settings to 'postMessage' and then add your handling
+ * here. Your javascript should grab settings from customizer controls, and
+ * then make any necessary changes to the page using jQuery.
+ *
+ * @package Astra
+ * @since 3.0.0
+ */
+
+( function( $ ) {
+
+ var tablet_break_point = AstraBuilderPrimaryHeaderData.tablet_break_point || 768,
+ mobile_break_point = AstraBuilderPrimaryHeaderData.mobile_break_point || 544;
+
+ wp.customize( 'astra-settings[hb-header-height]', function( value ) {
+ value.bind( function( size ) {
+
+ if( size.desktop != '' || size.tablet != '' || size.mobile != '' ) {
+ var dynamicStyle = '';
+ dynamicStyle += '.ast-mobile-header-wrap .ast-primary-header-bar , .ast-primary-header-bar .site-primary-header-wrap {';
+ dynamicStyle += 'min-height: ' + size.desktop + 'px;';
+ dynamicStyle += '} ';
+ dynamicStyle += '.ast-desktop .ast-primary-header-bar .main-header-menu > .menu-item {';
+ dynamicStyle += 'line-height: ' + size.desktop + 'px;';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += '.ast-mobile-header-wrap .ast-primary-header-bar , .ast-primary-header-bar .site-primary-header-wrap {';
+ dynamicStyle += 'min-height: ' + size.tablet + 'px;';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += '.ast-mobile-header-wrap .ast-primary-header-bar , .ast-primary-header-bar .site-primary-header-wrap {';
+ dynamicStyle += 'min-height: ' + size.mobile + 'px;';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ astra_add_dynamic_css( 'hb-header-height', dynamicStyle );
+ }
+ } );
+ } );
+
+ // Primary Header - Layout > Content Width.
+ wp.customize( 'astra-settings[hb-header-main-layout-width]', function( setting ) {
+ setting.bind( function( layout ) {
+
+ var dynamicStyle = '';
+
+ if ( 'content' !== layout ) {
+ dynamicStyle += '#masthead .ast-container, .site-header-focus-item + .ast-breadcrumbs-wrapper {';
+ dynamicStyle += 'max-width: unset;';
+ dynamicStyle += 'padding-left: 35px;';
+ dynamicStyle += 'padding-right: 35px;';
+ dynamicStyle += '} ';
+
+ } else {
+ dynamicStyle = '#masthead .ast-container, .site-header-focus-item + .ast-breadcrumbs-wrapper {';
+ dynamicStyle += 'max-width: 100%';
+ dynamicStyle += 'padding-left: 20px;';
+ dynamicStyle += 'padding-right: 20px;';
+ dynamicStyle += '} ';
+ }
+
+ dynamicStyle += '@media (max-width: ' + AstraBuilderPrimaryHeaderData.header_break_point + 'px) {';
+ dynamicStyle += '#masthead .ast-mobile-header-wrap .ast-above-header-bar, #masthead .ast-mobile-header-wrap .ast-primary-header-bar, #masthead .ast-mobile-header-wrap .ast-below-header-bar {';
+ dynamicStyle += 'padding-left: 20px;';
+ dynamicStyle += 'padding-right: 20px;';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ astra_add_dynamic_css( 'hb-header-main-layout-width', dynamicStyle );
+ } );
+ } );
+
+ // Border Bottom width.
+ wp.customize( 'astra-settings[hb-header-main-sep]', function( value ) {
+ value.bind( function( border ) {
+
+ var color = wp.customize( 'astra-settings[hb-header-main-sep-color]' ).get(),
+ dynamicStyle = '';
+
+ dynamicStyle += '.ast-header-break-point .ast-primary-header-bar, .ast-primary-header-bar {';
+ dynamicStyle += 'border-bottom-width: ' + border + 'px;';
+ dynamicStyle += 'border-bottom-style: solid;';
+ dynamicStyle += 'border-color:' + color + ';';
+ dynamicStyle += '}';
+
+ astra_add_dynamic_css( 'hb-header-main-sep', dynamicStyle );
+
+ } );
+ } );
+
+ // Border Color.
+ astra_css(
+ 'astra-settings[hb-header-main-sep-color]',
+ 'border-color',
+ '.ast-header-break-point .ast-primary-header-bar, .ast-primary-header-bar'
+ );
+
+ // Responsive BG styles > Primary Header Row.
+ astra_apply_responsive_background_css( 'astra-settings[hb-header-bg-obj-responsive]', '.main-header-bar', 'desktop' );
+ astra_apply_responsive_background_css( 'astra-settings[hb-header-bg-obj-responsive]', '.ast-primary-header.main-header-bar', 'tablet' );
+ astra_apply_responsive_background_css( 'astra-settings[hb-header-bg-obj-responsive]', '.ast-primary-header.main-header-bar', 'mobile' );
+
+ // Advanced CSS Generation.
+ astra_builder_advanced_css( 'section-primary-header-builder', '.ast-desktop .ast-primary-header-bar, .ast-header-break-point .ast-primary-header-bar' );
+
+ // Advanced Visibility CSS Generation.
+ astra_builder_visibility_css( 'section-primary-header-builder', '.ast-primary-header-bar', 'grid' );
+
+ // Advanced CSS for Header Builder - Margin.
+ wp.customize( 'astra-settings[section-header-builder-layout-margin]', function( value ) {
+ value.bind( function( margin ) {
+ if(
+ margin.desktop.bottom != '' || margin.desktop.top != '' || margin.desktop.left != '' || margin.desktop.right != '' ||
+ margin.tablet.bottom != '' || margin.tablet.top != '' || margin.tablet.left != '' || margin.tablet.right != '' ||
+ margin.mobile.bottom != '' || margin.mobile.top != '' || margin.mobile.left != '' || margin.mobile.right != ''
+ ) {
+ var dynamicStyle = '';
+ dynamicStyle += '.ast-hfb-header .site-header {';
+ dynamicStyle += 'margin-left: ' + margin['desktop']['left'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['desktop']['right'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['desktop']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['desktop']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += '.ast-hfb-header .site-header {';
+ dynamicStyle += 'margin-left: ' + margin['tablet']['left'] + margin['tablet-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['tablet']['right'] + margin['tablet-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['tablet']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['tablet']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += '.ast-hfb-header .site-header {';
+ dynamicStyle += 'margin-left: ' + margin['mobile']['left'] + margin['mobile-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['mobile']['right'] + margin['mobile-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['mobile']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['mobile']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+ astra_add_dynamic_css( 'section-header-builder-layout-margin-toggle-button', dynamicStyle );
+ }
+ } );
+ } );
+
+
+} )( jQuery );
diff --git a/inc/builder/type/header/primary-header/class-astra-primary-header-loader.php b/inc/builder/type/header/primary-header/class-astra-primary-header-loader.php new file mode 100644 index 0000000..2f12bcd --- /dev/null +++ b/inc/builder/type/header/primary-header/class-astra-primary-header-loader.php @@ -0,0 +1,115 @@ +<?php +/** + * Button Styling Loader for Astra theme. + * + * @package Astra + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since Astra 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Customizer Initialization + * + * @since 3.0.0 + */ +class Astra_Primary_Header_Loader { + + /** + * Constructor + * + * @since 3.0.0 + */ + public function __construct() { + add_action( 'customize_preview_init', array( $this, 'preview_scripts' ), 110 ); + + // Markup. + remove_filter( 'body_class', 'astra_body_classes' ); + add_filter( 'body_class', array( $this, 'astra_body_header_classes' ) ); + } + + /** + * Adds custom classes to the array of body classes. + * + * @since 1.0.0 + * @param array $classes Classes for the body element. + * @return array + */ + public function astra_body_header_classes( $classes ) { + + if ( wp_is_mobile() ) { + $classes[] = 'ast-header-break-point'; + } else { + $classes[] = 'ast-desktop'; + } + + if ( astra_is_amp_endpoint() ) { + $classes[] = 'ast-amp'; + } + + // Apply separate container class to the body. + $content_layout = astra_get_content_layout(); + if ( 'content-boxed-container' == $content_layout ) { + $classes[] = 'ast-separate-container'; + } elseif ( 'boxed-container' == $content_layout ) { + $classes[] = 'ast-separate-container ast-two-container'; + } elseif ( 'page-builder' == $content_layout ) { + $classes[] = 'ast-page-builder-template'; + } elseif ( 'plain-container' == $content_layout ) { + $classes[] = 'ast-plain-container'; + } + // Sidebar location. + $page_layout = 'ast-' . astra_page_layout(); + $classes[] = esc_attr( $page_layout ); + + // Current Astra verion. + $classes[] = esc_attr( 'astra-' . ASTRA_THEME_VERSION ); + + /** + * Add class for header width + */ + $header_content_layout = astra_get_option( 'hb-header-main-layout-width' ); + + if ( 'full' == $header_content_layout ) { + $classes[] = 'ast-full-width-primary-header'; + } + + return $classes; + } + + /** + * Customizer Preview + * + * @since 3.0.0 + */ + public function preview_scripts() { + /** + * Load unminified if SCRIPT_DEBUG is true. + */ + /* Directory and Extension */ + $dir_name = ( SCRIPT_DEBUG ) ? 'unminified' : 'minified'; + $file_prefix = ( SCRIPT_DEBUG ) ? '' : '.min'; + wp_enqueue_script( 'astra-heading-primary-customizer-preview-js', ASTRA_PRIMARY_HEADER_URI . '/assets/js/' . $dir_name . '/customizer-preview' . $file_prefix . '.js', array( 'customize-preview', 'astra-customizer-preview-js' ), ASTRA_THEME_VERSION, true ); + + // Localize variables for Button JS. + wp_localize_script( + 'astra-heading-primary-customizer-preview-js', + 'AstraBuilderPrimaryHeaderData', + array( + 'header_break_point' => astra_header_break_point(), + 'tablet_break_point' => astra_get_tablet_breakpoint(), + 'mobile_break_point' => astra_get_mobile_breakpoint(), + ) + ); + } +} + +/** +* Kicking this off by creating the object of the class. +*/ +new Astra_Primary_Header_Loader(); diff --git a/inc/builder/type/header/primary-header/class-astra-primary-header.php b/inc/builder/type/header/primary-header/class-astra-primary-header.php new file mode 100644 index 0000000..ebe81dd --- /dev/null +++ b/inc/builder/type/header/primary-header/class-astra-primary-header.php @@ -0,0 +1,45 @@ +<?php +/** + * Heading Colors for Astra theme. + * + * @package Astra + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since Astra 3.0.0. + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +define( 'ASTRA_PRIMARY_HEADER_DIR', ASTRA_THEME_DIR . 'inc/builder/type/header/primary-header' ); +define( 'ASTRA_PRIMARY_HEADER_URI', ASTRA_THEME_URI . 'inc/builder/type/header/primary-header' ); + +/** + * Heading Initial Setup + * + * @since 3.0.0 + */ +class Astra_Primary_Header { + + /** + * Constructor function that initializes required actions and hooks + */ + public function __construct() { + // @codingStandardsIgnoreStart WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + require_once ASTRA_PRIMARY_HEADER_DIR . '/class-astra-primary-header-loader.php'; + + // Include front end files. + if ( ! is_admin() ) { + require_once ASTRA_PRIMARY_HEADER_DIR . '/dynamic-css/dynamic.css.php'; + remove_filter( 'astra_dynamic_theme_css', 'astra_header_breakpoint_style' ); + } + // @codingStandardsIgnoreEnd WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + } +} + +/** + * Kicking this off by creating an object. + */ +new Astra_Primary_Header(); diff --git a/inc/builder/type/header/primary-header/dynamic-css/dynamic.css.php b/inc/builder/type/header/primary-header/dynamic-css/dynamic.css.php new file mode 100644 index 0000000..3d9caf8 --- /dev/null +++ b/inc/builder/type/header/primary-header/dynamic-css/dynamic.css.php @@ -0,0 +1,238 @@ +<?php +/** + * Primary Header - Dynamic CSS + * + * @package Astra + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Heading Colors + */ +add_filter( 'astra_dynamic_theme_css', 'astra_primary_header_breakpoint_style', 11 ); + +/** + * Dynamic CSS + * + * @param string $dynamic_css Astra Dynamic CSS. + * @param string $dynamic_css_filtered Astra Dynamic CSS Filters. + * @return String Generated dynamic CSS for Heading Colors. + * + * @since 3.0.0 + */ +function astra_primary_header_breakpoint_style( $dynamic_css, $dynamic_css_filtered = '' ) { + + if ( ! is_customize_preview() && ( ! Astra_Builder_helper::is_row_empty( 'primary', 'header', 'desktop' ) && ! Astra_Builder_helper::is_row_empty( 'primary', 'header', 'mobile' ) ) ) { + return $dynamic_css; + } + + // Parsed CSS. + $parse_css = ''; + + $hb_header_height = astra_get_option( 'hb-header-height' ); + + // Header Height. + $hb_header_height_desktop = ( isset( $hb_header_height['desktop'] ) && ! empty( $hb_header_height['desktop'] ) ) ? $hb_header_height['desktop'] : ''; + $hb_header_height_tablet = ( isset( $hb_header_height['tablet'] ) && ! empty( $hb_header_height['tablet'] ) ) ? $hb_header_height['tablet'] : ''; + $hb_header_height_mobile = ( isset( $hb_header_height['mobile'] ) && ! empty( $hb_header_height['mobile'] ) ) ? $hb_header_height['mobile'] : ''; + + + $common_css_output = array( + '.ast-mobile-header-wrap .ast-primary-header-bar, .ast-primary-header-bar .site-primary-header-wrap' => array( + 'min-height' => astra_get_css_value( $hb_header_height_desktop, 'px' ), + ), + '.ast-desktop .ast-primary-header-bar .main-header-menu > .menu-item' => array( + 'line-height' => astra_get_css_value( $hb_header_height_desktop, 'px' ), + ), + ); + + $parse_css .= astra_parse_css( $common_css_output ); + + if ( Astra_Builder_Helper::is_component_loaded( 'woo-cart', 'header' ) || Astra_Builder_Helper::is_component_loaded( 'edd-cart', 'header' ) ) { + $common_css_cart_output = array( + '.ast-desktop .ast-primary-header-bar .ast-header-woo-cart, .ast-desktop .ast-primary-header-bar .ast-header-edd-cart' => array( + 'line-height' => astra_get_css_value( $hb_header_height_desktop, 'px' ), + ), + ); + + $parse_css .= astra_parse_css( $common_css_cart_output ); + } + + + $astra_header_width = astra_get_option( 'hb-header-main-layout-width' ); + $header_breadcrumb_position = astra_get_option( 'breadcrumb-position' ); + + /* Width for Header */ + if ( 'content' !== $astra_header_width ) { + $general_global_responsive = array( + '#masthead .ast-container, .site-header-focus-item + .ast-breadcrumbs-wrapper' => array( + 'max-width' => '100%', + 'padding-left' => '35px', + 'padding-right' => '35px', + ), + ); + + /* Parse CSS from array()*/ + $parse_css .= astra_parse_css( $general_global_responsive ); + + } elseif ( 'astra_header_primary_container_after' == $header_breadcrumb_position ) { + $site_content_width = astra_get_option( 'site-content-width', 1200 ); + $general_global_responsive = array( + '.site-header-focus-item + .ast-breadcrumbs-wrapper' => array( + 'max-width' => astra_get_css_value( $site_content_width + 40, 'px' ), + 'margin-left' => 'auto', + 'margin-right' => 'auto', + 'padding-left' => '20px', + 'padding-right' => '20px', + ), + ); + + /* Parse CSS from array()*/ + $parse_css .= astra_parse_css( $general_global_responsive ); + } + + $padding_below_breakpoint = array( + '#masthead .ast-mobile-header-wrap .ast-primary-header-bar, #masthead .ast-mobile-header-wrap .ast-below-header-bar' => array( + 'padding-left' => '20px', + 'padding-right' => '20px', + ), + ); + + $parse_css .= astra_parse_css( $padding_below_breakpoint, '', astra_get_tablet_breakpoint() ); + + // Header Separator. + $header_separator = absint( astra_get_option( 'hb-header-main-sep' ) ); + + // Apply border only when it has positive value. + if ( $header_separator ) { + $header_separator_color = astra_get_option( 'hb-header-main-sep-color' ); + + $border_responsive_style = array( + '.ast-header-break-point .ast-primary-header-bar' => array( + 'border-bottom-width' => astra_get_css_value( $header_separator, 'px' ), + 'border-bottom-color' => esc_attr( $header_separator_color ), + 'border-bottom-style' => 'solid', + ), + ); + + + $border_desktop_style = array( + '.ast-primary-header-bar' => array( + 'border-bottom-width' => astra_get_css_value( $header_separator, 'px' ), + 'border-bottom-color' => esc_attr( $header_separator_color ), + 'border-bottom-style' => 'solid', + ), + ); + + } else { + $border_responsive_style = array( + '.ast-header-break-point .ast-primary-header-bar' => array( + 'border-bottom-style' => 'none', + ), + ); + + $border_desktop_style = array( + '.ast-primary-header-bar' => array( + 'border-bottom-style' => 'none', + ), + ); + } + + $parse_css .= astra_parse_css( $border_responsive_style ); + $parse_css .= astra_parse_css( $border_desktop_style, astra_get_tablet_breakpoint( '', 1 ) ); + + $header_bg_obj = astra_get_option( 'hb-header-bg-obj-responsive' ); + + /** + * Responsive Colors options + * Header Responsive Background with Image + */ + $desktop_colors = array( + '.ast-primary-header-bar' => astra_get_responsive_background_obj( $header_bg_obj, 'desktop' ), + ); + + $tablet_colors = array( + '.ast-primary-header-bar.ast-primary-header' => astra_get_responsive_background_obj( $header_bg_obj, 'tablet' ), + '.ast-mobile-header-wrap .ast-primary-header-bar, .ast-primary-header-bar .site-primary-header-wrap' => array( + 'min-height' => astra_get_css_value( $hb_header_height_tablet, 'px' ), + ), + ); + $mobile_colors = array( + '.ast-primary-header-bar.ast-primary-header' => astra_get_responsive_background_obj( $header_bg_obj, 'mobile' ), + '.ast-mobile-header-wrap .ast-primary-header-bar , .ast-primary-header-bar .site-primary-header-wrap' => array( + 'min-height' => astra_get_css_value( $hb_header_height_mobile, 'px' ), + ), + ); + + /* Parse CSS from array() */ + /** + * Tweak - Check for AMP Support. + */ + $parse_css .= apply_filters( 'astra_addon_colors_dynamic_css_desktop', astra_parse_css( $desktop_colors ) ); + $parse_css .= apply_filters( 'astra_addon_colors_dynamic_css_tablet', astra_parse_css( $tablet_colors, '', astra_get_tablet_breakpoint() ) ); + $parse_css .= apply_filters( 'astra_addon_colors_dynamic_css_mobile', astra_parse_css( $mobile_colors, '', astra_get_mobile_breakpoint() ) ); + + /** + * Tweak - $remove_bottom_sire_brancing - Search in Astra Pro. + */ + + // Trim white space for faster page loading. + $dynamic_css .= Astra_Enqueue_Scripts::trim_css( $parse_css ); + + $_section = 'section-primary-header-builder'; + + $parent_selector = '.ast-desktop .ast-primary-header-bar.main-header-bar, .ast-header-break-point #masthead .ast-primary-header-bar.main-header-bar'; + + $dynamic_css .= Astra_Builder_Base_Dynamic_CSS::prepare_advanced_margin_padding_css( $_section, $parent_selector ); + + $dynamic_css .= Astra_Builder_Base_Dynamic_CSS::prepare_visibility_css( $_section, '.ast-primary-header-bar', 'block', 'grid' ); + + // Advanced CSS for Header Builder. + $margin = astra_get_option( 'section-header-builder-layout-margin' ); + + // Desktop CSS. + $css_output_desktop = array( + + '.ast-hfb-header .site-header' => array( + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'desktop' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'desktop' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'desktop' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'desktop' ), + ), + ); + + // Tablet CSS. + $css_output_tablet = array( + + '.ast-hfb-header .site-header' => array( + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'tablet' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'tablet' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'tablet' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'tablet' ), + ), + ); + + // Mobile CSS. + $css_output_mobile = array( + + '.ast-hfb-header .site-header' => array( + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'mobile' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'mobile' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'mobile' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'mobile' ), + ), + ); + + $dynamic_css .= astra_parse_css( $css_output_desktop ); + $dynamic_css .= astra_parse_css( $css_output_tablet, '', astra_get_tablet_breakpoint() ); + $dynamic_css .= astra_parse_css( $css_output_mobile, '', astra_get_mobile_breakpoint() ); + + return $dynamic_css; +} diff --git a/inc/builder/type/header/search/assets/js/minified/customizer-preview.min.js b/inc/builder/type/header/search/assets/js/minified/customizer-preview.min.js new file mode 100644 index 0000000..d8a532b --- /dev/null +++ b/inc/builder/type/header/search/assets/js/minified/customizer-preview.min.js @@ -0,0 +1 @@ +!function(){var i=astraBuilderPreview.tablet_break_point||768,o=astraBuilderPreview.mobile_break_point||544,a=".ast-header-search";astra_color_responsive_css("header-search-icon-color","astra-settings[header-search-icon-color]","color",a+" .astra-search-icon, "+a+" .search-field::placeholder"),astra_css("astra-settings[header-search-icon-space]","font-size",a+" .astra-search-icon","px"),wp.customize("astra-settings[header-search-icon-space]",function(t){t.bind(function(t){var e;""==t.desktop&&""==t.tablet&&""==t.mobile||(e="",e+=a+" .astra-search-icon {",e+="font-size: "+t.desktop+"px;",e+="} ",e+="@media (max-width: "+i+"px) {",e+=a+" .astra-search-icon {",e+="font-size: "+t.tablet+"px;",e+="} ",e+="} ",e+="@media (max-width: "+o+"px) {",e+=a+" .astra-search-icon {",e+="font-size: "+t.mobile+"px;",e+="} ",e+="} ",astra_add_dynamic_css("header-search-icon-space",e))})}),wp.customize("astra-settings[section-header-search-margin]",function(t){t.bind(function(t){var e,a;""==t.desktop.bottom&&""==t.desktop.top&&""==t.desktop.left&&""==t.desktop.right&&""==t.tablet.bottom&&""==t.tablet.top&&""==t.tablet.left&&""==t.tablet.right&&""==t.mobile.bottom&&""==t.mobile.top&&""==t.mobile.left&&""==t.mobile.right||(a="",a+=(e=".ast-hfb-header .site-header-section > .ast-header-search, .ast-hfb-header .ast-header-search")+" {",a+="margin-left: "+t.desktop.left+t["desktop-unit"]+";",a+="margin-right: "+t.desktop.right+t["desktop-unit"]+";",a+="margin-top: "+t.desktop.top+t["desktop-unit"]+";",a+="margin-bottom: "+t.desktop.bottom+t["desktop-unit"]+";",a+="} ",a+="@media (max-width: "+i+"px) {",a+=e+" {",a+="margin-left: "+t.tablet.left+t["tablet-unit"]+";",a+="margin-right: "+t.tablet.right+t["tablet-unit"]+";",a+="margin-top: "+t.tablet.top+t["desktop-unit"]+";",a+="margin-bottom: "+t.tablet.bottom+t["desktop-unit"]+";",a+="} ",a+="} ",a+="@media (max-width: "+o+"px) {",a+=e+" {",a+="margin-left: "+t.mobile.left+t["mobile-unit"]+";",a+="margin-right: "+t.mobile.right+t["mobile-unit"]+";",a+="margin-top: "+t.mobile.top+t["desktop-unit"]+";",a+="margin-bottom: "+t.mobile.bottom+t["desktop-unit"]+";",a+="} ",a+="} ",astra_add_dynamic_css("header-search-margin",a))})}),astra_builder_visibility_css("section-header-search",a)}(jQuery);
\ No newline at end of file diff --git a/inc/builder/type/header/search/assets/js/unminified/customizer-preview.js b/inc/builder/type/header/search/assets/js/unminified/customizer-preview.js new file mode 100644 index 0000000..56d4dea --- /dev/null +++ b/inc/builder/type/header/search/assets/js/unminified/customizer-preview.js @@ -0,0 +1,102 @@ +/**
+ * This file adds some LIVE to the Customizer live preview. To leverage
+ * this, set your custom settings to 'postMessage' and then add your handling
+ * here. Your javascript should grab settings from customizer controls, and
+ * then make any necessary changes to the page using jQuery.
+ *
+ * @package Astra
+ * @since 3.0.0
+ */
+
+( function( $ ) {
+
+ var tablet_break_point = astraBuilderPreview.tablet_break_point || 768,
+ mobile_break_point = astraBuilderPreview.mobile_break_point || 544;
+
+ var selector = '.ast-header-search';
+ var section = 'section-header-search';
+
+ // Icon Color.
+ astra_color_responsive_css(
+ 'header-search-icon-color',
+ 'astra-settings[header-search-icon-color]',
+ 'color',
+ selector + ' .astra-search-icon, ' + selector + ' .search-field::placeholder'
+ );
+
+ // Icon Size.
+ astra_css(
+ 'astra-settings[header-search-icon-space]',
+ 'font-size',
+ selector + ' .astra-search-icon',
+ 'px'
+ );
+
+ // Icon Size.
+ wp.customize( 'astra-settings[header-search-icon-space]', function( value ) {
+ value.bind( function( size ) {
+ if( size.desktop != '' || size.tablet != '' || size.mobile != '' ) {
+ var dynamicStyle = '';
+ dynamicStyle += selector + ' .astra-search-icon {';
+ dynamicStyle += 'font-size: ' + size.desktop + 'px' + ';';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += selector + ' .astra-search-icon {';
+ dynamicStyle += 'font-size: ' + size.tablet + 'px' + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += selector + ' .astra-search-icon {';
+ dynamicStyle += 'font-size: ' + size.mobile + 'px' + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+ astra_add_dynamic_css( 'header-search-icon-space', dynamicStyle );
+ }
+ } );
+ } );
+
+ // Margin.
+ wp.customize( 'astra-settings[section-header-search-margin]', function( value ) {
+ value.bind( function( margin ) {
+ if(
+ margin.desktop.bottom != '' || margin.desktop.top != '' || margin.desktop.left != '' || margin.desktop.right != '' ||
+ margin.tablet.bottom != '' || margin.tablet.top != '' || margin.tablet.left != '' || margin.tablet.right != '' ||
+ margin.mobile.bottom != '' || margin.mobile.top != '' || margin.mobile.left != '' || margin.mobile.right != ''
+ ) {
+ var selector = '.ast-hfb-header .site-header-section > .ast-header-search, .ast-hfb-header .ast-header-search';
+ var dynamicStyle = '';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['desktop']['left'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['desktop']['right'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['desktop']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['desktop']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['tablet']['left'] + margin['tablet-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['tablet']['right'] + margin['tablet-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['tablet']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['tablet']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['mobile']['left'] + margin['mobile-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['mobile']['right'] + margin['mobile-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['mobile']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['mobile']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+ astra_add_dynamic_css( 'header-search-margin', dynamicStyle );
+ }
+ } );
+ } );
+
+ // Advanced Visibility CSS Generation.
+ astra_builder_visibility_css( section, selector );
+
+} )( jQuery );
diff --git a/inc/builder/type/header/search/class-astra-header-search-component-loader.php b/inc/builder/type/header/search/class-astra-header-search-component-loader.php new file mode 100644 index 0000000..b4d1f01 --- /dev/null +++ b/inc/builder/type/header/search/class-astra-header-search-component-loader.php @@ -0,0 +1,73 @@ +<?php +/** + * Search Styling Loader for Astra theme. + * + * @package astra-builder + * @author Astra + * @copyright Copyright (c) 2020, Astra + * @link https://wpastra.com/ + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Customizer Initialization + * + * @since 3.0.0 + */ +class Astra_Header_Search_Component_Loader { + + /** + * Constructor + * + * @since 3.0.0 + */ + public function __construct() { + + add_filter( 'astra_get_search', array( $this, 'get_search_markup' ), 10, 3 ); + add_action( 'customize_preview_init', array( $this, 'preview_scripts' ), 110 ); + } + + /** + * Customizer Preview + * + * @since 3.0.0 + */ + public function preview_scripts() { + /** + * Load unminified if SCRIPT_DEBUG is true. + */ + /* Directory and Extension */ + $dir_name = ( SCRIPT_DEBUG ) ? 'unminified' : 'minified'; + $file_prefix = ( SCRIPT_DEBUG ) ? '' : '.min'; + wp_enqueue_script( 'astra-header-builder-search-customizer-preview-js', ASTRA_HEADER_SEARCH_URI . '/assets/js/' . $dir_name . '/customizer-preview' . $file_prefix . '.js', array( 'customize-preview', 'astra-customizer-preview-js' ), ASTRA_THEME_VERSION, true ); + + } + + /** + * Adding Wrapper for Search Form. + * + * @since 3.0.0 + * + * @param string $search_markup Search Form Content. + * @param string $option Search Form Options. + * @param string $device Device Desktop/Tablet/Mobile. + * @return Search HTML structure created. + */ + public static function get_search_markup( $search_markup, $option = '', $device = '' ) { + + if ( is_customize_preview() ) { + Astra_Builder_UI_Controller::render_customizer_edit_button(); + } + + return $search_markup; + } +} + +/** +* Kicking this off by creating the object of the class. +*/ +new Astra_Header_Search_Component_Loader(); diff --git a/inc/builder/type/header/search/class-astra-header-search-component.php b/inc/builder/type/header/search/class-astra-header-search-component.php new file mode 100644 index 0000000..764daf8 --- /dev/null +++ b/inc/builder/type/header/search/class-astra-header-search-component.php @@ -0,0 +1,45 @@ +<?php +/** + * Search for Astra theme. + * + * @package astra-builder + * @author Astra + * @copyright Copyright (c) 2020, Astra + * @link https://wpastra.com/ + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +define( 'ASTRA_HEADER_SEARCH_DIR', ASTRA_THEME_DIR . 'inc/builder/type/header/search' ); +define( 'ASTRA_HEADER_SEARCH_URI', ASTRA_THEME_URI . 'inc/builder/type/header/search' ); + +/** + * Heading Initial Setup + * + * @since 3.0.0 + */ +class Astra_Header_Search_Component { + + /** + * Constructor function that initializes required actions and hooks + */ + public function __construct() { + + // @codingStandardsIgnoreStart WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + require_once ASTRA_HEADER_SEARCH_DIR . '/class-astra-header-search-component-loader.php'; + + // Include front end files. + if ( ! is_admin() ) { + require_once ASTRA_HEADER_SEARCH_DIR . '/dynamic-css/dynamic.css.php'; + } + // @codingStandardsIgnoreEnd WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + } +} + +/** + * Kicking this off by creating an object. + */ +new Astra_Header_Search_Component(); diff --git a/inc/builder/type/header/search/dynamic-css/dynamic.css.php b/inc/builder/type/header/search/dynamic-css/dynamic.css.php new file mode 100644 index 0000000..9dea5fc --- /dev/null +++ b/inc/builder/type/header/search/dynamic-css/dynamic.css.php @@ -0,0 +1,281 @@ +<?php +/** + * Search - Dynamic CSS + * + * @package Astra + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Search + */ +add_filter( 'astra_dynamic_theme_css', 'astra_hb_search_dynamic_css' ); + +/** + * Dynamic CSS + * + * @param string $dynamic_css Astra Dynamic CSS. + * @param string $dynamic_css_filtered Astra Dynamic CSS Filters. + * @return String Generated dynamic CSS for Search. + * + * @since 3.0.0 + */ +function astra_hb_search_dynamic_css( $dynamic_css, $dynamic_css_filtered = '' ) { + + if ( ! Astra_Builder_Helper::is_component_loaded( 'search', 'header' ) ) { + return $dynamic_css; + } + + $_section = 'section-header-search'; + $selector = '.ast-header-search'; + $icon_size = astra_get_option( 'header-search-icon-space' ); + + $icon_size_desktop = ( isset( $icon_size ) && isset( $icon_size['desktop'] ) && ! empty( $icon_size['desktop'] ) ) ? $icon_size['desktop'] : 20; + + $icon_size_tablet = ( isset( $icon_size ) && isset( $icon_size['tablet'] ) && ! empty( $icon_size['tablet'] ) ) ? $icon_size['tablet'] : 20; + + $icon_size_mobile = ( isset( $icon_size ) && isset( $icon_size['mobile'] ) && ! empty( $icon_size['mobile'] ) ) ? $icon_size['mobile'] : 20; + + $icon_color_desktop = astra_get_prop( astra_get_option( 'header-search-icon-color' ), 'desktop' ); + $icon_color_tablet = astra_get_prop( astra_get_option( 'header-search-icon-color' ), 'tablet' ); + $icon_color_mobile = astra_get_prop( astra_get_option( 'header-search-icon-color' ), 'mobile' ); + + $margin = astra_get_option( $_section . '-margin' ); + $margin_selector = '.ast-hfb-header .site-header-section > .ast-header-search, .ast-hfb-header .ast-header-search'; + + /** + * Search CSS. + */ + $css_output_desktop = array( + $selector . ' .ast-search-menu-icon .search-form .search-field:-ms-input-placeholder,' . $selector . ' .ast-search-menu-icon .search-form .search-field:-ms-input-placeholder' => array( + 'opacity' => '0.5', + ), + $selector . ' .ast-search-menu-icon.slide-search .search-form, .ast-header-search .ast-search-menu-icon.ast-inline-search .search-form' => array( + '-js-display' => 'flex', + 'display' => 'flex', + 'align-items' => 'center', + ), + '.ast-builder-layout-element.ast-header-search' => array( + 'height' => 'auto', + ), + $selector . ' .astra-search-icon' => array( + 'color' => esc_attr( $icon_color_desktop ), + 'font-size' => astra_get_css_value( $icon_size_desktop, 'px' ), + ), + $selector . ' .search-field::placeholder' => array( + 'color' => esc_attr( $icon_color_desktop ), + ), + $selector . ' .ast-search-menu-icon.ast-dropdown-active .search-field' => array( + 'margin-right' => astra_get_css_value( $icon_size_desktop - 10, 'px' ), + ), + $margin_selector => array( + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'desktop' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'desktop' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'desktop' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'desktop' ), + ), + ); + + $css_output_tablet = array( + + $selector . ' .astra-search-icon' => array( + 'color' => esc_attr( $icon_color_tablet ), + 'font-size' => astra_get_css_value( $icon_size_tablet, 'px' ), + ), + $selector . ' .search-field::placeholder' => array( + 'color' => esc_attr( $icon_color_tablet ), + ), + $selector . ' .ast-search-menu-icon.ast-dropdown-active .search-field' => array( + 'margin-right' => astra_get_css_value( $icon_size_tablet - 10, 'px' ), + ), + $margin_selector => array( + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'tablet' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'tablet' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'tablet' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'tablet' ), + ), + ); + + $css_output_mobile = array( + + $selector . ' .astra-search-icon' => array( + 'color' => esc_attr( $icon_color_mobile ), + 'font-size' => astra_get_css_value( $icon_size_mobile, 'px' ), + ), + $selector . ' .search-field::placeholder' => array( + 'color' => esc_attr( $icon_color_mobile ), + ), + $selector . ' .ast-search-menu-icon.ast-dropdown-active .search-field' => array( + 'margin-right' => astra_get_css_value( $icon_size_mobile - 10, 'px' ), + ), + $margin_selector => array( + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'mobile' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'mobile' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'mobile' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'mobile' ), + ), + ); + + /* Parse CSS from array() */ + $css_output = astra_search_static_css(); + $css_output .= astra_parse_css( $css_output_desktop ); + $css_output .= astra_parse_css( $css_output_tablet, '', astra_get_tablet_breakpoint() ); + $css_output .= astra_parse_css( $css_output_mobile, '', astra_get_mobile_breakpoint() ); + + $dynamic_css .= $css_output; + + $dynamic_css .= Astra_Builder_Base_Dynamic_CSS::prepare_visibility_css( $_section, $selector ); + + return $dynamic_css; +} + +/** + * Search Component static CSS. + * + * @return string + * @since 3.5.0 + */ +function astra_search_static_css() { + $search_css = ' + + .main-header-bar .main-header-bar-navigation .ast-search-icon { + display: block; + z-index: 4; + position: relative; + } + + .ast-search-icon { + z-index: 4; + position: relative; + line-height: normal; + } + .main-header-bar .ast-search-menu-icon .search-form { + background-color: #ffffff; + } + .ast-search-menu-icon.ast-dropdown-active.slide-search .search-form { + visibility: visible; + opacity: 1; + } + .ast-search-menu-icon .search-form { + border: 1px solid #e7e7e7; + line-height: normal; + padding: 0 3em 0 0; + border-radius: 2px; + display: inline-block; + -webkit-backface-visibility: hidden; + backface-visibility: hidden; + position: relative; + color: inherit; + background-color: #fff; + } + .ast-search-menu-icon .astra-search-icon { + -js-display: flex; + display: flex; + line-height: normal; + } + .ast-search-menu-icon .astra-search-icon:focus { + outline: none; + } + .ast-search-menu-icon .search-field { + border: none; + background-color: transparent; + transition: width .2s; + border-radius: inherit; + color: inherit; + font-size: inherit; + width: 0; + color: #757575; + } + .ast-search-menu-icon .search-submit { + display: none; + background: none; + border: none; + font-size: 1.3em; + color: #757575; + } + .ast-search-menu-icon.ast-dropdown-active { + visibility: visible; + opacity: 1; + position: relative; + } + + .ast-search-menu-icon.ast-dropdown-active .search-field { + width: 235px; + } + .ast-header-search .ast-search-menu-icon.slide-search .search-form, .ast-header-search .ast-search-menu-icon.ast-inline-search .search-form { + -js-display: flex; + display: flex; + align-items: center; + }'; + + if ( is_rtl() ) { + $search_css .= ' + .ast-search-menu-icon.ast-inline-search .search-field { + width : 100%; + padding : 0.60em; + padding-left : 5.5em; + } + .site-header-section-left .ast-search-menu-icon.slide-search .search-form { + padding-right: 3em; + padding-left: unset; + right: -1em; + left: unset; + } + + .site-header-section-left .ast-search-menu-icon.slide-search .search-form .search-field { + margin-left: unset; + margin-right: 10px; + } + .ast-search-menu-icon.slide-search .search-form { + -webkit-backface-visibility: visible; + backface-visibility: visible; + visibility: hidden; + opacity: 0; + transition: all .2s; + position: absolute; + z-index: 3; + left: -1em; + top: 50%; + transform: translateY(-50%); + }'; + } else { + $search_css .= ' + .ast-search-menu-icon.ast-inline-search .search-field { + width : 100%; + padding : 0.60em; + padding-right : 5.5em; + } + .site-header-section-left .ast-search-menu-icon.slide-search .search-form { + padding-left: 3em; + padding-right: unset; + left: -1em; + right: unset; + } + + .site-header-section-left .ast-search-menu-icon.slide-search .search-form .search-field { + margin-right: unset; + margin-left: 10px; + } + .ast-search-menu-icon.slide-search .search-form { + -webkit-backface-visibility: visible; + backface-visibility: visible; + visibility: hidden; + opacity: 0; + transition: all .2s; + position: absolute; + z-index: 3; + right: -1em; + top: 50%; + transform: translateY(-50%); + }'; + } + + return Astra_Enqueue_Scripts::trim_css( $search_css ); +} diff --git a/inc/builder/type/header/site-identity/assets/js/minified/customizer-preview.min.js b/inc/builder/type/header/site-identity/assets/js/minified/customizer-preview.min.js new file mode 100644 index 0000000..f78106d --- /dev/null +++ b/inc/builder/type/header/site-identity/assets/js/minified/customizer-preview.min.js @@ -0,0 +1 @@ +!function(){wp.customize("astra-settings[different-mobile-logo]",function(t){t.bind(function(t){"1"==t?jQuery(".site-header").addClass("ast-has-mobile-header-logo"):jQuery(".site-header").removeClass("ast-has-mobile-header-logo")})}),wp.customize("astra-settings[title_tagline-margin]",function(t){t.bind(function(t){var e,i,o,a;""==t.desktop.bottom&&""==t.desktop.top&&""==t.desktop.left&&""==t.desktop.right&&""==t.tablet.bottom&&""==t.tablet.top&&""==t.tablet.left&&""==t.tablet.right&&""==t.mobile.bottom&&""==t.mobile.top&&""==t.mobile.left&&""==t.mobile.right||(e="",i=".ast-builder-layout-element .ast-site-identity",o=astraBuilderPreview.tablet_break_point||768,a=astraBuilderPreview.mobile_break_point||544,e+=i+" {",e+="margin-left: "+t.desktop.left+t["desktop-unit"]+";",e+="margin-right: "+t.desktop.right+t["desktop-unit"]+";",e+="margin-top: "+t.desktop.top+t["desktop-unit"]+";",e+="margin-bottom: "+t.desktop.bottom+t["desktop-unit"]+";",e+="} ",e+="@media (max-width: "+o+"px) {",e+=i+" {",e+="margin-left: "+t.tablet.left+t["tablet-unit"]+";",e+="margin-right: "+t.tablet.right+t["tablet-unit"]+";",e+="margin-top: "+t.tablet.top+t["desktop-unit"]+";",e+="margin-bottom: "+t.tablet.bottom+t["desktop-unit"]+";",e+="} ",e+="} ",e+="@media (max-width: "+a+"px) {",e+=i+" {",e+="margin-left: "+t.mobile.left+t["mobile-unit"]+";",e+="margin-right: "+t.mobile.right+t["mobile-unit"]+";",e+="margin-top: "+t.mobile.top+t["desktop-unit"]+";",e+="margin-bottom: "+t.mobile.bottom+t["desktop-unit"]+";",e+="} ",e+="} ",astra_add_dynamic_css("title_tagline-margin",e))})});astra_builder_visibility_css("title_tagline",'.ast-builder-layout-element[data-section="title_tagline"]')}(jQuery);
\ No newline at end of file diff --git a/inc/builder/type/header/site-identity/assets/js/unminified/customizer-preview.js b/inc/builder/type/header/site-identity/assets/js/unminified/customizer-preview.js new file mode 100644 index 0000000..79f8b60 --- /dev/null +++ b/inc/builder/type/header/site-identity/assets/js/unminified/customizer-preview.js @@ -0,0 +1,71 @@ +/**
+ * This file adds some LIVE to the Customizer live preview. To leverage
+ * this, set your custom settings to 'postMessage' and then add your handling
+ * here. Your javascript should grab settings from customizer controls, and
+ * then make any necessary changes to the page using jQuery.
+ *
+ * @package Astra HF Builder.
+ * @since 3.0.0
+ */
+
+( function( $ ) {
+
+ wp.customize( 'astra-settings[different-mobile-logo]', function ( value ) {
+ value.bind( function ( newval ) {
+
+ if ( '1' == newval ) {
+ jQuery('.site-header').addClass( 'ast-has-mobile-header-logo' );
+ } else {
+ jQuery('.site-header').removeClass( 'ast-has-mobile-header-logo' );
+ }
+ } );
+ } );
+
+ // Margin.
+ wp.customize( 'astra-settings[title_tagline-margin]', function( value ) {
+ value.bind( function( margin ) {
+ if(
+ margin.desktop.bottom != '' || margin.desktop.top != '' || margin.desktop.left != '' || margin.desktop.right != '' ||
+ margin.tablet.bottom != '' || margin.tablet.top != '' || margin.tablet.left != '' || margin.tablet.right != '' ||
+ margin.mobile.bottom != '' || margin.mobile.top != '' || margin.mobile.left != '' || margin.mobile.right != ''
+ ) {
+ var dynamicStyle = '',
+ selector = '.ast-builder-layout-element .ast-site-identity',
+ tablet_break_point = astraBuilderPreview.tablet_break_point || 768,
+ mobile_break_point = astraBuilderPreview.mobile_break_point || 544;
+
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['desktop']['left'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['desktop']['right'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['desktop']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['desktop']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['tablet']['left'] + margin['tablet-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['tablet']['right'] + margin['tablet-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['tablet']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['tablet']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+
+ dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {';
+ dynamicStyle += selector + ' {';
+ dynamicStyle += 'margin-left: ' + margin['mobile']['left'] + margin['mobile-unit'] + ';';
+ dynamicStyle += 'margin-right: ' + margin['mobile']['right'] + margin['mobile-unit'] + ';';
+ dynamicStyle += 'margin-top: ' + margin['mobile']['top'] + margin['desktop-unit'] + ';';
+ dynamicStyle += 'margin-bottom: ' + margin['mobile']['bottom'] + margin['desktop-unit'] + ';';
+ dynamicStyle += '} ';
+ dynamicStyle += '} ';
+ astra_add_dynamic_css( 'title_tagline-margin', dynamicStyle );
+ }
+ } );
+ } );
+
+ var section = 'title_tagline';
+ var visibility_selector = '.ast-builder-layout-element[data-section="title_tagline"]';
+
+ // Advanced Visibility CSS Generation.
+ astra_builder_visibility_css( section, visibility_selector );
+} )( jQuery );
diff --git a/inc/builder/type/header/site-identity/class-astra-header-site-identity-component-loader.php b/inc/builder/type/header/site-identity/class-astra-header-site-identity-component-loader.php new file mode 100644 index 0000000..804cd78 --- /dev/null +++ b/inc/builder/type/header/site-identity/class-astra-header-site-identity-component-loader.php @@ -0,0 +1,51 @@ +<?php +/** + * Site_Identity Styling Loader for Astra theme. + * + * @package astra-builder + * @author Astra + * @copyright Copyright (c) 2020, Astra + * @link https://wpastra.com/ + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Customizer Initialization + * + * @since 3.0.0 + */ +class Astra_Header_Site_Identity_Component_Loader { + + /** + * Constructor + * + * @since 3.0.0 + */ + public function __construct() { + add_action( 'customize_preview_init', array( $this, 'preview_scripts' ), 110 ); + } + + /** + * Customizer Preview + * + * @since 3.0.0 + */ + public function preview_scripts() { + /** + * Load unminified if SCRIPT_DEBUG is true. + */ + /* Directory and Extension */ + $dir_name = ( SCRIPT_DEBUG ) ? 'unminified' : 'minified'; + $file_prefix = ( SCRIPT_DEBUG ) ? '' : '.min'; + wp_enqueue_script( 'astra-site-identity-customizer-preview-js', ASTRA_HEADER_SITE_IDENTITY_URI . '/assets/js/' . $dir_name . '/customizer-preview' . $file_prefix . '.js', array( 'customize-preview', 'astra-customizer-preview-js' ), ASTRA_THEME_VERSION, true ); + } +} + +/** +* Kicking this off by creating the object of the class. +*/ +new Astra_Header_Site_Identity_Component_Loader(); diff --git a/inc/builder/type/header/site-identity/class-astra-header-site-identity-component.php b/inc/builder/type/header/site-identity/class-astra-header-site-identity-component.php new file mode 100644 index 0000000..f7a3a6e --- /dev/null +++ b/inc/builder/type/header/site-identity/class-astra-header-site-identity-component.php @@ -0,0 +1,44 @@ +<?php +/** + * Site_Identity for Astra theme. + * + * @package astra-builder + * @author Astra + * @copyright Copyright (c) 2020, Astra + * @link https://wpastra.com/ + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +define( 'ASTRA_HEADER_SITE_IDENTITY_DIR', ASTRA_THEME_DIR . 'inc/builder/type/header/site-identity' ); +define( 'ASTRA_HEADER_SITE_IDENTITY_URI', ASTRA_THEME_URI . 'inc/builder/type/header/site-identity' ); + +/** + * Heading Initial Setup + * + * @since 3.0.0 + */ +class Astra_Header_Site_Identity_Component { + + /** + * Constructor function that initializes required actions and hooks + */ + public function __construct() { + // @codingStandardsIgnoreStart WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + require_once ASTRA_HEADER_SITE_IDENTITY_DIR . '/class-astra-header-site-identity-component-loader.php'; + + // Include front end files. + if ( ! is_admin() ) { + require_once ASTRA_HEADER_SITE_IDENTITY_DIR . '/dynamic-css/dynamic.css.php'; + } + // @codingStandardsIgnoreEnd WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + } +} + +/** + * Kicking this off by creating an object. + */ +new Astra_Header_Site_Identity_Component(); diff --git a/inc/builder/type/header/site-identity/dynamic-css/dynamic.css.php b/inc/builder/type/header/site-identity/dynamic-css/dynamic.css.php new file mode 100644 index 0000000..6531e00 --- /dev/null +++ b/inc/builder/type/header/site-identity/dynamic-css/dynamic.css.php @@ -0,0 +1,85 @@ +<?php +/** + * Site Identity - Dynamic CSS + * + * @package Astra + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Site Identity + */ +add_filter( 'astra_dynamic_theme_css', 'astra_hb_site_identity_dynamic_css' ); + +/** + * Dynamic CSS + * + * @param string $dynamic_css Astra Dynamic CSS. + * @param string $dynamic_css_filtered Astra Dynamic CSS Filters. + * @return String Generated dynamic CSS for Site Identity. + * + * @since 3.0.0 + */ +function astra_hb_site_identity_dynamic_css( $dynamic_css, $dynamic_css_filtered = '' ) { + + if ( ! Astra_Builder_Helper::is_component_loaded( 'logo', 'header' ) ) { + return $dynamic_css; + } + + $_section = 'title_tagline'; + $selector = '.ast-builder-layout-element .ast-site-identity'; + $visibility_selector = '.ast-builder-layout-element[data-section="title_tagline"]'; + $margin = astra_get_option( $_section . '-margin' ); + + // Desktop CSS. + $css_output_desktop = array( + + $selector => array( + + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'desktop' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'desktop' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'desktop' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'desktop' ), + ), + ); + + // Tablet CSS. + $css_output_tablet = array( + + $selector => array( + + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'tablet' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'tablet' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'tablet' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'tablet' ), + ), + ); + + // Mobile CSS. + $css_output_mobile = array( + + $selector => array( + + // Margin CSS. + 'margin-top' => astra_responsive_spacing( $margin, 'top', 'mobile' ), + 'margin-bottom' => astra_responsive_spacing( $margin, 'bottom', 'mobile' ), + 'margin-left' => astra_responsive_spacing( $margin, 'left', 'mobile' ), + 'margin-right' => astra_responsive_spacing( $margin, 'right', 'mobile' ), + ), + ); + + $css_output = astra_parse_css( $css_output_desktop ); + $css_output .= astra_parse_css( $css_output_tablet, '', astra_get_tablet_breakpoint() ); + $css_output .= astra_parse_css( $css_output_mobile, '', astra_get_mobile_breakpoint() ); + + $dynamic_css .= $css_output; + $dynamic_css .= Astra_Builder_Base_Dynamic_CSS::prepare_visibility_css( $_section, $visibility_selector ); + + return $dynamic_css; +} diff --git a/inc/builder/type/header/social-icon/assets/js/minified/customizer-preview.min.js b/inc/builder/type/header/social-icon/assets/js/minified/customizer-preview.min.js new file mode 100644 index 0000000..65822fc --- /dev/null +++ b/inc/builder/type/header/social-icon/assets/js/minified/customizer-preview.min.js @@ -0,0 +1 @@ +jQuery,astra_builder_social_css("header",astraBuilderHeaderSocial.component_limit);
\ No newline at end of file diff --git a/inc/builder/type/header/social-icon/assets/js/unminified/customizer-preview.js b/inc/builder/type/header/social-icon/assets/js/unminified/customizer-preview.js new file mode 100644 index 0000000..03ceb4a --- /dev/null +++ b/inc/builder/type/header/social-icon/assets/js/unminified/customizer-preview.js @@ -0,0 +1,15 @@ +/**
+ * This file adds some LIVE to the Customizer live preview. To leverage
+ * this, set your custom settings to 'postMessage' and then add your handling
+ * here. Your javascript should grab settings from customizer controls, and
+ * then make any necessary changes to the page using jQuery.
+ *
+ * @package Astra
+ * @since 3.0.0
+ */
+
+( function( $ ) {
+
+ astra_builder_social_css( 'header', astraBuilderHeaderSocial.component_limit );
+
+} )( jQuery );
diff --git a/inc/builder/type/header/social-icon/class-astra-header-social-icon-component-loader.php b/inc/builder/type/header/social-icon/class-astra-header-social-icon-component-loader.php new file mode 100644 index 0000000..a8de361 --- /dev/null +++ b/inc/builder/type/header/social-icon/class-astra-header-social-icon-component-loader.php @@ -0,0 +1,62 @@ +<?php +/** + * Social Icon Styling Loader for Astra theme. + * + * @package astra-builder + * @author Astra + * @copyright Copyright (c) 2020, Astra + * @link https://wpastra.com/ + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Customizer Initialization + * + * @since 3.0.0s + */ +class Astra_Header_Social_Icon_Component_Loader { + + /** + * Constructor + * + * @since 3.0.0s + */ + public function __construct() { + add_action( 'customize_preview_init', array( $this, 'preview_scripts' ), 110 ); + } + + /** + * Customizer Preview + * + * @since 3.0.0s + */ + public function preview_scripts() { + /** + * Load unminified if SCRIPT_DEBUG is true. + */ + /* Directory and Extension */ + $dir_name = ( SCRIPT_DEBUG ) ? 'unminified' : 'minified'; + $file_prefix = ( SCRIPT_DEBUG ) ? '' : '.min'; + wp_enqueue_script( 'astra-heading-social-icon-customizer-preview-js', ASTRA_HEADER_SOCIAL_ICON_URI . '/assets/js/' . $dir_name . '/customizer-preview' . $file_prefix . '.js', array( 'customize-preview', 'astra-customizer-preview-js' ), ASTRA_THEME_VERSION, true ); + + // Localize variables for Astra Breakpoints JS. + wp_localize_script( + 'astra-heading-social-icon-customizer-preview-js', + 'astraBuilderHeaderSocial', + array( + 'tablet_break_point' => astra_get_tablet_breakpoint(), + 'mobile_break_point' => astra_get_mobile_breakpoint(), + 'component_limit' => defined( 'ASTRA_EXT_VER' ) ? Astra_Builder_Helper::$component_limit : Astra_Builder_Helper::$num_of_header_social_icons, + ) + ); + } +} + +/** +* Kicking this off by creating the object of the class. +*/ +new Astra_Header_Social_Icon_Component_Loader(); diff --git a/inc/builder/type/header/social-icon/class-astra-header-social-icon-component.php b/inc/builder/type/header/social-icon/class-astra-header-social-icon-component.php new file mode 100644 index 0000000..f674d4b --- /dev/null +++ b/inc/builder/type/header/social-icon/class-astra-header-social-icon-component.php @@ -0,0 +1,45 @@ +<?php +/** + * Heading Colors for Astra theme. + * + * @package astra-builder + * @author Astra + * @copyright Copyright (c) 2020, Astra + * @link https://wpastra.com/ + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +define( 'ASTRA_HEADER_SOCIAL_ICON_DIR', ASTRA_THEME_DIR . 'inc/builder/type/header/social-icon' ); +define( 'ASTRA_HEADER_SOCIAL_ICON_URI', ASTRA_THEME_URI . 'inc/builder/type/header/social-icon' ); + +/** + * Heading Initial Setup + * + * @since 3.0.0 + */ +class Astra_Header_Social_Icon_Component { + + /** + * Constructor function that initializes required actions and hooks + */ + public function __construct() { + + // @codingStandardsIgnoreStart WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + require_once ASTRA_HEADER_SOCIAL_ICON_DIR . '/class-astra-header-social-icon-component-loader.php'; + + // Include front end files. + if ( ! is_admin() ) { + require_once ASTRA_HEADER_SOCIAL_ICON_DIR . '/dynamic-css/dynamic.css.php'; + } + // @codingStandardsIgnoreEnd WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + } +} + +/** + * Kicking this off by creating an object. + */ +new Astra_Header_Social_Icon_Component(); diff --git a/inc/builder/type/header/social-icon/dynamic-css/dynamic.css.php b/inc/builder/type/header/social-icon/dynamic-css/dynamic.css.php new file mode 100644 index 0000000..a28bb81 --- /dev/null +++ b/inc/builder/type/header/social-icon/dynamic-css/dynamic.css.php @@ -0,0 +1,32 @@ +<?php +/** + * Heading Colors - Dynamic CSS + * + * @package Astra + * @since 2.1.4 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Heading Colors + */ +add_filter( 'astra_dynamic_theme_css', 'astra_hb_social_icon_dynamic_css' ); + +/** + * Dynamic CSS + * + * @param string $dynamic_css Astra Dynamic CSS. + * @param string $dynamic_css_filtered Astra Dynamic CSS Filters. + * @return String Generated dynamic CSS for Heading Colors. + * + * @since 2.1.4 + */ +function astra_hb_social_icon_dynamic_css( $dynamic_css, $dynamic_css_filtered = '' ) { + + $dynamic_css .= Astra_Social_Component_Dynamic_CSS::astra_social_dynamic_css( 'header' ); + + return $dynamic_css; +} diff --git a/inc/builder/type/header/widget/assets/js/minified/customizer-preview.min.js b/inc/builder/type/header/widget/assets/js/minified/customizer-preview.min.js new file mode 100644 index 0000000..be1be33 --- /dev/null +++ b/inc/builder/type/header/widget/assets/js/minified/customizer-preview.min.js @@ -0,0 +1 @@ +jQuery,astra_builder_widget_css("header");
\ No newline at end of file diff --git a/inc/builder/type/header/widget/assets/js/unminified/customizer-preview.js b/inc/builder/type/header/widget/assets/js/unminified/customizer-preview.js new file mode 100644 index 0000000..716bd12 --- /dev/null +++ b/inc/builder/type/header/widget/assets/js/unminified/customizer-preview.js @@ -0,0 +1,15 @@ +/**
+ * This file adds some LIVE to the Customizer live preview. To leverage
+ * this, set your custom settings to 'postMessage' and then add your handling
+ * here. Your javascript should grab settings from customizer controls, and
+ * then make any necessary changes to the page using jQuery.
+ *
+ * @package Astra Builder
+ * @since 3.0.0
+ */
+
+( function( $ ) {
+
+ astra_builder_widget_css( 'header' );
+
+} )( jQuery );
diff --git a/inc/builder/type/header/widget/class-astra-header-widget-component-loader.php b/inc/builder/type/header/widget/class-astra-header-widget-component-loader.php new file mode 100644 index 0000000..c174ec4 --- /dev/null +++ b/inc/builder/type/header/widget/class-astra-header-widget-component-loader.php @@ -0,0 +1,64 @@ +<?php +/** + * WIDGET Styling Loader for Astra theme. + * + * @package Astra Builder + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since Astra 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Customizer Initialization + * + * @since 3.0.0 + */ +class Astra_Header_Widget_Component_Loader { + + /** + * Constructor + * + * @since 3.0.0 + */ + public function __construct() { + add_action( 'customize_preview_init', array( $this, 'preview_scripts' ), 110 ); + } + + /** + * Customizer Preview + * + * @since 3.0.0 + */ + public function preview_scripts() { + /** + * Load unminified if SCRIPT_DEBUG is true. + */ + /* Directory and Extension */ + $dir_name = ( SCRIPT_DEBUG ) ? 'unminified' : 'minified'; + $file_prefix = ( SCRIPT_DEBUG ) ? '' : '.min'; + wp_enqueue_script( 'astra-header-widget-customizer-preview-js', ASTRA_BUILDER_HEADER_WIDGET_URI . '/assets/js/' . $dir_name . '/customizer-preview' . $file_prefix . '.js', array( 'customize-preview', 'astra-customizer-preview-js' ), ASTRA_THEME_VERSION, true ); + + // Localize variables for WIDGET JS. + wp_localize_script( + 'astra-header-widget-customizer-preview-js', + 'AstraBuilderWidgetData', + array( + 'header_widget_count' => defined( 'ASTRA_EXT_VER' ) ? Astra_Builder_Helper::$component_limit : Astra_Builder_Helper::$num_of_header_widgets, + 'tablet_break_point' => astra_get_tablet_breakpoint(), + 'mobile_break_point' => astra_get_mobile_breakpoint(), + 'is_flex_based_css' => Astra_Builder_Helper::apply_flex_based_css(), + 'has_block_editor' => astra_has_widgets_block_editor(), + ) + ); + } +} + +/** +* Kicking this off by creating the object of the class. +*/ +new Astra_Header_Widget_Component_Loader(); diff --git a/inc/builder/type/header/widget/class-astra-header-widget-component.php b/inc/builder/type/header/widget/class-astra-header-widget-component.php new file mode 100644 index 0000000..921e063 --- /dev/null +++ b/inc/builder/type/header/widget/class-astra-header-widget-component.php @@ -0,0 +1,45 @@ +<?php +/** + * WIDGET component. + * + * @package Astra Builder + * @author Brainstorm Force + * @copyright Copyright (c) 2020, Brainstorm Force + * @link https://www.brainstormforce.com + * @since Astra 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +define( 'ASTRA_BUILDER_HEADER_WIDGET_DIR', ASTRA_THEME_DIR . 'inc/builder/type/header/widget' ); +define( 'ASTRA_BUILDER_HEADER_WIDGET_URI', ASTRA_THEME_URI . 'inc/builder/type/header/widget' ); + +/** + * Heading Initial Setup + * + * @since 3.0.0 + */ +class Astra_Header_Widget_Component { + + /** + * Constructor function that initializes required actions and hooks + */ + public function __construct() { + + // @codingStandardsIgnoreStart WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + require_once ASTRA_BUILDER_HEADER_WIDGET_DIR . '/class-astra-header-widget-component-loader.php'; + + // Include front end files. + if ( ! is_admin() ) { + require_once ASTRA_BUILDER_HEADER_WIDGET_DIR . '/dynamic-css/dynamic.css.php'; + } + // @codingStandardsIgnoreEnd WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + } +} + +/** + * Kicking this off by creating an object. + */ +new Astra_Header_Widget_Component(); diff --git a/inc/builder/type/header/widget/dynamic-css/dynamic.css.php b/inc/builder/type/header/widget/dynamic-css/dynamic.css.php new file mode 100644 index 0000000..8e936ed --- /dev/null +++ b/inc/builder/type/header/widget/dynamic-css/dynamic.css.php @@ -0,0 +1,32 @@ +<?php +/** + * WIdget control - Dynamic CSS + * + * @package Astra Builder + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Heading Colors + */ +add_filter( 'astra_dynamic_theme_css', 'astra_hb_widget_dynamic_css' ); + +/** + * Dynamic CSS + * + * @param string $dynamic_css Astra Dynamic CSS. + * @param string $dynamic_css_filtered Astra Dynamic CSS Filters. + * @return String Generated dynamic CSS for Heading Colors. + * + * @since 3.0.0 + */ +function astra_hb_widget_dynamic_css( $dynamic_css, $dynamic_css_filtered = '' ) { + + $dynamic_css .= Astra_Widget_Component_Dynamic_CSS::astra_widget_dynamic_css( 'header' ); + + return $dynamic_css; +} diff --git a/inc/builder/type/header/woo-cart/assets/js/minified/customizer-preview.min.js b/inc/builder/type/header/woo-cart/assets/js/minified/customizer-preview.min.js new file mode 100644 index 0000000..323ce91 --- /dev/null +++ b/inc/builder/type/header/woo-cart/assets/js/minified/customizer-preview.min.js @@ -0,0 +1 @@ +!function(r){var t=".ast-site-header-cart",a=".astra-cart-drawer.woocommerce-active";astra_css("astra-settings[header-woo-cart-icon-color]","color",t+" .ast-cart-menu-wrap .count, "+t+" .ast-cart-menu-wrap .count:after,"+t+" .ast-woo-header-cart-info-wrap,"+t+" .ast-site-header-cart .ast-addon-cart-wrap"),astra_css("astra-settings[header-woo-cart-icon-color]","border-color",t+" .ast-cart-menu-wrap .count, "+t+" .ast-cart-menu-wrap .count:after"),astra_css("astra-settings[header-woo-cart-icon-color]","border-color",".ast-menu-cart-fill .ast-cart-menu-wrap .count, .ast-menu-cart-fill .ast-cart-menu-wrap"),astra_color_responsive_css("woo-cart-colors","astra-settings[header-woo-cart-text-color]","color",".astra-cart-drawer-title, .ast-site-header-cart-data span, .ast-site-header-cart-data strong, .ast-site-header-cart-data .woocommerce-mini-cart__empty-message, .ast-site-header-cart-data .total .woocommerce-Price-amount, .ast-site-header-cart-data .total .woocommerce-Price-amount .woocommerce-Price-currencySymbol, .ast-header-woo-cart .ast-site-header-cart .ast-site-header-cart-data .widget_shopping_cart .mini_cart_item a.remove,"+a+" .widget_shopping_cart_content span, "+a+" .widget_shopping_cart_content strong,"+a+" .woocommerce-mini-cart__empty-message, .astra-cart-drawer .woocommerce-mini-cart *, "+a+" .astra-cart-drawer-title"),astra_color_responsive_css("woo-cart-border-color","astra-settings[header-woo-cart-text-color]","border-color",".ast-site-header-cart .ast-site-header-cart-data .widget_shopping_cart .mini_cart_item a.remove, "+a+" .widget_shopping_cart .mini_cart_item a.remove"),astra_color_responsive_css("woo-cart-colors","astra-settings[header-woo-cart-link-color]","color",t+" .ast-site-header-cart-data .widget_shopping_cart_content a:not(.button),"+a+" .widget_shopping_cart_content a:not(.button)"),astra_color_responsive_css("woo-cart-colors","astra-settings[header-woo-cart-background-color]","background-color","#ast-site-header-cart .widget_shopping_cart, .ast-site-header-cart .ast-site-header-cart-data .widget_shopping_cart .mini_cart_item a.remove:hover, .ast-site-header-cart .ast-site-header-cart-data .widget_shopping_cart .mini_cart_item:hover > a.remove,"+a+","+a+" .widget_shopping_cart .mini_cart_item a.remove:hover,"+a+" .widget_shopping_cart .mini_cart_item:hover > a.remove, #astra-mobile-cart-drawer"+a),astra_color_responsive_css("woo-cart-border-color","astra-settings[header-woo-cart-background-color]","border-color","#ast-site-header-cart .widget_shopping_cart,"+a+" .widget_shopping_cart"),astra_color_responsive_css("woo-cart-border-bottom-color","astra-settings[header-woo-cart-background-color]","border-bottom-color","#ast-site-header-cart:hover .widget_shopping_cart:before, #ast-site-header-cart:hover .widget_shopping_cart:after, .open-preview-woocommerce-cart #ast-site-header-cart .widget_shopping_cart:before, #astra-mobile-cart-drawer:hover .widget_shopping_cart:before, #astra-mobile-cart-drawer:hover .widget_shopping_cart:after, #astra-mobile-cart-drawer .widget_shopping_cart:before"),astra_color_responsive_css("woo-cart-colors","astra-settings[header-woo-cart-separator-color]","border-top-color","#ast-site-header-cart .widget_shopping_cart .woocommerce-mini-cart__total, #astra-mobile-cart-drawer .widget_shopping_cart .woocommerce-mini-cart__total, .astra-cart-drawer .astra-cart-drawer-header"),astra_color_responsive_css("woo-cart-border-bottom-colors","astra-settings[header-woo-cart-separator-color]","border-bottom-color","#ast-site-header-cart .widget_shopping_cart .woocommerce-mini-cart__total, #astra-mobile-cart-drawer .widget_shopping_cart .woocommerce-mini-cart__total, .astra-cart-drawer .astra-cart-drawer-header, #ast-site-header-cart .widget_shopping_cart .mini_cart_item, #astra-mobile-cart-drawer .widget_shopping_cart .mini_cart_item"),astra_color_responsive_css("woo-cart-colors","astra-settings[header-woo-cart-link-hover-color]","color",".ast-site-header-cart .ast-site-header-cart-data .widget_shopping_cart_content a:not(.button):hover, .ast-site-header-cart .ast-site-header-cart-data .widget_shopping_cart .mini_cart_item a.remove:hover, .ast-site-header-cart .ast-site-header-cart-data .widget_shopping_cart .mini_cart_item:hover > a.remove,"+a+" .widget_shopping_cart_content a:not(.button):hover,"+a+" .widget_shopping_cart .mini_cart_item a.remove:hover,"+a+" .widget_shopping_cart .mini_cart_item:hover > a.remove"),astra_color_responsive_css("woo-cart-border-colors","astra-settings[header-woo-cart-link-hover-color]","border-color",t+" .ast-site-header-cart-data .widget_shopping_cart .mini_cart_item a.remove:hover,"+t+" .ast-site-header-cart-data .widget_shopping_cart .mini_cart_item:hover > a.remove,"+a+" .widget_shopping_cart .mini_cart_item a.remove:hover,"+a+" .widget_shopping_cart .mini_cart_item:hover > a.remove"),astra_color_responsive_css("woo-cart-colors","astra-settings[header-woo-cart-btn-text-color]","color",t+" .ast-site-header-cart-data .widget_shopping_cart_content a.button.wc-forward:not(.checkout),"+a+" .widget_shopping_cart_content a.button.wc-forward:not(.checkout)"),astra_color_responsive_css("woo-cart-colors","astra-settings[header-woo-cart-btn-background-color]","background-color",t+" .ast-site-header-cart-data .widget_shopping_cart_content a.button.wc-forward:not(.checkout),"+a+" .widget_shopping_cart_content a.button.wc-forward:not(.checkout)"),astra_color_responsive_css("woo-cart-colors","astra-settings[header-woo-cart-btn-text-hover-color]","color",t+" .ast-site-header-cart-data .widget_shopping_cart_content a.button.wc-forward:not(.checkout):hover,"+a+" .widget_shopping_cart_content a.button.wc-forward:not(.checkout):hover"),astra_color_responsive_css("woo-cart-colors","astra-settings[header-woo-cart-btn-bg-hover-color]","background-color",t+" .ast-site-header-cart-data .widget_shopping_cart_content a.button.wc-forward:not(.checkout):hover,"+a+" .widget_shopping_cart_content a.button.wc-forward:not(.checkout):hover"),astra_color_responsive_css("woo-cart-colors","astra-settings[header-woo-checkout-btn-text-color]","color",t+" .ast-site-header-cart-data .widget_shopping_cart_content a.button.checkout.wc-forward,"+a+" .widget_shopping_cart_content a.button.checkout.wc-forward"),astra_color_responsive_css("woo-cart-colors","astra-settings[header-woo-checkout-btn-background-color]","border-color",t+" .ast-site-header-cart-data .widget_shopping_cart_content a.button.checkout.wc-forward,"+a+" .widget_shopping_cart_content a.button.checkout.wc-forward"),astra_color_responsive_css("woo-cart-background-color","astra-settings[header-woo-checkout-btn-background-color]","background-color",t+" .ast-site-header-cart-data .widget_shopping_cart_content a.button.checkout.wc-forward,"+a+" .widget_shopping_cart_content a.button.checkout.wc-forward"),astra_color_responsive_css("woo-cart-background-color","astra-settings[header-woo-checkout-btn-text-hover-color]","color",t+" .ast-site-header-cart-data .widget_shopping_cart_content a.button.checkout.wc-forward:hover,"+a+" .widget_shopping_cart_content a.button.checkout.wc-forward:hover"),astra_color_responsive_css("woo-cart-background-color","astra-settings[header-woo-checkout-btn-bg-hover-color]","background-color",t+" .ast-site-header-cart-data .widget_shopping_cart_content a.button.checkout.wc-forward:hover,"+a+" .widget_shopping_cart_content a.button.checkout.wc-forward:hover"),wp.customize("astra-settings[woo-header-cart-icon-style]",function(t){t.bind(function(t){var a=r(document).find(".ast-site-header-cart");a.removeClass("ast-menu-cart-fill ast-menu-cart-outline ast-menu-cart-none"),a.addClass("ast-menu-cart-"+t);astra_add_dynamic_css("woo-header-cart-icon-style",".ast-site-header-cart a, .ast-site-header-cart a *{ transition: all 0s; } "),wp.customize.preview.send("refresh")})}),wp.customize("astra-settings[header-woo-cart-icon-color]",function(t){t.bind(function(t){astra_add_dynamic_css("header-woo-cart-icon-color",".ast-menu-cart-fill .ast-cart-menu-wrap .count, .ast-menu-cart-fill .ast-cart-menu-wrap { background-color: "+t+"; } "),wp.customize.preview.send("refresh")})}),wp.customize("astra-settings[woo-header-cart-icon-radius]",function(t){t.bind(function(t){astra_add_dynamic_css("woo-header-cart-icon-radius",".ast-site-header-cart.ast-menu-cart-outline .ast-cart-menu-wrap, .ast-site-header-cart.ast-menu-cart-fill .ast-cart-menu-wrap, .ast-site-header-cart.ast-menu-cart-outline .ast-cart-menu-wrap .count, .ast-site-header-cart.ast-menu-cart-fill .ast-cart-menu-wrap .count, .ast-site-header-cart.ast-menu-cart-outline .ast-addon-cart-wrap, .ast-site-header-cart.ast-menu-cart-fill .ast-addon-cart-wrap { border-radius: "+t+"px; } ")})}),wp.customize("astra-settings[transparent-header-woo-cart-icon-color]",function(t){t.bind(function(t){wp.customize.preview.send("refresh")})}),astra_builder_visibility_css("section-header-woo-cart",".ast-header-woo-cart")}(jQuery);
\ No newline at end of file diff --git a/inc/builder/type/header/woo-cart/assets/js/unminified/customizer-preview.js b/inc/builder/type/header/woo-cart/assets/js/unminified/customizer-preview.js new file mode 100644 index 0000000..0e4f415 --- /dev/null +++ b/inc/builder/type/header/woo-cart/assets/js/unminified/customizer-preview.js @@ -0,0 +1,220 @@ +/**
+ * This file adds some LIVE to the Customizer live preview. To leverage
+ * this, set your custom settings to 'postMessage' and then add your handling
+ * here. Your javascript should grab settings from customizer controls, and
+ * then make any necessary changes to the page using jQuery.
+ *
+ * @package Astra
+ * @since x.x.x
+ */
+
+( function( $ ) {
+
+ var selector = '.ast-site-header-cart';
+ var responsive_selector = '.astra-cart-drawer.woocommerce-active';
+
+ // Icon Color.
+ astra_css(
+ 'astra-settings[header-woo-cart-icon-color]',
+ 'color',
+ selector + ' .ast-cart-menu-wrap .count, ' + selector + ' .ast-cart-menu-wrap .count:after,' + selector + ' .ast-woo-header-cart-info-wrap,' + selector + ' .ast-site-header-cart .ast-addon-cart-wrap'
+ );
+
+ // Icon Color.
+ astra_css(
+ 'astra-settings[header-woo-cart-icon-color]',
+ 'border-color',
+ selector + ' .ast-cart-menu-wrap .count, ' + selector + ' .ast-cart-menu-wrap .count:after'
+ );
+
+ // Icon BG Color.
+ astra_css(
+ 'astra-settings[header-woo-cart-icon-color]',
+ 'border-color',
+ '.ast-menu-cart-fill .ast-cart-menu-wrap .count, .ast-menu-cart-fill .ast-cart-menu-wrap'
+ );
+
+ // WooCommerce Cart Colors.
+
+ astra_color_responsive_css(
+ 'woo-cart-colors',
+ 'astra-settings[header-woo-cart-text-color]',
+ 'color',
+ '.astra-cart-drawer-title, .ast-site-header-cart-data span, .ast-site-header-cart-data strong, .ast-site-header-cart-data .woocommerce-mini-cart__empty-message, .ast-site-header-cart-data .total .woocommerce-Price-amount, .ast-site-header-cart-data .total .woocommerce-Price-amount .woocommerce-Price-currencySymbol, .ast-header-woo-cart .ast-site-header-cart .ast-site-header-cart-data .widget_shopping_cart .mini_cart_item a.remove,' + responsive_selector + ' .widget_shopping_cart_content span, '+ responsive_selector + ' .widget_shopping_cart_content strong,'+ responsive_selector + ' .woocommerce-mini-cart__empty-message, .astra-cart-drawer .woocommerce-mini-cart *, ' + responsive_selector + ' .astra-cart-drawer-title'
+ );
+
+ astra_color_responsive_css(
+ 'woo-cart-border-color',
+ 'astra-settings[header-woo-cart-text-color]',
+ 'border-color',
+ '.ast-site-header-cart .ast-site-header-cart-data .widget_shopping_cart .mini_cart_item a.remove, '+ responsive_selector + ' .widget_shopping_cart .mini_cart_item a.remove'
+ );
+
+ astra_color_responsive_css(
+ 'woo-cart-colors',
+ 'astra-settings[header-woo-cart-link-color]',
+ 'color',
+ selector + ' .ast-site-header-cart-data .widget_shopping_cart_content a:not(.button),' + responsive_selector + ' .widget_shopping_cart_content a:not(.button)'
+ );
+
+ astra_color_responsive_css(
+ 'woo-cart-colors',
+ 'astra-settings[header-woo-cart-background-color]',
+ 'background-color',
+ '#ast-site-header-cart .widget_shopping_cart, .ast-site-header-cart .ast-site-header-cart-data .widget_shopping_cart .mini_cart_item a.remove:hover, .ast-site-header-cart .ast-site-header-cart-data .widget_shopping_cart .mini_cart_item:hover > a.remove,' + responsive_selector + ','+ responsive_selector + ' .widget_shopping_cart .mini_cart_item a.remove:hover,'+ responsive_selector + ' .widget_shopping_cart .mini_cart_item:hover > a.remove, #astra-mobile-cart-drawer' + responsive_selector
+ );
+
+ astra_color_responsive_css(
+ 'woo-cart-border-color',
+ 'astra-settings[header-woo-cart-background-color]',
+ 'border-color',
+ '#ast-site-header-cart .widget_shopping_cart,' + responsive_selector + ' .widget_shopping_cart'
+ );
+
+ astra_color_responsive_css(
+ 'woo-cart-border-bottom-color',
+ 'astra-settings[header-woo-cart-background-color]',
+ 'border-bottom-color',
+ '#ast-site-header-cart:hover .widget_shopping_cart:before, #ast-site-header-cart:hover .widget_shopping_cart:after, .open-preview-woocommerce-cart #ast-site-header-cart .widget_shopping_cart:before, #astra-mobile-cart-drawer:hover .widget_shopping_cart:before, #astra-mobile-cart-drawer:hover .widget_shopping_cart:after, #astra-mobile-cart-drawer .widget_shopping_cart:before'
+ );
+
+ astra_color_responsive_css(
+ 'woo-cart-colors',
+ 'astra-settings[header-woo-cart-separator-color]',
+ 'border-top-color',
+ '#ast-site-header-cart .widget_shopping_cart .woocommerce-mini-cart__total, #astra-mobile-cart-drawer .widget_shopping_cart .woocommerce-mini-cart__total, .astra-cart-drawer .astra-cart-drawer-header'
+ );
+
+ astra_color_responsive_css(
+ 'woo-cart-border-bottom-colors',
+ 'astra-settings[header-woo-cart-separator-color]',
+ 'border-bottom-color',
+ '#ast-site-header-cart .widget_shopping_cart .woocommerce-mini-cart__total, #astra-mobile-cart-drawer .widget_shopping_cart .woocommerce-mini-cart__total, .astra-cart-drawer .astra-cart-drawer-header, #ast-site-header-cart .widget_shopping_cart .mini_cart_item, #astra-mobile-cart-drawer .widget_shopping_cart .mini_cart_item'
+ );
+
+ astra_color_responsive_css(
+ 'woo-cart-colors',
+ 'astra-settings[header-woo-cart-link-hover-color]',
+ 'color',
+ '.ast-site-header-cart .ast-site-header-cart-data .widget_shopping_cart_content a:not(.button):hover, .ast-site-header-cart .ast-site-header-cart-data .widget_shopping_cart .mini_cart_item a.remove:hover, .ast-site-header-cart .ast-site-header-cart-data .widget_shopping_cart .mini_cart_item:hover > a.remove,' + responsive_selector + ' .widget_shopping_cart_content a:not(.button):hover,'+ responsive_selector +' .widget_shopping_cart .mini_cart_item a.remove:hover,'+ responsive_selector + ' .widget_shopping_cart .mini_cart_item:hover > a.remove'
+ );
+
+ astra_color_responsive_css(
+ 'woo-cart-border-colors',
+ 'astra-settings[header-woo-cart-link-hover-color]',
+ 'border-color',
+ selector + ' .ast-site-header-cart-data .widget_shopping_cart .mini_cart_item a.remove:hover,'+ selector + ' .ast-site-header-cart-data .widget_shopping_cart .mini_cart_item:hover > a.remove,' + responsive_selector + ' .widget_shopping_cart .mini_cart_item a.remove:hover,'+ responsive_selector + ' .widget_shopping_cart .mini_cart_item:hover > a.remove'
+ );
+
+ astra_color_responsive_css(
+ 'woo-cart-colors',
+ 'astra-settings[header-woo-cart-btn-text-color]',
+ 'color',
+ selector + ' .ast-site-header-cart-data .widget_shopping_cart_content a.button.wc-forward:not(.checkout),' + responsive_selector + ' .widget_shopping_cart_content a.button.wc-forward:not(.checkout)'
+ );
+
+ astra_color_responsive_css(
+ 'woo-cart-colors',
+ 'astra-settings[header-woo-cart-btn-background-color]',
+ 'background-color',
+ selector + ' .ast-site-header-cart-data .widget_shopping_cart_content a.button.wc-forward:not(.checkout),' + responsive_selector + ' .widget_shopping_cart_content a.button.wc-forward:not(.checkout)'
+ );
+
+ astra_color_responsive_css(
+ 'woo-cart-colors',
+ 'astra-settings[header-woo-cart-btn-text-hover-color]',
+ 'color',
+ selector + ' .ast-site-header-cart-data .widget_shopping_cart_content a.button.wc-forward:not(.checkout):hover,' + responsive_selector + ' .widget_shopping_cart_content a.button.wc-forward:not(.checkout):hover'
+ );
+
+ astra_color_responsive_css(
+ 'woo-cart-colors',
+ 'astra-settings[header-woo-cart-btn-bg-hover-color]',
+ 'background-color',
+ selector + ' .ast-site-header-cart-data .widget_shopping_cart_content a.button.wc-forward:not(.checkout):hover,' + responsive_selector + ' .widget_shopping_cart_content a.button.wc-forward:not(.checkout):hover'
+ );
+
+ astra_color_responsive_css(
+ 'woo-cart-colors',
+ 'astra-settings[header-woo-checkout-btn-text-color]',
+ 'color',
+ selector + ' .ast-site-header-cart-data .widget_shopping_cart_content a.button.checkout.wc-forward,' + responsive_selector + ' .widget_shopping_cart_content a.button.checkout.wc-forward'
+ );
+
+ astra_color_responsive_css(
+ 'woo-cart-colors',
+ 'astra-settings[header-woo-checkout-btn-background-color]',
+ 'border-color',
+ selector + ' .ast-site-header-cart-data .widget_shopping_cart_content a.button.checkout.wc-forward,' + responsive_selector + ' .widget_shopping_cart_content a.button.checkout.wc-forward'
+ );
+
+ astra_color_responsive_css(
+ 'woo-cart-background-color',
+ 'astra-settings[header-woo-checkout-btn-background-color]',
+ 'background-color',
+ selector + ' .ast-site-header-cart-data .widget_shopping_cart_content a.button.checkout.wc-forward,' + responsive_selector + ' .widget_shopping_cart_content a.button.checkout.wc-forward'
+ );
+
+ astra_color_responsive_css(
+ 'woo-cart-background-color',
+ 'astra-settings[header-woo-checkout-btn-text-hover-color]',
+ 'color',
+ selector + ' .ast-site-header-cart-data .widget_shopping_cart_content a.button.checkout.wc-forward:hover,' + responsive_selector + ' .widget_shopping_cart_content a.button.checkout.wc-forward:hover'
+ );
+
+ astra_color_responsive_css(
+ 'woo-cart-background-color',
+ 'astra-settings[header-woo-checkout-btn-bg-hover-color]',
+ 'background-color',
+ selector + ' .ast-site-header-cart-data .widget_shopping_cart_content a.button.checkout.wc-forward:hover,' + responsive_selector + ' .widget_shopping_cart_content a.button.checkout.wc-forward:hover'
+ );
+
+ /**
+ * Cart icon style
+ */
+ wp.customize( 'astra-settings[woo-header-cart-icon-style]', function( setting ) {
+ setting.bind( function( icon_style ) {
+
+ var buttons = $(document).find('.ast-site-header-cart');
+ buttons.removeClass('ast-menu-cart-fill ast-menu-cart-outline ast-menu-cart-none');
+ buttons.addClass( 'ast-menu-cart-' + icon_style );
+ var dynamicStyle = '.ast-site-header-cart a, .ast-site-header-cart a *{ transition: all 0s; } ';
+ astra_add_dynamic_css( 'woo-header-cart-icon-style', dynamicStyle );
+ wp.customize.preview.send( 'refresh' );
+ } );
+ } );
+
+ /**
+ * Cart icon style
+ */
+ wp.customize( 'astra-settings[header-woo-cart-icon-color]', function( setting ) {
+ setting.bind( function( color ) {
+ var dynamicStyle = '.ast-menu-cart-fill .ast-cart-menu-wrap .count, .ast-menu-cart-fill .ast-cart-menu-wrap { background-color: ' + color + '; } ';
+ astra_add_dynamic_css( 'header-woo-cart-icon-color', dynamicStyle );
+ wp.customize.preview.send( 'refresh' );
+ } );
+ } );
+
+ /**
+ * Cart Border Radius
+ */
+ wp.customize( 'astra-settings[woo-header-cart-icon-radius]', function( setting ) {
+ setting.bind( function( radius ) {
+ var dynamicStyle = '.ast-site-header-cart.ast-menu-cart-outline .ast-cart-menu-wrap, .ast-site-header-cart.ast-menu-cart-fill .ast-cart-menu-wrap, .ast-site-header-cart.ast-menu-cart-outline .ast-cart-menu-wrap .count, .ast-site-header-cart.ast-menu-cart-fill .ast-cart-menu-wrap .count, .ast-site-header-cart.ast-menu-cart-outline .ast-addon-cart-wrap, .ast-site-header-cart.ast-menu-cart-fill .ast-addon-cart-wrap { border-radius: ' + radius + 'px; } ';
+ astra_add_dynamic_css( 'woo-header-cart-icon-radius', dynamicStyle );
+ } );
+ } );
+
+ /**
+ * Transparent Header WOO-Cart color options - Customizer preview CSS.
+ */
+ wp.customize( 'astra-settings[transparent-header-woo-cart-icon-color]', function( setting ) {
+ setting.bind( function( cart_icon_color ) {
+ wp.customize.preview.send( 'refresh' );
+ });
+ });
+
+ // Advanced Visibility CSS Generation.
+ astra_builder_visibility_css( 'section-header-woo-cart', '.ast-header-woo-cart' );
+
+} )( jQuery );
diff --git a/inc/builder/type/header/woo-cart/class-astra-header-woo-cart-component.php b/inc/builder/type/header/woo-cart/class-astra-header-woo-cart-component.php new file mode 100644 index 0000000..abc517e --- /dev/null +++ b/inc/builder/type/header/woo-cart/class-astra-header-woo-cart-component.php @@ -0,0 +1,49 @@ +<?php +/** + * WooCommerce Cart for Astra theme. + * + * @package astra-builder + * @author Astra + * @copyright Copyright (c) 2020, Astra + * @link https://wpastra.com/ + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +define( 'ASTRA_HEADER_WOO_CART_DIR', ASTRA_THEME_DIR . 'inc/builder/type/header/woo-cart' ); +define( 'ASTRA_HEADER_WOO_CART_URI', ASTRA_THEME_URI . 'inc/builder/type/header/woo-cart' ); + +if ( ! class_exists( 'Astra_Header_Woo_Cart_Component' ) ) { + + /** + * Heading Initial Setup + * + * @since 3.0.0 + */ + class Astra_Header_Woo_Cart_Component { + + /** + * Constructor function that initializes required actions and hooks + */ + public function __construct() { + + // @codingStandardsIgnoreStart WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + require_once ASTRA_HEADER_WOO_CART_DIR . '/class-astra-header-woo-cart-loader.php'; + + // Include front end files. + if ( ! is_admin() ) { + require_once ASTRA_HEADER_WOO_CART_DIR . '/dynamic-css/dynamic.css.php'; + } + // @codingStandardsIgnoreEnd WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound + } + } + + /** + * Kicking this off by creating an object. + */ + new Astra_Header_Woo_Cart_Component(); + +} diff --git a/inc/builder/type/header/woo-cart/class-astra-header-woo-cart-loader.php b/inc/builder/type/header/woo-cart/class-astra-header-woo-cart-loader.php new file mode 100644 index 0000000..860b9a9 --- /dev/null +++ b/inc/builder/type/header/woo-cart/class-astra-header-woo-cart-loader.php @@ -0,0 +1,53 @@ +<?php +/** + * WooCommerce Cart Styling Loader for Astra theme. + * + * @package astra-builder + * @author Astra + * @copyright Copyright (c) 2020, Astra + * @link https://wpastra.com/ + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Customizer Initialization + * + * @since 3.0.0 + */ +class Astra_Header_Woo_Cart_Loader { + + /** + * Constructor + * + * @since 3.0.0 + */ + public function __construct() { + + add_action( 'customize_preview_init', array( $this, 'preview_scripts' ), 110 ); + } + + /** + * Customizer Preview + * + * @since 3.0.0 + */ + public function preview_scripts() { + /** + * Load unminified if SCRIPT_DEBUG is true. + */ + /* Directory and Extension */ + $dir_name = ( SCRIPT_DEBUG ) ? 'unminified' : 'minified'; + $file_prefix = ( SCRIPT_DEBUG ) ? '' : '.min'; + wp_enqueue_script( 'astra-header-builder-woo-cart-customizer-preview-js', ASTRA_HEADER_WOO_CART_URI . '/assets/js/' . $dir_name . '/customizer-preview' . $file_prefix . '.js', array( 'customize-preview', 'astra-customizer-preview-js' ), ASTRA_THEME_VERSION, true ); + } + +} + +/** +* Kicking this off by creating the object of the class. +*/ +new Astra_Header_Woo_Cart_Loader(); diff --git a/inc/builder/type/header/woo-cart/dynamic-css/dynamic.css.php b/inc/builder/type/header/woo-cart/dynamic-css/dynamic.css.php new file mode 100644 index 0000000..f9c9ec7 --- /dev/null +++ b/inc/builder/type/header/woo-cart/dynamic-css/dynamic.css.php @@ -0,0 +1,432 @@ +<?php +/** + * WooCommerce Cart - Dynamic CSS + * + * @package Astra + * @since 3.0.0 + */ + +if ( ! defined( 'ABSPATH' ) ) { + exit; // Exit if accessed directly. +} + +/** + * Search + */ +add_filter( 'astra_dynamic_theme_css', 'astra_hb_woo_cart_dynamic_css' ); + +/** + * Dynamic CSS + * + * @param string $dynamic_css Astra Dynamic CSS. + * @param string $dynamic_css_filtered Astra Dynamic CSS Filters. + * @return String Generated dynamic CSS for Search. + * + * @since 3.0.0 + */ +function astra_hb_woo_cart_dynamic_css( $dynamic_css, $dynamic_css_filtered = '' ) { + + if ( ! Astra_Builder_Helper::is_component_loaded( 'woo-cart', 'header' ) ) { + return $dynamic_css; + } + + $selector = '.ast-site-header-cart'; + $trans_header_selector = '.ast-theme-transparent-header .ast-site-header-cart'; + $theme_color = astra_get_option( 'theme-color' ); + $icon_color = esc_attr( astra_get_option( 'header-woo-cart-icon-color', $theme_color ) ); + $header_cart_icon_radius = astra_get_option( 'woo-header-cart-icon-radius' ); + $cart_h_color = astra_get_foreground_color( $icon_color ); + $header_cart_icon_style = astra_get_option( 'woo-header-cart-icon-style' ); + $theme_h_color = astra_get_foreground_color( $theme_color ); + + $transparent_header_icon_color = esc_attr( astra_get_option( 'transparent-header-woo-cart-icon-color', $icon_color ) ); + $transparent_header_cart_h_color = astra_get_foreground_color( $transparent_header_icon_color ); + + if ( 'none' === $header_cart_icon_style ) { + $icon_color = $theme_color; + $transparent_header_icon_color = $theme_color; + } + + /** + * - WooCommerce cart styles. + */ + $cart_text_color = astra_get_option( 'header-woo-cart-text-color' ); + $cart_link_color = astra_get_option( 'header-woo-cart-link-color' ); + $cart_bg_color = astra_get_option( 'header-woo-cart-background-color' ); + $cart_separator_color = astra_get_option( 'header-woo-cart-separator-color' ); + $cart_h_link_color = astra_get_option( 'header-woo-cart-link-hover-color' ); + + $cart_button_text_color = astra_get_option( 'header-woo-cart-btn-text-color' ); + $cart_button_bg_color = astra_get_option( 'header-woo-cart-btn-background-color' ); + $cart_button_text_h_color = astra_get_option( 'header-woo-cart-btn-text-hover-color' ); + $cart_button_bg_h_color = astra_get_option( 'header-woo-cart-btn-bg-hover-color' ); + + $checkout_button_text_color = astra_get_option( 'header-woo-checkout-btn-text-color' ); + $checkout_button_bg_color = astra_get_option( 'header-woo-checkout-btn-background-color' ); + $checkout_button_text_h_color = astra_get_option( 'header-woo-checkout-btn-text-hover-color' ); + $checkout_button_bg_h_color = astra_get_option( 'header-woo-checkout-btn-bg-hover-color' ); + + $header_cart_icon = ''; + + $cart_text_color_desktop = ( ! empty( $cart_text_color['desktop'] ) ) ? $cart_text_color['desktop'] : ''; + $cart_text_color_mobile = ( ! empty( $cart_text_color['mobile'] ) ) ? $cart_text_color['mobile'] : ''; + $cart_text_color_tablet = ( ! empty( $cart_text_color['tablet'] ) ) ? $cart_text_color['tablet'] : ''; + + $cart_bg_color_desktop = ( ! empty( $cart_bg_color['desktop'] ) ) ? $cart_bg_color['desktop'] : ''; + $cart_bg_color_mobile = ( ! empty( $cart_bg_color['mobile'] ) ) ? $cart_bg_color['mobile'] : ''; + $cart_bg_color_tablet = ( ! empty( $cart_bg_color['tablet'] ) ) ? $cart_bg_color['tablet'] : ''; + + $cart_link_color_desktop = ( ! empty( $cart_link_color['desktop'] ) ) ? $cart_link_color['desktop'] : ''; + $cart_link_color_mobile = ( ! empty( $cart_link_color['mobile'] ) ) ? $cart_link_color['mobile'] : ''; + $cart_link_color_tablet = ( ! empty( $cart_link_color['tablet'] ) ) ? $cart_link_color['tablet'] : ''; + + $cart_separator_color_desktop = ( ! empty( $cart_separator_color['desktop'] ) ) ? $cart_separator_color['desktop'] : ''; + $cart_separator_color_mobile = ( ! empty( $cart_separator_color['mobile'] ) ) ? $cart_separator_color['mobile'] : ''; + $cart_separator_color_tablet = ( ! empty( $cart_separator_color['tablet'] ) ) ? $cart_separator_color['tablet'] : ''; + + $cart_h_link_color_desktop = ( ! empty( $cart_h_link_color['desktop'] ) ) ? $cart_h_link_color['desktop'] : ''; + $cart_h_link_color_mobile = ( ! empty( $cart_h_link_color['mobile'] ) ) ? $cart_h_link_color['mobile'] : ''; + $cart_h_link_color_tablet = ( ! empty( $cart_h_link_color['tablet'] ) ) ? $cart_h_link_color['tablet'] : ''; + + $checkout_button_text_color_desktop = ( ! empty( $checkout_button_text_color['desktop'] ) ) ? $checkout_button_text_color['desktop'] : ''; + $checkout_button_text_color_mobile = ( ! empty( $checkout_button_text_color['mobile'] ) ) ? $checkout_button_text_color['mobile'] : ''; + $checkout_button_text_color_tablet = ( ! empty( $checkout_button_text_color['tablet'] ) ) ? $checkout_button_text_color['tablet'] : ''; + + $checkout_button_bg_color_desktop = ( ! empty( $checkout_button_bg_color['desktop'] ) ) ? $checkout_button_bg_color['desktop'] : ''; + $checkout_button_bg_color_mobile = ( ! empty( $checkout_button_bg_color['mobile'] ) ) ? $checkout_button_bg_color['mobile'] : ''; + $checkout_button_bg_color_tablet = ( ! empty( $checkout_button_bg_color['tablet'] ) ) ? $checkout_button_bg_color['tablet'] : ''; + + $checkout_button_text_h_color_desktop = ( ! empty( $checkout_button_text_h_color['desktop'] ) ) ? $checkout_button_text_h_color['desktop'] : ''; + $checkout_button_text_h_color_mobile = ( ! empty( $checkout_button_text_h_color['mobile'] ) ) ? $checkout_button_text_h_color['mobile'] : ''; + $checkout_button_text_h_color_tablet = ( ! empty( $checkout_button_text_h_color['tablet'] ) ) ? $checkout_button_text_h_color['tablet'] : ''; + + $checkout_button_bg_h_color_desktop = ( ! empty( $checkout_button_bg_h_color['desktop'] ) ) ? $checkout_button_bg_h_color['desktop'] : ''; + $checkout_button_bg_h_color_mobile = ( ! empty( $checkout_button_bg_h_color['mobile'] ) ) ? $checkout_button_bg_h_color['mobile'] : ''; + $checkout_button_bg_h_color_tablet = ( ! empty( $checkout_button_bg_h_color['tablet'] ) ) ? $checkout_button_bg_h_color['tablet'] : ''; + + $cart_button_text_color_desktop = ( ! empty( $cart_button_text_color['desktop'] ) ) ? $cart_button_text_color['desktop'] : ''; + $cart_button_text_color_mobile = ( ! empty( $cart_button_text_color['mobile'] ) ) ? $cart_button_text_color['mobile'] : ''; + $cart_button_text_color_tablet = ( ! empty( $cart_button_text_color['tablet'] ) ) ? $cart_button_text_color['tablet'] : ''; + + $cart_button_bg_color_desktop = ( ! empty( $cart_button_bg_color['desktop'] ) ) ? $cart_button_bg_color['desktop'] : ''; + $cart_button_bg_color_mobile = ( ! empty( $cart_button_bg_color['mobile'] ) ) ? $cart_button_bg_color['mobile'] : ''; + $cart_button_bg_color_tablet = ( ! empty( $cart_button_bg_color['tablet'] ) ) ? $cart_button_bg_color['tablet'] : ''; + + $cart_button_text_h_color_desktop = ( ! empty( $cart_button_text_h_color['desktop'] ) ) ? $cart_button_text_h_color['desktop'] : ''; + $cart_button_text_h_color_mobile = ( ! empty( $cart_button_text_h_color['mobile'] ) ) ? $cart_button_text_h_color['mobile'] : ''; + $cart_button_text_h_color_tablet = ( ! empty( $cart_button_text_h_color['tablet'] ) ) ? $cart_button_text_h_color['tablet'] : ''; + + $cart_button_bg_h_color_desktop = ( ! empty( $cart_button_bg_h_color['desktop'] ) ) ? $cart_button_bg_h_color['desktop'] : ''; + $cart_button_bg_h_color_mobile = ( ! empty( $cart_button_bg_h_color['mobile'] ) ) ? $cart_button_bg_h_color['mobile'] : ''; + $cart_button_bg_h_color_tablet = ( ! empty( $cart_button_bg_h_color['tablet'] ) ) ? $cart_button_bg_h_color['tablet'] : ''; + + /** + * Woo Cart CSS. + */ + $css_output_desktop = array( + + $selector . ' .ast-cart-menu-wrap, ' . $selector . ' .ast-addon-cart-wrap' => array( + 'color' => $icon_color, + ), + $selector . ' .ast-cart-menu-wrap .count, ' . $selector . ' .ast-cart-menu-wrap .count:after, ' . $selector . ' .ast-addon-cart-wrap .count, ' . $selector . ' .ast-addon-cart-wrap .ast-icon-shopping-cart:after' => array( + 'color' => $icon_color, + 'border-color' => $icon_color, + ), + $selector . ' .ast-addon-cart-wrap .ast-icon-shopping-cart:after' => array( + 'color' => esc_attr( $theme_h_color ), + 'background-color' => esc_attr( $icon_color ), + ), + $selector . ' .ast-woo-header-cart-info-wrap' => array( + 'color' => esc_attr( $icon_color ), + ), + $selector . ' .ast-addon-cart-wrap i.astra-icon:after' => array( + 'color' => esc_attr( $theme_h_color ), + 'background-color' => esc_attr( $icon_color ), + ), + /** + * Transparent Header - Woo Cart icon color. + */ + $trans_header_selector . ' .ast-cart-menu-wrap, ' . $trans_header_selector . ' .ast-addon-cart-wrap' => array( + 'color' => $transparent_header_icon_color, + ), + $trans_header_selector . ' .ast-cart-menu-wrap .count, ' . $trans_header_selector . ' .ast-cart-menu-wrap .count:after, ' . $trans_header_selector . ' .ast-addon-cart-wrap .count, ' . $trans_header_selector . ' .ast-addon-cart-wrap .ast-icon-shopping-cart:after' => array( + 'color' => $transparent_header_icon_color, + 'border-color' => $transparent_header_icon_color, + ), + $trans_header_selector . ' .ast-addon-cart-wrap .ast-icon-shopping-cart:after' => array( + 'color' => esc_attr( $theme_h_color ), + 'background-color' => esc_attr( $transparent_header_icon_color ), + ), + $trans_header_selector . ' .ast-woo-header-cart-info-wrap' => array( + 'color' => esc_attr( $transparent_header_icon_color ), + ), + $trans_header_selector . ' .ast-addon-cart-wrap i.astra-icon:after' => array( + 'color' => esc_attr( $theme_h_color ), + 'background-color' => esc_attr( $transparent_header_icon_color ), + ), + /** + * General Woo Cart tray color for widget + */ + '.ast-site-header-cart .ast-site-header-cart-data .widget_shopping_cart_content a:not(.button)' => array( + 'color' => esc_attr( $cart_link_color_desktop ), + ), + '.ast-site-header-cart-data span, .ast-site-header-cart-data strong, .ast-site-header-cart-data .woocommerce-mini-cart__empty-message, .ast-site-header-cart-data .total .woocommerce-Price-amount, .ast-site-header-cart-data .total .woocommerce-Price-amount .woocommerce-Price-currencySymbol, .ast-header-woo-cart .ast-site-header-cart .ast-site-header-cart-data .widget_shopping_cart .mini_cart_item a.remove' => array( + 'color' => esc_attr( $cart_text_color_desktop ), + ), + '.ast-site-header-cart .ast-site-header-cart-data .widget_shopping_cart_content a:not(.button):hover' => array( + 'color' => esc_attr( $cart_h_link_color_desktop ), + ), + '#ast-site-header-cart .widget_shopping_cart' => array( + 'background-color' => esc_attr( $cart_bg_color_desktop ), + 'border-color' => esc_attr( $cart_bg_color_desktop ), + ), + '#ast-site-header-cart .widget_shopping_cart .woocommerce-mini-cart__total, .astra-cart-drawer .astra-cart-drawer-header' => array( + 'border-top-color' => esc_attr( $cart_separator_color_desktop ), + 'border-bottom-color' => esc_attr( $cart_separator_color_desktop ), + ), + '#ast-site-header-cart .widget_shopping_cart .mini_cart_item' => array( + 'border-bottom-color' => astra_hex_to_rgba( $cart_separator_color_desktop ), + ), + '#ast-site-header-cart:hover .widget_shopping_cart:before, #ast-site-header-cart:hover .widget_shopping_cart:after, .open-preview-woocommerce-cart #ast-site-header-cart .widget_shopping_cart:before' => array( + 'border-bottom-color' => esc_attr( $cart_bg_color_desktop ), + ), + '.ast-site-header-cart .ast-site-header-cart-data .widget_shopping_cart .mini_cart_item a.remove' => array( + 'border-color' => esc_attr( $cart_text_color_desktop ), + ), + '.ast-site-header-cart .ast-site-header-cart-data .widget_shopping_cart .mini_cart_item a.remove:hover, .ast-site-header-cart .ast-site-header-cart-data .widget_shopping_cart .mini_cart_item:hover > a.remove' => array( + 'color' => esc_attr( $cart_h_link_color_desktop ), + 'border-color' => esc_attr( $cart_h_link_color_desktop ), + 'background-color' => esc_attr( $cart_bg_color_desktop ), + ), + + /** + * Cart button color for widget + */ + '.ast-site-header-cart .ast-site-header-cart-data .widget_shopping_cart_content a.button.wc-forward:not(.checkout)' => array( + 'color' => esc_attr( $cart_button_text_color_desktop ), + 'background-color' => esc_attr( $cart_button_bg_color_desktop ), + ), + '.ast-site-header-cart .ast-site-header-cart-data .widget_shopping_cart_content a.button.wc-forward:not(.checkout):hover' => array( + 'color' => esc_attr( $cart_button_text_h_color_desktop ), + 'background-color' => esc_attr( $cart_button_bg_h_color_desktop ), + ), + + /** + * Checkout button color for widget + */ + '.ast-site-header-cart .ast-site-header-cart-data .widget_shopping_cart_content a.button.checkout.wc-forward' => array( + 'color' => esc_attr( $checkout_button_text_color_desktop ), + 'border-color' => esc_attr( $checkout_button_bg_color_desktop ), + 'background-color' => esc_attr( $checkout_button_bg_color_desktop ), + ), + '.ast-site-header-cart .ast-site-header-cart-data .widget_shopping_cart_content a.button.checkout.wc-forward:hover' => array( + 'color' => esc_attr( $checkout_button_text_h_color_desktop ), + 'background-color' => esc_attr( $checkout_button_bg_h_color_desktop ), + ), + ); + + /* Parse CSS from array() */ + $css_output = astra_parse_css( $css_output_desktop ); + $responsive_selector = '.astra-cart-drawer.woocommerce-active'; + + $css_output_mobile = array( + $responsive_selector . ' .astra-cart-drawer-title, ' . $responsive_selector . ' .widget_shopping_cart_content span, ' . $responsive_selector . ' .widget_shopping_cart_content strong,' . $responsive_selector . ' .woocommerce-mini-cart__empty-message, .astra-cart-drawer .woocommerce-mini-cart *' => array( + 'color' => esc_attr( $cart_text_color_mobile ), + ), + $responsive_selector . ' .widget_shopping_cart .mini_cart_item a.remove' => array( + 'border-color' => esc_attr( $cart_text_color_mobile ), + ), + $responsive_selector . '#astra-mobile-cart-drawer' => array( + 'background-color' => esc_attr( $cart_bg_color_mobile ), + 'border-color' => esc_attr( $cart_bg_color_mobile ), + ), + '#astra-mobile-cart-drawer:hover .widget_shopping_cart:before, #astra-mobile-cart-drawer:hover .widget_shopping_cart:after, .open-preview-woocommerce-cart #astra-mobile-cart-drawer .widget_shopping_cart:before' => array( + 'border-bottom-color' => esc_attr( $cart_bg_color_mobile ), + ), + $responsive_selector . ' .widget_shopping_cart .mini_cart_item a.remove:hover,' . $responsive_selector . ' .widget_shopping_cart .mini_cart_item:hover > a.remove' => array( + 'color' => esc_attr( $cart_h_link_color_mobile ), + 'border-color' => esc_attr( $cart_h_link_color_mobile ), + 'background-color' => esc_attr( $cart_bg_color_mobile ), + ), + $responsive_selector . ' .widget_shopping_cart_content a:not(.button)' => array( + 'color' => esc_attr( $cart_link_color_mobile ), + ), + '#astra-mobile-cart-drawer .widget_shopping_cart .woocommerce-mini-cart__total, .astra-cart-drawer.woocommerce-active .astra-cart-drawer-header' => array( + 'border-top-color' => esc_attr( $cart_separator_color_mobile ), + 'border-bottom-color' => esc_attr( $cart_separator_color_mobile ), + ), + '#astra-mobile-cart-drawer .widget_shopping_cart .mini_cart_item' => array( + 'border-bottom-color' => astra_hex_to_rgba( $cart_separator_color_mobile ), + ), + $responsive_selector . ' .widget_shopping_cart_content a:not(.button):hover' => array( + 'color' => esc_attr( $cart_h_link_color_mobile ), + ), + /** + * Checkout button color for widget + */ + $responsive_selector . ' .widget_shopping_cart_content a.button.checkout.wc-forward' => array( + 'color' => esc_attr( $checkout_button_text_color_mobile ), + 'border-color' => esc_attr( $checkout_button_bg_color_mobile ), + 'background-color' => esc_attr( $checkout_button_bg_color_mobile ), + ), + $responsive_selector . ' .widget_shopping_cart_content a.button.checkout.wc-forward:hover' => array( + 'color' => esc_attr( $checkout_button_text_h_color_mobile ), + 'background-color' => esc_attr( $checkout_button_bg_h_color_mobile ), + ), + + /** + * Cart button color for widget + */ + $responsive_selector . ' .widget_shopping_cart_content a.button.wc-forward:not(.checkout)' => array( + 'color' => esc_attr( $cart_button_text_color_mobile ), + 'background-color' => esc_attr( $cart_button_bg_color_mobile ), + ), + $responsive_selector . ' .widget_shopping_cart_content a.button.wc-forward:not(.checkout):hover' => array( + 'color' => esc_attr( $cart_button_text_h_color_mobile ), + 'background-color' => esc_attr( $cart_button_bg_h_color_mobile ), + ), + + ); + + $css_output_tablet = array( + $responsive_selector . ' .astra-cart-drawer-title, ' . $responsive_selector . ' .widget_shopping_cart_content span, ' . $responsive_selector . ' .widget_shopping_cart_content strong,' . $responsive_selector . ' .woocommerce-mini-cart__empty-message, .astra-cart-drawer .woocommerce-mini-cart *' => array( + 'color' => esc_attr( $cart_text_color_tablet ), + ), + $responsive_selector . ' .widget_shopping_cart .mini_cart_item a.remove' => array( + 'border-color' => esc_attr( $cart_text_color_tablet ), + ), + $responsive_selector . '#astra-mobile-cart-drawer' => array( + 'background-color' => esc_attr( $cart_bg_color_tablet ), + 'border-color' => esc_attr( $cart_bg_color_tablet ), + ), + '#astra-mobile-cart-drawer:hover .widget_shopping_cart:before, #astra-mobile-cart-drawer:hover .widget_shopping_cart:after, .open-preview-woocommerce-cart #astra-mobile-cart-drawer .widget_shopping_cart:before' => array( + 'border-bottom-color' => esc_attr( $cart_bg_color_tablet ), + ), + $responsive_selector . ' .widget_shopping_cart .mini_cart_item a.remove:hover,' . $responsive_selector . ' .widget_shopping_cart .mini_cart_item:hover > a.remove' => array( + 'color' => esc_attr( $cart_h_link_color_tablet ), + 'border-color' => esc_attr( $cart_h_link_color_tablet ), + 'background-color' => esc_attr( $cart_bg_color_tablet ), + ), + $responsive_selector . ' .widget_shopping_cart_content a:not(.button)' => array( + 'color' => esc_attr( $cart_link_color_tablet ), + ), + '#astra-mobile-cart-drawer .widget_shopping_cart .woocommerce-mini-cart__total, .astra-cart-drawer .astra-cart-drawer-header' => array( + 'border-top-color' => esc_attr( $cart_separator_color_tablet ), + 'border-bottom-color' => esc_attr( $cart_separator_color_tablet ), + ), + '#astra-mobile-cart-drawer .widget_shopping_cart .mini_cart_item' => array( + 'border-bottom-color' => astra_hex_to_rgba( $cart_separator_color_tablet ), + ), + $responsive_selector . ' .widget_shopping_cart_content a:not(.button):hover' => array( + 'color' => esc_attr( $cart_h_link_color_tablet ), + ), + /** + * Checkout button color for widget + */ + $responsive_selector . ' .widget_shopping_cart_content a.button.checkout.wc-forward' => array( + 'color' => esc_attr( $checkout_button_text_color_tablet ), + 'border-color' => esc_attr( $checkout_button_bg_color_tablet ), + 'background-color' => esc_attr( $checkout_button_bg_color_tablet ), + ), + $responsive_selector . ' .widget_shopping_cart_content a.button.checkout.wc-forward:hover' => array( + 'color' => esc_attr( $checkout_button_text_h_color_tablet ), + 'background-color' => esc_attr( $checkout_button_bg_h_color_tablet ), + ), + + /** + * Cart button color for widget + */ + $responsive_selector . ' .widget_shopping_cart_content a.button.wc-forward:not(.checkout)' => array( + 'color' => esc_attr( $cart_button_text_color_tablet ), + 'background-color' => esc_attr( $cart_button_bg_color_tablet ), + ), + $responsive_selector . ' .widget_shopping_cart_content a.button.wc-forward:not(.checkout):hover' => array( + 'color' => esc_attr( $cart_button_text_h_color_tablet ), + 'background-color' => esc_attr( $cart_button_bg_h_color_tablet ), + ), + + ); + + $css_output .= astra_parse_css( $css_output_tablet, '', astra_get_tablet_breakpoint() ); + $css_output .= astra_parse_css( $css_output_mobile, '', astra_get_mobile_breakpoint() ); + + if ( 'none' !== $header_cart_icon_style ) { + + $header_cart_icon = array( + + $selector . ' .ast-cart-menu-wrap, ' . $selector . ' .ast-addon-cart-wrap' => array( + 'color' => $icon_color, + ), + // Outline icon hover colors. + '.ast-site-header-cart .ast-cart-menu-wrap:hover .count, .ast-site-header-cart .ast-addon-cart-wrap:hover .count' => array( + 'color' => esc_attr( $cart_h_color ), + 'background-color' => esc_attr( $icon_color ), + ), + // Outline icon colors. + '.ast-menu-cart-outline .ast-cart-menu-wrap .count, .ast-menu-cart-outline .ast-addon-cart-wrap' => array( + 'color' => esc_attr( $icon_color ), + ), + // Outline Info colors. + $selector . ' .ast-menu-cart-outline .ast-woo-header-cart-info-wrap' => array( + 'color' => esc_attr( $icon_color ), + ), + + // Fill icon Color. + '.ast-menu-cart-fill .ast-cart-menu-wrap .count,.ast-menu-cart-fill .ast-cart-menu-wrap, .ast-menu-cart-fill .ast-addon-cart-wrap .ast-woo-header-cart-info-wrap,.ast-menu-cart-fill .ast-addon-cart-wrap' => array( + 'background-color' => esc_attr( $icon_color ), + 'color' => esc_attr( $cart_h_color ), + ), + + // Transparent Header - Cart Icon color. + $trans_header_selector . ' .ast-cart-menu-wrap, ' . $trans_header_selector . ' .ast-addon-cart-wrap' => array( + 'color' => $transparent_header_icon_color, + ), + // Outline icon hover colors. + '.ast-theme-transparent-header .ast-site-header-cart .ast-cart-menu-wrap:hover .count, .ast-theme-transparent-header .ast-site-header-cart .ast-addon-cart-wrap:hover .count' => array( + 'color' => esc_attr( $transparent_header_cart_h_color ), + 'background-color' => esc_attr( $transparent_header_icon_color ), + ), + // Outline icon colors. + '.ast-theme-transparent-header .ast-menu-cart-outline .ast-cart-menu-wrap .count, .ast-theme-transparent-header .ast-menu-cart-outline .ast-addon-cart-wrap' => array( + 'color' => esc_attr( $transparent_header_icon_color ), + ), + // Outline Info colors. + $trans_header_selector . ' .ast-menu-cart-outline .ast-woo-header-cart-info-wrap' => array( + 'color' => esc_attr( $transparent_header_icon_color ), + ), + + // Fill icon Color. + '.ast-theme-transparent-header .ast-menu-cart-fill .ast-cart-menu-wrap .count, .ast-theme-transparent-header .ast-menu-cart-fill .ast-cart-menu-wrap, .ast-theme-transparent-header .ast-menu-cart-fill .ast-addon-cart-wrap .ast-woo-header-cart-info-wrap, .ast-theme-transparent-header .ast-menu-cart-fill .ast-addon-cart-wrap' => array( + 'background-color' => esc_attr( $transparent_header_icon_color ), + 'color' => esc_attr( $transparent_header_cart_h_color ), + ), + + // Border radius. + '.ast-site-header-cart.ast-menu-cart-outline .ast-cart-menu-wrap, .ast-site-header-cart.ast-menu-cart-fill .ast-cart-menu-wrap, .ast-site-header-cart.ast-menu-cart-outline .ast-cart-menu-wrap .count, .ast-site-header-cart.ast-menu-cart-fill .ast-cart-menu-wrap .count, .ast-site-header-cart.ast-menu-cart-outline .ast-addon-cart-wrap, .ast-site-header-cart.ast-menu-cart-fill .ast-addon-cart-wrap, .ast-site-header-cart.ast-menu-cart-outline .ast-woo-header-cart-info-wrap, .ast-site-header-cart.ast-menu-cart-fill .ast-woo-header-cart-info-wrap' => array( + 'border-radius' => astra_get_css_value( $header_cart_icon_radius, 'px' ), + ), + ); + + // We adding this conditional CSS only to maintain backwards. Remove this condition after 2-3 updates of add-on. + if ( defined( 'ASTRA_EXT_VER' ) && version_compare( ASTRA_EXT_VER, '3.4.2', '<' ) ) { + // Outline cart style border. + $header_cart_icon['.ast-menu-cart-outline .ast-cart-menu-wrap .count, .ast-menu-cart-outline .ast-addon-cart-wrap'] = array( + 'border' => '2px solid ' . $icon_color, + 'color' => esc_attr( $icon_color ), + ); + // Transparent Header outline cart style border. + $header_cart_icon['.ast-theme-transparent-header .ast-menu-cart-outline .ast-cart-menu-wrap .count, .ast-theme-transparent-header .ast-menu-cart-outline .ast-addon-cart-wrap'] = array( + 'border' => '2px solid ' . $transparent_header_icon_color, + 'color' => esc_attr( $transparent_header_icon_color ), + ); + } + + $css_output .= astra_parse_css( $header_cart_icon ); + } + + $css_output .= Astra_Builder_Base_Dynamic_CSS::prepare_visibility_css( 'section-header-woo-cart', '.ast-header-woo-cart' ); + + $dynamic_css .= $css_output; + + return $dynamic_css; +} |