feat: nav bar with search bar

[hroth1994]

🔗 Linked issue

https://energysage.atlassian.net/browse/CED-1940

❓ Type of change

• 📖 Documentation (updates to the documentation or readme)
• 🐞 Bug fix (a non-breaking change that fixes an issue)
• 👌 Enhancement (improving an existing functionality like performance)
• ✨ New feature (a non-breaking change that adds functionality)
• ⚠️ Breaking change (fix or feature that would cause existing functionality to change)

📚 Description

Add a search bar and documentation that uses the design of the MVP and fulfills these requirements:

• Search button should be display: none by default, and have a specific id on it, so that VWO can target it for showing
• Search button should be fill: blue-600 while the dropdown is open
• When dropdown is opened, should automatically put the focus on the textbox so the user can start typing right away for accessibility
• Put an aria-label on the search input element itself
• The overlay should not appear on search button hover, should appear while the search bar is open, and clicking outside the search bar should hide the overlay and close the search bar
• Submission of the search form should result in a GET form submission to /search/, meaning that the search query is encoded as a query parameter.

🥼 Testing

• Tested locally in nav bar and in docs page

🧐 Feedback Requested / Focus Areas

• General
• VoiceOver is currently not working on the search icon button, but the nav bar in general is not accessible and needs to be rewritten

📝 Checklist

• I have linked an issue or discussion.
• I have updated the documentation accordingly.
• I have documented testing approach

[mpleroux]

👀

[mpleroux]

This all looks great.

I checked the ticket requirements and reviewed the new layout and SCSS changes.

The navbar with search button works well in every responsive breakpoint I tried, and tabbing between elements did what I expected when the search form was open or closed.

[nathanielwarner]

Looks good! The one thing that I'm noticing is that it's not working properly with VoiceOver. It'd be nice to fix that if it's easy, but the nav as a whole is not accessible (and will hopefully be rewritten fully soon), so I'm not too worried about getting this perfect.