Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • October 2, 2018 at 1:19 pm #1017033
    Kesselhut

    Hi there,

    I tried a few suggested solutions while going through the forum, but none of them did the job – or I didn’t find the right thread.

    1.I want the “Logo” to be displayed on mobile view and not to be overlayed by the the fly-out menu. I tried to change the percentage of the fly-out(didn’t look good), gave the logo a z-index of 99999 but nothing happened. How can I display the logo on mobile view – Please help! Found it!

    2. The font which I installed on y my site works fine, but when my site is viewed on mobile the font switches back to standard.
    I found the css, changed it in the developer-tools and it looked god. When I applied these changes to Quick-CSS nothing happened. What am I doing wrong?

    See private Content for Link!

    Best regards
    Henning

    • This topic was modified 6 years, 1 month ago by Kesselhut.
    October 2, 2018 at 8:21 pm #1017207
    Victoria

    Hey Kesselhut,

    Which font, of which elements are you referring to?

    Best regards,
    Victoria

    October 4, 2018 at 12:09 pm #1017854
    Kesselhut

    Hey Victoria,

    I am referring to the font in the menu when viewed on mobile. It only happens when the theme switches to the burger-menu. It seems the font is lost or ignored and a standard fallback font is activated.

    Best regards,
    Henning

    October 5, 2018 at 6:26 am #1018136
    Rikard

    Hi Henning,

    Thanks for the update, though I can’t reproduce the problem on my end using Chrome. Are you using an actual mobile device to check this? If so then please try to clear the browser cache from your browser and reload the page. You could also try to use an incognito window using Chrome.

    Best regards,
    Rikard

    October 5, 2018 at 9:59 am #1018197
    Kesselhut

    Hi Rikard,

    please check the Private Content for screenshots.
    I tried Chrome in Incognito-Mode and my iPhone, the results are the same.
    The menu seems to ignore the font, when in “Burger-Mode”.

    October 5, 2018 at 10:16 am #1018204
    Kesselhut

    HI again,

    furthermore I like to change the “Breakpoint” for the burger-menu to 970, not 767?
    Can you tell my which media-query has to be changed?

    Thank you
    Henning

    October 5, 2018 at 10:52 am #1018229
    Rikard

    Hi Henning,

    Thanks for the screenshot, though I’m not sure I understand the problem anymore. I thought that the font was the problem, but the font looks the same in both your screenshots. Could you try to explain a bit further what you are looking to change in the mobile menu please?

    If you want to change the breakpoint of the mobile menu you can either set it to activate for tablets as well (990 pixels) under Enfold->Main Menu or use this in Quick CSS:

    @media only screen and (max-width: 970px) {
  nav.main_menu {
    display: block !important;
  }
  #avia-menu .menu-item {
    display: none;
  }
  .av-burger-menu-main.menu-item-avia-special {
    display: block;
  }
}

    Best regards,
    Rikard

    October 5, 2018 at 12:17 pm #1018261
    Kesselhut

    Hi Rikard,

    the font is the problem and it is not the same. Have a closer look at the “O” in the word “INFORMIEREN”.
    In the mobile version it is a different font than on the desktop.

    Thanks for the Breakpoint so far..why does the position of the burger-menu change in tablet-view(left on tablet, right on mobile?)

    Greetings
    Henning

    October 6, 2018 at 6:21 am #1018411
    Rikard

    Hi Henning,

    I had a closer look now and you are right, the mobile menu was using Lato. Please try this CSS to see if it works:

    #av-burger-menu-ul .avia-menu-text {
    font-family: Carnas !important;
}

    About the mobile menu, the logo float right on tablet screens, so the mobile menu floats left. We should be able to give you CSS to change that if you like?

    Best regards,
    Rikard

    October 9, 2018 at 12:12 pm #1019440
    Kesselhut

    Hi Rikard,

    thanks, now the font is correctly displayed.

    ” About the mobile menu, the logo float right on tablet screens, so the mobile menu floats left. We should be able to give you CSS to change that if you like?”

    That would be wonderful because it looks really strange when the logo is hopping from right to left to right..

    Thanks for the great support.
    Henning

    October 10, 2018 at 4:43 am #1019740
    Rikard

    Hi Henning,

    Thanks for the feedback. Please try this CSS as well:

    @media only screen and (max-width: 989px) and (min-width: 768px) {
.responsive.html_logo_right #top #wrap_all .av_mobile_menu_tablet .main_menu {
    left: auto !important;
    right: 0 !important;
}
.html_header_top #top .av_logo_right .logo {
    left: 0 !important;
    right: auto !important;
}
}

    Best regards,
    Rikard

    October 11, 2018 at 3:02 pm #1020326
    Kesselhut

    That’s it, topic can be closed!

    Thank you for the great support
    Henning

    October 11, 2018 at 5:26 pm #1020387
    Jordan Shannon

    Hi,

    If you need additional help, please let us know here in the forums.

    Best regards,
    Jordan Shannon

  • Author
    Posts
Viewing 13 posts - 1 through 13 (of 13 total)
  • The topic ‘Menu in mobile view – Font and Logo’ is closed to new replies.