5086 Nav bar enhancement

[schoork]

What github issue is this PR for, if any?

Resolves #5086

What changed, and why?

• Mobile:
  • button on bar makes collapsible/openable
• Desktop:
  • when minimized shows narrow bar with icons
  • when minimized and hovered over expands to full width

How will this affect user permissions?

• Volunteer permissions: None
• Supervisor permissions: None
• Admin permissions: None

How is this tested? (please write tests!) 💖💪

• components
  • spec/components/sidebar/group_component_spec.rb
  • spec/components/sidebar/link_component_spec.rb
• system
  • spec/system/case_contacts/index_spec.rb
  • spec/system/case_contacts/index_spec.rb
• views
  • spec/views/layouts/sidebar.html.erb_spec.rb

Screenshots please :)

Feelings gif (optional)

What gif best describes your feeling working on this issue? https://giphy.com/
How to embed:
![alt text](https://media.giphy.com/media/1nP7ThJFes5pgXKUNf/giphy.gif)

Feedback please? (optional)

We are very interested in your feedback! Please give us some :) https://forms.gle/1D5ACNgTs2u9gSdh9

[schoork]

There are gonna be merge conflicts here between this and #5272. I can clean them up depending on the order they are merged.

[javiguerra777]

I like the use of creating variables for these colors. Good job!

[littleforest]

@schoork thanks so much for working on this! I'm getting really jumpy behavior on the hamburger menu on the small screen. Are you seeing differently?

Screen.Recording.2023-10-20.at.11.15.14.AM.mov

[schoork]

@littleforest I did when I used the Chrome tools to get a smaller screen and did not refresh after. Try refreshing the page and it should go away. I felt like that was ignorable edge case, but could do some more work if you think it's worth supporting.

[schoork]

No, @littleforest, you're totally right. window.screen.width literally gets the size of your screen, whereas winow.innerWidth gets the size of the browser window. Good catch!

[littleforest]

@schoork this is such an improvement, thank you so much for working on this! The stakeholders will be so happy.