Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #845120

    Hi there,
    I’m testing my site with the 4.1.2 update – on a dev site. The update has caused a number of issue with my main menu on mobile.

    1. The mobile ‘burger’ should be right aligned (as set in Enfold Header settings) but now it’s floating in a weird place.

    2. I’m using this code to hide some menu items on desktop and some on mobile, but now all the menu items are showing in the mobile menu.
    @media only screen and (max-width: 990px) {
    .hide-on-mobile { display: none !important; }}
    @media only screen and (min-width: 990px) {
    .hide-on-desktop { display: none !important; }}

    3. I had this code snippet to increase the font size in the mobile menu, this is no longer having an effect.
    #mobile-advanced, #mobile-advanced a, #mobile-advanced .mega_menu_title {
    font-size: 30px!important;
    }

    This is the dev site: http://dev.mrmod.co.nz/ with the 4.1.2 update.
    This the the live site: http://mrmod.co.nz/ running 4.0.7, for a comparison of how the mobile menu should look.

    Any help would be much appreciated.

    Thanks,
    Jessie @ Tanker

    #845857

    Hey Jessie,

    The header html has changed and so some of the things will not work. I suggest, we start from the beginning, remove previous modifications. If you have the header.php file in your child theme, you need to update it with the one from the parent theme. And then we can help you with other adjustments.

    Best regards,
    Victoria

    #846044

    Hi Victoria,
    Sweet, I’m happy to start over – I don’t have the header template copied to my child theme, do I need to do so or will the adjustments all be css?

    Cheers,
    Jessie

    #846417

    Hi Jessie,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
    @media only screen and (max-width: 767px) {
      .main_menu {
        width: auto!important;
    }
    }
    

    If you need further assistance please let us know.
    Best regards,
    Victoria

    #846577

    Great that fixes my first problem, thanks.

    How about the other 2 issues?
    2. I’m using this code to hide some menu items on desktop and some on mobile, but now all the menu items are showing in the mobile menu.
    @media only screen and (max-width: 990px) {
    .hide-on-mobile { display: none !important; }}
    @media only screen and (min-width: 990px) {
    .hide-on-desktop { display: none !important; }}

    3. I had this code snippet to increase the font size in the mobile menu, this is no longer having an effect.
    #mobile-advanced, #mobile-advanced a, #mobile-advanced .mega_menu_title {
    font-size: 30px!important;
    }

    Also, the font weight of my main menu and heading has changed. All headings are set to light in Advanced Styling but are showing medium or bold, but only in Chrome. And the main menu used to be light but now is bold on all browsers, tried this code to fix but it didn’t have any effect: .main_menu ul:first-child > li > a { font-weight: 200!important;}

    Cheers,
    Jessie

    #847439

    Hi,
    2) at this time the mobile menu doesn’t support classes, it will be fixed with the next update.
    3) same as above
    Also) I checked the two site above in Chrome on Win10, but I saw no difference. Are you using Chrome on Mac by chance?

    Best regards,
    Mike

    #847935

    Hi Mike,
    Thanks for that info, I might just hang on until the next update then, the site’s functioning fine at the moment.

    Yes I’m using Chrome on Mac.

    Cheers,
    Jessie @ Tanker

    #848088

    Hi Jessie,

    I think that would be a good idea, we should hopefully have all the problems fixed in the next version of the theme.

    Best regards,
    Rikard

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.