Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • October 8, 2018 at 11:22 am #1018922
    ronaldalexander

    Hey,

    i just used this CSS to display the “MENU” Text before hamburger menu.

    /*————————*/
    /* Add word menu next to hamburger icon
    /*————————*/
    .av-hamburger strong {
    display: block!important;
    position: absolute;
    left: -90%;
    top: 0;
    font-size: 20px;
    transform: translate(-90%, -44%);
    }

    ———————-
    My questions are …

    1.) How can i change the Text?
    2.) How can i remove the MENU when i click onto the menu? I use the fly out menu, an if I click the menu, the menu text is overlapping the menu. If the menu is active, i want to remove the text.

    3.) I use the submenu on mobile too, can i get those links to buttons only on mobile?

    thanks for helping me, ronald

    October 9, 2018 at 5:07 am #1019310
    Rikard

    Hey ronaldalexander,

    Could you post a link to where we can see the results you are getting please? It’s very difficult to help you out otherwise.

    Best regards,
    Rikard

    October 9, 2018 at 1:08 pm #1019484
    ronaldalexander
    This reply has been marked as private.
    October 10, 2018 at 12:25 pm #1019913
    Victoria

    Hi ronaldalexander,

    Best regards,
    Victoria

    October 11, 2018 at 11:25 am #1020285
    ronaldalexander

    Hi Victoria, it would be better to hide the “MENU” Text if the flyout is active. Thanks!

    I thought maybe to change the text from “MENU” to “MENÜ (German language purpose).

    October 12, 2018 at 10:17 pm #1020867
    Victoria

    Hi ronaldalexander,

    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

    
@media only screen and (max-width:767px){
    .av-hamburger.av-inserted-main-menu.is-active strong {
        display: none !important;
    }
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    October 13, 2018 at 5:42 pm #1021071
    ronaldalexander

    Hello Victoria, thanks! That worked out perfect!

    I have one other thing as mentioned before.
    I want to have ONLY on mobile (max width 767px) the top bar menu in buttons and not in Links. How can i do it?

    Mobile: Buttons
    Ipad: Links
    Desktop: Links

    Thanks, Ronald

    October 16, 2018 at 9:18 am #1022051
    Nikko

    Hi Ronald,

    Try adding this css code:

    @media only screen and (max-width:767px){
  .responsive #header .sub_menu {
    display: none;
  }
}

    Hope it helps.

    Best regards,
    Nikko

    October 16, 2018 at 9:53 am #1022068
    ronaldalexander

    Hi Nikko,

    thanks for your reply! But what has this code to do, compared to what i want?

    I want to have the submenu above 767px normal as it is, an below 767px i want them to show as BUTTONS, noch as normal links.

    Thanks

    October 17, 2018 at 9:42 am #1022650
    Nikko

    Hi Ronald,

    Sorry I misunderstood it as you want to only see topbar buttons and remove links.
    So basically the code only hides the links below 767px.
    You can make those links look like a button by using this code:

    @media only screen and (max-width:767px){
  .responsive #header .sub_menu li a {
    border-radius: 3px;
    padding: 10px;
    font-size: 12px;
    text-decoration: none;
    display: inline-block;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    margin: 3px 0;
    line-height: 1.2em;
    position: relative;
    font-weight: normal;
    text-align: center;
    max-width: 100%;
    background-color: red !important;
    border-color: red !important;
    color: white !important;
  }
}

    just change the background color and border color.

    Best regards,
    Nikko

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