I'm facing an issue where the images I add to my Shopify site using the Brooklyn theme appear blurry unless resized to a small scale. The dimensions of the images are 1748 x 1240 at 300dpi.
My intention is to implement a JQuery image slider (lightslider) on the site, but this brought the problem to light: the thumbnails look clear at 95 x 67, however, the main carousel image appears blurry (set to a max-width of 891 x 633 within its parent div).
Testing the slider outside of Shopify showed no blurriness in the images. When trying different sliders like flex-slider within the Shopify theme, the large images still appeared blurry.
I suspect there might be something in the Shopify theme CSS affecting the image quality. Is it possible or am I overlooking something?