Announcement bar not showing correctly on mobile vs shopify

[Pualilia]

Hi! Hoping someone can help me out please! My announcement bar looks different on different pages when viewing from my iPhone, yet it is consistent when viewing from the mobile view backend. It appears all turquoise on my iPhone on home page a some other pages, yet is gradient how I want it on some pages but not others. Yet in Shopify mobile view it is consistently gradient. Can someone please help me? Some pics for example…

 

 

 

[DaisyVo]

Hi @Pualilia 

Could you please share the store link and store access password with me? 

Thank you!

Best,

Daisy - Avada Support Team. 

[DaisyVo]

Hi @Pualilia 

I hope you are well. You can follow our instructions below:

Step 1: Shopify admin > Online store > Customize: https://prnt.sc/XQ6IDB99kUCd
Step 2: From the left menu > Theme settings > Open Custom CSS: https://prnt.sc/iDxwa8zBQ4Z-
Step 3: Copy the code below and paste it there

Here is the code for Step 3:

@media screen and (max-width: 750px){
.utility-bar.gradient {
    background: linear-gradient(240deg, rgba(51, 251, 231, 1) 6%, rgba(127, 72, 176, 1) 42%, rgba(61, 238, 251, 1) 63%, rgba(46, 134, 249, 1) 84%) !important;
}
}

 

Please let me know if it works. Thank you!

Best,
Daisy - Avada Support Team.

[Moeed]

Hey @Pualilia 

Welcome to Shopify Community! Can you share your Store URL so I can have a look on it? Also, if you have password enabled then please share the password as well. Your cooperation would be greatly appreciated.

Best Regards,
Moeed

[Pualilia]

Hi, thank you so much for your reply! I’m still very much working on my site so please don’t judge my content;)

https://pualilia.com/password
password: eARTh

[Moeed]

Hey @Pualilia 

I just checked and it looks completely fine for me.

If I managed to help you then, don't forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[Pualilia]

So strange because it shows up incorrectly on the three different phones I've checked on today...