I've been taking a look at how navigation is currently implemented, and I had a few ideas for how it can be improved. I'm opening this issue to gather feedback on these ideas and figure out what changes should be made. Out of the box, Bootstrap supports the following options for navbars:
- Multiple Content Types: links, brand images, forms, buttons, and text
- Multiple Content Alignments:
navbar-leftandnavbar-right - Multiple Positions: fixed to top, fixed to bottom, static to top
- Multiple Background Colors:
navbarandnavbar-inversed
On the other hand, Canon has four different styles of navigation:
- Utility Navigation
- Primary Navigation
- Secondary Navigation (deprecated)
- Footer
My goal is to map Bootstrap's built-in concepts to Canon while keeping our navigation-related styles as close to a skin as possible. Additionally, I want to make sure we consider the needs of teams like Cloud Intelligence who don't use Canon-style navigation but are interested in using canon-bootstrap. To accomplish this, I propose the following changes:
navbar- Use this class as a general purpose navigation for sites that only need a single navbar rather than a combination of primary and utility navigations. It can be modeled on Cloud Intelligence's current navigation.navbar-utility- This class maps to Canon's utility navigation with one major difference: it will default to dark text on a light background.navbar-primary- This class maps to Canon's primary navigation.navbar-footer- This class maps to Canon's footer navigation. As it exists currently, I think this pretty much duplicatesnavbar-utilityso it may be unnecessary.navbar-inverted- Used to invert navigation color. This will be combined withnavbar-utilityto replicate Canon's current utility navigation styles. We should also make sure it works with the primary navigation.navbar-brand- Not sure about this, but we might want to include Rackspace's logo.navbar-brand-small- Not sure about this, but we might want to include the fanatiguy-only logo used by Cloud Intelligence.navbar-static-top,navbar-fixed-top,navbar-fixed-bottom- These will keep their existing behavior, but we should make sure they work with combination navbars (utility + primary).
Given that Canon's secondary navigation is deprecated, I suggest we leave it out of canon-bootstrap entirely. We might be able to whittle down the set of styles a bit more by combining some of the options. For example, we might not need navbar-utility and navbar-footer. We might also consider combining navbar and navbar-primary.