Tagged: 

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • September 2, 2018 at 9:28 pm #1004714
    boyan89

    Hi,

    I have issues customizing the mobile menu of my site: kove.bg

    I tried this CSS, but some elements remain hidden in the background and also the background color is not OK.

    `@media only screen and (max-width:767px) {
    #top #wrap_all .av-burger-overlay .av-burger-overlay-scroll #av-burger-menu-ul li a {
    font-size: 36px;
    color: white !important;
    }

    #top .av-burger-overlay-inner {
    background-image: url(‘https://mydomain.com/image.jpg’);
    }
    }

    Thanks in advance :)
    Boyan

    September 2, 2018 at 11:01 pm #1004726
    Mike

    Hey boyan89,
    Please try this code in the General Styling > Quick CSS field:

    @media only screen and (max-width:984px) {
#top #wrap_all .av-burger-overlay .av-burger-overlay-scroll #av-burger-menu-ul li a {
font-size: 36px;
color: #fff !important;
}
.html_av-overlay-side #top .av-burger-overlay-scroll {
    background: rgba(156, 156, 156, .5) !important; 
}
.html_av-overlay-side-classic #top .av-burger-overlay li li .avia-bullet, .html_av-overlay-side.av-burger-overlay-active #top .av-hamburger-inner, .html_av-overlay-side.av-burger-overlay-active #top .av-hamburger-inner::before, .html_av-overlay-side.av-burger-overlay-active #top .av-hamburger-inner::after {
    background-color: #fff !important; 
}
}

    Best regards,
    Mike

    September 16, 2018 at 9:29 pm #1010517
    boyan89

    Thanks Mike,

    How can I make the overlay dark and not transparent?

    Best,
    Boyan

    September 17, 2018 at 5:59 am #1010569
    Rikard

    Hi Boyan,

    Please try this instead:

    @media only screen and (max-width:984px) {
#top #wrap_all .av-burger-overlay .av-burger-overlay-scroll #av-burger-menu-ul li a {
font-size: 36px;
color: #fff !important;
}
.html_av-overlay-side #top .av-burger-overlay-scroll {
    background: rgba(156, 156, 156, 1) !important; 
}
.html_av-overlay-side-classic #top .av-burger-overlay li li .avia-bullet, .html_av-overlay-side.av-burger-overlay-active #top .av-hamburger-inner, .html_av-overlay-side.av-burger-overlay-active #top .av-hamburger-inner::before, .html_av-overlay-side.av-burger-overlay-active #top .av-hamburger-inner::after {
    background-color: #fff !important; 
}
}

    Best regards,
    Rikard

    September 24, 2018 at 10:17 am #1013539
    04sattlm

    Hi,
    on our website we want the burger menu to be shown on all tablets (9,7 zoll and lower). Which CSS do we have to use?

    Best regards,
    Martina

    September 24, 2018 at 11:51 am #1013561
    boyan89

    Worked! Thank you so much :)

    September 24, 2018 at 1:29 pm #1013597
    Rikard

    Hi boyan89,

    Great, glad you got it working. Please let us know if you should need any further help on the topic or if we can close it.

    Best regards,
    Rikard

    September 24, 2018 at 1:29 pm #1013598
    Rikard

    Hi Martina,

    Please try the following in Quick CSS under Enfold->General Styling:

    @media only screen and (max-width: 1024px) {
  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

    September 24, 2018 at 2:24 pm #1013631
    boyan89

    You can close it, thanks!

    September 24, 2018 at 7:29 pm #1013773
    Victoria

    Hi boyan89,

    Glad we could help :)

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

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