Skip to content

Fix image focal point bug when dominant color is enabled by not overriding style attribute #582

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 7 commits into from
Nov 16, 2022
Merged

Fix image focal point bug when dominant color is enabled by not overriding style attribute #582

Changes from 1 commit
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
90b29c3
Fix focal point issue
mukeshpanchal27 Nov 15, 2022
081a10d
Add space for the style property
mukeshpanchal27 Nov 16, 2022
1d8ecf3
Unit test added
mukeshpanchal27 Nov 16, 2022
3a77c75
Update test method name
mukeshpanchal27 Nov 16, 2022
057240e
Update test method description
mukeshpanchal27 Nov 16, 2022
1dc7a4e
Address unit test feedback
mukeshpanchal27 Nov 16, 2022
faff059
Added missing param
mukeshpanchal27 Nov 16, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Next Next commit
Fix focal point issue
  • Loading branch information
@mukeshpanchal27
mukeshpanchal27 committed Nov 15, 2022
commit 90b29c3efe565e20738c5babf6b6f60e1cad98f6
12 changes: 8 additions & 4 deletions modules/images/dominant-color/load.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -112,12 +112,15 @@ function dominant_color_img_tag_add_dominant_color( $filtered_image, $context, $
}

$data = '';
$style = '';
$extra_class = '';

if ( ! empty( $image_meta['dominant_color'] ) ) {
$data .= sprintf( 'data-dominant-color="%s" ', esc_attr( $image_meta['dominant_color'] ) );
$style = 'style="--dominant-color: #' . esc_attr( $image_meta['dominant_color'] ) . ';" ';
if ( str_contains( $filtered_image, ' style="' ) ) {
$filtered_image = str_replace( ' style="', ' style="--dominant-color: #' . esc_attr( $image_meta['dominant_color'] ) . ';', $filtered_image );
} else {
$filtered_image = str_replace( '<img ', '<img style="--dominant-color: #' . esc_attr( $image_meta['dominant_color'] ) . ';" ', $filtered_image );
}
}

if ( isset( $image_meta['has_transparency'] ) ) {
Expand All @@ -126,9 +129,10 @@ function dominant_color_img_tag_add_dominant_color( $filtered_image, $context, $
$extra_class = $image_meta['has_transparency'] ? 'has-transparency' : 'not-transparent';
}

if ( ! empty( $data ) || ! empty( $style ) ) {
$filtered_image = str_replace( '<img ', '<img ' . $data . $style, $filtered_image );
if ( ! empty( $data ) ) {
$filtered_image = str_replace( '<img ', '<img ' . $data, $filtered_image );
}

if ( ! empty( $extra_class ) ) {
$filtered_image = str_replace( ' class="', ' class="' . $extra_class . ' ', $filtered_image );
}
Expand Down