Re: Change the Text variant color on mobile device on Debut Theme

Change the Text variant color on mobile device on Debut Theme

neonfactory
Excursionist
17 0 19

Hello,

 

The variants text colors are black on black background on mobile device, so it's not visible. 

How to I modify this, my theme is Debut Theme.

 

Please see the screenshot.

 

variant-color Image_20230704134324.jpg

 

Replies 8 (8)

Typostore
Shopify Partner
117 11 13

Hello @neonfactory , when I view on mobile, I still see text show normal: https://prnt.sc/r3bIeWiWqnJy

you can check my image

- I'm dev shopify. | Skype : hoang.nguyenit92 | Email: typostores@gmail.com
- Is my reply helpful? Click Like to let me know!
- If you got your answer? Mark it as an Accepted Solution
neonfactory
Excursionist
17 0 19

I think it's about the size of your screen.

Mine still doesnt showing the text of variant.

Weixin Image_20230704145041.jpg

ZestardTech
Shopify Partner
5718 1049 1380

Hello There,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > theme.scss.css and paste this at the bottom of the file:

@media (min-width: 768px){
select#SingleOptionSelector-0 {
color: red!important;
}
}

ZestardTech_0-1688455855004.png

 

Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing
neonfactory
Excursionist
17 0 19

I do not have theme.scss.css

I have theme.scss.liquid

neonfactory
Excursionist
17 0 19

I have edited the file I have theme.scss.liquid but It's change the color on desktop but not on my phone. 

Is it about this : min-width: 768px ?

Can we modify it for all the device?

ZestardTech
Shopify Partner
5718 1049 1380

Hello There,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > theme.scss.css and paste this at the bottom of the file:

@media (max-width: 768px){
select#SingleOptionSelector-0 {
color: red;
}
}
Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing
neonfactory
Excursionist
17 0 19

 

The first option is showed. But the second still not showing.

As seen as the attachment.

Or for example this one:

https://neon-factory.com/collections/new/products/troegs-neon-signs-

 

neonfactory
Excursionist
17 0 19