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

---

Open Items

1. 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. Will need / want the social and project logos as SVGs - hoping to get them all in feature/issue 23 Styleguide and Design System #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