Shopify themes, liquid, logos, and UX
I've just upgraded themes from Debut to Dawn theme. As with everyone else the Debut product page was perfect and I want to replicate that as much as possible.
I already followed a solution to resize the main product image.
The image was resized using this: (I changed it from 64% to 30%)
.product:not(.product — no-media) .product__media-wrapper {
max-width: 64%;
width: calc(64% — 1rem / 2);
My question now is how can I resize the product description and make it larger to fill the page again (i want to stretch it to fill the red area highlighted below).
Thanks
Solved! Go to the solution
This is an accepted solution.
Please Go to Online Store -> Themes -> Edit code -> Assets -> theme.scss.liquid and paste this code at the end of this file.
@media screen and (min-width: 990px) {
.product:not(.product--no-media):not(.featured-product) .product__info-wrapper {
max-width: 70% !important;
width: 70% !important;
}
}
Hello, @SilverBeach
Welcome to the Shopify Community.
I read your problem and it seems that I need to analyze your website to provide the solution here.
Would you please share your website URL and if your website is password protected then also provide the password.
This is an accepted solution.
Please Go to Online Store -> Themes -> Edit code -> Assets -> theme.scss.liquid and paste this code at the end of this file.
@media screen and (min-width: 990px) {
.product:not(.product--no-media):not(.featured-product) .product__info-wrapper {
max-width: 70% !important;
width: 70% !important;
}
}
I can't seem to find theme.scss.liquid under the Asset menu..
All good! It worked! Thank you
Hi, where did you find the theme.scss.liqud file?
It's under Assets > section-main-product.css and I just pasted the code at the bottom
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024Digital marketers and app developers have tracked activity in apps and websites for yea...
By Ollie Mar 13, 2024February was an exciting month with Shopify Editions, informative webinars, and more! F...
By JasonH Mar 7, 2024