Add a vertical line divider in the mega menu, Dawn Theme

Store Design
1

Heey!!

Im using the Dawn Theme and I would like to add a vertical line here in the menu as you can see in the picture (blue line). How can I do it?

Also, if I can align the subcategories, to look more organized.

Thanks in advance :slightly_smiling_face:

Screenshot 2023-09-14 185829.png
Screenshot 2023-09-14 185829.png1624×742 43.6 KB

2

Hi @yalostore

Can you share your store URL?

3

Hi @yalostore

This is David at SalesHunterThemes.

Thank you for your question.

Please share your store URL, page URL and also password (if your store has one) so we can help you.

4

this is my page

https://yalostore.com/

5

this is my page

https://yalostore.com/

6

Hi @yalostore

Please add this code to the bottom of your base.css file in Online store > Themes > Edit code > Assets

.header--top-center .mega-menu__list { position: relative; }
.header--top-center .mega-menu__list>li:first-child a::after {
    content: '';
    width: 2px;
    height: 100%;
    background: #000;
    position: absolute;
    left: 185px;
}
7

Hi @yalostore
In this case to make the style as you want, it requires to add some code in your theme.
So if you don’t know the code, You should hire an expert, they will support for you add the code to make the function as you want.

8

thank you so much! this worked for me. I chage it a little bit to personalize it but thank yooou