Make SALE menu item red

• Related Articles

• Make Mega Menu Second Child Horizontal

  In the header, add in custom css as below: @media screen and (min-width: 990px) { .header--top-center .mega-menu__list { display: flex; justify-content: left; flex-wrap: wrap; column-gap: 0; } #MegaMenu-Content-1 .mega-menu__list li:nth-child(2) ...

• To make the mobile menu parent links bigger

  In header-drawer.liquid, replace the followings: .menu-drawer__menu-item--parent { font-family: var(--menu-parent-font-family); font-style: var(--menu-parent-font-style); font-weight: var(--menu-parent-font-weight); font-size: ...

• Make mega menu list scrollable (overflow)

  At the header section, add the following css .mega-menu { max-height: 70vh; overflow-y: auto; }

• Make mega menu show only collection that consist of products

  In header-mega-menu.liquid and header-drawer.liquid, add the followings: {%- if childlink.object and childlink.object.products_count == 0 -%} {%- continue -%} {%- endif -%} and {%- if grandchildlink.object and grandchildlink.object.products_count == ...

• Reduce menu link padding in the footer

  In the footer section, add the following in the custom css: .list-menu__item--link { padding: 0px; }