Main Menu

Public Ticket #21382

Conversation thread

PenciDesign Supporter replied

4 years ago

Staff Reply

Hi,

Please go to Appearance → Customize → Custom CSS then add the following custom CSS code:

.navigation ul.menu ul.sub-menu li.menu-item-has-children:after {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 5px;
    content: '\\f105';
    font-family: 'FontAwesome';
}

Regards,
PenciDesign.

lklevenhagen replied

4 years ago

Customer Reply

Thank you. Part of it was solved. But about the "arrow" part actualy i ment this arrow (attachment image)

PenciDesign Supporter replied

4 years ago

Staff Reply

Hi,

Please go to Appearance → Customize → Custom CSS then add the following custom CSS code:

.navigation .menu .sub-menu {
    border-top: 3px solid var(--pcaccent-cl);
}
.navigation .menu .sub-menu:before {
    content: '';
    display: inline-block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 0 0 10px;
    border-color: transparent transparent transparent var(--pcaccent-cl);
    position: absolute;
    top: -10px;
    left: 15px;
}
.pc-builder-element.pc-main-menu .navigation.menu-item-padding ul.menu > li:not(:last-child) {
    border-right: 1px solid rgba(255, 255, 255, 0.5);
}

Regards,
PenciDesign.

lklevenhagen started the conversation

4 years ago

Conversation Start

I would like to add "arrows" on my dropdown menu, like on the attachment imagem example.

Also i´d like to add a separation line between main menu itens - same attachment

Best regards

Want to join this conversation or access attachments? Sign in first.