| @@ -432,13 +432,18 @@ | ||
| 432 | 432 | 'min' => 6, |
| 433 | 433 | ], |
| 434 | 434 | ], |
| 435 | 435 | 'selectors' => [ |
| 436 | - '{{WRAPPER}} .elementor-icon-list-icon' => '--e-icon-list-icon-size: {{SIZE}}{{UNIT}};', | |
| 436 | + '{{WRAPPER}}' => '--e-icon-list-icon-size: {{SIZE}}{{UNIT}};', | |
| 437 | 437 | ], |
| 438 | 438 | ] |
| 439 | 439 | ); |
| 440 | 440 | |
| 441 | + $e_icon_list_icon_css_var = 'var(--e-icon-list-icon-size, 1em)'; | |
| 442 | + $e_icon_list_icon_align_left = sprintf( '0 calc(%s * 0.25) 0 0', $e_icon_list_icon_css_var ); | |
| 443 | + $e_icon_list_icon_align_center = sprintf( '0 calc(%s * 0.125)', $e_icon_list_icon_css_var ); | |
| 444 | + $e_icon_list_icon_align_right = sprintf( '0 0 0 calc(%s * 0.25)', $e_icon_list_icon_css_var ); | |
| 445 | + | |
| 441 | 446 | $this->add_responsive_control( |
| 442 | 447 | 'icon_self_align', |
| 443 | 448 | [ |
| 444 | 449 | 'label' => esc_html__( 'Alignment', 'elementor' ), |
| @@ -457,10 +462,15 @@ | ||
| 457 | 462 | 'icon' => 'eicon-h-align-right', |
| 458 | 463 | ], |
| 459 | 464 | ], |
| 460 | 465 | 'default' => '', |
| 466 | + 'selectors_dictionary' => [ | |
| 467 | + 'left' => sprintf( '--e-icon-list-icon-align: left; --e-icon-list-icon-margin: %s;', $e_icon_list_icon_align_left ), | |
| 468 | + 'center' => sprintf( '--e-icon-list-icon-align: center; --e-icon-list-icon-margin: %s;', $e_icon_list_icon_align_center ), | |
| 469 | + 'right' => sprintf( '--e-icon-list-icon-align: right; --e-icon-list-icon-margin: %s;', $e_icon_list_icon_align_right ), | |
| 470 | + ], | |
| 461 | 471 | 'selectors' => [ |
| 462 | - '{{WRAPPER}} .elementor-icon-list-icon' => 'text-align: {{VALUE}};', | |
| 472 | + '{{WRAPPER}}' => '{{VALUE}}', | |
| 463 | 473 | ], |
| 464 | 474 | ] |
| 465 | 475 | ); |
| 466 | 476 | |