Created
October 16, 2018 13:40
-
-
Save FinalDestiny/dcd2c5a3abc7665764d9898987116953 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
class ET_Builder_Module_Blurb extends ET_Builder_Module { | |
function init() { | |
$this->name = esc_html__( 'Blurb', 'et_builder' ); | |
$this->plural = esc_html__( 'Blurbs', 'et_builder' ); | |
$this->slug = 'et_pb_blurb'; | |
$this->vb_support = 'on'; | |
$this->main_css_element = '%%order_class%%.et_pb_blurb'; | |
$this->settings_modal_toggles = array( | |
'general' => array( | |
'toggles' => array( | |
'main_content' => esc_html__( 'Text', 'et_builder' ), | |
'image' => esc_html__( 'Image & Icon', 'et_builder' ), | |
), | |
), | |
'advanced' => array( | |
'toggles' => array( | |
'icon_settings' => esc_html__( 'Image & Icon', 'et_builder' ), | |
'text' => array( | |
'title' => esc_html__( 'Text', 'et_builder' ), | |
'priority' => 49, | |
), | |
'width' => array( | |
'title' => esc_html__( 'Sizing', 'et_builder' ), | |
'priority' => 65, | |
), | |
), | |
), | |
'custom_css' => array( | |
'toggles' => array( | |
'animation' => array( | |
'title' => esc_html__( 'Animation', 'et_builder' ), | |
'priority' => 90, | |
), | |
'attributes' => array( | |
'title' => esc_html__( 'Attributes', 'et_builder' ), | |
'priority' => 95, | |
), | |
), | |
), | |
); | |
$this->advanced_fields = array( | |
'fonts' => array( | |
'header' => array( | |
'label' => esc_html__( 'Title', 'et_builder' ), | |
'css' => array( | |
'main' => "{$this->main_css_element} h4, {$this->main_css_element} h4 a, {$this->main_css_element} h1.et_pb_module_header, {$this->main_css_element} h1.et_pb_module_header a, {$this->main_css_element} h2.et_pb_module_header, {$this->main_css_element} h2.et_pb_module_header a, {$this->main_css_element} h3.et_pb_module_header, {$this->main_css_element} h3.et_pb_module_header a, {$this->main_css_element} h5.et_pb_module_header, {$this->main_css_element} h5.et_pb_module_header a, {$this->main_css_element} h6.et_pb_module_header, {$this->main_css_element} h6.et_pb_module_header a", | |
), | |
'header_level' => array( | |
'default' => 'h4', | |
), | |
), | |
'body' => array( | |
'label' => esc_html__( 'Body', 'et_builder' ), | |
'css' => array( | |
'line_height' => "{$this->main_css_element} p", | |
'text_align' => "{$this->main_css_element} .et_pb_blurb_description", | |
'text_shadow' => "{$this->main_css_element} .et_pb_blurb_description", | |
), | |
), | |
), | |
'background' => array( | |
'settings' => array( | |
'color' => 'alpha', | |
), | |
), | |
'borders' => array( | |
'default' => array(), | |
'image' => array( | |
'css' => array( | |
'main' => array( | |
'border_radii' => "%%order_class%% .et_pb_main_blurb_image .et_pb_image_wrap", | |
'border_styles' => "%%order_class%% .et_pb_main_blurb_image .et_pb_image_wrap", | |
) | |
), | |
'label_prefix' => esc_html__( 'Image', 'et_builder' ), | |
'tab_slug' => 'advanced', | |
'toggle_slug' => 'icon_settings', | |
'depends_on' => array( 'use_icon' ), | |
'depends_show_if' => 'off', | |
), | |
), | |
'box_shadow' => array( | |
'default' => array(), | |
'image' => array( | |
'label' => esc_html__( 'Image Box Shadow', 'et_builder' ), | |
'option_category' => 'layout', | |
'tab_slug' => 'advanced', | |
'toggle_slug' => 'icon_settings', | |
'depends_show_if' => 'off', | |
'css' => array( | |
'main' => '%%order_class%% .et_pb_main_blurb_image .et_pb_image_wrap', | |
'show_if_not' => array( | |
'use_icon' => 'on', | |
), | |
), | |
'default_on_fronts' => array( | |
'color' => '', | |
'position' => '', | |
), | |
), | |
), | |
'margin_padding' => array( | |
'css' => array( | |
'important' => 'all', | |
), | |
), | |
'max_width' => array( | |
'css' => array( | |
'main' => $this->main_css_element, | |
'module_alignment' => '%%order_class%%.et_pb_blurb.et_pb_module', | |
), | |
), | |
'text' => array( | |
'use_background_layout' => true, | |
'css' => array( | |
'text_shadow' => "{$this->main_css_element} .et_pb_blurb_container", | |
), | |
'options' => array( | |
'background_layout' => array( | |
'default_on_front' => 'light', | |
'hover' => 'tabs', | |
), | |
'text_orientation' => array( | |
'default_on_front' => 'left', | |
), | |
), | |
), | |
'filters' => array( | |
'child_filters_target' => array( | |
'tab_slug' => 'advanced', | |
'toggle_slug' => 'icon_settings', | |
'depends_show_if' => 'off', | |
'css' => array( | |
'main' => '%%order_class%% .et_pb_main_blurb_image', | |
), | |
), | |
), | |
'icon_settings' => array( | |
'css' => array( | |
'main' => '%%order_class%% .et_pb_main_blurb_image', | |
), | |
), | |
'button' => false, | |
); | |
$this->custom_css_fields = array( | |
'blurb_image' => array( | |
'label' => esc_html__( 'Blurb Image', 'et_builder' ), | |
'selector' => '.et_pb_main_blurb_image', | |
), | |
'blurb_title' => array( | |
'label' => esc_html__( 'Blurb Title', 'et_builder' ), | |
'selector' => '.et_pb_module_header', | |
), | |
'blurb_content' => array( | |
'label' => esc_html__( 'Blurb Content', 'et_builder' ), | |
'selector' => '.et_pb_blurb_content', | |
), | |
); | |
$this->help_videos = array( | |
array( | |
'id' => esc_html( 'XW7HR86lp8U' ), | |
'name' => esc_html__( 'An introduction to the Blurb module', 'et_builder' ), | |
), | |
); | |
} | |
function get_fields() { | |
$et_accent_color = et_builder_accent_color(); | |
$image_icon_placement = array( | |
'top' => esc_html__( 'Top', 'et_builder' ), | |
); | |
if ( ! is_rtl() ) { | |
$image_icon_placement['left'] = esc_html__( 'Left', 'et_builder' ); | |
} else { | |
$image_icon_placement['right'] = esc_html__( 'Right', 'et_builder' ); | |
} | |
$fields = array( | |
'title' => array( | |
'label' => esc_html__( 'Title', 'et_builder' ), | |
'type' => 'text', | |
'option_category' => 'basic_option', | |
'description' => esc_html__( 'The title of your blurb will appear in bold below your blurb image.', 'et_builder' ), | |
'toggle_slug' => 'main_content', | |
'dynamic_content' => 'text', | |
), | |
'url' => array( | |
'label' => esc_html__( 'Title Link URL', 'et_builder' ), | |
'type' => 'text', | |
'option_category' => 'basic_option', | |
'description' => esc_html__( 'If you would like to make your blurb a link, input your destination URL here.', 'et_builder' ), | |
'toggle_slug' => 'link_options', | |
'dynamic_content' => 'url', | |
), | |
'url_new_window' => array( | |
'label' => esc_html__( 'Title Link Target', 'et_builder' ), | |
'type' => 'select', | |
'option_category' => 'configuration', | |
'options' => array( | |
'off' => esc_html__( 'In The Same Window', 'et_builder' ), | |
'on' => esc_html__( 'In The New Tab', 'et_builder' ), | |
), | |
'toggle_slug' => 'link_options', | |
'description' => esc_html__( 'Here you can choose whether or not your link opens in a new window', 'et_builder' ), | |
'default_on_front'=> 'off', | |
), | |
'use_icon' => array( | |
'label' => esc_html__( 'Use Icon', 'et_builder' ), | |
'type' => 'yes_no_button', | |
'option_category' => 'basic_option', | |
'options' => array( | |
'off' => esc_html__( 'No', 'et_builder' ), | |
'on' => esc_html__( 'Yes', 'et_builder' ), | |
), | |
'toggle_slug' => 'image', | |
'affects' => array( | |
'border_radii_image', | |
'border_styles_image', | |
'box_shadow_style_image', | |
'font_icon', | |
'image_max_width', | |
'use_icon_font_size', | |
'use_circle', | |
'icon_color', | |
'image', | |
'alt', | |
'child_filter_hue_rotate', | |
'child_filter_saturate', | |
'child_filter_brightness', | |
'child_filter_contrast', | |
'child_filter_invert', | |
'child_filter_sepia', | |
'child_filter_opacity', | |
'child_filter_blur', | |
'child_mix_blend_mode', | |
), | |
'description' => esc_html__( 'Here you can choose whether icon set below should be used.', 'et_builder' ), | |
'default_on_front'=> 'off', | |
), | |
'font_icon' => array( | |
'label' => esc_html__( 'Icon', 'et_builder' ), | |
'type' => 'select_icon', | |
'option_category' => 'basic_option', | |
'class' => array( 'et-pb-font-icon' ), | |
'toggle_slug' => 'image', | |
'description' => esc_html__( 'Choose an icon to display with your blurb.', 'et_builder' ), | |
'depends_show_if' => 'on', | |
), | |
'icon_color' => array( | |
'default' => $et_accent_color, | |
'label' => esc_html__( 'Icon Color', 'et_builder' ), | |
'type' => 'color-alpha', | |
'description' => esc_html__( 'Here you can define a custom color for your icon.', 'et_builder' ), | |
'depends_show_if' => 'on', | |
'tab_slug' => 'advanced', | |
'toggle_slug' => 'icon_settings', | |
'hover' => 'tabs', | |
), | |
'use_circle' => array( | |
'label' => esc_html__( 'Circle Icon', 'et_builder' ), | |
'type' => 'yes_no_button', | |
'option_category' => 'configuration', | |
'options' => array( | |
'off' => esc_html__( 'No', 'et_builder' ), | |
'on' => esc_html__( 'Yes', 'et_builder' ), | |
), | |
'affects' => array( | |
'use_circle_border', | |
'circle_color', | |
), | |
'tab_slug' => 'advanced', | |
'toggle_slug' => 'icon_settings', | |
'description' => esc_html__( 'Here you can choose whether icon set above should display within a circle.', 'et_builder' ), | |
'depends_show_if' => 'on', | |
'default_on_front'=> 'off', | |
), | |
'circle_color' => array( | |
'default' => $et_accent_color, | |
'label' => esc_html__( 'Circle Color', 'et_builder' ), | |
'type' => 'color-alpha', | |
'description' => esc_html__( 'Here you can define a custom color for the icon circle.', 'et_builder' ), | |
'depends_show_if' => 'on', | |
'tab_slug' => 'advanced', | |
'toggle_slug' => 'icon_settings', | |
'hover' => 'tabs', | |
), | |
'use_circle_border' => array( | |
'label' => esc_html__( 'Show Circle Border', 'et_builder' ), | |
'type' => 'yes_no_button', | |
'option_category' => 'layout', | |
'options' => array( | |
'off' => esc_html__( 'No', 'et_builder' ), | |
'on' => esc_html__( 'Yes', 'et_builder' ), | |
), | |
'affects' => array( | |
'circle_border_color', | |
), | |
'description' => esc_html__( 'Here you can choose whether if the icon circle border should display.', 'et_builder' ), | |
'depends_show_if' => 'on', | |
'tab_slug' => 'advanced', | |
'toggle_slug' => 'icon_settings', | |
'default_on_front' => 'off', | |
), | |
'circle_border_color' => array( | |
'default' => $et_accent_color, | |
'label' => esc_html__( 'Circle Border Color', 'et_builder' ), | |
'type' => 'color-alpha', | |
'description' => esc_html__( 'Here you can define a custom color for the icon circle border.', 'et_builder' ), | |
'depends_show_if' => 'on', | |
'tab_slug' => 'advanced', | |
'toggle_slug' => 'icon_settings', | |
'hover' => 'tabs', | |
), | |
'image' => array( | |
'label' => esc_html__( 'Image', 'et_builder' ), | |
'type' => 'upload', | |
'option_category' => 'basic_option', | |
'upload_button_text' => esc_attr__( 'Upload an image', 'et_builder' ), | |
'choose_text' => esc_attr__( 'Choose an Image', 'et_builder' ), | |
'update_text' => esc_attr__( 'Set As Image', 'et_builder' ), | |
'depends_show_if' => 'off', | |
'description' => esc_html__( 'Upload an image to display at the top of your blurb.', 'et_builder' ), | |
'toggle_slug' => 'image', | |
'dynamic_content' => 'image', | |
), | |
'alt' => array( | |
'label' => esc_html__( 'Image Alt Text', 'et_builder' ), | |
'type' => 'text', | |
'option_category' => 'basic_option', | |
'description' => esc_html__( 'Define the HTML ALT text for your image here.', 'et_builder' ), | |
'depends_show_if' => 'off', | |
'tab_slug' => 'custom_css', | |
'toggle_slug' => 'attributes', | |
'dynamic_content' => 'text', | |
), | |
'icon_placement' => array( | |
'label' => esc_html__( 'Image/Icon Placement', 'et_builder' ), | |
'type' => 'select', | |
'option_category' => 'layout', | |
'options' => $image_icon_placement, | |
'tab_slug' => 'advanced', | |
'toggle_slug' => 'icon_settings', | |
'description' => esc_html__( 'Here you can choose where to place the icon.', 'et_builder' ), | |
'default_on_front' => 'top', | |
), | |
'content' => array( | |
'label' => esc_html__( 'Content', 'et_builder' ), | |
'type' => 'tiny_mce', | |
'option_category' => 'basic_option', | |
'description' => esc_html__( 'Input the main text content for your module here.', 'et_builder' ), | |
'toggle_slug' => 'main_content', | |
'dynamic_content' => 'text', | |
), | |
'image_max_width' => array( | |
'label' => esc_html__( 'Image Width', 'et_builder' ), | |
'type' => 'range', | |
'option_category' => 'layout', | |
'tab_slug' => 'advanced', | |
'toggle_slug' => 'width', | |
'mobile_options' => true, | |
'validate_unit' => true, | |
'depends_show_if' => 'off', | |
'default' => '100%', | |
'default_unit' => '%', | |
'default_on_front'=> '', | |
'allow_empty' => true, | |
'range_settings' => array( | |
'min' => '0', | |
'max' => '100', | |
'step' => '1', | |
), | |
'responsive' => true, | |
), | |
'content_max_width' => array( | |
'label' => esc_html__( 'Content Width', 'et_builder' ), | |
'type' => 'range', | |
'option_category' => 'layout', | |
'tab_slug' => 'advanced', | |
'toggle_slug' => 'width', | |
'mobile_options' => true, | |
'validate_unit' => true, | |
'default' => '550px', | |
'default_unit' => 'px', | |
'default_on_front'=> '', | |
'allow_empty' => true, | |
'range_settings' => array( | |
'min' => '0', | |
'max' => '1100', | |
'step' => '1', | |
), | |
'responsive' => true, | |
), | |
'use_icon_font_size' => array( | |
'label' => esc_html__( 'Use Icon Font Size', 'et_builder' ), | |
'type' => 'yes_no_button', | |
'option_category' => 'font_option', | |
'options' => array( | |
'off' => esc_html__( 'No', 'et_builder' ), | |
'on' => esc_html__( 'Yes', 'et_builder' ), | |
), | |
'affects' => array( | |
'icon_font_size', | |
), | |
'depends_show_if' => 'on', | |
'tab_slug' => 'advanced', | |
'toggle_slug' => 'icon_settings', | |
'default_on_front' => 'off', | |
), | |
'icon_font_size' => array( | |
'label' => esc_html__( 'Icon Font Size', 'et_builder' ), | |
'type' => 'range', | |
'option_category' => 'font_option', | |
'tab_slug' => 'advanced', | |
'toggle_slug' => 'icon_settings', | |
'default' => '96px', | |
'default_unit' => 'px', | |
'default_on_front'=> '', | |
'range_settings' => array( | |
'min' => '1', | |
'max' => '120', | |
'step' => '1', | |
), | |
'mobile_options' => true, | |
'depends_show_if' => 'on', | |
'responsive' => true, | |
'hover' => 'tabs', | |
), | |
); | |
return $fields; | |
} | |
public function get_transition_fields_css_props() { | |
$fields = parent::get_transition_fields_css_props(); | |
$fields['icon_color'] = array( | |
'color' => '%%order_class%% .et-pb-icon', | |
); | |
$fields['circle_color'] = array( | |
'background-color' => '%%order_class%% .et-pb-icon', | |
); | |
$fields['circle_border_color'] = array( | |
'border-color' => '%%order_class%% .et-pb-icon', | |
); | |
$fields['icon_font_size'] = array( | |
'font-size' => '%%order_class%% .et-pb-icon', | |
); | |
return $fields; | |
} | |
function render( $attrs, $content = null, $render_slug ) { | |
$title = $this->_esc_attr( 'title' ); | |
$url = $this->props['url']; | |
$image = $this->props['image']; | |
$url_new_window = $this->props['url_new_window']; | |
$alt = $this->_esc_attr( 'alt' ); | |
$background_layout = $this->props['background_layout']; | |
$background_layout_hover = et_pb_hover_options()->get_value( 'background_layout', $this->props, 'light' ); | |
$background_layout_hover_enabled = et_pb_hover_options()->is_enabled( 'background_layout', $this->props ); | |
$animation = $this->props['animation']; | |
$icon_placement = $this->props['icon_placement']; | |
$font_icon = $this->props['font_icon']; | |
$use_icon = $this->props['use_icon']; | |
$use_circle = $this->props['use_circle']; | |
$use_circle_border = $this->props['use_circle_border']; | |
$icon_color = $this->props['icon_color']; | |
$icon_color_hover = $this->get_hover_value( 'icon_color' ); | |
$circle_color = $this->props['circle_color']; | |
$circle_color_hover = $this->get_hover_value( 'circle_color' ); | |
$circle_border_color = $this->props['circle_border_color']; | |
$circle_border_color_hover = $this->get_hover_value( 'circle_border_color' ); | |
$use_icon_font_size = $this->props['use_icon_font_size']; | |
$icon_font_size = $this->props['icon_font_size']; | |
$icon_font_size_hover = $this->get_hover_value( 'icon_font_size' ); | |
$icon_font_size_tablet = $this->props['icon_font_size_tablet']; | |
$icon_font_size_phone = $this->props['icon_font_size_phone']; | |
$header_level = $this->props['header_level']; | |
$icon_font_size_last_edited = $this->props['icon_font_size_last_edited']; | |
$image_max_width = $this->props['image_max_width']; | |
$image_max_width_tablet = $this->props['image_max_width_tablet']; | |
$image_max_width_phone = $this->props['image_max_width_phone']; | |
$image_max_width_last_edited = $this->props['image_max_width_last_edited']; | |
$content_max_width = $this->props['content_max_width']; | |
$content_max_width_tablet = $this->props['content_max_width_tablet']; | |
$content_max_width_phone = $this->props['content_max_width_phone']; | |
$content_max_width_last_edited = $this->props['content_max_width_last_edited']; | |
$image_pathinfo = pathinfo( $image ); | |
$is_image_svg = isset( $image_pathinfo['extension'] ) ? 'svg' === $image_pathinfo['extension'] : false; | |
$icon_selector = '%%order_class%% .et-pb-icon'; | |
if ( 'off' !== $use_icon_font_size ) { | |
$font_size_responsive_active = et_pb_get_responsive_status( $icon_font_size_last_edited ); | |
$font_size_values = array( | |
'desktop' => $icon_font_size, | |
'tablet' => $font_size_responsive_active ? $icon_font_size_tablet : '', | |
'phone' => $font_size_responsive_active ? $icon_font_size_phone : '', | |
); | |
et_pb_generate_responsive_css( $font_size_values, $icon_selector, 'font-size', $render_slug ); | |
if ( et_builder_is_hover_enabled( 'icon_font_size', $this->props ) ) { | |
ET_Builder_Element::set_style( $render_slug, array( | |
'selector' => $this->add_hover_to_order_class( $icon_selector ), | |
'declaration' => sprintf( | |
'font-size: %1$s;', | |
esc_html( $icon_font_size_hover ) | |
), | |
) ); | |
} | |
} | |
if ( '' !== $image_max_width_tablet || '' !== $image_max_width_phone || '' !== $image_max_width || $is_image_svg ) { | |
$is_size_px = false; | |
// If size is given in px, we want to override parent width | |
if ( | |
false !== strpos( $image_max_width, 'px' ) || | |
false !== strpos( $image_max_width_tablet, 'px' ) || | |
false !== strpos( $image_max_width_phone, 'px' ) | |
) { | |
$is_size_px = true; | |
} | |
// SVG image overwrite. SVG image needs its value to be explicit | |
if ( '' === $image_max_width && $is_image_svg ) { | |
$image_max_width = '100%'; | |
} | |
$image_max_width_selector = $icon_placement === 'top' && $is_image_svg ? '%%order_class%% .et_pb_main_blurb_image' : '%%order_class%% .et_pb_main_blurb_image .et_pb_image_wrap'; | |
$image_max_width_property = ( $is_image_svg || $is_size_px ) ? 'width' : 'max-width'; | |
$image_max_width_responsive_active = et_pb_get_responsive_status( $image_max_width_last_edited ); | |
$image_max_width_values = array( | |
'desktop' => $image_max_width, | |
'tablet' => $image_max_width_responsive_active ? $image_max_width_tablet : '', | |
'phone' => $image_max_width_responsive_active ? $image_max_width_phone : '', | |
); | |
et_pb_generate_responsive_css( $image_max_width_values, $image_max_width_selector, $image_max_width_property, $render_slug ); | |
} | |
if ( '' !== $content_max_width_tablet || '' !== $content_max_width_phone || '' !== $content_max_width ) { | |
$content_max_width_responsive_active = et_pb_get_responsive_status( $content_max_width_last_edited ); | |
$content_max_width_values = array( | |
'desktop' => $content_max_width, | |
'tablet' => $content_max_width_responsive_active ? $content_max_width_tablet : '', | |
'phone' => $content_max_width_responsive_active ? $content_max_width_phone : '', | |
); | |
et_pb_generate_responsive_css( $content_max_width_values, '%%order_class%% .et_pb_blurb_content', 'max-width', $render_slug ); | |
} | |
if ( is_rtl() && 'left' === $icon_placement ) { | |
$icon_placement = 'right'; | |
} | |
if ( '' !== $title && '' !== $url ) { | |
$title = sprintf( '<a href="%1$s"%3$s>%2$s</a>', | |
esc_url( $url ), | |
et_esc_previously( $title ), | |
( 'on' === $url_new_window ? ' target="_blank"' : '' ) | |
); | |
} else { | |
// Allowing full html for backwards compatibility. | |
$title = $this->_esc_attr( 'title', 'full' ); | |
} | |
if ( '' !== $title ) { | |
$title = sprintf( | |
'<%1$s class="et_pb_module_header">%2$s</%1$s>', | |
et_pb_process_header_level( $header_level, 'h4' ), | |
et_esc_previously( $title ) | |
); | |
} | |
// Added for backward compatibility | |
if ( empty( $animation ) ) { | |
$animation = 'top'; | |
} | |
if ( 'off' === $use_icon ) { | |
$image = ( '' !== trim( $image ) ) ? sprintf( | |
'<img src="%1$s" alt="%2$s" class="et-waypoint%3$s" />', | |
esc_attr( $image ), | |
et_esc_previously( $alt ), | |
esc_attr( " et_pb_animation_{$animation}" ) | |
) : ''; | |
} else { | |
$icon_style = sprintf( 'color: %1$s;', esc_attr( $icon_color ) ); | |
$icon_style_hover = ''; | |
if ( et_builder_is_hover_enabled( 'icon_color', $this->props ) ) { | |
$icon_style_hover = sprintf( 'color: %1$s;', esc_attr( $icon_color_hover ) ); | |
} | |
if ( 'on' === $use_circle ) { | |
$icon_style .= sprintf( ' background-color: %1$s;', esc_attr( $circle_color ) ); | |
if ( et_builder_is_hover_enabled( 'circle_color', $this->props ) ) { | |
$icon_style_hover .= sprintf( ' background-color: %1$s;', esc_attr( $circle_color_hover ) ); | |
} | |
if ( 'on' === $use_circle_border ) { | |
$icon_style .= sprintf( ' border-color: %1$s;', esc_attr( $circle_border_color ) ); | |
if ( et_builder_is_hover_enabled( 'circle_border_color', $this->props ) ) { | |
$icon_style_hover .= sprintf( ' border-color: %1$s;', esc_attr( $circle_border_color_hover ) ); | |
} | |
} | |
} | |
ET_Builder_Element::set_style( $render_slug, array( | |
'selector' => $icon_selector, | |
'declaration' => $icon_style, | |
) ); | |
if ( '' !== $icon_style_hover ) { | |
ET_Builder_Element::set_style( $render_slug, array( | |
'selector' => $this->add_hover_to_order_class( $icon_selector ), | |
'declaration' => $icon_style_hover, | |
) ); | |
} | |
$image = ( '' !== $font_icon ) ? sprintf( | |
'<span class="et-pb-icon et-waypoint%2$s%3$s%4$s">%1$s</span>', | |
esc_attr( et_pb_process_font_icon( $font_icon ) ), | |
esc_attr( " et_pb_animation_{$animation}" ), | |
( 'on' === $use_circle ? ' et-pb-icon-circle' : '' ), | |
( 'on' === $use_circle && 'on' === $use_circle_border ? ' et-pb-icon-circle-border' : '' ), | |
$icon_style | |
) : ''; | |
} | |
// Images: Add CSS Filters and Mix Blend Mode rules (if set) | |
$generate_css_image_filters = ''; | |
if ( $image && array_key_exists( 'icon_settings', $this->advanced_fields ) && array_key_exists( 'css', $this->advanced_fields['icon_settings'] ) ) { | |
$generate_css_image_filters = $this->generate_css_filters( | |
$render_slug, | |
'child_', | |
self::$data_utils->array_get( $this->advanced_fields['icon_settings']['css'], 'main', '%%order_class%%' ) | |
); | |
} | |
$image = $image ? sprintf( '<span class="et_pb_image_wrap">%1$s</span>', $image ) : ''; | |
$image = $image ? sprintf( | |
'<div class="et_pb_main_blurb_image%2$s">%1$s</div>', | |
( '' !== $url | |
? sprintf( | |
'<a href="%1$s"%3$s>%2$s</a>', | |
esc_url( $url ), | |
$image, | |
( 'on' === $url_new_window ? ' target="_blank"' : '' ) | |
) | |
: $image | |
), | |
esc_attr( $generate_css_image_filters ) | |
) : ''; | |
$video_background = $this->video_background(); | |
$parallax_image_background = $this->get_parallax_image_background(); | |
// Module classnames | |
$this->add_classname( array( | |
"et_pb_bg_layout_{$background_layout}", | |
$this->get_text_orientation_classname(), | |
sprintf( ' et_pb_blurb_position_%1$s', esc_attr( $icon_placement ) ), | |
) ); | |
$data_background_layout = ''; | |
$data_background_layout_hover = ''; | |
if ( $background_layout_hover_enabled ) { | |
$data_background_layout = sprintf( | |
' data-background-layout="%1$s"', | |
esc_attr( $background_layout ) | |
); | |
$data_background_layout_hover = sprintf( | |
' data-background-layout-hover="%1$s"', | |
esc_attr( $background_layout_hover ) | |
); | |
} | |
$output = sprintf( | |
'<div%5$s class="%4$s"%8$s%9$s> | |
%7$s | |
%6$s | |
<div class="et_pb_blurb_content"> | |
%2$s | |
<div class="et_pb_blurb_container"> | |
%3$s | |
<div class="et_pb_blurb_description"> | |
%1$s | |
</div><!-- .et_pb_blurb_description --> | |
</div> | |
</div> <!-- .et_pb_blurb_content --> | |
</div> <!-- .et_pb_blurb -->', | |
$this->content, | |
$image, | |
et_esc_previously( $title ), | |
$this->module_classname( $render_slug ), | |
$this->module_id(), // #5 | |
$video_background, | |
$parallax_image_background, | |
et_esc_previously( $data_background_layout ), | |
et_esc_previously( $data_background_layout_hover ) | |
); | |
return $output; | |
} | |
} | |
new ET_Builder_Module_Blurb; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment