Remove Account/Login Icon on mobile device

Topic summary

A user seeks to remove the account/login icon from their Shopify store header on mobile devices only.

Solutions Provided:

  • Multiple contributors offered CSS code snippets using media queries targeting mobile screens (max-width: 600px or 767px)
  • Code should be added to either base.css or Theme Settings > Custom CSS
  • The solution uses .header__icon--account { display: none !important; } wrapped in a mobile media query

Additional Requests:

  • User wants to reposition the sign-in option from footer categories upward on mobile (requires theme code modifications beyond CSS)
  • User requests help making the announcement bar transparent and matching desktop styling on mobile
  • User has attached files for review but awaits guidance on where to implement corrections

Status: Initial issue appears resolved (user thanked contributors), but follow-up customization requests remain open and require deeper theme code changes.

Summarized with AI on November 12. AI used: claude-sonnet-4-5-20250929.

@manan123 sorry, correction in the code.

Please add media query to execute CSS only for mobile devices.

@media(max-width:767px){
.header__icon--account {
    display: none !important;
}
}
1 Like