Enlarge & Move Position of Collection Images in Navigation (Enterprise Theme)

[RaimaNasir]

I want to be able to move the collection images in the column mega menu to the top of the collection name and make the image size bigger like in the example shown below. My Store:

 

Change Example: 

[JasmeetVT14313]

Hi @RaimaNasir 

Please provide the store URL, so that I can provide you with detailed solution/ code as per your theme.

[RaimaNasir]

The store is not live yet. But you can check out the other store I have on the same theme here https://www.shredderwarehouse.com/. The menu 'Brands' is the one I need to update.

[JasmeetVT14313]

Try adding the below piece of code to the end of your "navigation-mega-columns.css" file which can be found under Assets

@media screen and (min-width:769px){
.mega-nav--columns .child-nav__item--toggle:not(.nav__item--no-underline) {
flex-direction: column;
}

.mega-nav--columns .main-nav__collection-image img {
min-width: 60px;
position: relative;
}
}

Let me know if it helps or not.

[Benjamen]

Hello!
If you're open to an app, we designed our "Prism" template with exactly this use case in mind. 
You can find the app here: https://apps.shopify.com/meteor-mega-menus
I hope this helps.