Login option not showing in mobile menu drawer after making transparent header

[AnSrSi]

Hi there,

I have added custom css for making the header of my store transparent on home page only. But after I did that the login option is missing in the mobile menu drawer. This is the code that I added for transparent header,

.template-index .header-wrapper {
  background: transparent !important;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 999;
  transition: all 0.3s ease;
  box-shadow: none !important;
}

I customized the code and found out that the problem is with the position property even though changing it will affect transperancy. So can anyone suggest a solution for this.

store- https://www.valcoure.store/

password- kothavara

Thank You.

[BiDeal-Discount]

Hi @AnSrSi 

let try to add this custom CSS code:

@media screen and (max-width: 749px) {
  .header__icon.header__icon--account {
      display: flex !important;
  }
}

then login icon will display on your mobile:

[AnSrSi]

Thank you @BiDeal-Discount, but i need the login in the menu drawer

 

Actually when I remove the position property the login option is like this. I need the login option like this even when the postion property is set to absolute or fixed. 

[AnSrSi · Accepted solution]

Never mind, I found the solution I just added paddting-bottom to the utility links.