I know, that’s why I added code that allows me to upload different images for mobile view only.
Topic summary
Issue: Enabling “adapt to first image” in the Brooklyn theme prevents desktop cropping, but causes mobile slideshow images (square “mb_image”) to be cropped top/bottom to fit the desktop-derived rectangular height.
Context: Merchant added custom code to upload separate images for mobile and desktop within the slideshow. Code renders two image blocks (desktop and mb_image) with computed heights and responsive widths.
What’s likely happening: The slideshow/container height is being fixed or inherited from the desktop image when “adapt to first image” is on, forcing the mobile image into a rectangular frame.
Advice shared:
- Check for any fixed height on slideshow/banner elements that prevents mobile expansion.
- Be aware Brooklyn is a retired theme (harder to reproduce); using square images can make desktop appear oversized without separate handling.
Assets: A screenshot was provided showing the desired full, uncropped square image on mobile; this is central to understanding the target outcome.
Status: Unresolved. Next steps implied: adjust CSS/media queries so the mobile container (e.g., .mb-img) controls its own height/aspect ratio and doesn’t inherit the desktop “adapt to first image” height.