feat(NavigationHeader): implement NavigationHeader component

[codemonkey800]

Summary

Github issue: #816

Implements the NavigationHeader component for desktop and mobile

Checklist

• Default Story in Storybook
• LivePreview Story in Storybook
• Test Story in Storybook
• Tests written
• Variables from defaultTheme.ts used wherever possible
• If updating an existing component, depreciate flag has been used where necessary
• Chromatic build verified by @chanzuckerberg/sds-design

[kev-zunshiwang]

Looking great, thanks Jeremy!!

Desktop Feedback

• Logo Slot
  • Update color to Base/border for the dash border line around "logo slot"
  • Unbold the text "logo slot"
  • The entire area of "logo slot / logo name / beta tag" should be linked to the home page of the product. Not sure if this affects the code
• Tag
  • Update text inside the tags to title case
  • Remove the hover effect for the tags
• Buttons
  • Update the "person" minimal button to a icon button (see design for the specific spec)
• Shadow
  • I'm not sure if you implemented a shadow into the component, if you did please remove it.

[kev-zunshiwang]

Mobile Feedback
Logo

• whole area should be a link

Secondary Nav Item

• the whole row should be a target area - see spec for details
• On hover, the background color of the whole row should have a gray (base/surface-secondary)
  Secondary Nav Sub Item
• the whole row should be a target area - see spec for details
• On hover, bold the text with Narrow/fontBodyS/600 in addition to the background color change.

Buttons

• the primary / secondary buttons / minimal button should extend to the whole row - see spec for detals
• Use the S size of the person icon, the illustration is different from the larger size
• bold the text - Narrow/fontBodyM/600