How can I make the announcement bar viewable on smartphones?

[Marco211]

Do you know how to make the announcement bar also viewable on smartphones with the social icons and language?

https://refade-8966.myshopify.com/

password: refade

[HM_Helal · Accepted solution]

Hey @Marco211 , 

To make the announcement bar also viewable on smartphones with the social icons and language, please follow these steps:

1. Go to the Theme Editor by navigating to Theme Editor > Assets > base.css.

2. Once you open the file, add the following CSS code at the end of the file:

.utility-bar__grid {
    display: flex;
    justify-content: space-between;
}

@media only screen and (max-width: 768px){
	utility-bar .utility-bar__grid .list-social{
	    display:block !important;
	}
}
@media only screen and (max-width: 748px){
	.localization-wrapper .small-hide{
	    display:block !important;
	}
}

3. Save the changes and check if the issue is resolved.

If you encounter any further difficulties or require additional assistance, please don't hesitate to let me know.

If this solution resolves your issue, please consider marking it as the accepted solution.