Viewing 15 posts - 1 through 15 (of 15 total)
  • Author
    Posts
  • May 8, 2016 at 1:15 pm #628857
    J.A.R.

    Hello,

    Is there any way i can change the mobile menu arrows? also is there anyway i can change the design of the mobile menu? right now its social media on top then the language switcher under it, and then the phone number under that, then the menu under that. is there any way we can make the first three lines sit all under one line? so the social media and the language switcher and the phone number all in one line?

    also can i change the color of the top bar?

    May 10, 2016 at 11:22 am #629801
    Josue

    Hi,

    Can you post the link to your website please?

    Regards,
    Josue

    May 10, 2016 at 1:32 pm #629888
    J.A.R.

    Hey Josue,

    Its bellow.

    May 10, 2016 at 2:04 pm #629910
    Josue

    Hey!

    Try adding this code to the Quick CSS:

    @media only screen and (max-width: 767px) {
    #header_meta {
        position: absolute;
        width: 100%;
        background: transparent !important;
        width: 140px;
        margin: 0 auto;
        left: 0;
        right: 0;
    }

    #header_main {
        position: relative;
    }
}

    Cheers! 
    Josue

    May 10, 2016 at 2:15 pm #629920
    J.A.R.

    Hey Josue,

    tried it, it just moves everything onto the main menu. i was thinking it stays on the same bar it on currently, but it goes on a straight line instead of each element siting on its own line. so the social media and the language switcher and the call us now text will all be on one line. can i do that?

    also what do you say about changing the arrows on the mobile menu?

    May 10, 2016 at 2:17 pm #629922
    Josue

    Would you mind posting us a screenshot/mockup of what you would like to achieve? You can upload the screenshot to imgur.com or dropbox and share the link here :)

    May 10, 2016 at 2:43 pm #629944
    J.A.R.

    this is what it looks like now:

    https://www.dropbox.com/s/meojg1ejvwbl2i2/What%20it%20looks%20like%20now.png?dl=0

    and this is how i would like it to look:

    https://www.dropbox.com/s/lmkc0l667kqu017/How%20i%20want%20it.png?dl=0

    May 10, 2016 at 3:57 pm #630010
    Josue

    Ok, try with this:

    @media only screen and (max-width: 767px) {
    #header_meta .container{
        text-align: center;
    }

    #header_meta .container > * {
        display: inline-block;
        width: auto !important;
    }

    #header_meta .phone-info.with_nav {
        position: absolute;
        right: 0;
    }

    #header_meta .responsive #header .social_bookmarks {
        position: absolute;
        left: 0;
    }
}
    May 10, 2016 at 4:13 pm #630025
    J.A.R.

    Thats nicer, but the language switchers are not sitting exactly in the centre, plus the social media boxes look really ugly now. Can The boxes be removed?

    May 10, 2016 at 4:34 pm #630065
    Josue

    Try this:

    @media only screen and (max-width: 767px) {
	.responsive #header_meta .social_bookmarks li {
	    border: 0 !important;
	}

    #header_meta .container{
        text-align: center;
    }

    #header_meta .container > * {
        display: inline-block;
        width: auto !important;
        padding: 0;
    }

    #header_meta .phone-info.with_nav {
        position: absolute;
        right: 0;
        top: 5px;
    }

    #header_meta .responsive #header .social_bookmarks {
        position: absolute;
        left: 0;
    }
}
    May 10, 2016 at 8:50 pm #630233
    J.A.R.

    Thats lovely, but how do i get the language switcher to be more centred? its sitting more to the right of the screen.

    May 11, 2016 at 1:48 am #630312
    Josue

    Try adding this to the block (put it inside the media query):

    .sub_menu {
    position: absolute !important;
    left: 0;
    right :0;
    top: 0px;
    margin: 0 auto;
}
    May 11, 2016 at 8:18 am #630510
    J.A.R.

    I tried it like this, but nothing changed, do i have to change the 0’s. if yes how much?:

    @media only screen and (max-width: 767px) {
	.responsive #header_meta .social_bookmarks li {
	    border: 0 !important;
.sub_menu {
    position: absolute !important;
    left: 0;
    right :0;
    top: 0px;
    margin: 0 auto;
}
	}
    #header_meta .container{
        text-align: center;
    }

    #header_meta .container > * {
        display: inline-block;
        width: auto !important;
        padding: 0;
    }

    #header_meta .phone-info.with_nav {
        position: absolute;
        right: 0;
        top: 5px;
    }

    #header_meta .responsive #header .social_bookmarks {
        position: absolute;
        left: 0;
    }
}
    May 12, 2016 at 8:40 am #631204
    J.A.R.

    sorry added it in the wrong place, tried again and now it works. thank you very much.

    May 12, 2016 at 12:54 pm #631313
    Andy

    Hi,

    glad we could help. Let us know in a new ticket if you have some more questions related to the theme. We are happy to assist you.

    Best regards,
    Andy

  • Author
    Posts
Viewing 15 posts - 1 through 15 (of 15 total)
  • The topic ‘Mobile Menu’ is closed to new replies.