Classic Theme - How to scale down font (mobile only)

Highlighted
Tourist
5 0 2

Hi there,

how can I scale down the font size of my products in the product page? How and where could I change the code, if possible?

Thank you in advance,

Johannes

0 Likes
Highlighted
Shopify Partner
86 3 20

Hey there,

is Classic an old theme? Can't seem to find it on the marketplace now. 

Usually when dealing with different styling for Mobile and Desktop you can use the screen size media query breakpoints, something like below. Here for screens with width bigger than 1024px the font size for the visely-container class will be 24px, and for screen with width between 768 and 1024 it will be 14px.

@media only screen and (min-width: 1024px) { 
    
    .visely-recommendation-item { font-size: 24px; }
  }
  @media only screen and (min-width: 768px) and (max-width: 1023px) { 
    .visely-recommendation-item { font-size: 14px; }
  }

Find the css class that deals with the font size you want to change and add the media queries and breakpoints that make sense for your design.

 

Alex Dereveanco | CMO @ visely.io
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution!
- To learn more about the awesome stuff we do head over to visely.io or our blog
0 Likes
Highlighted
Explorer
51 1 8

Hello @Alexandru_Derev ,

 

I ma having a similar issue on theme Prestige. I want to change the tittle to font size 30px for the mobile view only. Can you help me?

 

https://newdaysports.com/pages/brandservices

PS: CoschStudio

 

Thanks in advance

0 Likes