Astra_Button_Component_Dynamic_CSS::astra_button_dynamic_css( string $builder_type = 'header' )
Dynamic CSS
Description
Parameters
- $builder_type
-
(string) (Optional) Builder Type.
Default value: 'header'
Return
(String) Generated dynamic CSS for Heading Colors.
Source
File: inc/builder/type/base/dynamic-css/button/class-astra-button-component-dynamic-css.php
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;
}
Expand full source code Collapse full source code View on Trac
Changelog
| Version | Description |
|---|---|
| 3.0.0 | Introduced. |