New navigation style for Coga Design Guide

[SteveALee]

This can also be found on github..io

The key point is the top level items in the left nav can be collapsed and expanded. As items are selected the RHS content is updated (SPA style).

This style has come from a CogA TF mockup of how an interactive version of the design guide should behave.

At present this is very much a hack based on the main site Nav with hijax loading full pages and setting part for the RHS container using innerHTML. The pages are defined in markdown as usual for jekyll pages but the generated HTML files are used for the content. ARIA expanded is managed.

In terms of the WAI site this is a micro site (well not SO micro) somewhat like WCAG Quick Ref. However, it would be good to blend the style in more with the main site if agreement can me made .

[SteveALee]

Know bugs are:

• focus managment on RHS as page changes
• expand-o shows hover and focus link decoration even though coded to stop it.
• need to scroll to top on new page