How do I reduce the size of my mobile menu dropdown boxes in Flow theme

Solved
Highlighted
Tourist
10 0 2

 

Store address thesilenceco.com

Theme: Flow

I downloaded a mega menu app that made my drop downs in mobile view much smaller which I like the look of. This app does not adjust the size of the drop down for the main menu. 

I would like to reduce the size of the mobile main menu dropdowns to match the size of the submenu mobile dropdowns. Here are pictures to clearly illustrate the issue. Notice how the menu items on the left are larger than the submenu items on the right. I have searched for the majority of the day and have edited css unsuccessfully on a copy of the theme. 

Any help would be greatly appreciated. I also want to reduce the extra space around my site footer and may hire an expert.

silence mobile menu.jpgmobile small menu .jpg

0 Likes
Highlighted
Excursionist
80 19 19

This is an accepted solution.

Hi there

This CSS - added to the bottom of your theme.scss file - should get you close to the result you want:

li.mobile-nav__item {
    text-align: left;
    line-height: 1em;
    text-transform: none;
    text-shadow: none;
    font-weight: 400;
    font-size: 14px;
    margin: 0;
}

.mobile-nav__item a,.mobile-nav__item button,.mobile-nav__toggle button {
    padding: 10px 30px;
}
0 Likes
Highlighted
Excursionist
77 23 18

Hi @sicworldwide,

Just add below CSS line in the bottom of the theme.scss file.

.mobile-nav__item a {
    font-size: 14px;
}


To edit the theme.scss then go to Online store > Actions ( current theme) > Edit code > Search "theme.scs".

Please like and accept this solution if it works for you.

Thanks, 

If helpful then please Like and Accept Solution.
Do you need custom changes on store ? Hire us.
Feel free to Contact me for shopify help on support@prezentech.com
Shopify Design Changes | Shopify Custom Theme Design and Development | Shopify App Development
0 Likes
Highlighted
Tourist
10 0 2

This worked perfectly, thank you. I am very appreciative of you taking your time to help.

0 Likes