Skip to content

Commit

Permalink
TMZ-306 header refactoring
Browse files Browse the repository at this point in the history
  • Loading branch information
@mserino
mserino committed Jan 23, 2025
1 parent 767814e commit af4e250
Show file tree
Hide file tree
Showing 2 changed files with 0 additions and 339 deletions.
1 change: 0 additions & 1 deletion modules/template-parts/classes/render/widget-header-render.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,6 @@ class Widget_Header_Render {
const LAYOUT_CLASSNAME = 'ehp-header';
const SITE_LINK_CLASSNAME = 'ehp-header__site-link';
const CTAS_CONTAINER_CLASSNAME = 'ehp-header__ctas-container';
const BUTTON_CLASSNAME = 'ehp-header__button';

protected Ehp_Header $widget;

Expand Down
338 changes: 0 additions & 338 deletions modules/template-parts/widgets/ehp-header.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1692,344 +1692,6 @@ protected function add_style_box_section() {
$this->end_controls_section();
}

protected function add_cta_button_controls( string $type, bool $add_condition = false ) {
$is_primary = 'primary' === $type;
$label = $is_primary ? esc_html__( 'Primary CTA', 'hello-plus' ) : esc_html__( 'Secondary CTA', 'hello-plus' );
$show_button_border_default = $is_primary ? 'no' : 'yes';
$background_color_default = $is_primary ? Global_Colors::COLOR_ACCENT : '';

$add_type_condition = $add_condition ? [
$type . '_cta_show' => 'yes',
] : [];

$this->add_control(
$type . '_button_label',
[
'label' => $label,
'type' => Controls_Manager::HEADING,
'condition' => $add_type_condition,
]
);

$this->add_control(
$type . '_button_type',
[
'label' => esc_html__( 'Type', 'hello-plus' ),
'type' => Controls_Manager::SELECT,
'default' => 'button',
'options' => [
'button' => esc_html__( 'Button', 'hello-plus' ),
'link' => esc_html__( 'Link', 'hello-plus' ),
],
'condition' => $add_type_condition,
]
);

$this->add_responsive_control(
$type . '_button_icon_position',
[
'label' => esc_html__( 'Icon Position', 'hello-plus' ),
'type' => Controls_Manager::CHOOSE,
'default' => is_rtl() ? 'row' : 'row-reverse',
'toggle' => false,
'options' => [
'row' => [
'title' => esc_html__( 'Start', 'hello-plus' ),
'icon' => 'eicon-h-align-left',
],
'row-reverse' => [
'title' => esc_html__( 'End', 'hello-plus' ),
'icon' => 'eicon-h-align-right',
],
],
'selectors_dictionary' => [
'left' => is_rtl() ? 'row-reverse' : 'row',
'right' => is_rtl() ? 'row' : 'row-reverse',
],
'selectors' => [
'{{WRAPPER}} .ehp-header__button--' . $type => 'flex-direction: {{VALUE}};',
],
'condition' => array_merge([
$type . '_cta_button_icon[value]!' => '',
], $add_type_condition),
]
);

$this->add_control(
$type . '_button_icon_spacing',
[
'label' => esc_html__( 'Icon Spacing', 'hello-plus' ),
'type' => Controls_Manager::SLIDER,
'size_units' => [ 'px', 'em', 'rem', 'custom' ],
'range' => [
'px' => [
'max' => 100,
],
'em' => [
'max' => 5,
],
'rem' => [
'max' => 5,
],
'%' => [
'max' => 100,
],
],
'selectors' => [
'{{WRAPPER}} .ehp-header' => '--header-button-' . $type . '-icon-spacing: {{SIZE}}{{UNIT}};',
],
'condition' => array_merge([
$type . '_cta_button_icon[value]!' => '',
], $add_type_condition),
]
);

$this->add_group_control(
Group_Control_Typography::get_type(),
[
'name' => $type . '_button_typography',
'selector' => '{{WRAPPER}} .ehp-header__button--' . $type,
'global' => [
'default' => Global_Typography::TYPOGRAPHY_ACCENT,
],
'condition' => $add_type_condition,
]
);

$this->start_controls_tabs(
$type . '_button_style'
);

$this->start_controls_tab(
$type . '_button_normal_tab',
[
'label' => esc_html__( 'Normal', 'hello-plus' ),
'condition' => $add_type_condition,
]
);

$this->add_control(
$type . '_button_text_color',
[
'label' => esc_html__( 'Text Color', 'hello-plus' ),
'type' => Controls_Manager::COLOR,
'global' => [
'default' => Global_Colors::COLOR_SECONDARY,
],
'selectors' => [
'{{WRAPPER}} .ehp-header' => '--header-button-' . $type . '-text-color: {{VALUE}}',
],
'condition' => $add_type_condition,
]
);

$this->add_group_control(
Group_Control_Background::get_type(),
[
'name' => $type . '_button_background',
'types' => [ 'classic', 'gradient' ],
'exclude' => [ 'image' ],
'selector' => '{{WRAPPER}} .is-type-button.ehp-header__button--' . $type,
'fields_options' => [
'background' => [
'default' => 'classic',
],
'color' => [
'global' => [
'default' => $background_color_default,
],
],
],
'condition' => array_merge([
$type . '_button_type' => 'button',
], $add_type_condition),
]
);

$this->end_controls_tab();

$this->start_controls_tab(
$type . '_button_hover_tab',
[
'label' => esc_html__( 'Hover', 'hello-plus' ),
'condition' => $add_type_condition,
]
);

$this->add_control(
$type . '_hover_button_text_color',
[
'label' => esc_html__( 'Text Color', 'hello-plus' ),
'type' => Controls_Manager::COLOR,
'global' => [
'default' => Global_Colors::COLOR_TEXT,
],
'selectors' => [
'{{WRAPPER}} .ehp-header' => '--header-button-' . $type . '-text-color-hover: {{VALUE}}',
],
'condition' => $add_type_condition,
]
);

$this->add_group_control(
Group_Control_Background::get_type(),
[
'name' => $type . '_button_background_hover',
'types' => [ 'classic', 'gradient' ],
'exclude' => [ 'image' ],
'selector' => '{{WRAPPER}} .is-type-button.ehp-header__button--' . $type . ':hover, {{WRAPPER}} .is-type-button.ehp-header__button--' . $type . ':focus',
'fields_options' => [
'background' => [
'default' => 'classic',
],
'color' => [
'global' => [
'default' => $background_color_default,
],
],
],
'condition' => array_merge([
$type . '_button_type' => 'button',
], $add_type_condition),
]
);

$this->add_control(
$type . '_button_hover_animation',
[
'label' => esc_html__( 'Hover Animation', 'hello-plus' ),
'type' => Controls_Manager::HOVER_ANIMATION,
'condition' => $add_type_condition,
]
);

$this->end_controls_tab();

$this->end_controls_tabs();

$this->add_control(
$type . '_show_button_border',
[
'label' => esc_html__( 'Border', 'hello-plus' ),
'type' => Controls_Manager::SWITCHER,
'label_on' => esc_html__( 'Yes', 'hello-plus' ),
'label_off' => esc_html__( 'No', 'hello-plus' ),
'return_value' => 'yes',
'default' => $show_button_border_default,
'separator' => 'before',
'condition' => array_merge([
$type . '_button_type' => 'button',
], $add_type_condition),
]
);

$this->add_control(
$type . '_button_border_width',
[
'label' => __( 'Border Width', 'hello-plus' ),
'type' => Controls_Manager::SLIDER,
'size_units' => [ 'px' ],
'range' => [
'px' => [
'min' => 0,
'max' => 10,
'step' => 1,
],
],
'default' => [
'size' => 1,
'unit' => 'px',
],
'selectors' => [
'{{WRAPPER}} .ehp-header' => '--header-button-' . $type . '-border-width: {{SIZE}}{{UNIT}};',
],
'condition' => array_merge([
$type . '_show_button_border' => 'yes',
], $add_type_condition),
]
);

$this->add_control(
$type . '_button_border_color',
[
'label' => esc_html__( 'Color', 'hello-plus' ),
'type' => Controls_Manager::COLOR,
'global' => [
'default' => Global_Colors::COLOR_TEXT,
],
'selectors' => [
'{{WRAPPER}} .ehp-header' => '--header-button-' . $type . '-border-color: {{VALUE}}',
],
'condition' => array_merge([
$type . '_show_button_border' => 'yes',
], $add_type_condition),
]
);

$this->add_responsive_control(
$type . '_button_shape',
[
'label' => esc_html__( 'Shape', 'hello-plus' ),
'type' => Controls_Manager::SELECT,
'default' => 'default',
'options' => [
'default' => esc_html__( 'Default', 'hello-plus' ),
'sharp' => esc_html__( 'Sharp', 'hello-plus' ),
'round' => esc_html__( 'Round', 'hello-plus' ),
'rounded' => esc_html__( 'Rounded', 'hello-plus' ),
'oval' => esc_html__( 'Oval', 'hello-plus' ),
'custom' => esc_html__( 'Custom', 'hello-plus' ),
],
'condition' => array_merge([
$type . '_button_type' => 'button',
], $add_type_condition),
]
);

$this->add_responsive_control(
$type . '_button_shape_custom',
[
'label' => esc_html__( 'Border Radius', 'hello-plus' ),
'type' => Controls_Manager::DIMENSIONS,
'size_units' => [ 'px', '%', 'em', 'rem' ],
'selectors' => [
'{{WRAPPER}} .ehp-header' => '--header-button-border-radius-custom-block-end: {{BOTTOM}}{{UNIT}}; --header-button-border-radius-custom-block-start: {{TOP}}{{UNIT}}; --header-button-border-radius-custom-inline-end: {{RIGHT}}{{UNIT}}; --header-button-border-radius-custom-inline-start: {{LEFT}}{{UNIT}};',
],
'separator' => 'before',
'condition' => array_merge([
$type . '_button_shape' => 'custom',
], $add_type_condition),
]
);

$this->add_group_control(
Group_Control_Box_Shadow::get_type(),
[
'name' => $type . '_button_box_shadow',
'selector' => '{{WRAPPER}} .ehp-header__button--' . $type,
'condition' => array_merge([
$type . '_button_type' => 'button',
], $add_type_condition),
]
);

$this->add_responsive_control(
$type . '_button_padding',
[
'label' => esc_html__( 'Padding', 'hello-plus' ),
'type' => Controls_Manager::DIMENSIONS,
'size_units' => [ 'px', '%', 'em', 'rem' ],
'selectors' => [
'{{WRAPPER}} .ehp-header' => '--header-button-' . $type . '-padding-block-end: {{BOTTOM}}{{UNIT}}; --header-button-' . $type . '-padding-block-start: {{TOP}}{{UNIT}}; --header-button-' . $type . '-padding-inline-end: {{RIGHT}}{{UNIT}}; --header-button-' . $type . '-padding-inline-start: {{LEFT}}{{UNIT}};',
],
'separator' => 'before',
'condition' => array_merge([
$type . '_button_type' => 'button',
], $add_type_condition),
]
);
}

private function add_advanced_behavior_section(): void {
$this->start_controls_section(
'advanced_behavior_section',
Expand Down

0 comments on commit af4e250

Please sign in to comment.