Dawn theme search modal not displaying on desktop when scrolled down the page

Store Design
1

Can anyone assist me in fixing this bug in the Dawn theme?

If you install the Dawn theme and preview on desktop, then scroll down so window.scrollY is 1200, when you try to open the search modal, it opens and automatically closes. If you scroll back up so window.scrollY is 1000, it opens and remains open.

2

Hello,

Please share your store details.

Thank you.

3

@tmstn

Hi, Tmstn

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community! :blush:
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

4

I’ve reported this issue in the GitHub repo for the Dawn theme.

Shopify have said they will let me know when a fix has been found.

5

Was a fix for this ever found?

Dawn 7.0 seems to have this issue still. If you size your browser smaller than 1600 px wide it seems to occur. Appears that page width has something to do with it.

6

@johanson

oh sorry for that issue if possible to share store url

7

The issue is with .overflow-hidden in base.css.
This needs to have height: 100%;

.overflow-hidden {
overflow: hidden;
height: 100%;
}

Note: I am not a front end engineer, nor an expert in css, and I do not fully understand the “why” so there could be a better fix.

8

Hi,

You need to add this to your CSS

.overflow-hidden {
height: max-content;
}

This works best for me in Dawn theme 7.0.1