Re: Dawn Theme - Drop-down Menu on Mobile Not Working

Solved

Dawn Theme - Drop-down Menu on Mobile Not Working

danielcfossum
Tourist
4 1 3

Hello!

I am using the Dawn theme and having some issues with the drop-down menu on mobile. It does not seem to be moving when one pushes it on mobile. 

Store-URL: https://solgar-no.myshopify.com

 

May someone please help me?

 

Thank you 

Accepted Solution (1)

danielcfossum
Tourist
4 1 3

This is an accepted solution.

This solved the problem: 

.js details[open]>.menu-drawer, .js details[open]>.menu-drawer__submenu {
    transition: transform var(--duration-default) ease,visibility var(--duration-default) ease;
    visibility: visible;
    transform: translate(0%);
}
Go to Online Store->Theme->Edit code->Asset->/base.css ->paste the below code at the bottom of the file.

 

View solution in original post

Replies 8 (8)

Sheesh_b
Shopify Partner
516 113 117

Hi @danielcfossum 

Find Assets > global.js and paste the below code at the end of the file.

 

const boxes = document.querySelectorAll('.menu-drawer-container');

for (const box of boxes) {
  box.addEventListener('click', function handleClick() {
    box.classList.add('menu-opening');
  });
}

 

I didn't dig the issue but to solve this you can use the code. May the issue arrived conflict of any code added to theme by any app.

We're here to simplify website creation for those looking to establish a strong online presence. Book a meeting slot if you want to discuss. It's FREE. BOOK NOW | Try Shopify for $1 for 3 Months: Shopify Trial | Shopify Web Store Developer |
LIKE or mark as ACCEPTED SOLUTION
Natascha12
New Member
4 0 0

Hello, thank you for your help! I have the same issue now, unfortunately the code does not work. Do you have any other Idea? Thank you! Natascha 

Sheesh_b
Shopify Partner
516 113 117

Hi @Natascha12 

Have you tried my solution provided above?
Let me know if that works for you. In case, nothing is working, do let us know. I'll check and will provide a solution.

 

Thanks

We're here to simplify website creation for those looking to establish a strong online presence. Book a meeting slot if you want to discuss. It's FREE. BOOK NOW | Try Shopify for $1 for 3 Months: Shopify Trial | Shopify Web Store Developer |
LIKE or mark as ACCEPTED SOLUTION

DelightCart
Shopify Partner
1242 82 157

@danielcfossum It's a code level change. Can you give me store access?

Delight Cart - It's time to turn your visitors into loyal shoppers! 

Delight Loyalty - Increase repeat sales quickly and build lifelong customers loyalty.

danielcfossum
Tourist
4 1 3

This is an accepted solution.

This solved the problem: 

.js details[open]>.menu-drawer, .js details[open]>.menu-drawer__submenu {
    transition: transform var(--duration-default) ease,visibility var(--duration-default) ease;
    visibility: visible;
    transform: translate(0%);
}
Go to Online Store->Theme->Edit code->Asset->/base.css ->paste the below code at the bottom of the file.

 

EECo
Visitor
1 0 1

Worked and very easy! Thanks!

Hayjay25
Visitor
1 0 1

Worked for me as well. Thanks!

FishinGirl
Tourist
4 0 5

I started having the same problem out of nowhere and this fixed it. Thanks!