Nav Redesign - Main Nav

[alainacoppa]

Nav Specifications

rs-nav-primary:

• Min-height: 74px

rs-nav:

• Padding-top: 20px

Active:

• Color: #c40022
• No underline

Hover:

• Color: #333333
• No underline

Logo:

• Margin-top: 3px

  Pages that need to be updated

  App Layout

Summary

• Example needs to be updated
• 3rd bullet point should be removed

Header & Navigation

• Example needs new screenshot; should include a drop down panel
• Primary Navigation: Remove 3rd bullet point
• Secondary Navigation: Add second bullet point indicating that the Top Tasks are an optional section.

Content Area All screenshots need to be updated

UI Components

Dropdowns

• Update Primary Dropdown Example

Primary Dropdown

• Update example
• Update bullet: "Primary dropdowns are used when your application requires a secondary navigation. Use category styles to break up long lists of menu items."
• Remove second bullet

  Demo

[araiford]

@alainacoppa it looks like the utility nav is also a new height - 39px - is that correct?

[alainacoppa]

@araiford It should be 40px.

[bradgignac]

Is this a good opportunity to start killing off hard-coded pixels? We really need to get to responsive and pixels are a dead end. Building all the new navigation items off relative units (ems or rems) would be a good start.

/cc @j00k

[j00k]

i would love to do this

[araiford]

@bradgignac - good point - good opportunity. rem based layout sounds awesome to me.

[bradgignac]

@j00k Is this completed?

[j00k]

@bradgignac yep! https://github.com/rackerlabs/canon/pull/124