[Resolved] How do I control how fast the slideout is shown?

[Tom]

Are we talking about this alignment?: https://www.screencast.com/t/Kz1UJYEu0mE2

[Silvio]

yes and not.
here’s a correct link generatepress.silviogulizia.com to a cleaned version.

Everything is aligned but when you trigger the slideout, the slideout close button is not aligned. Additionally, on mobile, the logo touches the top edge, but this is probably due to not cropping it, and it requires adding some margin to the inside navigation and removing some padding from the menu toggle that is a bit more inside than the rest of the website.

I am still missing the logo in the mobile sticky navigation for staging3.silviogulizia.com but at some point ok, let it go.

thanks for supporting and pointing me to reduce the clutter of the additional css.

[Tom]

It’s not aligned, or it’s not in the same position as the menu bars? As far as I can tell, the close icon is still aligned with everything else.

This might help make it align better?:

.slideout-navigation button.slideout-exit {
    text-align: right;
    font-size: 20px;
}

I’m not seeing a logo on mobile – did you remove it? It might help to increase the menu item height on mobile to match desktop.

[Silvio]

far better thanks!

when it comes to the mobile header, it seems I was not able to replicate it.

on my staging I have mobile header on set to site title, plus an element that hooks into inside_mobile_header with this code

<div class="site-logo">
<a href="<?php echo site_url(); ?>" title="<?php bloginfo( 'name' ); ?>" rel="home">
<img class="header-image" alt="Silvio Gulizia" src="/wp-content/uploads/2019/04/logo-silvio-gulizia-e1555021035983.png" title="Silvio Gulizia">
</a>
</div>

and it’s working. but I couldn’t replicate it.

[Tom]

What couldn’t you replicate exactly? The spacing?

[Silvio]

not a problem. thanks

[Tom]

You’re welcome 🙂

[Author]

Posts