How can I uniformly increase text size on mobile and web?

Store Design
1

Hi there!

We just got a custom site created, but need some fixes that I think are minor, but he wants to charge us an arm and a leg for. Is there any way to put sort of a ‘blanket’ css statement to increase the text size of our prices on mobile and web?

Our site is itsjuliet.com and the price sizes are smaller on mobile, and to be honest, all over the place. I just want them all to be the same size across the board - web, mobile, price, and compare at price.

Thank you!

Tiffany

2

Try adding this code to the bottom of theme.css

/* product page prices */
.ProductMeta__Price.Price.Text--subdued.u-h4 {
font-size: 20px !important;
}

/* collection page prices */
.ProductItem__PriceList.Heading {
      font-size: 20px !important;
}

/* collection & product page sale prices */
.ProductItem__Price.Price.Price--compareAt.Text--subdued, .ProductItem__Price.Price.Price--highlight.Text--subdued {
      font-size: 21px !important;
}
1 Like
3

OMG THANK YOU!!! IT WORKS. GENIUS. THANK YOU!!!

One other question if you don’t mind but it’s okay if you’re busy.

Do you see how the colors of the prices show up grey under recently viewed, style with, collection pages, etc? How can we change that color to hex code #000000

Can we do it the same way we did the font?