flash theme mobile menu

You can improve the visibility of the menu icon on the Flash theme mobile view by making it larger and more noticeable using custom CSS. Here’s how:

1. Log in to your WordPress admin dashboard.
2. Navigate to Appearance > Customize to open the WordPress Customizer.
3. In the Customizer, click on “Additional CSS” at the bottom of the menu.
4. Paste the following CSS code snippet in the “Additional CSS” section:

/* Adjust the size of the mobile menu icon */
@media screen and (max-width: 768px) {
  .flash-responsive-menu .menu-toggle {
    font-size: 24px; /* Adjust the size of the icon */
    color: #000; /* Change the color of the icon */
    background-color: #f1f1f1; /* Add a background color to the icon area */
    padding: 10px; /* Add some padding around the icon */
  }
}

You can modify the font-size, color, background-color, and padding properties to fit your needs. Adjust the values until you’re happy with the appearance of the menu icon.

5. Click on the “Publish” button to save your changes.

Now, the menu icon should be larger and more visible on mobile devices. You can further customize the appearance by tweaking the CSS code as needed.

You’re using a commercial/premium theme, so please use their official support channel. We feel they are best equipped to support their products.

https://themegrill.com/contact/

Commercial products are not supported in these forums: https://make.www.ads-software.com/support/trouble/section-1-getting-started/what-is-not-supported

linards…. I put that into the CSS but it didn’t change anything…. Should I have removed the /instruction/ code or does it matter with the /…. /

/* this is a CSS comment, it's fine */
You could try the !important modifier, like this:
font-size: 24px !important;

If that doesn’t help, you’d best follow Steven’s advice.

Like @bcworkz said, try to add !important

@media screen and (max-width: 768px) {
  .flash-responsive-menu .menu-toggle {
    font-size: 24px !important;
    color: #000 !important;
    background-color: #f1f1f1 !important;
    padding: 10px !important;
  }
}

If this does not work, then contact the support of plugin.

• This reply was modified 2 years ago by Linards.