Changing Text color based on platform

Allure2
Visitor
2 0 1

I want to change my banner text color to be white on the mobile POV but black on the desktop POV since right now its black on both and its very hard to read on the mobile POV. Heres a picture below that shows how the mobile pov is hard to read.

Replies 2 (2)

Allure2
Visitor
2 0 1

Screenshot 2024-01-28 at 12.01.54 PM.png

biznazz101
Shopify Partner
484 46 86

Could you please provide your store URL, thanks!

In the meantime, you could duplicate the section and change the button color. Then hide one section based on screen size (ie desktop section only shown on desktop, mobile on mobile) you can add this code to your base.css file you would just need to replace the Shopify section ID's with your own:

<!-- ADD TO BASE.CSS (OR THEME.CSS) AT BOTTOM ON NEW LINE. REPLACE SECTION ID WITH THE ONE YOU WANT TO HIDE (top code hides mobile, bottom code hides mobile section) --> 

@media screen and (max-width: 768px) {
  #shopify-section-72bd75b8-a784-4453-8b3b-bc08a80d9530 {
    display: none;
    visibility: hidden;
  }
}
 @media screen and (min-width: 768px) {
  #shopify-section-6e87ba40-9742-46c4-8ad5-27549cfd6c3c {
    display: none;
    visibility: hidden;
  }


Hope that helps!
@biznazz101 

Don't hesitate to reach out for more help with your store.
SEE OUR TASK STORE or check us out via our profile! FREE STORE AUDIT