Shopify themes, liquid, logos, and UX
Dear sir, madam,
First I got the problem that it wasn't possible to overlay the main image behind the main menu. I got advise that I should adjust the code, so I added the following code in assets->theme.css:
.template-index .site-header {position: absolute;background: transparent !important;}
.template-index .site-header__mobile-nav {background: transparent !important;}
The problem is now solved if I open my website www.printjeskoning.nl on a computer, but now I don't see the main menu when opening the website on a mobile.
Could someone please help me?
Kind regards,
T
Solved! Go to the solution
This is an accepted solution.
Hi @Wijnen,
Please place this code at the end of theme.css
.mobile-nav-wrapper {
-ms-transform: none;
-webkit-transform: none;
transform: none;
position: absolute;
top: 100%;
left: 0;
background-color: var(--color-body);
transition: all 0.45s cubic-bezier(0.29, 0.63, 0.44, 1);
display: none;
overflow: hidden;
width: 100%;
}
.mobile-nav-wrapper.js-menu--is-open {
display: block;
z-index: 999;
transform: none !important;
}
.page-container {
transform: none !important;
}
Link to refer: https://prnt.sc/12pqlla
Hope this helps.
This is an accepted solution.
Hi @Wijnen,
Please place this code at the end of theme.css
.mobile-nav-wrapper {
-ms-transform: none;
-webkit-transform: none;
transform: none;
position: absolute;
top: 100%;
left: 0;
background-color: var(--color-body);
transition: all 0.45s cubic-bezier(0.29, 0.63, 0.44, 1);
display: none;
overflow: hidden;
width: 100%;
}
.mobile-nav-wrapper.js-menu--is-open {
display: block;
z-index: 999;
transform: none !important;
}
.page-container {
transform: none !important;
}
Link to refer: https://prnt.sc/12pqlla
Hope this helps.
Your the man!
User | RANK |
---|---|
74 | |
72 | |
62 | |
59 | |
41 |
As a business owner, have you ever wondered when your customer's first impression of yo...
By Skye Jun 6, 2023We're excited to announce improvements to the threaded messaging experience in our communi...
By TyW May 31, 2023Thank you to everyone who participated in our AMA with Klaviyo. It was great to see so man...
By Jacqui May 30, 2023