[btboganParticipant]

ok ya that looks great, thank you so much, i really appreciate it

[NicoModerator]

Happy to hear that.

Feel free to ask us again.

Thanks.

[btboganParticipant]

hello there. i’m not sure if this was the code that made this happen, but now, on mobile, when you press the header menu button, there is no longer a white background behind the expanded menu buttons.

http://www.barrettbogan.com

any ideas on how I can get that part back as it was and still benefit from the changes we accomplished?

thanks

[btboganParticipant]

OH WOW, also for some reason all that work you helped me achieve with the scrolling and easing on a desktop screen seems to now be not responding anymore. I’m not sure what code changed it. Would you be able to take a look at it for me and help me get it back?

Yikes!

[LelyModerator]

Hi There,

There is a javascript error when I check. This will stop it from working.
Please remove this part line <div id="fb-root"></div> from Appearance > Customize > Custom > Edit Global Javascript.

The we can add this custom CSS to add background on Mobile Menu on dropdown:

.x-navbar-inner {
    background: #fff;
}

Hope this helps.

[btboganParticipant]

PERFECT. Thank you for both of those fixes.

y’all are so helpful and gracious.

much obliged.

God bless!

[JoaoModerator]

Glad to hear it 🙂

Joao

[btboganParticipant]

ok so now on mobile when you load the page the header menu is too tall again. then when you scroll down and back up it finally decides to remain sticky at the right height.

And also on mobile, once the header does remain sticky, the logo shrinks up like it does on the desktop which is weird.

Is there any way I can have that shrinking be avoided on mobile but still have it on desktop?

thank you so much for all your help guys

[RupokMember]

Hi there,

You might need to adjust the existing code to make it perfect to your needs. Further customizations from here would be getting into custom development, which is outside the scope of support we can offer. If you need more in depth changes, you may wish to consult with a developer. X is quite extensible with child themes, so there are plenty of possibilities. Thanks for understanding.

[btboganParticipant]

ok i understand. But since you gave me these current codes can you help me fix them please?

[JadeModerator]

Hi there,

Please add this code:

@media (max-width: 979px) {
    body .x-navbar.x-navbar-fixed-top {
        position: relative;
    }

    .x-navbar-inner {
        min-height: 50px !important;
    }

    .x-navbar-fixed-top .x-brand img {
        width: 250px !important;
    }
}

Hope this helps.

[btboganParticipant]

OK great that fixed some of it thank you so much.

the height of the header is right

the only thing missing is that the header on mobile should be sticky. do i have codes that are countering each other or what?

[ChristopherModerator]

Hi there,

Please update previous code to :

@media (max-width: 979px) {
   
    .x-navbar-inner {
        min-height: 50px !important;
    }

    .x-navbar-fixed-top .x-brand img {
        width: 250px !important;
    }
}

Hope it helps.

[btboganParticipant]

it does indeed. thank you so much

i really appreciate y’alls help.

thanks again & God bless you guys.

have a great day 🙂

[JoaoModerator]

Thank you!

[Author]

Posts