Menu icon Foundation
How to customize top-bar dropdown item

Screen shot 2013 11 27 at 8.24.54 am

I am using Rails and the Sass overrides to customize the menu but I can't find anything that controls the font size of the dropdown menus, or the hover background of the dropdown items. Does anyone know of any overrides that would manage this? I don't really want to hack at the CSS if not necessary.

Thanks

topbarcustomizestyledropdown

Screen shot 2013 11 27 at 8.24.54 am

I am using Rails and the Sass overrides to customize the menu but I can't find anything that controls the font size of the dropdown menus, or the hover background of the dropdown items. Does anyone know of any overrides that would manage this? I don't really want to hack at the CSS if not necessary.

Thanks

This post has been closed. No new replies can be added.

Troy Martin almost 6 years ago

Anybody? Seems like an important part of the site to need to customize.

Karl Ward almost 6 years ago

The top-bar navigation is tedious to work with I admit, but did you check the SAS section in the documentation?
http://foundation.zurb.com/docs/components/topbar.html

There are several variables:
```
$topbar-link-font-size: rem-calc(13);
$topbar-menu-link-font-size: rem-calc(13);

Other than this, you would need to apply your own css styles. For example to target the submenu items only:

.dropdown li { ... }
```