Mobile header issue

Heading background color and text color are correct in desktop view. But text color is showing black/invisible in mobile view, everything is perfect in theme setting.

Website link : https://a16843-4.myshopify.com/

Password: 1234
Can anyone help me with this

Hello! @Fayed Please follow these steps to add this CSS code:

  1. Go to your Online Store
  2. Click on “Themes”
  3. Select “Edit code”
  4. Open your CSS file. engo-customizes.css file, open that instead.
  5. replace the following code.
@media only screen and (max-width: 768px){
.menu_moblie .menuleft .iconmenu {
    color: #fff;/* change */
}
.menu_moblie .menuleft .iconmenu span {
    background: #fff; /* change */
}
.menu_moblie .menuright svg {
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7420%) hue-rotate(105deg) brightness(116%) contrast(92%);/* change */
}
}

Let me know if you need further assistance.

@Fayed Please follow below steps to change the header icon color for mobile. Let me know whether it is helpful for you.

  1. From admin go to “Online Store” → “Themes”.
  2. Click “Customize” button from the current theme.
  3. Click “Header” and paste the below code in the “Custom CSS” field and save changes.
.menu_moblie svg path {
    fill: #FFFFFF !important;
}
.menu_moblie .menuleft .iconmenu span {
    background: #FFFFFF !important;
}

Result will be like,

Please provide your support by click “Like” and “Accepted” if our solution works for you. Thanks for your support.

1 Like

Thanks for the easy solution.