Make Product photos larger in mobile mode in Dawn theme

[thesheaparlor]

Hello! I would like my product photos to take up more space in mobile mode (as shown in the the Fenty Skin screenshot that is attached). Thank you!

 

[Sangeetanahar]

hello @thesheaparlor 

can you please share your Website URL

thanks

[thesheaparlor]

Hello, its : https://thesheaparlor.com/

[thesheaparlor]

I'd rather solve it here. is there an setting in Dawn I am missing?

[Sangeetanahar]

hello @thesheaparlor 

Go to online store ----> themes ----> actions ----> edit code ---->assets ---->section-main-product.css...>
add the code end of the file

@media screen and (max-width: 767px) {

.product-media-container.constrain-height.media-fit-contain {
    --contained-width: calc(var(--constrained-height)* var(--aspect-ratio));
    width: 100%;
}

}

result

Buy me a Pizza

If this was helpful, hit the like button and accept the solution.
Thanks

[thesheaparlor]

Hi, the photos are bigger but are getting cut off at the bottom: 

[Sangeetanahar]

hello @thesheaparlor 

I checked it on my mobile and it is working fine

[thesheaparlor]

that worked! thank you so much