Changing text color when turning in phone

Store Design
, ,
1

Hello eveyone,

I’ve got a small problem with my shopify store.I have used the “image slide” section on my shopify store.When it is on computer it’s all good since the text is white on a colerful picture so we can see the text.Now when i go to the phone view, i see that my text disapeared just below the picture because the text is white on a white background.I would like to know if it was possible to maybe change the color of the text to black on white background below the picture but just for the phone version and let everything be for the computer version.

Thanks to anyone who will provide me with any kind of help.

2

Hi,

Can you share your store URL to be able to give you the solution for this.

3

Hi @HHloot

Can you please provide your store URL and password as well if applicable, so that I can provide you solution that can work for you.

Best regards

Sahil

4

Hello @HHloot ,

Please share your store URL and Password.
So that I will check and let you know the exact solution here.

5

Hello,

Here is the link : https://9d4a5b-3.myshopify.com/

Scroll down until you find the slideshow.You can see that the text displayed on the slide,on computer mode,is visible,all good. But if you go to inspect and switch to iphone version,you can see that the text go below the slide since it is too small,and because the color of the text is white and the background is white too,you can’t see the text on mobile.

Now if you really need the password to fix it or to find the solution i don’t know what password to share (like the password of my whole shopify account ? or like is there a password specificly for the shopify store only).

6

Hello,

Here is the link : https://9d4a5b-3.myshopify.com/

Scroll down until you find the slideshow. You can see that the text displayed on the slide,on computer mode,is visible,all good. But if you go to inspect and switch to iphone version,you can see that the text go below the slide since it is too small,and because the color of the text is white and the background is white too,you can’t see the text on mobile.

Now if you really need the password to fix it or to find the solution i don’t know what password to share (like the password of my whole shopify account ? or like is there a password specifically for the shopify store only).

7

Hi @HHloot Thanks for explaining the issue you are facing, Please add the give code at the bottom of base.css file.

@media only screen and (max-width: 600px) {
h2.banner__heading.inline-richtext.h1, .banner__text.rte{
    color: black !important;
}
}

If you are not sure where is your base.css file please follow the steps:

  1. Login in shopify admin.
  2. Click on the Online Store.
  3. Then click on the button next to Customize in live Theme.
  4. Click Edit Code.
  5. Search Base.css in the code in left hand side.
  6. Add the code given above at the bottom of base.css file.

Result:

sahilsharma9515_0-1700310335128.png
sahilsharma9515_0-1700310335128.png498×357 25.7 KB

If you will unable to implement the same then I’m happy to do this for you, let me know. I can implement the code changes so that this will work well for you.

Hopefully it will help you. If yes then Please don’t forget hit Like and Mark it as solution!

Best Regards

Sahil

8

Wow,incredible,this worked perfectly.

I haven’t been active lately due to personal matter so i just tried it now and it’s fantastic it’s so easy thank you so much for your help Sahil !