How to change image banner font color

[YIVAN]

Hello,

Is there a way to change the text color in my image banner to white while also keeping the mobile version black?

The reason is because on mobile I want the text to show below the image so the color has to remain black.

URL: https://www.yivan.us/

Pass: YIVAN24

Thanks in advance

[suyash1 · Accepted solution]

@YIVAN - add this css to the end of your base.css file and check

@media screen and (min-width:750px){
#Banner-template--22660447666460__image_banner_hw4FHP .banner__heading,
#Banner-template--22660447666460__image_banner_hw4FHP .banner__text,
#Banner-template--22660447666460__image_banner_hw4FHP .banner__buttons a{color:#fff;}
}

[suyash1 · Accepted solution]

@YIVAN - remove this part

#shopify-section-template--22660447666460__image_banner_hw4FHP .banner__box .button {
   background: #000;}

[EBOOST]

Hi @YIVAN ,

May I suggest to update code these steps:

1. Go to Store Online-> theme -> edit code
2. Assets/base.css
3. Add code below to end of file

@media(min-width: 750px){
  #shopify-section-template--22660447666460__image_banner_hw4FHP .banner__box * {
    color: #fff;
  }
  #shopify-section-template--22660447666460__image_banner_hw4FHP .banner__box .button {
   background: #000;
  }
}

[YIVAN]

Thank you it worked but there was one problem. The button for the shop now is filled with black now. I would like there to be no fill like how I had it at first.

[suyash1 · Accepted solution]

@YIVAN - remove this part

#shopify-section-template--22660447666460__image_banner_hw4FHP .banner__box .button {
   background: #000;}

[EBOOST · Accepted solution]

Hi, 

You can refer screenshot below to remove code

[suyash1 · Accepted solution]

@YIVAN - add this css to the end of your base.css file and check

@media screen and (min-width:750px){
#Banner-template--22660447666460__image_banner_hw4FHP .banner__heading,
#Banner-template--22660447666460__image_banner_hw4FHP .banner__text,
#Banner-template--22660447666460__image_banner_hw4FHP .banner__buttons a{color:#fff;}
}