feat(component-header-footer): add multi column dropdown, limit mega menu width

[scott-williams-az]

Description

Checklist

• Tests pass for relevant code changes

Important Reminders

Links

• JIRA ticket
• Unity reference site
• UDS Guidelines

[asu-jenkins-devops]

Storybook deployed at https://unity-uds-staging.s3.us-west-2.amazonaws.com/pr-1631/index.html

[davidornelas11]

I did notice that when a dropdown menu is opened, since the scroll behavior is removed from the main page there is a page shift from the toolbar being remvoed

[davidornelas11]

Just some linting conflicts I believe @scott-williams-az

[mlsamuelson]

@scott-williams-az Conflicts to resolve.

Also, saw the scrollbar jump result in shifts as well.

[mlsamuelson]

How to see the shift... go to https://unity-uds-staging.s3.us-west-2.amazonaws.com/pr-1631/@asu/component-header-footer/index.html?path=/story/uds-asu-header--default and ensure there's a scrollbar on the right side of the screen. Open a dropdown that has a scrollbar, and the edge of the page scrollbar will be removed while that dropdown is open and the page layout will shift.

[scott-williams-az]

As for the page shift. I learned a new trick

html {
  scrollbar-gutter: stable;
}

[mlsamuelson]

@scott-williams-az Got a review from the GTM team testing the data layer:

Hi,

Thank you for including me in your biweekly meeting that we had today! I had a chance to review the updated make to the nav bar and the data layer and everything looks great expect for the component section of the data layer.

On my end, I am not seeing any text populating that field currently and after reviewing Jonthan, we want to make sure that all fields are being populated properly before publishing any changes.

I hope this is not a difficult thing to address.

Thank you again!

Best,
Abigail Abdiyeva
Marketing Analyst Specialist
Data analytics and insights
ASU Enterprise Partners

[scott-williams-az]

Continued with PR #1672