logo in mobile

  • amc4042

    (@amc4042)


    6 years ago

    My mobile menu shows the word “Menu”. This word and the hamburger are placed in a lightgrey background. Can this be customised?

    Looks like Virtue has 2 breakpoints.

    In pc view, logo is in the left and primary menu at right, as set up in Theme options. Fine with me.

    Zooming in, 1st breakpoint triggers: the logo becomes huge (seems to be centered, taking 70% or so of the width), the primary menu gets replaced by the hamburger, but gets overlapped by the logo.

    Further zoom in, and the 2nd breakpoint triggers: the logo takes the full width, and the grey rectangle with the word Menu and the hamburger are placed just below the logo. Fine with me

    I can’t find the way to adjust that or simply use a smaller logo for the smaller screens.

    Thanks

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • hannah

    (@hannahritner)

    Hey,
    The premium theme provides functionality for using a different logo for mobile. The free theme doesn’t have this, but you can use css to adjust. For example, this css would reduce your logo size on smaller screens:

    @media (max-width: 992px) {
div#thelogo {
    max-width: 200px;
}
}

    You can paste that into your custom css box in Theme Options > Advanced Settings.
    Let me know how that works for you!

    Hannah

    Thread Starter amc4042

    (@amc4042)

    It works, thanks.
    I applied your snippet to my virtue-child style.css, instead of Advanced Settings.
    thanks

    hannah

    (@hannahritner)

    Glad it works for you!

    Hannah

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘logo in mobile’ is closed to new replies.