Tagged: 

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • August 9, 2018 at 2:30 pm #995485
    BenRi

    Hello enfold Team,
    i would like to customize the hamburger icon (combinated with overlay menu) and extra menu element “E-Mail link” on the right of the mainmenu icon.

    What i like to do is:
    First: Both menu elements should be positioned at the top of the browser window (and not centerd vertically in the line with the Logo).
    Second i would like to set a background color for both menu-items and give them a sqared shape with a little padding on each side.
    For better understanding, i send you a link to a layout-image which i uploaded into media.library of the site

    Can you help me with this customisation?
    Thanks a lot for every hint you can give me :-)

    August 9, 2018 at 3:34 pm #995535
    Victoria

    Hey BenRi,

    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

    

 #top #header_main > .container .main_menu .av-main-nav > li > a,
 .av_minimal_header .main_menu ul:first-child > li a,
 .av-hamburger.av-hamburger--spin.av-js-hamburger,
  #top #header_main > .container .main_menu .av-main-nav > li {
  height: 50px !important;
  line-height: 50px !important;
   background-color: navy;
}
#top #header_main > .container .main_menu .av-main-nav > li {
    padding-right: 12px;
}

#top #wrap_all nav .social_bookmarks {
    top: 0;
    margin-top: 0;
    background: navy;
    width: 54px;
    height: 50px;
}
#top #wrap_all .av-social-link-mail {
  margin-top: 10px;
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    August 9, 2018 at 3:47 pm #995540
    BenRi

    Wow, thanks a lot for the super-fast answer!
    Your code works perfekt for the mail menu-item, but as you can check on the site, the burger menu icon doesn’t show any effect and stays at the old position and color..

    Could you take another look?

    thousand thanks for the fast support

    best regards

    August 9, 2018 at 4:03 pm #995556
    BenRi

    Sorry… forget my last post :-( i saw, that there was a copy/paste error by transfering your code…

    Now the css works for the burger menu…
    But could you take another look now on the website? The code takes effect on all the child menu elements containing in the hamburger menu… is it possible not to change the look of the overlay menu items?

    And another question: do you have an idea to get the same padding around the burger icon (now it is docked on the right side)

    Thanks for your time and best regards

    August 9, 2018 at 4:18 pm #995568
    Victoria

    Hi BenRi,

    I adjusted the code in Quick css, but please remove the duplicate code if you put it in the custom css.

    Best regards,
    Victoria

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