Dawn problem

Hello I heavily modified Dawn theme but there is one bug that drives me crazy.

It’s this blue box below the X button on menu bar on mobile version
Can good developer see it and to tell me where to look on what liquid file to remove it

Thank you
site:privateviewscreen.com
password:1614

Hey @Kiwart

Follow these Steps:

  1. Go to Online Store
  2. Edit Code
  3. Find theme.liquid file
  4. Add the following code in the bottom of the file above </ body> tag
<style>
.header__icon--menu[aria-expanded='true']::before {
    background: transparent !important;
}
</style>

RESULT:


Hope that helps! If it did, a Like and Marking it as Solution goes a long way and helps others find the fix faster too.

Best,
Moeed

Hi @Kiwart

This issue is coming from below CSS

.header__icon--menu[aria-expanded='true']::before {
    content: '';
    top: 100%;
    left: 0;
    height: calc(var(--viewport-height, 100vh) - (var(--header-bottom-position, 100%)));
    width: 100%;
    display: block;
    position: absolute;
    background: red;
}

Check screenshot also:

When the mobile menu opens, this blue element still remains in place. You can remove it using CSS.

Thank You

Add this code here

.header__icon--menu[aria-expanded='true']::before {
    background: transparent !important;
}

Best,
Moeed

BTW why does it says Bulgaria and not your country? I want my clients to see their own country and to be more social proof

Thank you for finding the problem. But may I ask why it says Bulgaria and not your country?
I want when people enter the store from let’s say Netherlands , to show them Netherlands and their flag down in the country picker

Do you have automatic redirection on?
https://help.shopify.com/en/manual/international/automatic-redirection

Yes both settings are turned on

Not 100% sure, but may be because of password protection.
Also, many of us here are not in Europe so we’re stay at your default market/country.