[ActionList] Fix spacing above action list title when first in mobile action menu popover

[rmleg]

WHY are these changes introduced?

Fixes #5877

When a page has action groups but no secondary actions, there is not enough spacing above the title of the first action group in the action list popover on mobile.

I can't reproduce the problem in an ActionList in isolation; it only seems to be present in a Page.

WHAT is this pull request doing?

There was a previous PR that fixed this last August by adding a firstSection class to the first section of the action list using the index when mapping across finalSections. However this solution is not reliable as-is because the item at the index of 0 is not always rendered.

Instead of fixing the logic, I decided to go for a CSS solution.

First, set the padding-top for every action list title to the increased amount.

Then, select all titles that are in sections that are not the first section and set their padding-top to the smaller amount.

I had originally done this by just selecting .Section:first-child .Title and setting its padding-top to the increased amount, but that broke the case where an action list is not sectioned (has only one item in its actionGroups array).

Before this PR

After this PR

How to 🎩

🖥 Local development instructions
🗒 General tophatting guidelines
📄 Changelog guidelines

This can be tophatted by viewing the Page/Page with action groups story in Storybook at a mobile screen size and expanding the action list menu.

You can also verify this does not break the ActionList component in isolation by viewing the Action list/Action list with destructive item and Action list/Sectioned action list stories.

🎩 checklist

• Tested on mobile
• Tested on multiple browsers
• Tested for accessibility
• Updated the component's README.md with documentation changes
• Tophatted documentation changes in the style guide

[github-actions]

size-limit report 📦

Path	Size
cjs	151 KB (-0.03% 🔽)
esm	87.37 KB (-0.04% 🔽)
esnext	137.36 KB (-0.04% 🔽)
css	37.3 KB (-0.03% 🔽)

[laurkim]

💯