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

Store Design
1

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
con17_1-1625058109301.png1366×768 120 KB

2

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.

2 Likes
3

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

4

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

1 Like
5

@Ninthony

Thank you that did the trick!

6

This was driving me insane! Such a simple and easy fix!

Thank you!!