Drawer menu issues no animation and close delayed - dawn theme

Hello,

I am having an issue with my drawer menu on my customised dawn theme. the opening and closing animation is not working, the menu just pop up. Also the close is lag/delayed and happened a second after the click on close button.

website : https://a91d87-c1.myshopify.com/collections/frontpage

password : Password25!

Thanks for your help!

Hi @GM15 ,

May I suggest to update code these steps:

  1. Go to Store Online-> theme → edit code

  2. Assets/component-menu-drawer.css

  3. Refer screenshot below to remove code

  1. Add code below
.js details[open] > .menu-drawer,

.js details[open] > .menu-drawer__submenu {

  transition: transform var(--duration-default) ease, visibility var(--duration-default) ease;

}
.js details[open].menu-opening > .menu-drawer,

details[open].menu-opening > .menu-drawer__submenu {

  transform: translateX(0);

  visibility: visible;

}

Thank you !! works perfectly now

Can you also please check why the close button transform back into the burger menu with 1sec lag/delayed ? thanks

Hi,

You can try add code below:

.header__icon--menu .icon {
    transition: transform .15s ease,opacity .15s ease
}

.js details[open]:not(.menu-opening)>.header__icon--menu .icon-close {
    visibility: hidden
}

.js details[open]:not(.menu-opening)>.header__icon--menu .icon-hamburger {
    visibility: visible;
    opacity: 1;
    transform: scale(1.07)
}
1 Like

thanks, everything is working !!