0

I want to show navigation arrows in luma theme like blank theme nav of Magento 2.

Anybody can suggest me how can I do this ?

  • Where you want to show arrow can't see in blank theme – hweb87 May 7 '18 at 9:07
  • I am using luma theme and by default navigation icons not coming in luma theme, can you suggest me how to do this. – Ankush Verma May 7 '18 at 10:17
  • In desktop view you can't see icons but in mobile you can see luma and blank both themes – hweb87 May 7 '18 at 10:19
  • yes but I want to enable them on desktop as well, how can i do this ? – Ankush Verma May 7 '18 at 10:34
1

Override below css in your theme :

/app/design/frontend/Vendor/YourTheme/web/css/source/_navigation.less

Removed below css from Line no. 52 to 79

.navigation {
    padding: 0;

    .parent {
        .level-top {
            position: relative;
            .lib-icon-font(
            @_icon-font-content: @icon-down,
            @_icon-font-size: 42px,
            @_icon-font-position: after,
            @_icon-font-display: block
            );

            &:after {
                position: absolute;
                right: 7px;
                top: -8px;
            }

            &.ui-state-active {
                .lib-icon-font-symbol(
                @_icon-font-content: @icon-up,
                @_icon-font-position: after
                );
            }
        }
    }
}

And Add Line no. 45

.navigation {
    padding: 0;

    .parent {
        .level-top {
            position: relative;
            .lib-icon-font(
            @_icon-font-content: @icon-down,
            @_icon-font-size: 42px,
            @_icon-font-position: after,
            @_icon-font-display: block
            );

            &:after {
                position: absolute;
                right: 7px;
                top: -8px;
            }

            &.ui-state-active {
                .lib-icon-font-symbol(
                @_icon-font-content: @icon-up,
                @_icon-font-position: after
                );
            }
        }
    }
}

adjust font-size as and position as per your theme requirements.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.