Docs

[Paul R]

Hi,

Your menu is too long to fit on smaller screens.

We can make the mobile button appear earlier.

You can add this under Custom > Edit Global CSS in the Customizer.

@media (max-width: 1166px) {
    .x-navbar .x-nav-wrap.desktop {
         display:none;
    }

.x-navbar .x-btn-navbar {
    display: block;
    float: left;
    color:#333;
}

.x-navbar .x-nav-wrap.mobile.collapse.in {
    display:block !important;
}
.x-navbar  .x-btn-navbar:hover {
    color: #333;
}
}

Hope that helps.

[Erman]

Thanks! You guys are fantastic!!

[Lely]

You’re welcome!

Cheers!

[Erman]

This reply has been marked as private.

[Joao]

Hi There,

Please find this code:

.x-social-global,
.x-topbar .p-info {
    float: none !important;
    display: inline-block !important;
}

and change for this:

@media only screen and (min-device-width: 768px) {
.x-social-global {
    float: none !important;
    display: inline-block !important;
} }

.x-topbar .p-info {
    float: none !important;
    display: inline-block !important;

}

Hope that helps,

Joao

[Erman]

Thanks a lot!
Can you help me to reactive the mobile menu button?
Cheers!

[Rupok]

Hi there,

Thanks for updating. I am not sure what you meant by “reactive the mobile menu button”. It seems you have changed the password so can’t check the site either hence can’t understand the issue. Would you clarify a bit and provide the credentials or take of maintenance mode?

Cheers!

[Erman]

This reply has been marked as private.

[Jade]

Hi there,

Please add this CSS:

.x-btn-navbar {
    color: #333;
}

.x-btn-navbar:hover {
    color: #000;
}

@media (max-width: 1100px) {
    .x-btn-navbar {
        display: block !important;
    }
}

Hope this helps.

[Erman]

Thanks, but the menu button is always there now…

[Lely]

Hi There,

That is because of the following custom CSS:

.x-navbar .x-btn-navbar {
   display: block;
   float: left;
   color:#333;
}

Please remove this line: display: block; from above CSS. See attached screenhot.

[Author]

Posts