Replace KSS nav with main-nav component

[yvonnetangsu]

READY FOR REVIEW

Summary

• Replace the current nav on the styleguide website with the main-nav component now that we have a variant for dark backgrounds.
• Add script to add --current class to appropriate nav items (and parent items) for styleguide.
• Tweak variants of main-nav component. .su-main-nav--right now have mobile nav also right justified. .su-main-nav--center now have mobile nav also center justified.
• Reorganize the links a bit - some items are in dropdowns.

Needed By (Date)

• Before v.5 release if possible

Urgency

• Not urgent

Steps to Test

1. Pull this branch and run grunt styleguide.
2. See if the website nav behaves the same as the main nav .su-main-nav--dark variant.

Affected Projects or Products

• Decanter
• Scott's event calendar

Associated Issues and/or People

• Replace KSS main nav with the main navigation component. #328

Notes - a few small tweaks I added on the side....

• Added link to brand logo "Decanter".
• Added screen margins to decanter styleguide content for xs and sm breakpoints (was edge to edge).
• Added a text-decoration: none for the lockup a element (found out I need that when doing Scott's calendar, the a element might be inheriting the underline from the style in the @link mixin).

[josephgknox]

@yvonnetangsu thanks for tackling this! It's nice to utilize our component in our own style guide. :)

Also: thanks for adding links to the other sections in the style guide, as well as pointing to important documentation elsewhere.

This looks good to me!

[yvonnetangsu]

@sherakama , what do you think? Does this look ok?

[sherakama]

GTG