Top Bar Phone Number on Mobile

Support
#1

I changed the top bar font color to white and made it bold but it is a faint light yellow on mobile. How do I fix this?

#2

Hello @AroundUScorp,

Thanks for writing in. I have checked your site in smaller screen and the light yellow is the hover color.

You may have experienced browser caching issue. Please clear your browser cache or use private browsing mode and test your site again.

Kindly let us know how it goes.

#3

It’s showing as the thin light yellow on iphones and not the bold white.

#4

Here is an example.

#5

Hi @AroundUScorp,

I see what you mean, please add this CSS to Theme Options > CSS

.x-topbar .p-info {
    border: 0px !important;
}

Hope this helps.

#6

That looks a lot better but is there a way to bold the text on mobile like the social icons and how the text looks on desktop? The phone number is still hard to see but only on iphone?

#7

Hi @AroundUScorp,

You can set the icons to bold, you can only increase its size through font size styling. And the reason you’re seeing the phone number differently is because iOS tends to override the phone number. Please check this https://stackoverflow.com/questions/3736807/how-do-i-remove-the-blue-styling-of-telephone-numbers-on-iphone-ios

You can simply add it like

<a href="tel:702.907.8477" style="color: #fff3bc;">702.907.8477</a>

Thanks!

#8

Perfect, thank you so much.

#9

You’re most welcome!

#10

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.