Fix image responsive breakpoints render

infinum · Nov 7, 2024 · becb9ab · becb9ab
1 parent f5487f2
commit becb9ab
Showing 1 changed file with 6 additions and 5 deletions.
diff --git a/blocks/init/src/Blocks/components/image/image.php b/blocks/init/src/Blocks/components/image/image.php
@@ -22,10 +22,10 @@
 
 $imageAlt = get_post_meta($imageData['_default']['id'], '_wp_attachment_image_alt', true) ?? '';
 
-$isMobileFirst = $imageData['_desktopFirst'] ?? false;
+$isDesktopFirst = $imageData['_desktopFirst'] ?? false;
 
 $breakpointData = Helpers::getSettingsGlobalVariablesBreakpoints();
-$breakpoints = Helpers::getTwBreakpoints($isMobileFirst);
+$breakpoints = Helpers::getTwBreakpoints();
 ?>
 
 <picture
@@ -45,12 +45,12 @@ class="<?php echo esc_attr($additionalClass['picture']); ?>"
 			continue;
 		}
 
-		$breakpointWidth = $breakpointData[str_replace('max-', '', $breakpoint)];
+		$breakpointWidth = $breakpointData[$breakpoint];
 
-		$widthMode = $isMobileFirst ? 'min-width' : 'max-width';
+		$widthMode = $isDesktopFirst ? 'max-width' : 'min-width';
 
 		// phpcs:ignore Eightshift.Security.HelpersEscape.OutputNotEscaped
-		echo '<source srcset="' . esc_url($value) . '" media="(' . $widthMode . ': ' . $breakpointWidth . 'rem)" />';
+		echo '<source srcset="' . esc_url($value) . '" media="(' . $widthMode . ': ' . $breakpointWidth . 'em)" />';
 		?>
 	<?php } ?>
 
@@ -60,3 +60,4 @@ class="<?php echo esc_attr($additionalClass['picture']); ?>"
 		class="<?php echo esc_attr(Helpers::tailwindClasses('base', $attributes, $manifest, $additionalClass['image'] ?? $additionalClass)); ?>"
 	/>
 </picture>
+