Different product price font-size for desktop and mobile with Debut theme?

Solved
Highlighted
Excursionist
14 1 1

Hi guys,

 

I wanted to change the font-size of the product price on my site. I managed to change this with the code below in theme.scss.liquid. However, I don't like the size on desktop but I do like how it is on mobile. Is there a way to have two different sizes for mobile and desktop? Thanks!

 

.price-item--regular {
font-size: 20px;
font-weight: normal;
}

0 Likes
Highlighted
Shopify Partner
321 57 76

This is an accepted solution.

@GlobalSoldier,

 

1. You can use first for mobile and second for desktop. replace it with previous code
 
@media only screen and (max-width: 700px) {
  .price-item--regular {
font-size: 14px;
font-weight: normal;
}
}
@media only screen and (min-width: 700px) {
  .price-item--regular {
font-size: 20px;
font-weight: normal;
}
}
 
 
Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: wahabahmadghori@gmail.com

 

1 Like
Highlighted
Excursionist
14 1 1

Thanks a lot! that did the trick :)

0 Likes
Highlighted
New Member
1 0 0

Where do I find this code please? Is there an easy way to search the code to find the bit that you want to alter. I have a supply theme and want to reduce the size of the price on the product page

0 Likes