Is it possible to reduce announcement bar text size only for the mobile?

Solved
con17
Excursionist
35 0 16

Hi I wanted to know can I reduce the text size of the announcement bar only for the mobile as it is good for the desktop version but it is too long for the mobile version, it shows in 3 lines as shown below.

Website url tbp17.myshopify.com

con17_1-1625058109301.png

 

0 Likes
Ninthony
Shopify Partner
1966 296 780

This is an accepted solution.

At the bottom of your theme.scss.liquid file in your assets folder you can place this code:

@media(max-width: 500px){
    .announcement-bar__message {
        font-size:12px
    }
}

 

Just adjust the pixel value as you see fit.

If my solution helped you, please like it and accept it as the solution!
If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish :D
con17
Excursionist
35 0 16

Hi thank you for your reply, would this change it for the desktop version also?

0 Likes
Ninthony
Shopify Partner
1966 296 780

This is an accepted solution.

No, it will only change it on screen sizes less than 500px

If my solution helped you, please like it and accept it as the solution!
If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish :D
con17
Excursionist
35 0 16

@Ninthony 

Thank you that did the trick!

0 Likes