Header Component

[thescientist13]

Summary

Will want to create a component for the global site header, with logo on the left and links / socials on the right. Needs to be done after #23

Needs to be done after #23

Details

1. [x] Will need a src/components/header/header.js component file
2. [x] Will want a Storybook file
3. [x] Will want a spec file to test basic content output
4. [x] Since this one is interactive on mobile breakpoints, we should use declarative shadow DOM in our implementation
5. [x] (nice to have) what could be a JavaScript disabled fallback for this look like?

---

Open Items

1. [x] Need a canonical figma file / screenshot for reference here
   • Figma shows different treatments for home page vs docs / guides pages
   • Need social links in the header - Twitter, GitHub, Discord
   • Social links and logs disappear in mobile?
2. [x] Will need / want the social and project logos as SVGs - hoping to get them all in #36

[thescientist13]

Some references

• https://github.com/AnalogStudiosRI/www.blissri.com/tree/main/src/components/header
• https://github.com/AnalogStudiosRI/www.blissri.com/tree/main/src/components/navigation